/* Baize × pdoom — "construction sheet" theme preview.
   One palette, one type system, one grain: ink / bone / signal orange,
   Archivo (display) + IBM Plex Mono (machine voice) + serif (prophetic register).
   Loaded after refinement.css; overrides visuals only, never content. */

:root{
  --pd-ink:#0a0a0b;--pd-ink2:#151517;
  --pd-graphite:#5e5b57;--pd-ash:#9c978f;--pd-bone:#eee9df;
  --pd-signal:#ff4d12;--pd-ember:#ff8a3d;--pd-blood:#c21d0b;
  --pd-hair:#eee9df1f;--pd-hair-strong:#eee9df3d;--pd-hair-ink:#0a0a0b1f;

  --pd-sans:"Archivo","PingFang SC","Hiragino Sans GB","Noto Sans SC","Microsoft YaHei",sans-serif;
  --pd-mono:"IBM Plex Mono","SFMono-Regular",Menlo,"PingFang SC",monospace;
  --pd-serif:"Cormorant Garamond","Songti SC","Noto Serif SC","STSong",serif;

  --pd-text-hero:clamp(2.6rem,1rem + 5.2vw,6.6rem);
  --pd-text-h2:clamp(2.1rem,1.2rem + 2.6vw,4.2rem);
  --pd-text-mono:.8125rem;
  --pd-space-section:clamp(5rem,3.5rem + 5vw,9.5rem);

  --pd-out-expo:cubic-bezier(.16,1,.3,1);
  --pd-fast:160ms;--pd-normal:420ms;
}

/* ---------- base ---------- */
html{scroll-padding-top:84px;background:var(--pd-ink)}
body{background:var(--pd-ink);color:var(--pd-bone);font-family:var(--pd-sans);counter-reset:pd-section;
  font-feature-settings:"kern","lnum";-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
::selection{background:var(--pd-signal);color:var(--pd-ink)}
a:focus-visible,button:focus-visible{outline:2px solid var(--pd-signal);outline-offset:4px;border-radius:0}
h1,h2,h3,h4{font-family:var(--pd-sans)}

/* Film grain: one shared layer, stepped rather than drifting. */
.pd-grain{position:fixed;inset:-50%;z-index:90;pointer-events:none;opacity:.075;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 1.4 -.2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:pd-grain 1s steps(6) infinite}
@keyframes pd-grain{0%{transform:translate(0,0)}17%{transform:translate(-3%,2%)}33%{transform:translate(2%,-4%)}50%{transform:translate(-4%,-1%)}67%{transform:translate(4%,3%)}83%{transform:translate(-1%,4%)}100%{transform:translate(0,0)}}

/* ---------- header ---------- */
.site-header,.site-header.scrolled{background:#0a0a0bd9;border-bottom:1px solid var(--pd-hair);box-shadow:none;backdrop-filter:blur(14px) saturate(.6)}
.nav-wrap{height:76px}
.brand img{width:38px;height:38px;transition:transform .6s var(--pd-out-expo)}
.brand{position:relative}
.pd-logo-anim{position:absolute;left:0;top:50%;width:38px;height:38px;margin-top:-19px;pointer-events:none;opacity:0}
.pd-logo-anim.is-on{opacity:1}
.brand img.is-morphing{visibility:hidden}
.brand b{color:var(--pd-bone);font-family:var(--pd-sans);font-weight:700;font-size:20px;letter-spacing:.18em}
.brand small{font-family:var(--pd-mono);font-size:12px;letter-spacing:.32em;color:var(--pd-ash)}
.site-header nav a{position:relative;color:var(--pd-ash);font-size:.95rem;letter-spacing:.06em;padding:26px 0;transition:color var(--pd-fast)}
.site-header nav a:hover,.site-header nav a.active{color:var(--pd-bone)}
.site-header nav a:after{background:var(--pd-signal);height:2px;bottom:18px}
.site-header nav a.active:before{content:"";position:absolute;left:-12px;top:50%;width:5px;height:5px;margin-top:-2px;background:var(--pd-signal)}
.nav-cta{background:var(--pd-signal);color:var(--pd-ink);border-radius:0;font-family:var(--pd-mono);font-weight:600;
  letter-spacing:.08em;padding:10px 18px;transition:background var(--pd-fast),transform var(--pd-normal) var(--pd-out-expo),box-shadow var(--pd-normal) var(--pd-out-expo)}
.nav-cta:hover{background:var(--pd-bone);color:var(--pd-ink);transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--pd-signal)}
.nav-toggle{color:var(--pd-bone);background:transparent;border:1px solid var(--pd-hair-strong);border-radius:0}
@media(max-width:1000px){
  .site-header nav{background:var(--pd-ink2)!important;border:1px solid var(--pd-hair-strong)!important;border-radius:0!important;box-shadow:none!important}
  .site-header nav a{border-color:var(--pd-hair)!important}
  .site-header nav a.active:before{display:none}
}

/* Buttons inherit the old KaiTi stack from main.css; pull them into the system. */
button{font-family:var(--pd-sans)}

/* ---------- buttons ---------- */
.btn{border-radius:0;font-family:var(--pd-mono);font-weight:500;letter-spacing:.06em;font-size:.95rem;min-height:52px;
  transition:transform var(--pd-normal) var(--pd-out-expo),box-shadow var(--pd-normal) var(--pd-out-expo),background var(--pd-fast),color var(--pd-fast)}
.btn.primary{background:var(--pd-signal);color:var(--pd-ink);border:1px solid var(--pd-signal);box-shadow:none}
.btn.primary:hover{background:var(--pd-signal);transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--pd-bone)}
.btn.secondary{background:transparent;color:var(--pd-bone);border:1px solid var(--pd-hair-strong)}
.btn.secondary:hover{background:var(--pd-bone);color:var(--pd-ink);border-color:var(--pd-bone)}
.btn:active{transform:none!important;box-shadow:none!important;transition-duration:60ms}

/* ---------- section scaffolding ---------- */
.section{padding:var(--pd-space-section) 0;background:var(--pd-ink);position:relative}
.section.white{background:var(--pd-ink)}
.section-head{counter-increment:pd-section;align-items:flex-end;gap:48px;margin-bottom:clamp(40px,4vw,72px);
  padding-top:22px;border-top:1px solid var(--pd-hair-strong);position:relative}
.section-eyebrow{font-family:var(--pd-mono)!important;font-size:var(--pd-text-mono)!important;letter-spacing:.22em!important;
  color:var(--pd-ash)!important;text-transform:uppercase;display:flex!important;align-items:center;gap:12px}
.section-eyebrow::before{content:"§" counter(pd-section,decimal-leading-zero)!important;color:var(--pd-signal);letter-spacing:.08em;
  width:auto!important;height:auto!important;background:none!important;white-space:nowrap}
.section-eyebrow::after{content:"";flex:0 0 48px;height:1px;background:var(--pd-graphite)}
.section-title,.section-head h2{font-size:var(--pd-text-h2)!important;font-weight:800!important;letter-spacing:-.035em!important;
  line-height:1.06!important;color:var(--pd-bone)!important;margin-top:18px!important;font-stretch:88%}
.section-head p{color:var(--pd-ash);font-size:1.02rem;line-height:1.85;max-width:440px;
  padding-left:18px;border-left:1px solid var(--pd-graphite)}

