/*!
 * shannoncainjr.com — site styles
 * Design & build: Shannon Cain · Jacksonville, FL
 */

/* ---------- Fonts (self-hosted) ---------- */
@font-face{font-family:"SC Display";src:url("../fonts/bricolage.woff2") format("woff2");font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:"SC Sans";src:url("../fonts/inter-tight.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"SC Italic";src:url("../fonts/instrument-serif-italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"SC Mono";src:url("../fonts/geist-mono.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}

/* ---------- Tokens ---------- */
:root{
  --ink:#0a0b0d;
  --ink-2:#101216;
  --ink-3:#171a1f;
  --ink-4:#20242b;
  --paper:#eceef1;
  --paper-2:#dfe2e7;
  --text:#eceef1;
  --text-2:#a9afb9;
  --text-3:#6f7682;
  --signal:#ff5b1f;          /* ignition orange: the one accent */
  --signal-soft:#ff8a5c;
  --signal-ink:#b23a0b;      /* signal on light surfaces, AA */
  --line:rgba(236,238,241,.1);
  --line-2:rgba(236,238,241,.2);
  --display:"SC Display","SC Sans",system-ui,sans-serif;
  --sans:"SC Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --italic:"SC Italic",Georgia,serif;
  --mono:"SC Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --gutter:clamp(16px,4.2vw,56px);
  --max:1360px;
  --header:64px;
  --ease:cubic-bezier(.2,.7,.1,1);
  --r:16px;
  color-scheme:dark;
}

/* page-to-page transitions (cross-document view transitions) */
@view-transition{navigation:auto}
::view-transition-old(root){animation:.35s var(--ease) both vt-out}
::view-transition-new(root){animation:.55s var(--ease) both vt-in}
@keyframes vt-out{to{opacity:0;transform:translateY(-14px);filter:blur(4px)}}
@keyframes vt-in{from{opacity:0;transform:translateY(22px)}}
.hdr{view-transition-name:hdr}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;background:var(--ink)}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
body{margin:0;background:var(--ink);color:var(--text);font-family:var(--sans);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg,canvas{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
p{margin:0 0 1em}
h1,h2,h3,h4{margin:0;font-weight:500}
::selection{background:var(--signal);color:var(--ink)}
:focus-visible{outline:2px solid var(--signal);outline-offset:3px;border-radius:6px}
.skip{position:absolute;left:12px;top:-60px;z-index:200;background:var(--signal);color:var(--ink);padding:10px 14px;border-radius:8px;font-weight:600}
.skip:focus{top:12px}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* fine grid + grain, very quiet */
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.5;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:calc((100vw - 2*var(--gutter))/4) 100vh;background-position:var(--gutter) 0;
  -webkit-mask-image:radial-gradient(ellipse at 50% 0%,#000 0%,transparent 70%);mask-image:radial-gradient(ellipse at 50% 0%,#000 0%,transparent 70%)}
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:90;opacity:.045;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
main,.ftr{position:relative;z-index:1}

.lab>*,.sec-head>*,.bio>*,.contact>*,.log-wrap>*,.deck-wrap>*,.triad>*{min-width:0}
.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter)}
.mono{font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase}
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-2);display:inline-flex;align-items:center;gap:10px}
.eyebrow b{color:var(--signal);font-weight:400}
.sig{color:var(--signal)}
.it{font-family:var(--italic);font-style:italic;font-weight:400;letter-spacing:-.01em}

/* ---------- Type scale ---------- */
.h-display{font-family:var(--display);font-weight:500;font-variation-settings:"opsz" 96;letter-spacing:-.045em;line-height:.88;font-size:clamp(58px,13.4vw,200px)}
.h1{font-family:var(--display);font-weight:500;font-variation-settings:"opsz" 96;letter-spacing:-.04em;line-height:.95;font-size:clamp(44px,7.6vw,112px)}
.h2{font-family:var(--display);font-weight:500;font-variation-settings:"opsz" 72;letter-spacing:-.035em;line-height:1;font-size:clamp(36px,5.2vw,76px)}
.h3{font-family:var(--display);font-weight:500;font-variation-settings:"opsz" 36;letter-spacing:-.02em;line-height:1.1;font-size:clamp(22px,2.1vw,28px)}
.h-display .it,.h1 .it,.h2 .it{font-size:1.06em;letter-spacing:-.02em}
.lede{font-size:clamp(18px,1.55vw,21px);line-height:1.55;color:var(--text-2);max-width:60ch}
.sw{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.1em;margin-bottom:-.1em}
.sw>span{display:inline-block;will-change:transform}

/* ---------- Header ---------- */
.hdr{position:fixed;inset:0 0 auto;z-index:80;height:var(--header);transition:transform .5s var(--ease),background-color .4s}
.hdr.is-hidden{transform:translateY(-100%)}
.hdr.is-solid{background:rgba(10,11,13,.72);backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3);border-bottom:1px solid var(--line)}
.hdr .wrap{height:100%;display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:flex;align-items:center;gap:12px}
.brand svg{width:36px;height:36px;flex:none}
.brand .bn{font-family:var(--display);font-weight:600;font-size:17px;letter-spacing:-.02em;white-space:nowrap}
.nav{display:none;align-items:center;gap:2px}
.nav a{position:relative;padding:8px 13px;font-size:15px;color:var(--text-2);transition:color .25s}
.nav a::after{content:"";position:absolute;left:13px;right:13px;bottom:3px;height:1.5px;background:var(--signal);transform:scaleX(0);transform-origin:100% 50%;transition:transform .45s var(--ease)}
.nav a:hover,.nav a[aria-current="page"]{color:var(--text)}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scaleX(1);transform-origin:0 50%}
.hdr-tools{display:flex;align-items:center;gap:8px}
.kbtn{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 12px 0 14px;border-radius:999px;border:1px solid var(--line-2);color:var(--text-2);font-size:14px;transition:border-color .3s,color .3s}
.kbtn:hover{border-color:var(--signal);color:var(--text)}
.kbtn svg{width:16px;height:16px}
.kbtn span{display:none}
.kbtn{width:42px;padding:0;justify-content:center}
.kbtn kbd{display:none;font-family:var(--mono);font-size:11px;border:1px solid var(--line-2);border-radius:6px;padding:1px 6px;color:var(--text-3)}
.hdr .hdr-cta{display:none}
.burger{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--line-2)}
.burger span{display:block;width:18px;height:1.5px;background:var(--text);position:relative;transition:background .3s}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:18px;height:1.5px;background:var(--text);transition:transform .4s var(--ease),top .4s var(--ease)}
.burger span::before{top:-6px}.burger span::after{top:6px}
.menu-open .burger span{background:transparent}
.menu-open .burger span::before{top:0;transform:rotate(45deg)}
.menu-open .burger span::after{top:0;transform:rotate(-45deg)}
.progress{position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:var(--signal);transform-origin:0 50%;transform:scaleX(0)}

