/* ============================================================
   NEUROSCALE — site.css
   One stylesheet, all pages. Bone / ink / one Eden-green accent.
   Fraunces 300 display · Inter body · JetBrains Mono metadata.
   Grid: 12 × 8pt. Motion: gentle decel, ≥.4s, no bounce.
   ============================================================ */

/* ---------- fonts (self-hosted, latin) ---------- */
@font-face{
  font-family:"Fraunces";
  src:url("../fonts/fraunces-latin-300.woff2") format("woff2");
  font-weight:300;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Fraunces";
  src:url("../fonts/fraunces-latin-300-italic.woff2") format("woff2");
  font-weight:300;font-style:italic;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Inter";
  src:url("../fonts/inter-latin-var.woff2") format("woff2");
  font-weight:300 600;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"JetBrains Mono";
  src:url("../fonts/jetbrains-mono-latin-var.woff2") format("woff2");
  font-weight:400 500;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

/* ---------- tokens ---------- */
:root{
  --paper:#f4f2ec;
  --paper-2:#ece9e1;
  --ink:#14110d;
  --ink-soft:#4a463e;
  --ink-faint:#6e6a60;
  --line:#cbc7bc;
  --line-soft:#ddd9cf;
  --accent:#4F6B5E;
  --shadow:rgba(20,17,13,.14);
  --ease:cubic-bezier(.16,.84,.24,1);
  --u:8px;
  --gut:clamp(20px,4.4vw,64px);
}

/* ---------- reset / base ---------- */
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
html,body{background:var(--paper);color:var(--ink);overflow-x:hidden}
body{font-family:"Inter",system-ui,sans-serif;font-weight:400;line-height:1.5;font-size:clamp(15px,1.05vw,17px)}
::selection{background:var(--ink);color:var(--paper)}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

/* grain — static, ≤5% */
body::before{content:"";position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.5;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");}
main,footer{position:relative;z-index:2}

/* scrollbar */
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:var(--paper-2)}
::-webkit-scrollbar-thumb{background:var(--line);border:3px solid var(--paper-2)}
::-webkit-scrollbar-thumb:hover{background:var(--ink-faint)}

/* ---------- utilities ---------- */
.mono{font-family:"JetBrains Mono",ui-monospace,monospace;font-feature-settings:"tnum" 1}
.serif{font-family:"Fraunces",Georgia,serif}
.eyebrow{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:.66rem;letter-spacing:.34em;text-transform:uppercase;color:var(--ink-faint)}
.wrap{max-width:1560px;margin:0 auto;padding:0 var(--gut)}
.rule{height:1px;background:var(--line);width:100%}
.row12{display:grid;grid-template-columns:repeat(12,1fr);gap:1rem}

/* ---------- fixed frame ---------- */
.frame{position:fixed;inset:0;pointer-events:none;z-index:60}
.frame span{position:absolute;background:var(--line)}
.frame .t{top:0;left:0;right:0;height:1px}
.frame .b{bottom:0;left:0;right:0;height:1px}
.frame .l{top:0;bottom:0;left:0;width:1px}
.frame .r{top:0;bottom:0;right:0;width:1px}
@media(max-width:640px){.frame{display:none}}

/* ---------- header ---------- */
header{position:fixed;top:0;left:0;right:0;z-index:70;transition:background .5s var(--ease),backdrop-filter .5s}
header.solid{background:rgba(244,242,236,.82);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;padding:clamp(16px,1.9vw,26px) var(--gut);gap:2rem}
.brand{display:flex;align-items:center}
.brand .mk{display:inline-flex;gap:3.5px;align-items:flex-end}
.brand .mk i{display:block;width:9px;height:19px;background:var(--ink)}
.brand .mk i:last-of-type{background:none;border:1.5px solid var(--ink)}
.brand .mk b{display:block;width:5.5px;height:5.5px;background:var(--accent);margin-left:2px}
.navlinks{display:flex;gap:clamp(1rem,2.4vw,2.6rem);align-items:baseline}
.navlinks a{font-size:.82rem;letter-spacing:.01em;color:var(--ink-soft);position:relative;transition:color .3s}
.navlinks a::after{content:"";position:absolute;left:0;right:100%;bottom:-4px;height:1px;background:var(--ink);transition:right .4s var(--ease)}
.navlinks a:hover{color:var(--ink)}
.navlinks a:hover::after{right:0}
.navlinks .idx{color:var(--ink-faint)}
@media(max-width:760px){.navlinks a:not(:last-child){display:none}}

/* ---------- hero (index) ---------- */
.hero{padding-top:clamp(120px,17vh,190px);padding-bottom:clamp(56px,8vh,110px)}
.hero .eyebrow{display:block;margin-bottom:1.6rem}
.hero h1{font-family:"Fraunces",serif;font-weight:300;
  font-size:clamp(3.4rem,13vw,14.5rem);line-height:.86;letter-spacing:-.035em;
  font-variation-settings:"opsz" 144}
.hero h1 .void{-webkit-text-stroke:1.4px var(--ink);color:transparent}
.hero h1 .stop{color:var(--accent)}
.hero-meta{display:grid;grid-template-columns:repeat(12,1fr);gap:1rem;align-items:end;margin-top:clamp(1.6rem,3vw,2.6rem)}
.hero-lede{grid-column:1 / span 8;font-size:clamp(1.05rem,1.55vw,1.5rem);line-height:1.35;font-weight:300;color:var(--ink-soft);max-width:36ch;letter-spacing:-.01em}
.hero-lede b{color:var(--ink);font-weight:500}
.hero-status{grid-column:9 / span 4;justify-self:end;display:flex;align-items:center;gap:.7rem;white-space:nowrap;
  font-family:"JetBrains Mono",ui-monospace,monospace;font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--ink-soft);font-feature-settings:"tnum" 1}