/* Reveal: hold, then snap in. No clip-path on the target, or the
   IntersectionObserver in main.js sees an empty box and never fires. */
.js-motion .reveal{opacity:0;transform:translateY(36px);
  transition:opacity .45s linear,transform .9s var(--pd-out-expo)}
.js-motion .reveal.visible{opacity:1;transform:none}

/* ---------- hero: luminous construction sheet ---------- */
.hero{background:var(--pd-ink);padding-top:76px;min-height:760px;overflow:hidden}
.hero-bg,.hero-mist{display:none}
.hero-atmosphere{z-index:2}
.hero-flow{display:none}
.hero-flow .flow-base{stroke:var(--pd-hair-strong)!important;stroke-width:1!important;stroke-dasharray:2 6}
.hero-flow .flow-pulse{stroke:var(--pd-signal)!important;stroke-width:1.5!important}
.hero-flow circle{fill:var(--pd-ink)!important;stroke:var(--pd-signal)!important;stroke-width:1.5}
.pd-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,#0a0a0bf0 0%,#0a0a0bb8 36%,#0a0a0b10 66%,#0a0a0b00 100%)}
.hero-inner{position:relative;z-index:3;min-height:calc(100svh - 76px)}
.hero-copy{width:62%;max-width:1020px;padding:56px 0 150px}
.eyebrow{font-family:var(--pd-mono)!important;font-size:var(--pd-text-mono)!important;letter-spacing:.24em!important;
  color:var(--pd-ash)!important;text-transform:uppercase}
.eyebrow:before{background:var(--pd-signal)!important;width:28px!important;height:2px!important}
.hero h1{font-family:var(--pd-sans);font-size:var(--pd-text-hero);font-weight:800;line-height:1.04;letter-spacing:-.045em;
  color:var(--pd-bone);margin:26px 0 30px;font-stretch:84%}