.sheet{position:fixed;inset:0;z-index:70;background:var(--ink);display:flex;flex-direction:column;justify-content:flex-end;padding:calc(var(--header) + 24px) var(--gutter) 30px;clip-path:circle(0% at calc(100% - 37px) 32px);transition:clip-path .7s var(--ease);visibility:hidden}
.menu-open .sheet{clip-path:circle(150% at calc(100% - 37px) 32px);visibility:visible}
.sheet nav{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.sheet nav a{display:flex;align-items:baseline;justify-content:space-between;padding:14px 0;border-bottom:1px solid var(--line);font-family:var(--display);font-weight:500;font-size:clamp(34px,10vw,56px);line-height:1.05;letter-spacing:-.035em}
.sheet nav a small{font-family:var(--mono);font-size:12px;color:var(--text-3);letter-spacing:.08em}
.sheet nav a[aria-current="page"]{color:var(--signal)}
.sheet .sheet-foot{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}

/* ---------- Buttons ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 26px;border-radius:999px;font-weight:600;font-size:15px;overflow:hidden;isolation:isolate;transition:color .35s var(--ease),border-color .35s}
.btn .arw{width:16px;height:16px;transition:transform .4s var(--ease)}
.btn:hover .arw{transform:translateX(4px)}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;transform:translateY(101%);transition:transform .45s var(--ease)}
.btn:hover::before{transform:none}
.btn-sig{background:var(--signal);color:#120600}
.btn-sig::before{background:var(--paper)}
.btn-line{border:1px solid var(--line-2);color:var(--text)}
.btn-line::before{background:var(--paper)}
.btn-line:hover{color:var(--ink);border-color:var(--paper)}
.btn-ink{background:var(--ink);color:var(--paper)}
.btn-ink::before{background:var(--signal)}
.btn-ink:hover{color:var(--ink)}
.btn-sm{min-height:42px;padding:0 18px;font-size:14px}

/* ---------- Sections ---------- */
section{position:relative}
.sec{padding-block:clamp(88px,12vw,180px)}
.sec-head{display:grid;gap:22px;margin-bottom:clamp(40px,6vw,80px)}
.sec-num{font-family:var(--mono);font-size:12px;color:var(--text-3);letter-spacing:.08em}
.rule{height:1px;background:var(--line);transform-origin:0 50%}
.chip{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 11px;border-radius:999px;border:1px solid var(--line-2);font-family:var(--mono);font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--text-2);white-space:nowrap}
.chip i{width:6px;height:6px;border-radius:50%;background:var(--signal)}
.chips{display:flex;flex-wrap:wrap;gap:6px}

/* ---------- Hero (particle portrait → systems map) ---------- */
.hero{position:relative;height:100svh;min-height:640px;overflow:hidden;padding-top:var(--header)}
.hero-stage{position:absolute;inset:0;z-index:0}
.hero-gl{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .8s}
.hero.gl-on .hero-gl{opacity:1}
.hero-photo{position:absolute;z-index:0;left:50%;top:calc(var(--header) + 3svh);height:48svh;width:auto;aspect-ratio:560/1043;transform:translateX(-30%);-webkit-mask-image:linear-gradient(to bottom,#000 70%,transparent 99%);mask-image:linear-gradient(to bottom,#000 70%,transparent 99%);transition:opacity .9s}
.hero-photo img{width:100%;height:100%;object-fit:contain;filter:grayscale(.35) contrast(1.05)}
.hero.gl-on .hero-photo{opacity:var(--ph,0);transition:none}
.hero.gl-on .hero-photo img{filter:grayscale(1) contrast(1.12) brightness(.92)}
.hero-labels{position:absolute;inset:0;z-index:1;pointer-events:none}
.hero-labels span{position:absolute;transform:translate(-50%,-50%);font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--text);white-space:nowrap;padding:3px 7px;border-radius:999px;background:rgba(10,11,13,.66);border:1px solid var(--line);opacity:0;margin-top:-16px}
.hero-labels span.ai{color:var(--signal);border-color:rgba(255,91,31,.4)}
.hero-labels span.hub{display:none}
.hero .wrap{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:22px;pointer-events:none}
.hero .wrap a,.hero .wrap button{pointer-events:auto}
.hero-copy{display:grid;gap:16px}
.hero-meta{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center}
.status{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-2)}
.status i{width:7px;height:7px;border-radius:50%;background:var(--signal);box-shadow:0 0 0 0 rgba(255,91,31,.6);animation:pulse 2.2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 10px rgba(255,91,31,0)}100%{box-shadow:0 0 0 0 rgba(255,91,31,0)}}
.hero-name .ln{display:block}
.hero-name .ln-2{padding-left:.42em}
.hero-role{font-size:clamp(17px,1.45vw,20px);line-height:1.45;color:var(--text);max-width:36ch;margin:0}
.hero-role b{font-weight:500;color:var(--signal)}
.hero-cap{position:absolute;left:var(--gutter);right:var(--gutter);bottom:120px;z-index:2;display:grid;gap:14px;opacity:0;pointer-events:none}
.hero-cap .h2{max-width:13ch}
.legend{display:flex;flex-wrap:wrap;gap:8px 18px}
.legend span{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-2)}
.legend i{width:8px;height:8px;border-radius:50%;background:var(--paper)}
.legend i.s{background:#8b929d}.legend i.a{background:var(--signal)}
.hero-foot{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}
.hero-ctas{display:flex;flex-wrap:wrap;gap:10px}
.cue{display:none;align-items:center;gap:10px;font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-3)}
.cue i{position:relative;width:1px;height:34px;background:var(--line-2);overflow:hidden}
.cue i::after{content:"";position:absolute;left:0;top:-40%;width:1px;height:40%;background:var(--signal);animation:cue 1.8s var(--ease) infinite}
@keyframes cue{to{top:100%}}