.hero-status .pip{width:.5em;height:.5em;background:var(--accent);flex:none;animation:pip 2.6s var(--ease) infinite}
@keyframes pip{50%{opacity:.3}}
@media(max-width:1080px){
  .hero-lede{grid-column:1 / -1;max-width:100%}
  .hero-status{grid-column:1 / -1;justify-self:start;margin-top:1.5rem}
}

/* ---------- section head ---------- */
.sechead{display:grid;grid-template-columns:repeat(12,1fr);gap:1rem;align-items:baseline;padding:clamp(96px,13vh,190px) 0 clamp(32px,4.6vh,58px)}
.sechead .no{grid-column:1 / span 2;font-family:"JetBrains Mono",monospace;font-size:.7rem;letter-spacing:.28em;color:var(--ink-faint)}
.sechead .ti{grid-column:3 / span 10;font-family:"Fraunces",serif;font-weight:300;font-size:clamp(1.8rem,4vw,3.4rem);line-height:1;letter-spacing:-.02em}
.sechead .ti em{font-style:italic}
@media(max-width:820px){
  .sechead .no{grid-column:1/-1}
  .sechead .ti{grid-column:1/-1;margin-top:.3rem}
}

/* ---------- systems index ---------- */
.index{border-top:1px solid var(--ink)}
.prow{display:grid;grid-template-columns:.7fr 2.6fr 1.2fr 1.1fr .8fr .5fr;gap:1rem;align-items:center;
  padding:clamp(18px,2.4vw,30px) 0;border-bottom:1px solid var(--line);position:relative;
  transition:padding-left .5s var(--ease),color .5s var(--ease);color:var(--ink)}