.hero h1 em{display:block;color:var(--pd-signal);font-style:normal;font-weight:900;font-stretch:100%;letter-spacing:-.05em;
  text-shadow:0 0 42px #ff4d1259}
.hero-philosophy{font-family:var(--pd-serif)!important;font-style:italic;font-size:clamp(1.25rem,.9rem + .9vw,1.8rem)!important;
  color:var(--pd-bone)!important;letter-spacing:.06em;margin:0 0 26px!important}
.hero-philosophy strong{color:var(--pd-signal);font-weight:600}
.hero-philosophy:after,.hero-philosophy:before{display:none!important}
.hero-lead{color:var(--pd-bone)!important;opacity:.86;font-size:clamp(1.05rem,.95rem + .35vw,1.3rem)!important;line-height:1.75!important;max-width:680px}
.hero-thesis{font-family:var(--pd-sans);color:var(--pd-ash)!important;font-size:1rem!important;line-height:1.85!important;
  max-width:620px;border-left:1px solid var(--pd-signal)!important;padding-left:18px!important;background:none!important}
.hero-actions{gap:14px;margin-top:34px}

/* Phases → HUD timeline */
.hero-phases{z-index:4;left:clamp(16px,4vw,64px)!important;right:clamp(16px,4vw,64px)!important;bottom:34px!important;
  display:grid!important;grid-template-columns:repeat(4,1fr);gap:0!important;padding:0!important;margin:0!important;
  border-top:1px solid var(--pd-hair-strong);background:none!important;width:auto!important;counter-reset:pd-phase}
.hero-phases::before,.hero-phases::after{display:none!important}
.hero-phases li{counter-increment:pd-phase;position:relative;padding:14px 0 0!important;margin:0!important;
  font-family:var(--pd-sans);font-size:.98rem!important;letter-spacing:.12em;color:var(--pd-ash)!important;
  transition:color var(--pd-fast);background:none!important;border:0!important}
.hero-phases li::before{content:counter(pd-phase,decimal-leading-zero) " /";font-family:var(--pd-mono);font-size:.72rem;
  color:var(--pd-graphite);margin-right:10px;letter-spacing:.1em;position:static!important;width:auto!important;height:auto!important;background:none!important;display:inline!important;border:0!important;box-shadow:none!important}
.hero-phases li::after{content:"";position:absolute!important;left:0;top:-1px;height:2px;width:100%;background:var(--pd-signal);
  transform:scaleX(0);transform-origin:left;transition:transform .7s var(--pd-out-expo);display:block!important}
.hero-phases li.is-live{color:var(--pd-bone)!important}
.hero-phases li.is-live::before{color:var(--pd-signal)}
.hero-phases li.is-live::after{transform:scaleX(1)}
.hero-scroll{z-index:4;font-family:var(--pd-mono)!important;font-size:.75rem!important;letter-spacing:.24em;color:var(--pd-ash)!important;
  bottom:96px!important;left:auto!important;right:clamp(16px,4vw,64px)!important;border:0!important;padding-left:0!important}
.hero-scroll:after{display:none!important}
.hero-scroll::before{content:"↓ "!important;display:inline!important;position:static!important;color:var(--pd-signal);background:none!important;width:auto!important;height:auto!important}
@media(max-width:1000px){
  .hero-copy{width:100%;padding-bottom:170px}
  .hero::after{background:linear-gradient(180deg,#0a0a0bcc 0%,#0a0a0be6 55%,#0a0a0bf7 100%)}
}
@media(max-width:720px){
  .hero-phases{grid-template-columns:repeat(2,1fr);row-gap:10px!important}
  .hero-scroll{display:none!important}
}

/* World engine (pdoom-world.js): the narrated feature hides the copy, ambient mode shows it. */
.hero.pd-feature .hero-inner,.hero.pd-feature .hero-phases,.hero.pd-feature .hero-scroll,.hero.pd-feature .pd-crop{opacity:0;pointer-events:none}
.hero .hero-inner{transition:opacity .9s linear}
.hero.pd-feature::after{opacity:0}
.hero::after{transition:opacity .9s linear}
.hero-phases li{display:flex;flex-direction:column;gap:6px}
.hero-phases li::before{order:-1}
.hero-phases li b{font-weight:700;font-size:1rem;letter-spacing:.12em;color:inherit}
.hero-phases li span{font-size:.78rem;line-height:1.55;letter-spacing:.02em;color:var(--pd-graphite);max-width:22em;transition:color var(--pd-fast)}
.hero-phases li.is-live span,.hero-phases li:hover span{color:var(--pd-ash)}
@media(max-width:720px){.hero-phases li span{display:none}}

/* Copy ⇄ scene (pdoom-hero.js): glyph particles fly above the copy. */
.pd-glyph-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:4;pointer-events:none}
.hero h1 .pd-k{transition:color .45s linear,-webkit-text-stroke-color .45s linear,opacity .28s linear}
.hero h1 .pd-k.pd-ghost{color:transparent!important;-webkit-text-stroke:1px rgba(238,233,223,.38)}
.hero h1 em .pd-k.pd-ghost{-webkit-text-stroke-color:rgba(255,77,18,.6)}
.hero h1 em.pd-ghosting{text-shadow:none}
@keyframes pd-forge{0%{text-shadow:0 0 0 #ff4d1200}12%{text-shadow:0 0 18px #ffd2b8,0 0 70px #ff4d12}100%{text-shadow:0 0 42px #ff4d1259}}
.hero h1 em.pd-forged{animation:pd-forge 1.6s var(--pd-out-expo)}
.hero-philosophy.pd-linked .pd-phrase{color:var(--pd-ash);transition:color .4s linear,background-size .6s var(--pd-out-expo);
  background:linear-gradient(var(--pd-signal),var(--pd-signal)) left 100%/0 1px no-repeat}
.hero-philosophy.pd-linked strong.pd-phrase{color:#ff4d1299}
.hero-philosophy.pd-linked .pd-phrase.pd-phase-on{color:var(--pd-bone);background-size:100% 1px}
.hero-philosophy.pd-linked strong.pd-phrase.pd-phase-on{color:var(--pd-signal)}

/* Hero MV (pdoom-mv.js): starts transparent over the live hero, copy hands off to the canvas. */
.pd-mv{position:absolute;inset:0;width:100%;height:100%;z-index:6;pointer-events:none;transition:opacity .7s linear}
.hero.pd-mv-on h1{visibility:hidden}
.hero .hero-copy>*:not(h1),.hero .hero-phases,.hero .hero-scroll{transition:opacity .6s linear}
.hero.pd-mv-on .hero-copy>*:not(h1),.hero.pd-mv-on .hero-phases,.hero.pd-mv-on .hero-scroll,.hero.pd-mv-on .pd-crop,.hero.pd-mv-on .pd-glyph-canvas{opacity:0}
.pd-mv-bar{position:absolute;left:clamp(16px,4vw,64px);right:clamp(16px,4vw,64px);top:calc(min(100%,100svh) - 56px);z-index:7;display:grid;
  grid-template-columns:1fr auto;align-items:center;gap:10px 18px;font-family:var(--pd-mono);font-size:11px;letter-spacing:.16em;color:var(--pd-ash);transition:opacity .7s linear}
.pd-mv-bar b{grid-column:1/-1;grid-row:2;height:1px;background:var(--pd-hair-strong);overflow:hidden}
.pd-mv-bar b i{display:block;height:100%;background:var(--pd-signal);transform-origin:left;transform:scaleX(0)}
.pd-mv-btn{justify-self:end}
.pd-mv-bar{grid-template-columns:1fr auto auto}
.pd-mv-sound{color:var(--pd-bone);border-color:var(--pd-hair-strong)}
.pd-mv-sound.is-off{position:relative;padding-left:24px}
.pd-mv-sound.is-off::before{content:"";position:absolute;left:10px;top:50%;width:6px;height:6px;margin-top:-3px;background:var(--pd-signal);animation:pd-sound-pulse 1s steps(2) infinite}
@keyframes pd-sound-pulse{50%{opacity:.15}}
.pd-mv-btn,.pd-mv-replay{white-space:nowrap;font-family:var(--pd-mono);font-size:11px;letter-spacing:.14em;color:var(--pd-signal);background:#0a0a0bcc;
  border:1px solid var(--pd-signal);padding:7px 12px;cursor:pointer;transition:background var(--pd-fast),color var(--pd-fast)}
.pd-mv-btn:hover,.pd-mv-replay:hover{background:var(--pd-signal);color:var(--pd-ink)}
.pd-mv-replay{position:absolute;right:clamp(16px,4vw,64px);top:clamp(150px,13vw,176px);z-index:5;color:var(--pd-ash);border-color:var(--pd-hair-strong)}
@media(max-width:720px){.pd-mv-bar{top:calc(min(100%,100svh) - 64px)}.pd-mv-replay{top:auto;bottom:150px}}

/* World engine (pdoom-world.js): the narrated feature hides the copy, ambient mode shows it. */
.hero.pd-feature .hero-inner,.hero.pd-feature .hero-phases,.hero.pd-feature .hero-scroll,.hero.pd-feature .pd-crop{opacity:0;pointer-events:none}
.hero .hero-inner{transition:opacity .9s linear}
.hero.pd-feature::after{opacity:0}
.hero::after{transition:opacity .9s linear}
.hero-phases li{display:flex;flex-direction:column;gap:6px}
.hero-phases li::before{order:-1}
.hero-phases li b{font-weight:700;font-size:1rem;letter-spacing:.12em;color:inherit}
.hero-phases li span{font-size:.78rem;line-height:1.55;letter-spacing:.02em;color:var(--pd-graphite);max-width:22em;transition:color var(--pd-fast)}
.hero-phases li.is-live span,.hero-phases li:hover span{color:var(--pd-ash)}
@media(max-width:720px){.hero-phases li span{display:none}}

/* Copy ⇄ scene (pdoom-hero.js): glyph particles fly above the copy. */
.pd-glyph-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:4;pointer-events:none}
.hero h1 .pd-k{transition:color .45s linear,-webkit-text-stroke-color .45s linear,opacity .28s linear}
.hero h1 .pd-k.pd-ghost{color:transparent!important;-webkit-text-stroke:1px rgba(238,233,223,.38)}
.hero h1 em .pd-k.pd-ghost{-webkit-text-stroke-color:rgba(255,77,18,.6)}
.hero h1 em.pd-ghosting{text-shadow:none}
@keyframes pd-forge{0%{text-shadow:0 0 0 #ff4d1200}12%{text-shadow:0 0 18px #ffd2b8,0 0 70px #ff4d12}100%{text-shadow:0 0 42px #ff4d1259}}
.hero h1 em.pd-forged{animation:pd-forge 1.6s var(--pd-out-expo)}
.hero-philosophy.pd-linked .pd-phrase{color:var(--pd-ash);transition:color .4s linear,background-size .6s var(--pd-out-expo);
  background:linear-gradient(var(--pd-signal),var(--pd-signal)) left 100%/0 1px no-repeat}
.hero-philosophy.pd-linked strong.pd-phrase{color:#ff4d1299}
.hero-philosophy.pd-linked .pd-phrase.pd-phase-on{color:var(--pd-bone);background-size:100% 1px}
.hero-philosophy.pd-linked strong.pd-phrase.pd-phase-on{color:var(--pd-signal)}

/* Hero MV cold open (pdoom-mv.js): a full-frame reel over the hero, then hand-off. */
.pd-mv{position:absolute;inset:0;width:100%;height:100%;z-index:6;pointer-events:none;background:var(--pd-ink);transition:opacity 1.2s linear}
.hero.pd-mv-on .pd-canvas,.hero.pd-mv-on .pd-glyph-canvas{visibility:hidden}
.hero.pd-mv-on .hero-inner,.hero.pd-mv-on .hero-phases,.hero.pd-mv-on .hero-scroll,.hero.pd-mv-on .pd-crop{opacity:0}
.hero .hero-inner,.hero .hero-phases{transition:opacity .9s linear}
.pd-mv-bar{position:absolute;left:clamp(16px,4vw,64px);right:clamp(16px,4vw,64px);top:calc(min(100%,100svh) - 64px);z-index:7;display:grid;
  grid-template-columns:auto 1fr auto auto;align-items:center;gap:8px 18px;font-family:var(--pd-mono);font-size:11px;letter-spacing:.14em;
  color:var(--pd-ash);transition:opacity 1.2s linear}
.pd-mv-bar [data-tc]{color:var(--pd-bone)}
.pd-mv-bar b{grid-column:1/-1;grid-row:2;height:1px;background:var(--pd-hair-strong);overflow:hidden}
.pd-mv-bar b i{display:block;height:100%;background:var(--pd-signal);transform-origin:left;transform:scaleX(0)}
.pd-mv-btn{justify-self:end}
.pd-mv-bar{grid-template-columns:1fr auto auto}
.pd-mv-sound{color:var(--pd-bone);border-color:var(--pd-hair-strong)}
.pd-mv-sound.is-off{position:relative;padding-left:24px}
.pd-mv-sound.is-off::before{content:"";position:absolute;left:10px;top:50%;width:6px;height:6px;margin-top:-3px;background:var(--pd-signal);animation:pd-sound-pulse 1s steps(2) infinite}
@keyframes pd-sound-pulse{50%{opacity:.15}}
.pd-mv-btn,.pd-mv-replay{white-space:nowrap;font-family:var(--pd-mono);font-size:11px;letter-spacing:.14em;color:var(--pd-bone);background:#0a0a0bcc;
  border:1px solid var(--pd-hair-strong);padding:8px 12px;cursor:pointer;transition:background var(--pd-fast),color var(--pd-fast),border-color var(--pd-fast)}
.pd-mv-btn:hover,.pd-mv-replay:hover{background:var(--pd-bone);color:var(--pd-ink);border-color:var(--pd-bone)}
.pd-mv-skip{border-color:var(--pd-signal);color:var(--pd-signal)}
.pd-mv-replay{position:absolute;right:clamp(16px,4vw,64px);top:clamp(140px,12vw,170px);z-index:5}
@media(max-width:720px){.pd-mv-bar{grid-template-columns:1fr auto auto;top:calc(min(100%,100svh) - 84px)}.pd-mv-bar [data-tc]{white-space:nowrap;font-size:10px}.pd-mv-bar [data-shot]{display:none}.pd-mv-replay{top:auto;bottom:150px}}

/* Hero layout: copy, scroll cue and the phase bar stack in flow (no absolute overlap at any height). */
.hero{height:auto!important;min-height:max(100svh,640px)!important;display:flex!important;flex-direction:column}
.hero .hero-inner{flex:1 0 auto;min-height:0!important;display:flex;align-items:center}
.hero .hero-copy{padding:clamp(28px,5vh,56px) 0 clamp(20px,3vh,36px)!important}
.hero .hero-scroll{order:1;position:relative!important;inset:auto!important;z-index:4;align-self:flex-end;margin:0 clamp(16px,4vw,64px) 14px!important}
.hero .hero-phases{order:2;position:relative!important;inset:auto!important;z-index:4;margin:0 clamp(16px,4vw,64px) 30px!important;flex:none}
@media(max-width:1000px){.hero .hero-copy{padding-bottom:20px!important}}

/* Karaoke words (spans injected by pdoom.js) */
.pd-k{transition:opacity .28s linear}
.pd-k.pd-dim{opacity:.3}

/* ---------- capabilities ---------- */
.capability-intro{display:grid!important;grid-template-columns:1.25fr .75fr;gap:clamp(32px,5vw,96px);align-items:end;margin-bottom:64px}
.big-quote{font-family:var(--pd-sans)!important;font-size:clamp(1.8rem,1rem + 2.2vw,3.4rem)!important;font-weight:700!important;
  line-height:1.24!important;letter-spacing:-.025em;color:var(--pd-bone)!important;margin:0!important;font-stretch:90%}
.big-quote:before,.big-quote:after{display:none!important}
.intro-text{color:var(--pd-ash)!important;line-height:1.95!important;font-size:1rem!important;border-top:1px solid var(--pd-graphite);padding-top:18px}
.cap-stack{display:grid;gap:0!important;border-top:1px solid var(--pd-hair-strong)}
.cap-row{background:transparent!important;border:0!important;border-bottom:1px solid var(--pd-hair-strong)!important;border-radius:0!important;
  box-shadow:none!important;grid-template-columns:200px 1fr!important}
.cap-row-label{background:transparent!important;border-radius:0!important;padding:28px 24px 28px 0!important;border-right:1px solid var(--pd-hair)!important;
  display:flex;flex-direction:column;justify-content:flex-start;gap:14px}
.cap-row-label span{font-family:var(--pd-mono)!important;font-size:.72rem!important;letter-spacing:.2em!important;color:var(--pd-signal)!important}
.cap-row-label b{font-size:clamp(1.6rem,1.2rem + 1vw,2.3rem)!important;font-weight:800!important;color:var(--pd-bone)!important;letter-spacing:-.02em}
.cap-items{gap:0!important;background:none!important}
@media(min-width:1001px){
  .cap-row.service .cap-items{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .cap-row.service .cap-item:nth-child(n+5){border-top:1px solid var(--pd-hair)!important}
  .cap-row.service .cap-item:nth-child(5){border-left:0!important}
}
.service .cap-item:after{display:none!important}
.cap-item{background:transparent!important;border:0!important;border-left:1px solid var(--pd-hair)!important;border-radius:0!important;
  padding:28px 22px!important;position:relative;min-height:150px;box-shadow:none!important;
  transition:background var(--pd-fast) linear!important}
.cap-item:first-child{border-left:0!important}
.cap-item:before{content:"";position:absolute!important;left:0;top:-1px;width:100%;height:2px;background:var(--pd-signal)!important;
  transform:scaleX(0);transform-origin:left;transition:transform .5s var(--pd-out-expo);animation:none!important;opacity:1!important;display:block!important;border-radius:0!important}
.cap-item:hover{background:var(--pd-ink2)!important;transform:none!important;box-shadow:none!important}
.cap-item:hover:before{transform:scaleX(1)}
.cap-item i{font-family:var(--pd-sans)!important;font-style:normal;font-weight:700!important;font-size:1.06rem!important;color:var(--pd-bone)!important;display:block;letter-spacing:.01em}
.cap-item b{display:block;font-family:var(--pd-sans);font-size:1.12rem;font-weight:700;color:var(--pd-bone)!important;margin:10px 0 0}
.cap-item p{color:var(--pd-ash)!important;font-size:.95rem!important;line-height:1.75!important;margin-top:12px!important}
.cap-row.foundation .cap-item i{font-family:var(--pd-mono)!important;font-size:.74rem!important;font-weight:500!important;letter-spacing:.2em;color:var(--pd-signal)!important}
.cap-note{background:transparent!important;border:0!important;border-left:2px solid var(--pd-signal)!important;color:var(--pd-bone)!important;
  margin-top:56px!important;padding:6px 0 6px 26px!important;max-width:980px;font-family:var(--pd-serif);font-style:italic;
  font-size:clamp(1.12rem,1rem + .4vw,1.4rem)!important;line-height:1.75!important}
.cap-note b{font-family:var(--pd-mono);font-style:normal;font-size:.78rem;letter-spacing:.2em;color:var(--pd-signal);display:block;margin-bottom:8px;font-weight:500}
@media(max-width:1000px){
  .capability-intro{grid-template-columns:1fr}
  .cap-row{grid-template-columns:minmax(0,1fr)!important}
  .cap-row .cap-items{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .cap-item{min-width:0}
  .cap-item:nth-child(odd){border-left:0!important}
  .cap-row-label{border-right:0!important;border-bottom:1px solid var(--pd-hair)!important;padding:22px 0!important;flex-direction:row;align-items:baseline}
  .cap-item{border-top:1px solid var(--pd-hair)!important}
}

/* ---------- bone-paper plates (light/dark rhythm) ---------- */
.seo-cluster,.insights-section{color:var(--pd-ink);background-color:var(--pd-bone)!important;background-image:
  linear-gradient(var(--pd-hair-ink) 1px,transparent 1px),linear-gradient(90deg,var(--pd-hair-ink) 1px,transparent 1px)!important;
  background-size:100% 96px,96px 100%!important}
.seo-cluster .section-head,.insights-section .section-head{border-top-color:var(--pd-ink)}
.seo-cluster .section-title,.insights-section .section-title{color:var(--pd-ink)!important}
.seo-cluster .section-eyebrow,.insights-section .section-eyebrow{color:var(--pd-graphite)!important}
.seo-cluster .section-eyebrow::before,.insights-section .section-eyebrow::before{color:var(--pd-blood)}
.seo-cluster .section-head p,.insights-section .section-head p{color:var(--pd-graphite);border-left-color:var(--pd-ink)}

.seo-link-grid{gap:0!important;border-top:1px solid var(--pd-ink);border-left:1px solid var(--pd-ink)}
.seo-link-card{background:var(--pd-bone)!important;border:0!important;border-right:1px solid var(--pd-ink)!important;border-bottom:1px solid var(--pd-ink)!important;
  padding:30px 28px!important;color:var(--pd-ink)!important;position:relative;
  transition:color var(--pd-fast),background var(--pd-fast)!important}
.seo-link-card:hover{transform:none!important}
.seo-link-card b{font-size:clamp(1.25rem,1rem + .6vw,1.6rem)!important;font-weight:800!important;color:inherit!important;letter-spacing:-.01em}
.seo-link-card span{color:var(--pd-graphite)!important;font-size:.98rem;transition:color var(--pd-fast)}
.seo-link-card em{font-family:var(--pd-mono);font-style:normal;font-size:.8rem!important;letter-spacing:.14em;color:var(--pd-blood)!important;transition:color var(--pd-fast)}
.seo-link-card:hover{background:var(--pd-ink)!important;color:var(--pd-bone)!important}
.seo-link-card:hover span{color:var(--pd-ash)!important}
.seo-link-card:hover em{color:var(--pd-signal)!important}
.seo-hub-link{margin-top:28px}
.text-link{font-family:var(--pd-mono);letter-spacing:.08em;color:var(--pd-blood)!important;border-bottom:1px solid currentColor}
.site-footer .text-link{color:var(--pd-signal)!important}

/* ---------- cases ---------- */
.case-section{background:var(--pd-ink)!important}
.case-tabs{gap:0!important;border:1px solid var(--pd-hair-strong);display:inline-flex!important;background:none!important;padding:0!important;border-radius:0!important}
.case-tab{border-radius:0!important;background:transparent!important;color:var(--pd-ash)!important;font-family:var(--pd-mono);letter-spacing:.1em;
  padding:12px 22px!important;border:0!important;box-shadow:none!important;transition:background var(--pd-fast),color var(--pd-fast)}
.case-tab+.case-tab{border-left:1px solid var(--pd-hair-strong)!important}
.case-tab.active{background:var(--pd-bone)!important;color:var(--pd-ink)!important}
.case-nav{gap:8px!important;margin:22px 0 40px!important;border:0!important}
.case-chip{border-radius:0!important;background:transparent!important;border:1px solid var(--pd-hair)!important;color:var(--pd-ash)!important;
  font-size:.92rem!important;padding:9px 14px!important;box-shadow:none!important;transition:border-color var(--pd-fast),color var(--pd-fast)}
.case-chip:hover{border-color:var(--pd-ash)!important;color:var(--pd-bone)!important}
.case-chip.active{border-color:var(--pd-signal)!important;color:var(--pd-bone)!important;background:#ff4d1214!important}
.case-chip.active:before{content:"▸ ";color:var(--pd-signal)}
.case-stage{border-top:1px solid var(--pd-hair-strong);padding-top:40px}
.case-visual{border-radius:0!important;position:relative;overflow:hidden;background:var(--pd-ink2);box-shadow:none!important;border:1px solid var(--pd-hair)}
.case-visual img{filter:none;transition:filter .6s var(--pd-out-expo),transform 1.2s var(--pd-out-expo)!important;border-radius:0!important}
.case-visual::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#0a0a0b00 45%,#0a0a0bb3 100%);pointer-events:none}
.case-panel:hover .case-visual img{filter:brightness(1.08) saturate(1.12);transform:scale(1.04)}
.case-visual::before{content:"";position:absolute;inset:12px;z-index:3;pointer-events:none;
  background:
    linear-gradient(var(--pd-signal),var(--pd-signal)) top left/18px 1px,linear-gradient(var(--pd-signal),var(--pd-signal)) top left/1px 18px,
    linear-gradient(var(--pd-signal),var(--pd-signal)) bottom right/18px 1px,linear-gradient(var(--pd-signal),var(--pd-signal)) bottom right/1px 18px;
  background-repeat:no-repeat}
.case-visual-overlay{background:linear-gradient(0deg,#0a0a0bf2,#0a0a0b00)!important;border-radius:0!important}
.case-visual-overlay span{font-family:var(--pd-mono);font-size:.74rem!important;letter-spacing:.14em;color:var(--pd-signal)!important;
  background:var(--pd-ink);padding:3px 8px;align-self:flex-start;width:max-content;max-width:100%}
.case-visual-overlay b{color:var(--pd-bone)!important;font-weight:800}
.case-visual-credit{font-family:var(--pd-mono);font-size:.7rem!important;letter-spacing:.16em;border-radius:0!important;background:var(--pd-ink)!important;color:var(--pd-ash)!important;border:1px solid var(--pd-hair-strong)}
.case-kicker{font-family:var(--pd-mono)!important;font-size:.75rem!important;letter-spacing:.22em!important;color:var(--pd-signal)!important;text-transform:uppercase}
.case-copy h3{font-size:clamp(1.9rem,1.2rem + 1.6vw,3rem)!important;font-weight:800!important;letter-spacing:-.03em!important;line-height:1.12!important;color:var(--pd-bone)!important;font-stretch:88%}
.case-sub{color:var(--pd-bone)!important;opacity:.78;font-family:var(--pd-serif);font-style:italic;font-size:1.15rem!important}
.case-triad{gap:0!important;border-top:1px solid var(--pd-hair-strong);border-bottom:1px solid var(--pd-hair-strong)}
.case-triad section{background:transparent!important;border:0!important;border-top:1px solid var(--pd-hair)!important;border-radius:0!important;padding:14px 0!important;box-shadow:none!important;grid-template-columns:96px 1fr!important;align-items:baseline}
.case-triad section:first-child{border-top:0!important}
.case-triad h4{font-family:var(--pd-mono)!important;font-size:.72rem!important;letter-spacing:.2em!important;color:var(--pd-ash)!important;font-weight:500!important}
.case-triad p{color:var(--pd-bone)!important;opacity:.86;font-size:.96rem!important;line-height:1.75!important}
.mini-metrics{gap:0!important;border:0!important;background:none!important}
.metric{background:transparent!important;border:0!important;border-left:1px solid var(--pd-hair)!important;border-radius:0!important;padding:18px 18px 4px!important;box-shadow:none!important}
.metric:first-child{border-left:0!important;padding-left:0!important}
.metric strong{font-family:var(--pd-sans)!important;font-weight:900!important;font-size:clamp(1.1rem,.8rem + .7vw,1.55rem)!important;
  color:var(--pd-signal)!important;letter-spacing:-.02em;line-height:1.15;font-variant-numeric:tabular-nums;text-shadow:0 0 26px #ff4d1240}
.metric span{font-family:var(--pd-mono);font-size:.74rem!important;letter-spacing:.14em;color:var(--pd-ash)!important}
.case-more{font-family:var(--pd-mono);letter-spacing:.1em;color:var(--pd-bone)!important;border-bottom:1px solid var(--pd-signal);padding-bottom:4px;transition:color var(--pd-fast)}
.case-more:hover{color:var(--pd-signal)!important}
.insights-section .btn.secondary{color:var(--pd-ink);border-color:var(--pd-ink)}
.insights-section .btn.secondary:hover{background:var(--pd-ink);color:var(--pd-bone)}

/* ---------- insights (bone plate) ---------- */
.insights-categories{gap:0!important;border:0!important;border-top:1px solid var(--pd-ink)!important;border-left:1px solid var(--pd-ink)!important;padding:0!important;margin-bottom:56px!important}
.insights-categories a{background:var(--pd-bone)!important;border:0!important;border-right:1px solid var(--pd-ink)!important;border-bottom:1px solid var(--pd-ink)!important;
  border-radius:0!important;box-shadow:none!important;color:var(--pd-ink)!important;padding:22px!important;transition:background var(--pd-fast),color var(--pd-fast)!important}
.insights-categories a:hover{transform:none!important}
.insights-categories a strong{color:inherit!important;font-weight:800}
.insights-categories a span{color:var(--pd-graphite)!important;transition:color var(--pd-fast)}
.insights-categories a:hover{background:var(--pd-ink)!important;color:var(--pd-bone)!important}
.insights-categories a:hover span{color:var(--pd-ash)!important}
.insight-feature-cover{border-radius:0!important;border:1px solid var(--pd-ink);overflow:hidden}
.insight-feature-cover img{filter:grayscale(1) contrast(1.1);transition:filter .6s var(--pd-out-expo),transform 1.1s var(--pd-out-expo)!important}
.insight-feature-cover:hover img{filter:none}
.insight-feature time,.insight-meta time{font-family:var(--pd-mono);font-size:.8rem!important;letter-spacing:.1em;color:var(--pd-graphite)!important}
.insight-feature .topic,.insight-meta span{font-family:var(--pd-mono);font-size:.78rem!important;letter-spacing:.12em;color:var(--pd-blood)!important;background:none!important}
.insight-feature h3,.insight-list h3{color:var(--pd-ink)!important;font-weight:800!important;letter-spacing:-.015em}
.insight-feature h3{font-size:clamp(1.6rem,1.1rem + 1.2vw,2.4rem)!important;line-height:1.28!important}
.insight-feature-copy>p,.insight-list p{color:var(--pd-graphite)!important}
.insight-feature-foot a{font-family:var(--pd-mono);letter-spacing:.1em;color:var(--pd-blood)!important}
.insight-list article,.insight-list article:nth-child(odd),.insight-list article:nth-child(even){border-top:1px solid var(--pd-ink)!important;position:relative}
.insight-list article::before{content:"";position:absolute;left:0;top:-1px;height:3px;width:28px;background:var(--pd-signal);transition:width .5s var(--pd-out-expo)}
.insight-list article:hover::before{width:100%}
.insight-list h3 a{color:inherit!important}
.research-directions{border-top:1px solid var(--pd-ink)!important;border-bottom:1px solid var(--pd-ink)!important;background:none!important;border-radius:0!important;padding:18px 0!important}
.research-title{font-family:var(--pd-mono);font-size:.78rem!important;letter-spacing:.2em;color:var(--pd-graphite)!important}
.research-directions a{border-radius:0!important;background:transparent!important;border:1px solid var(--pd-ink)!important;color:var(--pd-ink)!important;
  font-family:var(--pd-mono);font-size:.82rem!important;padding:6px 12px!important;transition:background var(--pd-fast),color var(--pd-fast)}
.research-directions a:hover{background:var(--pd-ink)!important;color:var(--pd-bone)!important}

/* ---------- closing: the hook slam, ink on a signal field ---------- */
.closing{background:var(--pd-signal)!important;padding:clamp(90px,10vw,170px) 0!important;position:relative;overflow:hidden}
.closing::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.18;
  background:repeating-linear-gradient(90deg,var(--pd-ink) 0 1px,transparent 1px 96px)}
.closing p{position:relative;font-family:var(--pd-sans)!important;color:var(--pd-ink)!important;text-align:left!important;
  font-size:clamp(2rem,1rem + 3.6vw,5.4rem)!important;font-weight:900;line-height:1.1!important;letter-spacing:-.045em;font-stretch:82%}
/* Bone on signal fails contrast; stamp the phrase on an ink block instead. */
.closing p em{color:var(--pd-bone)!important;background:var(--pd-ink);font-style:normal;padding:0 .12em;-webkit-box-decoration-break:clone;box-decoration-break:clone}

/* ---------- footer ---------- */
.site-footer{background:var(--pd-ink)!important;color:var(--pd-ash);border-top:1px solid var(--pd-hair-strong)}
.site-footer h3,.site-footer strong,.footer-contact b{color:var(--pd-bone)!important}
.site-footer h3{font-family:var(--pd-mono);font-size:.8rem!important;letter-spacing:.24em;font-weight:500;color:var(--pd-signal)!important}
.site-footer p,.site-footer span,.footer-bottom{color:var(--pd-ash)!important}
.site-footer a{color:var(--pd-bone)}
.footer-contact a[href^="tel"]{font-family:var(--pd-mono);color:var(--pd-bone)!important;letter-spacing:.06em}
.footer-contact em{font-family:var(--pd-mono);font-style:normal;color:var(--pd-signal)!important;font-size:.78rem}
.sparta-row img{filter:grayscale(1) brightness(1.8)}
.footer-map{border-radius:0!important;border:1px solid var(--pd-hair-strong)!important}
.footer-bottom{border-top:1px solid var(--pd-hair)!important;font-family:var(--pd-mono);font-size:.78rem!important;letter-spacing:.06em}
.footer-bottom a{color:var(--pd-ash)!important}
.footer-bottom a:hover{color:var(--pd-signal)!important}
.back-to-top{border-radius:0!important;background:var(--pd-ink)!important;color:var(--pd-bone)!important;border:1px solid var(--pd-hair-strong)!important;box-shadow:none!important;font-family:var(--pd-mono)}
.back-to-top:hover{background:var(--pd-signal)!important;color:var(--pd-ink)!important;border-color:var(--pd-signal)!important}

/* ---------- motion layer (pdoom-motion.js; all keyed off JS-added classes) ---------- */
@keyframes pd-rise{from{opacity:0;transform:translate3d(0,22px,0)}}
.pd-stagger:not(.pd-in)>*{opacity:0}
.pd-stagger.pd-in>*{animation:pd-rise .85s var(--pd-out-expo) backwards;animation-delay:calc(var(--i,0)*60ms + 80ms)}
.pd-solo:not(.pd-in){opacity:0}
.pd-solo.pd-in{animation:pd-rise .9s var(--pd-out-expo) both}

/* Section rule draws itself left→right, orange tick lands first. */
.pd-motion .section-head{border-top-color:transparent}
.section-head::after,.section-head::before{content:"";position:absolute;left:0;top:-1px;height:1px;pointer-events:none}
.section-head::after{right:0;background:var(--pd-hair-strong);transform:scaleX(0);transform-origin:left;transition:transform 1.5s var(--pd-out-expo) .15s}
.section-head::before{width:64px;height:2px;top:-1px;background:var(--pd-signal);z-index:1;transform:scaleX(0);transform-origin:left;transition:transform .6s var(--pd-out-expo)}
.seo-cluster .section-head::after,.insights-section .section-head::after{background:var(--pd-ink)}
.pd-motion .section-head.visible::after,.pd-motion .section-head.visible::before{transform:scaleX(1)}

/* Case switch: image wipes in like a cut. */
@keyframes pd-wipe{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
.pd-motion .case-panel.is-active .case-visual img{animation:pd-wipe 1s var(--pd-out-expo) both}

/* Bookend crop marks (hero + closing only, as in the reference). */
.pd-crop{position:absolute;inset:96px clamp(12px,2vw,28px) 16px;pointer-events:none;z-index:4;color:var(--pd-signal)}
.closing .pd-crop{inset:22px;color:var(--pd-ink)}
.pd-crop i{position:absolute;width:26px;height:26px;border:0 solid currentColor;opacity:0;
  transition:transform 1.2s var(--pd-out-expo),opacity .3s linear}
.pd-crop i:nth-child(1){top:0;left:0;border-top-width:1px;border-left-width:1px;transform:translate3d(-48px,-48px,0)}
.pd-crop i:nth-child(2){top:0;right:0;border-top-width:1px;border-right-width:1px;transform:translate3d(48px,-48px,0)}
.pd-crop i:nth-child(3){bottom:0;left:0;border-bottom-width:1px;border-left-width:1px;transform:translate3d(-48px,48px,0)}
.pd-crop i:nth-child(4){bottom:0;right:0;border-bottom-width:1px;border-right-width:1px;transform:translate3d(48px,48px,0)}
.pd-crop.pd-in i{opacity:1;transform:none}

/* Closing hook slam: drop, shake, then stamp the phrase onto an ink block. */
.pd-armed{opacity:0}
@keyframes pd-slam{0%{opacity:0;transform:scale(1.14) translate3d(0,-14px,0)}36%{opacity:1;transform:scale(.985)}
  50%{transform:translate3d(-7px,0,0)}62%{transform:translate3d(6px,0,0)}74%{transform:translate3d(-3px,0,0)}86%{transform:translate3d(1px,0,0)}100%{opacity:1;transform:none}}
@keyframes pd-stamp{to{background-size:100% 100%}}
@keyframes pd-flash{0%,100%{opacity:.18}20%{opacity:.6}40%{opacity:.05}60%{opacity:.4}}
.pd-slam{animation:pd-slam .9s var(--pd-out-expo) both;transform-origin:left center}
.closing .pd-slam em{background:linear-gradient(var(--pd-ink),var(--pd-ink)) left center/0% 100% no-repeat;animation:pd-stamp .7s var(--pd-out-expo) .8s forwards}
.closing:has(.pd-slam)::before{animation:pd-flash .6s steps(1) .2s}

/* Hero scene is interactive on the right half: aim to drop a probe. */
.hero.pd-aim,.page-hero.pd-aim{cursor:crosshair}
.hero-phases li{user-select:none}
.hero-phases li:hover{color:var(--pd-bone)!important}

/* Hero scroll-out, driven by --pd-out (0→1). */
.pd-motion .hero-inner{transform:translate3d(0,calc(var(--pd-out,0)*-90px),0);opacity:calc(1 - var(--pd-out,0)*1.1)}
.pd-motion .page-hero>.container{transform:translate3d(0,calc(var(--pd-out,0)*-60px),0);opacity:calc(1 - var(--pd-out,0)*1.2)}
.pd-motion .pd-page-canvas{transform:translate3d(0,calc(var(--pd-out,0)*100px),0)}
.pd-motion .hero-phases,.pd-motion .hero-scroll{opacity:calc(1 - var(--pd-out,0)*1.6)}

/* ---------- section effects (pdoom-sections.js) ---------- */
/* Oversized outline numeral behind each section, parallax via transform. */
.section{overflow:hidden}
.section>.container{position:relative;z-index:1}
.pd-bignum{position:absolute;right:-.04em;top:clamp(40px,6vw,110px);z-index:0;pointer-events:none;
  font-family:var(--pd-sans);font-weight:900;font-stretch:75%;font-size:clamp(11rem,8rem + 18vw,30rem);line-height:.8;letter-spacing:-.06em;
  color:transparent;-webkit-text-stroke:1px var(--pd-hair-strong);will-change:transform}
.seo-cluster .pd-bignum,.insights-section .pd-bignum{-webkit-text-stroke-color:var(--pd-hair-ink)}

/* 我们的能力: spotlight reveals a finer blueprint grid under the pointer. */
.cap-stack{position:relative;isolation:isolate}
.cap-stack::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0;transition:opacity .3s linear;
  background:linear-gradient(#ff4d1222 1px,transparent 1px) 0 0/24px 24px,linear-gradient(90deg,#ff4d1222 1px,transparent 1px) 0 0/24px 24px;
  -webkit-mask:radial-gradient(220px circle at var(--mx,-999px) var(--my,-999px),#000 0%,transparent 70%);
          mask:radial-gradient(220px circle at var(--mx,-999px) var(--my,-999px),#000 0%,transparent 70%)}
.cap-stack:hover::before{opacity:1}
/* Service pipeline: one step "runs" at a time, a token travels along its top rule. */
@keyframes pd-token{from{transform:translate3d(0,0,0)}to{transform:translate3d(calc(100cqw - 8px),0,0)}}
.cap-row.service .cap-item{container-type:inline-size}
.cap-row.service .cap-item::after{content:"";position:absolute!important;left:0;top:-4px;width:8px;height:8px;background:var(--pd-signal);
  box-shadow:0 0 14px #ff4d12;opacity:0;display:block!important;right:auto!important;border:0!important;font-size:0!important;transform:none}
.pd-live .cap-row.service .cap-item.is-flow{background:#ff4d120d!important}
.pd-live .cap-row.service .cap-item.is-flow::before{transform:scaleX(1)}
.pd-live .cap-row.service .cap-item.is-flow::after{opacity:1;animation:pd-token 1.1s linear both}
.pd-live .cap-row.service .cap-item.is-flow i{color:var(--pd-signal)!important}
/* Value yield: when the pipeline completes, every value lights in sequence. */
@keyframes pd-yield{0%{background:transparent}25%{background:#ff4d121c}100%{background:transparent}}
.cap-row.value .cap-item{--i:0}
.cap-row.value .cap-item:nth-child(2){--i:1}.cap-row.value .cap-item:nth-child(3){--i:2}
.cap-row.value .cap-item:nth-child(4){--i:3}.cap-row.value .cap-item:nth-child(5){--i:4}
.cap-row.value.pd-yield .cap-item{animation:pd-yield .9s ease-out both;animation-delay:calc(var(--i)*70ms)}
.cap-row.value.pd-yield .cap-item::before{transform:scaleX(1);transition-delay:calc(var(--i)*70ms)}
.cap-row.value.pd-yield .cap-row-label span{color:var(--pd-bone)!important;transition:color .2s linear}

/* 在重庆: ink wipes up through each card on hover (instead of a flat swap). */
.seo-link-card,.insights-categories a{isolation:isolate;overflow:hidden}
.seo-link-card::before,.insights-categories a::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--pd-ink);
  transform:scaleY(0);transform-origin:bottom;transition:transform .55s var(--pd-out-expo)}
.seo-link-card:hover,.insights-categories a:hover{background:var(--pd-bone)!important}
.seo-link-card:hover::before,.insights-categories a:hover::before{transform:scaleY(1)}
.insights-categories a{position:relative}
.seo-link-card em{display:inline-block;transition:transform .5s var(--pd-out-expo),color var(--pd-fast)!important}
.seo-link-card:hover em{transform:translate3d(8px,0,0)}
/* Coordinate stamp, rotated and ink-textured, slams onto the paper. */
.seo-link-grid{position:relative}
.pd-stamp{position:absolute;right:clamp(8px,3vw,48px);bottom:-104px;z-index:2;pointer-events:none;
  display:flex;flex-direction:column;align-items:center;gap:2px;padding:12px 18px;
  border:2px solid var(--pd-blood);outline:1px solid var(--pd-blood);outline-offset:3px;color:var(--pd-blood);
  font-family:var(--pd-mono);font-size:.7rem;letter-spacing:.18em;mix-blend-mode:multiply;
  opacity:0;transform:rotate(-8deg) scale(1.9)}
.pd-stamp b{font-family:var(--pd-sans);font-weight:900;font-size:1.35rem;letter-spacing:.12em;line-height:1.1}
.pd-stamp.is-down{opacity:.86;transform:rotate(-8deg) scale(1);transition:transform .38s cubic-bezier(.5,0,.75,0),opacity .12s linear}

/* 案例: index tag, scan sweep on every switch, tilt with glare. */
.pd-case-index{position:absolute;right:12px;top:12px;z-index:4;font-family:var(--pd-mono);font-size:.7rem;letter-spacing:.16em;
  color:var(--pd-bone);background:var(--pd-ink);padding:4px 8px;border:1px solid var(--pd-hair-strong)}
.pd-scan{position:absolute;left:0;right:0;top:0;height:2px;z-index:3;pointer-events:none;background:var(--pd-signal);
  box-shadow:0 0 18px 4px #ff4d1280;opacity:0}
@keyframes pd-scan{0%{opacity:1;transform:translate3d(0,0,0)}90%{opacity:1}100%{opacity:0;transform:translate3d(0,var(--h,440px),0)}}
.pd-motion .case-panel.is-active .pd-scan{animation:pd-scan 1.1s var(--pd-out-expo) .1s both}
.case-visual{--h:440px}
.pd-tilt{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .6s var(--pd-out-expo)}
.pd-tilt.is-tilting{transition:transform .12s linear}
.pd-glare{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:0;transition:opacity .3s linear;mix-blend-mode:screen;
  background:radial-gradient(360px circle at var(--gx,50%) var(--gy,50%),#ff8a3d40,transparent 60%)}
.is-tilting .pd-glare{opacity:1}
.insight-feature-cover{position:relative}

/* 知识中心: list titles get an ink underline that draws in. */
.insight-list h3 a{background:linear-gradient(var(--pd-signal),var(--pd-signal)) left 100%/0 2px no-repeat;transition:background-size .5s var(--pd-out-expo)}
.insight-list article:hover h3 a{background-size:100% 2px}

@media(max-width:720px){.pd-stamp{bottom:-150px;right:-10px;transform:rotate(-8deg) scale(.8)}.pd-stamp.is-down{transform:rotate(-8deg) scale(.8)}.pd-case-index{display:none}}

/* ---------- back-to-top = scroll progress ---------- */
.back-to-top{width:48px!important;height:48px!important;right:clamp(14px,2vw,28px)!important;bottom:clamp(14px,2vw,28px)!important;padding:0!important;
  border-color:var(--pd-hair-strong)!important;display:grid!important;place-items:center;align-content:center;gap:1px;overflow:visible}
.pd-ring{position:absolute;inset:-1px;width:calc(100% + 2px);height:calc(100% + 2px);pointer-events:none}
.pd-ring rect{fill:none;stroke:var(--pd-signal);stroke-width:1.5;stroke-dasharray:100;stroke-dashoffset:100;transition:stroke-dashoffset .12s linear}
.pd-top-arrow{font-size:15px;line-height:1;transition:transform .4s var(--pd-out-expo)}
.pd-top-pct{font-family:var(--pd-mono);font-size:9px;letter-spacing:.04em;line-height:1;color:var(--pd-ash);font-variant-numeric:tabular-nums}
.back-to-top:hover .pd-top-arrow{transform:translateY(-3px)}
.back-to-top:hover .pd-top-pct{color:var(--pd-ink)}
.back-to-top:hover .pd-ring rect{stroke:var(--pd-ink)}

/* ---------- reduced motion ---------- */
@media(prefers-reduced-motion:reduce){
  .pd-grain{animation:none}
  .js-motion .reveal{transform:none;opacity:1}
  .pd-k.pd-dim{opacity:1}
  .hero-phases li::after,.cap-item:before,.insight-list article::before{transition:none}
  .seo-link-card::before,.insights-categories a::before,.pd-tilt{transition:none}
}

/* Maps: darken only the base tiles, so the pin and label keep the theme colours. */
.amap-container{background:var(--pd-ink2)!important}
.amap-container .amap-layer,.amap-container .amap-labels{filter:grayscale(1) invert(.92) contrast(.9)}
.baize-map-pin{position:relative;width:28px;height:28px}
.baize-map-pin b{position:absolute;left:9px;top:9px;width:10px;height:10px;background:var(--pd-signal);box-shadow:0 0 0 3px var(--pd-ink),0 0 18px 4px #ff4d12b3}
.baize-map-pin i{position:absolute;inset:0;border:1.5px solid var(--pd-signal);border-radius:50%;animation:pd-pin 2s var(--pd-out-expo) infinite}
@keyframes pd-pin{from{transform:scale(.4);opacity:1}to{transform:scale(2.2);opacity:0}}
.baize-map-label{font-family:var(--pd-sans)!important;background:var(--pd-ink)!important;color:var(--pd-bone)!important;border:1px solid var(--pd-signal)!important;border-radius:0!important;
  padding:8px 12px!important;box-shadow:0 0 24px -4px #ff4d1299!important;display:flex;flex-direction:column;gap:3px;white-space:nowrap;position:relative}
.baize-map-label b{color:var(--pd-signal);font-size:13px;letter-spacing:.06em}
.baize-map-label span{font-size:12px;color:var(--pd-ash)}
.baize-map-label::after{content:"";position:absolute;left:50%;bottom:-6px;width:10px;height:10px;margin-left:-5px;background:var(--pd-ink);border-right:1px solid var(--pd-signal);border-bottom:1px solid var(--pd-signal);transform:rotate(45deg)}
.map-open-amap{background:var(--pd-signal)!important;color:var(--pd-ink)!important;border-radius:0!important;font-family:var(--pd-mono)!important}
@media(prefers-reduced-motion:reduce){.baize-map-pin i{animation:none;opacity:.5}}