/* ---------- Stats ---------- */
.stats{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);border-left:1px solid var(--line)}
.stat{padding:24px 18px 20px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:10px;min-height:148px;justify-content:space-between}
.stat:last-child{grid-column:1/-1}
.stat .num{font-family:var(--display);font-weight:500;font-variation-settings:"opsz" 96;font-size:clamp(46px,6.6vw,88px);line-height:.9;letter-spacing:-.05em;font-variant-numeric:tabular-nums}
.stat .num sup{font-size:.45em;vertical-align:top;position:relative;top:.12em;color:var(--signal);margin-left:2px}
.stat .lbl{font-size:14px;color:var(--text-2);line-height:1.4;max-width:24ch}

/* ---------- Triad ---------- */
.triad{display:grid;gap:14px}
.tri{position:relative;border:1px solid var(--line);border-radius:var(--r);padding:clamp(22px,3vw,36px);background:linear-gradient(180deg,var(--ink-2),var(--ink));overflow:hidden;display:flex;flex-direction:column;gap:14px}
.tri::before{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;background:radial-gradient(380px circle at var(--mx,50%) var(--my,0%),rgba(255,91,31,.16),transparent 60%);opacity:0;transition:opacity .4s}
.tri:hover::before{opacity:1}
.tri-top{display:flex;justify-content:space-between;align-items:center}
.tri-top .mono{color:var(--text-3)}
.tri-ico{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:var(--ink-3);border:1px solid var(--line)}
.tri-ico svg{width:22px;height:22px}
.tri.ai{border-color:rgba(255,91,31,.35);background:linear-gradient(170deg,rgba(255,91,31,.1),var(--ink-2) 45%,var(--ink))}
.tri p{color:var(--text-2);margin:0}
.tri ul{list-style:none;margin:auto 0 0;padding:0;display:grid}
.tri li{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-top:1px solid var(--line);font-size:15px}
.tri li span:last-child{font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--text-3);text-transform:uppercase;white-space:nowrap}

/* ---------- AI lab ---------- */
.lab{display:grid;gap:clamp(28px,4vw,48px)}
.caps{display:grid;border-top:1px solid var(--line)}
.cap{display:grid;grid-template-columns:40px 1fr;gap:4px 14px;padding:20px 0;border-bottom:1px solid var(--line)}
.cap .mono{color:var(--signal);padding-top:4px}
.cap h3{font-size:clamp(20px,1.9vw,24px)}
.cap p{grid-column:2;margin:0;color:var(--text-2);font-size:15.5px}