.prow>*{position:relative;z-index:2}
.prow .p-no{font-family:"JetBrains Mono",monospace;font-size:.72rem;color:var(--ink-faint);letter-spacing:.06em}
.prow .p-name{font-family:"Fraunces",serif;font-weight:300;font-size:clamp(1.3rem,2.6vw,2.3rem);letter-spacing:-.015em;line-height:1;display:flex;align-items:baseline;gap:.6rem;flex-wrap:wrap}
.prow .p-name .tag{font-family:"JetBrains Mono",monospace;font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-faint);white-space:nowrap}
.prow .p-typ,.prow .p-loc{font-size:.8rem;color:var(--ink-soft);letter-spacing:.01em}
.prow .p-yr{font-family:"JetBrains Mono",monospace;font-size:.82rem;text-align:right;font-feature-settings:"tnum" 1}
.prow .p-arw{justify-self:end;font-size:.9rem;opacity:0;transform:translateX(-8px);transition:opacity .4s var(--ease),transform .4s var(--ease)}
.prow::before{content:"";position:absolute;inset:0;background:var(--ink);z-index:1;transform:scaleY(0);transform-origin:bottom;transition:transform .5s var(--ease)}
.prow:hover,.prow:focus-within{color:var(--paper);padding-left:clamp(10px,1.6vw,26px)}
.prow:hover::before,.prow:focus-within::before{transform:scaleY(1)}
.prow:hover .p-no,.prow:focus-within .p-no,
.prow:hover .p-typ,.prow:focus-within .p-typ,
.prow:hover .p-loc,.prow:focus-within .p-loc{color:var(--paper-2)}
.prow:hover .p-name .tag,.prow:focus-within .p-name .tag{color:var(--paper-2)}
.prow:hover .p-arw,.prow:focus-within .p-arw{opacity:1;transform:translateX(0)}
.prow:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
@media(max-width:820px){
  .prow{grid-template-columns:.6fr 3fr;grid-auto-flow:row}
  .prow .p-typ,.prow .p-loc,.prow .p-arw{display:none}
  .prow .p-yr{grid-column:2;justify-self:start;text-align:left;color:var(--ink-faint);margin-top:.3rem}
}

/* quiet further-systems rows */
.further{margin-top:clamp(40px,6vh,72px)}
.further .eyebrow{display:block;margin-bottom:1rem}
.qrow{display:grid;grid-template-columns:.7fr 2.6fr 3.1fr .8fr;gap:1rem;align-items:baseline;
  padding:clamp(12px,1.6vw,18px) 0;border-top:1px solid var(--line);
  font-family:"JetBrains Mono",ui-monospace,monospace;color:var(--ink-soft);transition:color .3s}
.qrow:last-child{border-bottom:1px solid var(--line)}
.qrow .q-no{font-size:.72rem;color:var(--ink-faint)}
.qrow .q-name{font-size:.88rem;color:var(--ink);letter-spacing:.01em}
.qrow .q-desc{font-size:.75rem;letter-spacing:.01em}
.qrow .q-tag{font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-faint);text-align:right}
@media(max-width:820px){
  .qrow{grid-template-columns:.6fr 3fr}
  .qrow .q-desc{grid-column:2}
  .qrow .q-tag{grid-column:2;text-align:left}
}

/* hover preview thumb (cursor-follow) — a ghost, not a card: feathered edges,
   translucent, no shadow, so it never blocks the rows beneath it */
.preview{position:fixed;width:clamp(150px,12.5vw,200px);aspect-ratio:3/4;pointer-events:none;z-index:40;opacity:0;
  transform:translate(-50%,-112%) scale(.94);transition:opacity .45s var(--ease),transform .6s var(--ease);
  overflow:hidden;will-change:transform,opacity;
  -webkit-mask-image:radial-gradient(130% 130% at 50% 50%,#000 55%,transparent 95%);
  mask-image:radial-gradient(130% 130% at 50% 50%,#000 55%,transparent 95%)}
.preview img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.04)}
.preview.on{opacity:.8;transform:translate(-50%,-112%) scale(1)}
@media(hover:none),(max-width:820px){.preview{display:none}}

/* ---------- practice ---------- */
.manifesto{padding:clamp(20px,4vh,56px) 0}
.manifesto blockquote{font-family:"Fraunces",serif;font-weight:300;
  font-size:clamp(1.8rem,5vw,4.4rem);line-height:1.04;letter-spacing:-.025em;max-width:22ch}
.manifesto blockquote em{font-style:italic;color:var(--accent)}
.pcols{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2.4vw,2.4rem);margin-top:clamp(48px,7vh,96px)}
.pcols .c h3{font-family:"JetBrains Mono",monospace;font-size:.66rem;letter-spacing:.28em;text-transform:uppercase;color:var(--accent);margin-bottom:1rem;font-weight:500}
.pcols .c p{font-size:.92rem;color:var(--ink-soft);font-weight:300;line-height:1.6;max-width:34ch}
.pcols .c p b{color:var(--ink);font-weight:500}
@media(max-width:820px){.pcols{grid-template-columns:1fr;gap:2.2rem}}

