/* PinkyDolly V2 · pd-v2-footer
 * 从定稿原型抽出,参数已实测。⚠️ 图片/视频路径需换成 SHOPLINE CDN 地址。
 * 不要修改数值 —— 见 docs/pd-v2-brief.md
 */

/* ══ NEWSLETTER + FOOTER ══ */
/* Defensive addendum (not part of the deploy package). .news had no
   background of its own, so it fell through to #page's hardcoded white
   instead of the dark surface — same fix as .foot below, not the full
   .band treatment (that adds top+bottom borders meant for a standalone
   section, which would put an odd seam right above .foot). */
.news{text-align:center}
.news__in{max-width:600px;margin:0 auto}
.news h2 em{font-style:normal;color:var(--main2)}
html[data-mode="light"] .news h2 em{color:var(--act)}
.news p{color:var(--tx-dim);margin:16px 0 26px}
.news__f{display:flex;gap:9px;max-width:440px;margin:0 auto}
.news__f input{flex:1;min-height:48px;padding:0 16px;background:transparent;border-radius:var(--r);
  border:1.5px solid var(--line);color:var(--tx);font:inherit;font-size:15px}
/* Was --tx-faint. Contrast audit (feedback item 5): rgb(154,142,154) on this
   input's own background (effectively --surface/--bw depending on mode) measures
   2.95–3.08:1 in light mode — fails the 4.5:1 a 14px placeholder needs. --tx-dim
   is the next step up and already passes everywhere else it's used at this size. */
.news__f input::placeholder{color:var(--tx-dim)}
.news__f input:focus{outline:none;border-color:var(--act)}
.news__m{margin-top:13px;font-size:13px;min-height:20px;color:var(--mint)}
html[data-mode="light"] .news__m{color:#0E8F5F}
/* 2026-10-10:真实整页提交后,这条提示默认就在视口里(pd-v2-footer.html 自己
   的内联脚本会把它滚到正中间),这里再加一下淡入+背景闪一下,让它更显眼,
   不会被当成"什么都没发生"。只在提示真的渲染出来的这一次(.news__m--in,
   服务端判断加的类)才会播放。 */
.news__m--in{animation:newsMsgIn .9s ease}
@keyframes newsMsgIn{0%{opacity:0;background:color-mix(in srgb,currentColor 18%,transparent);border-radius:6px}
  30%{opacity:1}100%{opacity:1;background:transparent}}
@media (prefers-reduced-motion:reduce){.news__m--in{animation:none}}
/* Was --tx-faint — same contrast-audit fix as the input placeholder above, same
   measured ratio (this and the placeholder are both direct children of .foot's
   --surface/--bw background, so the numbers match exactly). */
.news__fine{margin-top:16px;font-size:13.5px;color:var(--tx-dim)}
@media (max-width:460px){.news__f{flex-direction:column}}
.foot{background:var(--surface);border-top:1px solid var(--line)}
.foot__in{max-width:var(--maxw);margin:0 auto;padding:56px var(--gut) 28px;
  display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,.7fr) minmax(0,.9fr);gap:clamp(24px,4vw,64px)}
@media (max-width:860px){.foot__in{grid-template-columns:1fr 1fr}.foot__brand{grid-column:1/-1}}
.foot__lg{display:inline-block;line-height:0}
.foot__lg:focus-visible{outline:2px solid var(--act);outline-offset:4px;border-radius:4px}
/* Same real-wordmark swap as .pd-v2-nav__lg-img in pd-v2-header.css — see that file's
   comment. 48px matched the old text logo's overall visual size here (bigger
   font-size than the nav logo, so a bigger target height too).
   2026-10-13(反馈): bumped ~10% to 53px after swapping to the new full-colour
   wordmark (pd-v2-footer-logo.webp) — explicit ask, not a redesign call. */
.foot__lg-img{height:53px;width:auto;display:none}
html[data-mode="dark"] .foot__lg-img--dark{display:block}
html[data-mode="light"] .foot__lg-img--light{display:block}
/* 品牌标语:2026-10-10 早些时候按 Yimei 当场反馈("太大,砍半")缩到了
   13-15px Text 样式。同一天晚些时候,她发来的 handover 包(README-this-
   package.md)把这个当成三个"改回已批准设计"之一,明确要求 Display 样式
   (opsz 144 · 650)、clamp(24px,2.1vw,30px)、.02em、line-height 1.22——
   跟当场反馈直接矛盾。按 README 更新、更具体的书面说明执行,在交付报告里
   把这个冲突标出来,不要默默二选一。 */