/* "Ask the site" console + command palette share these */
.console{position:relative;border:1px solid var(--line-2);border-radius:20px;background:linear-gradient(180deg,var(--ink-2),#0c0d10);overflow:hidden;box-shadow:0 40px 80px rgba(0,0,0,.45)}
.console::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:radial-gradient(600px 220px at 20% 0%,rgba(255,91,31,.12),transparent 70%)}
.con-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line);font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-3)}
.con-dots{display:flex;gap:6px}.con-dots i{width:9px;height:9px;border-radius:50%;background:var(--ink-4)}
.con-dots i:first-child{background:var(--signal)}
.con-log{height:clamp(260px,34vw,340px);overflow-y:auto;padding:18px 18px 8px;display:flex;flex-direction:column;gap:14px;scrollbar-width:thin;overscroll-behavior:contain}
.msg{max-width:92%;font-size:15.5px;line-height:1.55}
.msg.q{align-self:flex-end;background:var(--ink-4);padding:10px 14px;border-radius:14px 14px 4px 14px}
.msg.a{color:var(--text)}
.msg.a .who{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--signal);margin-bottom:6px}
.msg.a .src{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.msg.a .src a{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;border:1px solid var(--line-2);padding:4px 9px;border-radius:999px;color:var(--text-2)}
.msg.a .src a:hover{border-color:var(--signal);color:var(--text)}
.caret{display:inline-block;width:8px;height:1.1em;background:var(--signal);vertical-align:-.15em;margin-left:2px;animation:blink 1s steps(2) infinite}
@keyframes blink{50%{opacity:0}}
.con-sugs{display:flex;gap:6px;overflow-x:auto;padding:8px 18px 12px;scrollbar-width:none}
.con-sugs::-webkit-scrollbar{display:none}
.con-sugs button{flex:none;font-size:13px;padding:7px 12px;border-radius:999px;border:1px solid var(--line-2);color:var(--text-2);transition:border-color .3s,color .3s}
.con-sugs button:hover{border-color:var(--signal);color:var(--text)}
.con-form{display:flex;gap:8px;padding:12px;border-top:1px solid var(--line)}
.con-form input{flex:1;min-width:0;height:48px;border-radius:12px;border:1px solid var(--line-2);background:var(--ink);color:var(--text);padding:0 14px;font:inherit;font-size:16px}
.con-form input:focus{outline:none;border-color:var(--signal);box-shadow:0 0 0 4px rgba(255,91,31,.15)}
.con-form button{width:48px;height:48px;border-radius:12px;background:var(--signal);color:#120600;display:grid;place-items:center;flex:none}
.con-form button svg{width:18px;height:18px}
.con-note{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;color:var(--text-3);padding:0 16px 12px;text-transform:uppercase}

/* ---------- Shipping log ---------- */
.log{display:grid;border-top:1px solid var(--line)}
.log-row{display:grid;grid-template-columns:86px 1fr;gap:6px 18px;padding:22px 0;border-bottom:1px solid var(--line);align-items:start}
.log-row time{font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--signal);padding-top:5px;text-transform:uppercase}
.log-row h3{font-size:clamp(19px,1.8vw,24px)}
.log-row p{grid-column:2;margin:0;color:var(--text-2);font-size:15.5px;max-width:62ch}
.log-row .chips{grid-column:2;margin-top:6px}
.learn{border:1px solid var(--line);border-radius:var(--r);padding:clamp(22px,3vw,34px);background:var(--ink-2);display:grid;gap:12px;align-content:start}
.learn .live{display:inline-flex;align-items:center;gap:8px}

/* ---------- Paper sections (PlantSwitch) ---------- */
.paper{background:var(--paper);color:var(--ink)}
.paper .eyebrow,.paper .sec-num{color:#535a64}
.paper .eyebrow b{color:var(--signal-ink)}
.paper .lede{color:#434951}
.paper ::selection{background:var(--ink);color:var(--paper)}
.paper .chip{border-color:rgba(10,11,13,.2);color:#434951}
.sys-grid{display:grid;border-top:1px solid rgba(10,11,13,.16)}
.sys{display:grid;grid-template-columns:48px 1fr;gap:6px 16px;padding:22px 0;border-bottom:1px solid rgba(10,11,13,.16);align-items:start}
.sys .idx{font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--signal-ink);padding-top:6px}
.sys h3{font-size:clamp(21px,2.1vw,27px);color:var(--ink)}
.sys p{grid-column:2;margin:0;color:#434951;font-size:16px;max-width:60ch}
.sys .chips{grid-column:2;margin-top:8px}
.sys-note{font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:#5f6670;margin-top:24px}

/* ---------- Work list ---------- */
.work{display:grid}
.work-row{position:relative;display:grid;grid-template-columns:1fr auto;gap:6px 18px;padding:22px 0;border-top:1px solid var(--line);align-items:center;isolation:isolate}
.work-row:last-child{border-bottom:1px solid var(--line)}
.work-row::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--ink-3);transform:scaleY(0);transform-origin:50% 100%;transition:transform .45s var(--ease)}
.work-row h3{font-family:var(--display);font-size:clamp(30px,4.4vw,62px);font-weight:500;font-variation-settings:"opsz" 96;letter-spacing:-.04em;line-height:1.02;transition:transform .45s var(--ease),color .3s}
.work-row .meta{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-3)}
.work-row .plat{grid-row:1/3;grid-column:2;font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-2);display:flex;align-items:center;gap:8px}
.work-row .plat svg{width:18px;height:18px;transition:transform .45s var(--ease)}
.work-desc{grid-column:1/-1;color:var(--text-2);font-size:15.5px;max-width:62ch;margin:6px 0 0}
.wpv{position:fixed;left:0;top:0;z-index:60;width:min(34vw,460px);aspect-ratio:16/10;border-radius:12px;overflow:hidden;pointer-events:none;opacity:0;transform:translate(-50%,-50%) scale(.85);box-shadow:0 30px 80px rgba(0,0,0,.55)}
.wpv img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .35s}
.wpv img.on{opacity:1}

/* ---------- Career timeline ---------- */
.tl{position:relative}
.tl-track{display:grid;gap:14px}
.tl-card{position:relative;border:1px solid var(--line);border-radius:var(--r);padding:24px 22px 22px;background:var(--ink-2);display:grid;gap:14px}
.tl-when{display:flex;justify-content:space-between;gap:10px;font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;color:var(--text-3);text-transform:uppercase}
.tl-when b{color:var(--signal);font-weight:400}
.tl-card h3{font-size:clamp(26px,2.6vw,34px)}
.tl-org{color:var(--text-2);font-size:15px;margin:6px 0 0}
.tl-big{font-family:var(--display);font-weight:500;font-variation-settings:"opsz" 96;font-size:clamp(42px,5vw,68px);line-height:1;letter-spacing:-.05em;color:var(--paper);margin:0}
.tl-big small{display:block;font-family:var(--sans);font-size:14px;letter-spacing:0;color:var(--text-2);margin-top:10px;line-height:1.4;font-weight:400}
.tl-now{border-color:rgba(255,91,31,.45);background:linear-gradient(160deg,rgba(255,91,31,.1),var(--ink-2) 50%)}