/* proof strips (index stats + case callouts) — one ink rule, three open columns, no boxes */
.stats,.callouts{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.6rem,3.4vw,3.4rem);border-top:1px solid var(--ink);padding-top:clamp(22px,3.2vh,38px);margin-top:clamp(48px,7vh,96px)}
.stats .n,.callouts .n{font-family:"Fraunces",serif;font-weight:300;font-size:clamp(2.1rem,4vw,3.6rem);line-height:1;letter-spacing:-.02em;font-feature-settings:"tnum" 1}
.stats .k,.callouts .k{font-family:"JetBrains Mono",monospace;font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-faint);margin-top:.85rem;line-height:1.6}
@media(max-width:760px){
  .stats,.callouts{grid-template-columns:1fr;gap:0;padding-top:0}
  .stats .cell,.callouts .cell{padding:1.3rem 0}
  .stats .cell+.cell,.callouts .cell+.cell{border-top:1px solid var(--line-soft)}
}

/* commission line — the section's last word */
.commission{margin-top:clamp(56px,8vh,100px);font-size:clamp(1.05rem,1.5vw,1.4rem);font-weight:300;color:var(--ink-soft);letter-spacing:-.01em}
.commission a{color:var(--ink);border-bottom:1px solid var(--line);padding-bottom:.15em;transition:color .3s,border-color .3s}
.commission a:hover{color:var(--accent);border-color:var(--accent)}

/* ---------- contact ---------- */
.contact-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:1rem;align-items:start;padding-bottom:clamp(70px,10vh,150px)}
.contact-lede{grid-column:1 / span 7;font-family:"Fraunces",serif;font-weight:300;font-size:clamp(2.1rem,4.6vw,4.2rem);line-height:1;letter-spacing:-.03em}
.contact-lede em{font-style:italic;color:var(--accent)}
.contact-lede a{display:inline-block;margin-top:1.6rem;font-family:"Inter",sans-serif;font-size:clamp(1rem,1.4vw,1.3rem);font-weight:300;color:var(--ink-soft);border-bottom:1px solid var(--line);padding-bottom:.2em;transition:color .3s,border-color .3s}
.contact-lede a:hover{color:var(--ink);border-color:var(--ink)}
.contact-stack{grid-column:9 / span 4;display:grid;gap:1.8rem;justify-self:end;text-align:right}
.contact-stack .k{font-family:"JetBrains Mono",monospace;font-size:.62rem;letter-spacing:.28em;text-transform:uppercase;color:var(--ink-faint)}
.contact-stack .v{font-size:.85rem;color:var(--ink-soft);margin-top:.35rem;line-height:1.6}
.contact-stack .v a{border-bottom:1px solid var(--line);transition:color .3s,border-color .3s}
.contact-stack .v a:hover{color:var(--ink);border-color:var(--ink)}
@media(max-width:820px){
  .contact-lede{grid-column:1/-1}
  .contact-stack{grid-column:1/-1;justify-self:start;text-align:left;margin-top:2rem}
}

/* ---------- footer / colophon ---------- */
footer{border-top:1px solid var(--line)}
.colophon{display:flex;justify-content:space-between;align-items:baseline;gap:2rem;flex-wrap:wrap;padding:clamp(20px,2.6vw,34px) var(--gut)}
.colophon .who{font-size:.8rem;color:var(--ink-soft)}
.colophon .who b{color:var(--ink);font-weight:500}
.colophon .who .dot{color:var(--accent)}
.colophon .meta{display:flex;gap:clamp(1.2rem,2.6vw,2.6rem);align-items:baseline;flex-wrap:wrap;
  font-family:"JetBrains Mono",monospace;font-size:.66rem;letter-spacing:.08em;color:var(--ink-faint);font-feature-settings:"tnum" 1}