/* 2026-10-13(反馈 #2 测试,已有结论,见 SPEC-typography-v2-opsz72.md): 问题
   不是字重太轻,是 opsz 144 的发丝线太细——方案是把 Display 整体从 opsz 144
   换成 opsz 72(--fr-display 这一个 token,见 pd-v2-base.css),字重仍是
   650,不是这里试过的 800。那次测试已经撤掉,改回 token。 */
.foot__tag{margin:20px 0 0;font-family:var(--disp);font-variation-settings:var(--fr-display);
  font-weight:650;font-size:clamp(24px,2.1vw,30px);line-height:1.22;letter-spacing:.02em;color:var(--tx)}
.foot__tag span{display:block}
.foot__tag em{font-style:normal}
.foot__tag .o1{color:#E0106F}
.foot__tag .o2{color:#B532DE}
html[data-mode="light"] .foot__tag .o1{color:var(--act)}
html[data-mode="light"] .foot__tag .o2{color:var(--act2)}
@media (max-width:480px){.foot__tag span{display:inline}.foot__tag{text-wrap:balance}}
.foot__mailrow{margin:20px 0 0}
.foot__mail{font:700 14px/1 var(--ui);letter-spacing:.08em;text-transform:uppercase;text-underline-offset:6px}
.foot__social{display:flex;gap:14px;margin:16px 0 0}
.foot__social a{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;
  color:var(--tx-dim);box-shadow:inset 0 0 0 1px var(--line);transition:color .2s,box-shadow .2s}
.foot__social svg{width:17px;height:17px;max-width:none;fill:currentColor}
@media (hover:hover){.foot__social a:hover{color:var(--tx);box-shadow:inset 0 0 0 1px var(--tx-dim)}}
.foot__social a:focus-visible{outline:2px solid var(--act);outline-offset:2px}
.foot__legal{display:flex;gap:18px;flex-wrap:wrap}
.foot__legal a{white-space:nowrap}
@media (hover:hover){.foot__legal a:hover{color:var(--tx)}}
/* Was --tx-faint on both .foot h4 and .foot__bar — 92 (h4 + bar together, both
   backgrounds counted) of the contrast audit's failures by itself, the single
   biggest bucket sitewide, because this footer renders on every template. Column
   headings and the copyright/legal row are real navigation text, not decorative
   micro-labels — --tx-dim reads a shade less faint but is the nearest shared token
   that actually clears 4.5:1 against both --surface and --bw. */
/* 2026-10-10: was 800/.2em (2.6px) — approved spec is 700/.18em. Font-size stays the
   accepted +1px-sitewide 13px (not the prototype's 12px) per the handover package's
   own "accepted differences" list; only the weight/tracking ratio were the real bug. */
.foot h4{font-family:var(--ui);font-size:13px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--tx-dim);margin:0 0 14px;font-weight:700}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:0;font-size:15px;color:var(--tx-dim)}
/* 2026-10-11 mobile audit: these links rendered ~20px tall (text + the old
   9px list gap) — well under the 44px tap-target floor. Padding instead of
   bigger type (E2's own instruction): the link itself grows to >=44px and
   the old inter-item gap is absorbed into that padding instead of stacking
   on top of it, so the list doesn't end up with doubled whitespace. */
.foot ul a{display:block;padding:11px 0}
.foot__bar{max-width:var(--maxw);margin:0 auto;padding:18px var(--gut) 40px;
  border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:14px;
  flex-wrap:wrap;font-size:13.5px;color:var(--tx-dim)}

.rev{opacity:0;translate:0 20px}
.rev.in{opacity:1;translate:0 0;transition:opacity .6s var(--e),translate .6s var(--e);
  transition-delay:calc(var(--i,0)*65ms)}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}*{transition-duration:.01ms!important}
  .rev{opacity:1;translate:none}.p__cta{opacity:1;translate:0 0}
}