/* ---------- Quotes deck ---------- */
.deck-wrap{display:grid;gap:28px}
.deck{position:relative;height:clamp(430px,110vw,470px);touch-action:pan-y;user-select:none;-webkit-user-select:none}
.qcard{position:absolute;inset:0;border-radius:20px;padding:clamp(24px,4vw,44px);background:var(--paper);color:var(--ink);display:flex;flex-direction:column;justify-content:space-between;gap:22px;box-shadow:0 30px 60px rgba(0,0,0,.4);will-change:transform;cursor:grab}
.qcard:active{cursor:grabbing}
.qcard blockquote{margin:0;font-family:var(--display);font-weight:400;font-variation-settings:"opsz" 24;font-size:clamp(19px,2vw,25px);line-height:1.36;letter-spacing:-.015em}
.qcard blockquote::before{content:"\201C";display:block;font-family:var(--italic);font-style:italic;font-size:80px;line-height:.6;color:var(--signal);margin-bottom:6px}
.qcard figcaption{display:flex;justify-content:space-between;align-items:end;gap:12px;border-top:1px solid rgba(10,11,13,.16);padding-top:16px}
.qcard figcaption b{display:block;font-weight:600;font-size:16px}
.qcard figcaption span{font-size:14px;color:#535a64}
.qcard .qn{font-family:var(--mono);font-size:12px;color:#6b727c;letter-spacing:.06em}
.deck-ctrl{display:flex;align-items:center;gap:10px}
.deck-ctrl button{width:52px;height:52px;border-radius:50%;border:1px solid var(--line-2);display:grid;place-items:center;transition:background .3s,color .3s,border-color .3s}
.deck-ctrl button:hover{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.deck-ctrl button svg{width:18px;height:18px}
.deck-count{font-family:var(--mono);font-size:12px;letter-spacing:.08em;color:var(--text-2);margin-left:6px}

/* ---------- CTA ---------- */
.cta{position:relative;overflow:hidden}
.cta .h-display{font-size:clamp(54px,12vw,180px)}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:36px}
.cta-mark{position:absolute;right:-8vw;bottom:-10vw;width:min(78vw,760px);opacity:.06;pointer-events:none;color:var(--paper)}

/* ---------- Footer ---------- */
.ftr{border-top:1px solid var(--line);padding-block:48px 26px;color:var(--text-2);font-size:14.5px;background:var(--ink)}
.ftr-top{display:grid;gap:28px}
.ftr-name{font-family:var(--display);font-weight:500;font-variation-settings:"opsz" 96;font-size:clamp(46px,10vw,140px);letter-spacing:-.05em;line-height:.88;color:var(--text);margin:0}
.ftr-name .it{color:var(--signal)}
.ftr-cols{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.ftr-cols h4{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);margin-bottom:12px;font-weight:400}
.ftr-cols a{display:block;padding:7px 0;color:var(--text-2);transition:color .25s}
.ftr-cols a:hover{color:var(--signal)}
.ftr-bot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;margin-top:40px;padding-top:20px;border-top:1px solid var(--line);font-family:var(--mono);font-size:11px;letter-spacing:.05em;color:var(--text-3);text-transform:uppercase}
.clock b{color:var(--text-2);font-weight:400}

/* ---------- Inner page heads ---------- */
.phead{padding-top:calc(var(--header) + clamp(56px,10vw,140px));padding-bottom:clamp(40px,6vw,80px);position:relative;overflow:hidden}
.phead .h-display{margin-top:22px}
.phead .lede{margin-top:26px}
.phead-mark{position:absolute;right:-6vw;top:calc(var(--header) + 10px);width:min(56vw,600px);opacity:.05;pointer-events:none;color:var(--paper)}

/* ---------- Expertise page ---------- */
.disc{display:grid;gap:12px}
.dcard{border:1px solid var(--line);border-radius:var(--r);padding:22px;background:var(--ink-2);display:grid;gap:10px;align-content:start;transition:border-color .3s,transform .5s var(--ease)}
.dcard:hover{border-color:rgba(255,91,31,.5)}
.dcard .mono{color:var(--signal)}
.dcard h3{font-size:clamp(21px,1.9vw,25px)}
.dcard p{margin:0;color:var(--text-2);font-size:15.5px}
.stack{display:grid;gap:18px}
.stack-row{display:grid;gap:10px;padding:18px 0;border-top:1px solid var(--line)}
.stack-row h3{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);font-weight:400}
.rules{display:grid;gap:12px;counter-reset:r}
.rulec{border:1px solid var(--line);border-radius:var(--r);padding:22px;display:grid;gap:8px;background:linear-gradient(180deg,var(--ink-2),var(--ink))}
.rulec h3{font-size:22px}
.rulec p{margin:0;color:var(--text-2);font-size:15.5px}

/* ---------- Experience page ---------- */
.role{display:grid;gap:18px;padding:clamp(34px,5vw,56px) 0;border-top:1px solid var(--line)}
.role-head{display:grid;gap:8px;align-content:start}
.role-when{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--signal)}
.role-head h2{font-family:var(--display);font-weight:500;font-size:clamp(30px,3.4vw,46px);line-height:1.04;letter-spacing:-.035em}
.role-org{color:var(--text-2);font-size:16px;margin:0}
.role ul{margin:0;padding:0;list-style:none;display:grid;gap:12px}
.role li{position:relative;padding-left:24px;color:var(--text-2);max-width:70ch}
.role li::before{content:"";position:absolute;left:0;top:.72em;width:12px;height:1.5px;background:var(--signal)}
.role li b{color:var(--text);font-weight:600}
.facts{display:grid;gap:14px}
.fact{border:1px solid var(--line);border-radius:var(--r);padding:24px;background:var(--ink-2)}
.fact h3{font-size:22px;margin-bottom:12px}
.fact ul{list-style:none;margin:0;padding:0;display:grid;gap:8px;color:var(--text-2)}
.fact b{color:var(--text);font-weight:600}