.colophon .meta .clock{color:var(--ink-soft)}

/* ---------- case pages ---------- */
.case-head{padding-top:clamp(120px,16vh,180px)}
.case-head .eyebrow{display:block;margin-bottom:1.4rem}
.case-title{font-family:"Fraunces",serif;font-weight:300;font-size:clamp(3rem,9vw,9.5rem);line-height:.9;letter-spacing:-.03em;font-variation-settings:"opsz" 144}
.case-outcome{font-family:"Fraunces",serif;font-weight:300;font-size:clamp(1.5rem,3.2vw,2.7rem);line-height:1.05;letter-spacing:-.02em;max-width:24ch;margin-top:clamp(1.4rem,2.6vw,2.4rem);color:var(--ink)}
.case-outcome em{font-style:italic}

.narr{padding:clamp(48px,7vh,100px) 0 0}
.narr .block{display:grid;grid-template-columns:repeat(12,1fr);gap:1rem;padding:clamp(20px,3vh,36px) 0;border-top:1px solid var(--line-soft)}
.narr .block:first-child{border-top:none}
.narr .lbl{grid-column:1 / span 2;font-family:"JetBrains Mono",monospace;font-size:.66rem;letter-spacing:.28em;text-transform:uppercase;color:var(--ink-faint);padding-top:.35em}
.narr .txt{grid-column:3 / span 7;font-size:clamp(.98rem,1.2vw,1.12rem);font-weight:300;color:var(--ink-soft);line-height:1.6;max-width:58ch}
.narr .txt b{color:var(--ink);font-weight:500}
@media(max-width:820px){
  .narr .lbl{grid-column:1/-1;padding-top:0}
  .narr .txt{grid-column:1/-1;margin-top:.5rem}
}

/* plate */
.plate-wrap{padding:clamp(48px,7vh,100px) 0 0}
.plate-reveal{position:relative;overflow:hidden;background:var(--paper-2);aspect-ratio:16/10}
.plate-reveal img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.04);transform:scale(1.16);transition:transform 1.5s cubic-bezier(.22,1,.36,1)}
.plate-reveal::after{content:"";position:absolute;inset:0;background:var(--paper);transform:scaleY(1);transform-origin:top;transition:transform 1.2s var(--ease)}
.plate-reveal.seen img{transform:scale(1)}
.plate-reveal.seen::after{transform:scaleY(0)}
.plate-cap{display:flex;justify-content:space-between;gap:1rem;padding-top:.8rem;font-size:.7rem;color:var(--ink-faint);letter-spacing:.04em}
.plate-cap .prov{font-family:"JetBrains Mono",monospace;font-size:.62rem;letter-spacing:.18em;text-transform:uppercase}

/* status row */
.status-row{display:grid;grid-template-columns:repeat(12,1fr);gap:1rem;align-items:baseline;
  margin-top:clamp(48px,7vh,100px);padding:clamp(20px,3vh,32px) 0;border-top:1px solid var(--ink)}
.status-row .lbl{grid-column:1 / span 2;font-family:"JetBrains Mono",monospace;font-size:.66rem;letter-spacing:.28em;text-transform:uppercase;color:var(--ink-faint)}
.status-row .val{grid-column:3 / span 8;font-family:"JetBrains Mono",monospace;font-size:clamp(.9rem,1.4vw,1.15rem);letter-spacing:.14em;text-transform:uppercase;color:var(--ink);display:flex;align-items:center;gap:.8rem}
.status-row .val::before{content:"";width:.55em;height:.55em;background:var(--accent);display:inline-block;flex:none}
@media(max-width:820px){
  .status-row .lbl{grid-column:1/-1}
  .status-row .val{grid-column:1/-1;margin-top:.6rem}
}