/* ---------- Portfolio page ---------- */
.pgrid{display:grid;gap:clamp(30px,4vw,56px)}
.proj{display:grid;gap:16px}
.proj-img{position:relative;display:block;border-radius:14px;overflow:hidden;aspect-ratio:16/10;background:var(--ink-3);border:1px solid var(--line)}
.proj-img img{width:100%;height:112%;object-fit:cover;transition:transform 1s var(--ease)}
.proj-img:hover img{transform:scale(1.03)}
.proj-img .open{position:absolute;right:14px;bottom:14px;height:36px;padding:0 14px;border-radius:999px;background:rgba(10,11,13,.8);backdrop-filter:blur(8px);display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--paper)}
.proj h3{font-family:var(--display);font-size:clamp(28px,3vw,42px);font-weight:500;letter-spacing:-.035em;line-height:1.05}
.proj .meta{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-3)}
.proj p{color:var(--text-2);margin:0;max-width:60ch}
.ailist{display:grid;gap:12px}
.aiitem{border:1px solid var(--line);border-radius:var(--r);padding:22px;background:var(--ink-2);display:grid;gap:10px}
.aiitem h3{font-size:22px}
.aiitem p{margin:0;color:var(--text-2);font-size:15.5px}
.career-wins{display:grid;gap:14px}
.win{border:1px solid var(--line);border-radius:var(--r);padding:24px;display:grid;gap:10px;background:var(--ink-2)}
.win .tl-big{font-size:clamp(40px,4.4vw,58px)}

/* ---------- Bio page ---------- */
.bio{display:grid;gap:clamp(36px,6vw,80px);align-items:start}
.bio-photo{position:relative;margin:0;border-radius:18px;overflow:hidden;aspect-ratio:4/5;background:var(--ink-3)}
.bio-photo img{width:100%;height:115%;object-fit:cover;object-position:50% 20%;filter:grayscale(.2)}
.bio-photo figcaption{position:absolute;left:14px;bottom:14px;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;background:rgba(10,11,13,.75);backdrop-filter:blur(8px);padding:8px 12px;border-radius:999px}
.prose{font-size:clamp(18px,1.4vw,20px);line-height:1.7;color:var(--text-2);max-width:62ch}
.prose h2{font-family:var(--display);font-weight:500;font-size:clamp(28px,3vw,40px);color:var(--text);margin:1.6em 0 .6em;letter-spacing:-.03em;line-height:1.05}
.prose strong{color:var(--text);font-weight:600}
.pull{font-family:var(--italic);font-style:italic;font-size:clamp(28px,3.2vw,44px);line-height:1.15;color:var(--text);border-left:2px solid var(--signal);padding-left:22px;margin:1.4em 0}
.values{display:grid;gap:0;margin-top:10px}
.value{display:grid;grid-template-columns:44px 1fr;gap:4px 14px;padding:18px 0;border-top:1px solid var(--line)}
.value .mono{color:var(--signal);padding-top:4px}
.value h3{font-size:22px}
.value p{grid-column:2;margin:0;color:var(--text-2);font-size:16px}
.book{display:grid;gap:12px;border:1px solid var(--line);border-radius:var(--r);padding:26px;background:linear-gradient(150deg,var(--ink-3),var(--ink-2))}