/* next-system giant row */
.next-wrap{padding:clamp(70px,10vh,150px) 0 clamp(40px,6vh,80px)}
.next-wrap .eyebrow{display:block;margin-bottom:1rem}
.next-row{display:grid;grid-template-columns:.7fr 5fr .5fr;gap:1rem;align-items:center;
  padding:clamp(24px,3.4vw,44px) 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--line);
  position:relative;color:var(--ink);transition:padding-left .5s var(--ease),color .5s var(--ease)}
.next-row>*{position:relative;z-index:2}
.next-row::before{content:"";position:absolute;inset:0;background:var(--ink);z-index:1;transform:scaleY(0);transform-origin:bottom;transition:transform .5s var(--ease)}
.next-row:hover,.next-row:focus-visible{color:var(--paper);padding-left:clamp(10px,1.6vw,26px)}
.next-row:hover::before,.next-row:focus-visible::before{transform:scaleY(1)}
.next-row .n-no{font-family:"JetBrains Mono",monospace;font-size:.72rem;color:var(--ink-faint);letter-spacing:.06em}
.next-row:hover .n-no{color:var(--paper-2)}
.next-row .n-name{font-family:"Fraunces",serif;font-weight:300;font-size:clamp(1.9rem,4.6vw,4.2rem);letter-spacing:-.025em;line-height:1}
.next-row .n-arw{justify-self:end;font-size:1.1rem;opacity:0;transform:translateX(-8px);transition:opacity .4s var(--ease),transform .4s var(--ease)}
.next-row:hover .n-arw,.next-row:focus-visible .n-arw{opacity:1;transform:translateX(0)}
.next-row:focus-visible .n-no{color:var(--paper-2)}
.back-link{display:inline-block;margin-top:1.6rem;font-family:"JetBrains Mono",monospace;font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-faint);transition:color .3s}
.back-link:hover{color:var(--ink)}

/* ---------- view transitions (cross-document) ---------- */
@media not (prefers-reduced-motion: reduce){
  @view-transition{navigation:auto}
}
::view-transition-group(*){animation-duration:.5s;animation-timing-function:var(--ease)}
::view-transition-old(root),::view-transition-new(root){animation-duration:.35s}
.vt-meridian{view-transition-name:sys-meridian}
.vt-gravitas{view-transition-name:sys-gravitas}
.vt-vault-os{view-transition-name:sys-vault-os}
.vt-neuroscale-os{view-transition-name:sys-neuroscale-os}

/* ---------- reveals ---------- */
.rise{opacity:0;transform:translateY(22px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
.rise.seen{opacity:1;transform:none}
[data-stagger]>*{opacity:0;transform:translateY(18px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:calc(var(--i,0)*80ms)}
[data-stagger].seen>*{opacity:1;transform:none}

/* ---------- grid overlay (press G) ---------- */
.grid-overlay{position:fixed;inset:0;z-index:9000;pointer-events:none;padding:0 var(--gut);
  display:grid;grid-template-columns:repeat(12,1fr);gap:1rem;opacity:0;transition:opacity .35s var(--ease)}
.grid-overlay.on{opacity:1}
.grid-overlay span{background:rgba(79,107,94,.05);border-left:1px solid rgba(79,107,94,.22);border-right:1px solid rgba(79,107,94,.22)}
.baseline-rows{position:fixed;inset:0;z-index:8999;pointer-events:none;opacity:0;transition:opacity .35s var(--ease);
  background-image:repeating-linear-gradient(to bottom,transparent 0,transparent 7px,rgba(79,107,94,.08) 7px,rgba(79,107,94,.08) 8px)}
.baseline-rows.on{opacity:1}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms!important;transition-duration:.001ms!important}
  .rise,[data-stagger]>*{opacity:1!important;transform:none!important}
  .plate-reveal::after{transform:scaleY(0)}
  .plate-reveal img{transform:none}
  .prow:hover,.prow:focus-within,.next-row:hover,.next-row:focus-visible{padding-left:0}
}
@media (max-width:480px){
  .case-head .eyebrow{font-size:.58rem;letter-spacing:.2em}
}

/* ---------- print: site pages are screen artifacts ---------- */
@media print{
  .frame,.grid-overlay,.baseline-rows,.preview{display:none}
  body::before{display:none}
}