/* ---------- Contact ---------- */
.contact{display:grid;gap:clamp(36px,6vw,72px)}
.cways{display:grid;gap:12px;align-content:start}
.cway{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:20px 22px;border:1px solid var(--line);border-radius:var(--r);background:var(--ink-2);transition:border-color .3s,background .3s}
.cway:hover{border-color:var(--signal);background:var(--ink-3)}
.cway b{display:block;font-family:var(--display);font-weight:500;font-size:clamp(22px,2.3vw,30px);letter-spacing:-.03em}
.cway span{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-3)}
.cway svg{width:22px;height:22px;flex:none;color:var(--signal)}
.form{display:grid;gap:14px}
.fld label{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-2);margin-bottom:8px}
.fld input,.fld textarea{width:100%;min-height:54px;padding:14px 16px;border-radius:12px;border:1px solid var(--line-2);background:var(--ink-2);color:var(--text);font:inherit;font-size:16px;transition:border-color .25s,box-shadow .25s}
.fld textarea{min-height:160px;resize:vertical}
.fld input:focus,.fld textarea:focus{outline:none;border-color:var(--signal);box-shadow:0 0 0 4px rgba(255,91,31,.15)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-msg{min-height:24px;font-size:15px;margin:0}
.form-msg.ok{color:var(--signal)}
.form-msg.err{color:#ff9b8a}

/* ---------- Résumé page ---------- */
.cv{background:#fff;color:#111;border-radius:18px;padding:clamp(22px,5vw,60px);max-width:920px;margin-inline:auto;font-family:var(--sans)}
.cv .cv-name{margin:0;font-family:var(--display);font-weight:600;font-size:clamp(36px,5vw,52px);letter-spacing:-.04em;line-height:1}
.cv .cv-sub{font-weight:600;margin:8px 0 0;color:#2b2f35}
.cv .cv-contact{font-size:14px;color:#454b54;margin:10px 0 0;display:flex;flex-wrap:wrap;gap:4px 16px}
.cv h2{font-family:var(--mono);font-size:11.5px;font-weight:400;letter-spacing:.12em;text-transform:uppercase;color:var(--signal-ink);margin:28px 0 10px;padding-bottom:7px;border-bottom:1px solid #d6d9de}
.cv p,.cv li{font-size:14.5px;line-height:1.5;color:#22262b}
.cv .cv-role{margin-bottom:16px;break-inside:avoid}
.cv .cv-role-h{display:flex;justify-content:space-between;flex-wrap:wrap;gap:2px 16px}
.cv .cv-role-h b{font-size:15.5px}
.cv .cv-role-h span{font-size:13.5px;color:#545a63}
.cv ul{margin:6px 0 0;padding-left:18px}
.cv li{margin-bottom:3px}
.cv-cols{display:grid;gap:4px 24px}
.cv-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}

/* ---------- Command palette ---------- */
.pal{position:fixed;inset:0;z-index:120;display:none;align-items:flex-start;justify-content:center;padding:calc(var(--header) + 4vh) 12px 12px;background:rgba(5,6,8,.6);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.pal.open{display:flex}
.pal .console{width:min(680px,100%)}
.pal-list{display:grid;padding:8px}
.pal-list a{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 12px;border-radius:10px;color:var(--text-2)}
.pal-list a:hover,.pal-list a.on{background:var(--ink-3);color:var(--text)}
.pal-list a small{font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--text-3);text-transform:uppercase}
.pal .con-log{height:auto;max-height:44vh}

/* ---------- Chapter HUD (desktop) ---------- */
.hud{position:fixed;left:var(--gutter);bottom:22px;z-index:50;display:none;opacity:0;transition:opacity .4s;align-items:center;gap:10px;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);pointer-events:none;mix-blend-mode:difference}
.hud b{color:var(--paper);font-weight:400}
.hud i{display:block;width:44px;height:1px;background:rgba(236,238,241,.3);position:relative;overflow:hidden}
.hud i::after{content:"";position:absolute;inset:0;background:var(--paper);transform-origin:0 50%;transform:scaleX(var(--p,0))}

/* ---------- Cursor ---------- */
.cur{position:fixed;left:0;top:0;z-index:130;pointer-events:none;display:none;opacity:0;transition:opacity .3s}
.cur.on{opacity:1}
.hud.on{opacity:1}
.cur .d{position:absolute;width:8px;height:8px;margin:-4px 0 0 -4px;border-radius:50%;background:var(--signal)}
.cur .r{position:absolute;width:38px;height:38px;margin:-19px 0 0 -19px;border-radius:50%;border:1px solid rgba(236,238,241,.35);transition:width .35s var(--ease),height .35s var(--ease),margin .35s var(--ease),background .35s,border-color .35s}
.cur .t{position:absolute;left:0;top:0;transform:translate(-50%,-50%);font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:#120600;opacity:0;transition:opacity .2s;white-space:nowrap}
.cur.is-view .r,.cur.is-drag .r{width:86px;height:86px;margin:-43px 0 0 -43px;background:var(--signal);border-color:var(--signal)}
.cur.is-view .t,.cur.is-drag .t{opacity:1}
.cur.is-view .d,.cur.is-drag .d{opacity:0}

/* ---------- Breakpoints (mobile-first) ---------- */
/* Sales: retail buyers wall and trained teams */
.buyers{border-top:1px solid var(--line)}
.buyers-h{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 0;color:var(--text-3)}
.buyer-wall{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);border-left:1px solid var(--line)}
.buyer{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;gap:18px;min-height:clamp(112px,13vw,184px);padding:clamp(16px,2.4vw,30px) clamp(14px,2vw,26px);border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.buyer::before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(255,91,31,.16),transparent 70%);transform:scaleY(0);transform-origin:50% 100%;transition:transform .55s var(--ease);pointer-events:none}
.buyer .mono{position:relative;color:var(--text-3);font-size:11px}
.buyer b{position:relative;display:block;font-family:var(--display);font-weight:500;font-variation-settings:"opsz" 72;font-size:clamp(25px,3.5vw,50px);line-height:1.02;letter-spacing:-.04em;transition:color .35s,transform .55s var(--ease)}
.buyer:hover::before{transform:scaleY(1)}
.buyer b span{display:inline-block}
.buyer:hover b{color:var(--signal);transform:translateX(6px)}
.trained{display:grid;gap:14px}
.trained .mono{margin:0;color:var(--text-3)}
.trained ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.trained li{font-family:var(--display);font-weight:500;font-size:clamp(19px,2.2vw,28px);letter-spacing:-.025em;line-height:1;padding:12px 18px;border:1px solid var(--line-2);border-radius:999px}
#sales .trained{margin-top:clamp(28px,4vw,48px)}
.sell-foot{display:grid;gap:28px;margin-top:clamp(28px,4vw,48px);align-items:end}
@media (min-width:900px){
  .buyer-wall{grid-template-columns:repeat(4,1fr)}
  .sell-foot{grid-template-columns:1fr auto}
}
@media (min-width:600px){
  .stats{grid-template-columns:repeat(3,1fr)}
  .stat:last-child{grid-column:auto}
  .tl-track{grid-template-columns:1fr 1fr}
  .ftr-cols{grid-template-columns:repeat(3,1fr)}
  .facts,.disc,.rules,.ailist,.career-wins{grid-template-columns:1fr 1fr}
  .cv-cols{grid-template-columns:1fr 1fr}
}
@media (min-width:900px){
  :root{--header:76px}
  body{font-size:18px}
  .nav{display:flex}
  .hdr .hdr-cta{display:inline-flex}
  .kbtn kbd{display:inline}
  .kbtn{width:auto;padding:0 12px 0 14px}
  .kbtn span{display:inline}
  .burger{display:none}
  .sheet{display:none}
  .cue{display:inline-flex}
  .hud{display:flex}
  .hero .wrap{padding-bottom:26px}
  .hero-photo{left:auto;right:8%;top:calc(var(--header) + 3svh);height:calc(100svh - var(--header) - 40px);transform:none}
  .hero-cap{left:var(--gutter);right:auto;bottom:150px;max-width:44%}
  .hero-labels span{font-size:11px}
  .stats{grid-template-columns:repeat(5,1fr)}
  .stat{min-height:200px;padding:30px 24px 26px}
  .sec-head{grid-template-columns:1fr 1fr;align-items:end;gap:48px}
  .triad{grid-template-columns:repeat(3,1fr)}
  .lab{grid-template-columns:1fr 1.05fr;align-items:start}
  .lab-console{position:sticky;top:calc(var(--header) + 28px)}
  .log-wrap{display:grid;grid-template-columns:1.6fr 1fr;gap:48px;align-items:start}
  .learn{position:sticky;top:calc(var(--header) + 28px)}
  .sys{grid-template-columns:80px 1fr 1fr;gap:10px 28px;padding:28px 0}
  .sys p{grid-column:3;grid-row:1/3}
  .sys .chips{grid-column:2}
  .work-row{grid-template-columns:200px 1fr auto;padding:28px 14px}
  .work-row .meta{grid-column:1;grid-row:1}
  .work-row h3{grid-column:2;grid-row:1}
  .work-row .plat{grid-column:3;grid-row:1}
  .work-desc{grid-column:2;grid-row:2;margin:0}
  .work-row:hover::before{transform:scaleY(1)}
  .work-row:hover h3{transform:translateX(14px);color:var(--signal)}
  .work-row:hover .plat svg{transform:rotate(-45deg)}
  .deck-wrap{grid-template-columns:1fr 1.25fr;align-items:center;gap:60px}
  .deck{height:420px}
  .ftr-top{grid-template-columns:1.3fr 1fr;align-items:end}
  .role{grid-template-columns:minmax(280px,1fr) 1.6fr;gap:40px}
  .facts{grid-template-columns:repeat(3,1fr)}
  .disc{grid-template-columns:repeat(3,1fr)}
  .rules{grid-template-columns:repeat(4,1fr)}
  .ailist{grid-template-columns:repeat(3,1fr)}
  .stack-row{grid-template-columns:220px 1fr;align-items:center}
  .pgrid{grid-template-columns:1fr 1fr}
  .proj:nth-child(even){margin-top:120px}
  .bio{grid-template-columns:.9fr 1.1fr}
  .bio-aside{position:sticky;top:calc(var(--header) + 24px)}
  .contact{grid-template-columns:1fr 1.15fr}
  .form{grid-template-columns:1fr 1fr}
  .form .full{grid-column:1/-1}
  .career-wins{grid-template-columns:repeat(4,1fr)}
}
@media (min-width:1100px){
  .tl.is-h{overflow:hidden}
  .tl.is-h .tl-track{display:flex;gap:22px;width:max-content;padding-right:var(--gutter)}
  .tl.is-h .tl-card{width:min(30vw,420px);min-height:430px;align-content:space-between}
}
@media (hover:hover) and (pointer:fine){
  .cur{display:block}
  body.has-cur a,body.has-cur button,body.has-cur .qcard{cursor:none}
}
@media (max-width:899px){
  .wpv{display:none}
  .work.has-stage{position:relative}
  .work-stage{position:sticky;top:calc(var(--header) + 10px);z-index:2;aspect-ratio:16/10;border-radius:12px;overflow:hidden;margin-bottom:12px;background:var(--ink-3);border:1px solid var(--line);box-shadow:0 18px 40px rgba(0,0,0,.5)}
  .work-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.06);transition:opacity .5s,transform 2.4s var(--ease)}
  .work-stage img.on{opacity:1;transform:scale(1)}
  .work-stage .ws-label{position:absolute;left:10px;bottom:10px;z-index:2;font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;background:rgba(10,11,13,.8);padding:6px 10px;border-radius:999px}
  .work.has-stage .work-row{transition:opacity .4s}
  .work.has-stage .work-row.is-past{opacity:.45}
  .work.has-stage .work-row.is-on h3{color:var(--signal)}
  .hero-name{font-size:clamp(70px,20vw,140px)}
  .hero-cap{bottom:auto;top:calc(var(--header) + 54svh)}
  .hero-cap .h2{font-size:clamp(30px,9vw,44px)}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  @view-transition{navigation:none}
}
@media print{
  @page{size:Letter;margin:.5in .55in}
  html,body{background:#fff!important;color:#000}
  body::before,body::after,.hdr,.sheet,.ftr,.cur,.cv-actions,.phead,.skip,.hud,.pal{display:none!important}
  .cv{border-radius:0;padding:0;max-width:none}
  .cv p,.cv li{font-size:9.4pt;line-height:1.36}
  .cv h2{margin:13px 0 6px;padding-bottom:4px}
  .cv .cv-role{margin-bottom:8px}
  .cv li{margin-bottom:1px}
  .cv .cv-name{font-size:28pt}
  main>section{padding:0!important}
}