/* Layout: one 1240px editorial column floating over a fixed WebGL aurora ("Atlantic dawn").
   Big condensed display type carries the claims; frosted-glass panes carry the proof and overlap it. */
:root{
  --night:#05080b;          /* page ground, blue-black with a sea bias */
  --deep:#0c1419;           /* solid raised surface (browser frames) */
  --pearl:#edf1ee;          /* primary text */
  --mist:#9aa9a8;           /* secondary text */
  --tide:#45c6b4;           /* sea-teal light, also "live" */
  --ember:#ff8a5c;          /* dawn coral */
  --brass:#e2b86b;          /* sun brass, the one accent */
  --brass-hi:#f6dca8;
  --ink-on-brass:#1b1206;
  --line:rgba(237,241,238,.11);
  --line-strong:rgba(237,241,238,.22);
  --shadow:0 40px 100px -40px rgba(0,0,0,.8);

  --display:"Bricolage Grotesque","Helvetica Neue",Arial,sans-serif;
  --body:"Geist","Segoe UI",system-ui,-apple-system,sans-serif;
  --mono:"Geist Mono",ui-monospace,"SFMono-Regular",Consolas,monospace;

  --wrap:1240px;
  --gutter:clamp(16px,4vw,40px);
  --r-lg:26px;--r-md:18px;--r-sm:12px;
  --ease:cubic-bezier(.2,.8,.2,1);
  color-scheme:dark;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:clip;background:var(--night)}
body{margin:0;background:var(--night);color:var(--pearl);font-family:var(--body);font-size:1.0625rem;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:clip;text-rendering:optimizeLegibility}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
p{margin:0}
::selection{background:rgba(226,184,107,.35);color:var(--pearl)}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px;border-radius:8px}

.skip{position:fixed;left:16px;top:-60px;z-index:100;background:var(--brass);color:var(--ink-on-brass);padding:10px 16px;border-radius:10px;font-weight:600;text-decoration:none}
.skip:focus{top:calc(env(safe-area-inset-top,0px) + 12px)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- atmosphere ---------- */
.bg-fallback{position:fixed;inset:0;z-index:0;pointer-events:none;background:
  radial-gradient(60% 45% at 18% 8%,rgba(69,198,180,.20),transparent 70%),
  radial-gradient(45% 40% at 88% 14%,rgba(255,138,92,.16),transparent 70%),
  radial-gradient(70% 55% at 50% 105%,rgba(226,184,107,.10),transparent 70%),
  var(--night)}
#aurora{position:fixed;inset:0;width:100%;height:100%;z-index:0;display:block;pointer-events:none;opacity:0;transition:opacity 1.6s ease}
#aurora.on{opacity:1}
.grain{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.06;mix-blend-mode:overlay;background-size:220px 220px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .6 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}

.hero,main,.footer{position:relative;z-index:1}
.wrap{width:100%;max-width:calc(var(--wrap) + var(--gutter) * 2);margin-inline:auto;padding-inline:var(--gutter)}

/* ---------- type ---------- */
h1,h2,h3,h4{font-family:var(--display);font-weight:640;font-stretch:84%;letter-spacing:-.03em;text-wrap:balance;margin:0;line-height:1}
.eyebrow{font-family:var(--mono);font-size:.74rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--brass);margin:0 0 1.25rem;display:flex;align-items:center;gap:.7rem}
.eyebrow::before{content:"";width:24px;height:1px;background:currentColor;opacity:.75;flex:none}
.lede{color:var(--mist);font-size:clamp(1.05rem,1rem + .3vw,1.2rem);line-height:1.62;max-width:58ch;text-wrap:pretty}
.mono{font-family:var(--mono)}
.iri{background:linear-gradient(100deg,var(--brass-hi) 0%,var(--brass) 24%,var(--ember) 48%,var(--tide) 76%,var(--brass-hi) 100%);background-size:240% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:iri 14s ease-in-out infinite alternate}
@keyframes iri{to{background-position:100% 0}}

/* ---------- glass ---------- */
.glass{position:relative;isolation:isolate;border-radius:var(--r-lg);
  background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.025) 55%,rgba(255,255,255,.045));
  -webkit-backdrop-filter:blur(22px) saturate(150%);backdrop-filter:blur(22px) saturate(150%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),var(--shadow)}
.glass::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;z-index:3;
  background:linear-gradient(140deg,rgba(255,255,255,.4),rgba(255,255,255,.07) 30%,rgba(255,255,255,.03) 58%,rgba(226,184,107,.34) 84%,rgba(69,198,180,.32));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.glass::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1;
  background:radial-gradient(560px circle at var(--mx,25%) var(--my,-30%),rgba(255,255,255,.10),transparent 45%)}
.glass-lite{position:relative;border-radius:var(--r-md);background:rgba(255,255,255,.035);box-shadow:inset 0 0 0 1px var(--line)}

/* ---------- buttons ---------- */
.btn{--h:52px;display:inline-flex;align-items:center;justify-content:center;gap:.6rem;height:var(--h);padding:0 1.55rem;border-radius:999px;border:0;cursor:pointer;
  font:600 .98rem/1 var(--body);letter-spacing:-.005em;text-decoration:none;color:var(--pearl);white-space:nowrap;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),background .3s}
.btn svg{width:16px;height:16px;flex:none;transition:transform .3s var(--ease)}
.btn:hover svg{transform:translate(3px,-1px)}
.btn-brass{color:var(--ink-on-brass);background:linear-gradient(135deg,var(--brass-hi),var(--brass) 45%,var(--ember));
  box-shadow:0 12px 32px -12px rgba(226,184,107,.65),inset 0 1px 0 rgba(255,255,255,.55)}
.btn-brass:hover{transform:translateY(-2px);box-shadow:0 18px 44px -14px rgba(255,138,92,.7),inset 0 1px 0 rgba(255,255,255,.55)}
.btn-glass{background:rgba(255,255,255,.06);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:inset 0 0 0 1px var(--line-strong)}
.btn-glass:hover{background:rgba(255,255,255,.11);transform:translateY(-2px)}
.btn-sm{--h:40px;padding:0 1.1rem;font-size:.9rem}

/* ---------- nav ---------- */
.progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:70;pointer-events:none}
.progress span{display:block;height:100%;transform-origin:0 50%;transform:scaleX(var(--p,0));background:linear-gradient(90deg,var(--tide),var(--brass),var(--ember))}
.nav{position:fixed;top:0;left:0;right:0;z-index:60;padding-top:calc(env(safe-area-inset-top,0px) + 14px);padding-inline:var(--gutter);pointer-events:none}
.nav-inner{pointer-events:auto;max-width:var(--wrap);margin-inline:auto;display:flex;align-items:center;gap:.75rem;height:62px;padding:0 10px 0 16px;border-radius:999px;
  background:rgba(7,12,15,.42);-webkit-backdrop-filter:blur(20px) saturate(160%);backdrop-filter:blur(20px) saturate(160%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.09),0 24px 60px -30px rgba(0,0,0,.9);transition:background .35s}
.nav.scrolled .nav-inner{background:rgba(7,12,15,.72)}
.brand{display:flex;align-items:center;gap:.65rem;text-decoration:none;color:var(--pearl);margin-right:auto;border-radius:12px}
.mark{width:30px;height:30px;flex:none}
.wordmark{font-family:var(--display);font-weight:700;font-stretch:86%;font-size:1.2rem;letter-spacing:-.025em;line-height:1}
.wordmark span{font-weight:400;color:var(--mist);margin-left:.28em}
.nav-links{display:flex;gap:.2rem;list-style:none;margin:0;padding:0}
.nav-links a{display:block;padding:.55rem .9rem;border-radius:999px;color:var(--mist);text-decoration:none;font-size:.92rem;transition:color .2s,background .2s}
.nav-links a:hover,.nav-links a.active{color:var(--pearl);background:rgba(255,255,255,.07)}
.nav-toggle{display:none;width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.07);cursor:pointer;place-items:center;padding:0}
.nav-toggle span{display:block;width:18px;height:1.5px;background:var(--pearl);border-radius:2px;transition:transform .3s var(--ease)}
.nav-toggle span+span{margin-top:6px}
.nav-toggle[aria-expanded="true"] span:first-child{transform:translateY(3.75px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:last-child{transform:translateY(-3.75px) rotate(-45deg)}
.nav-sheet{pointer-events:auto;max-width:var(--wrap);margin:10px auto 0;padding:10px;border-radius:24px;background:rgba(7,12,15,.86)}
.nav-sheet a{display:flex;justify-content:space-between;align-items:center;padding:15px 16px;border-radius:14px;text-decoration:none;font-family:var(--display);font-stretch:88%;font-weight:600;font-size:1.25rem}
.nav-sheet a:hover{background:rgba(255,255,255,.06)}
.nav-sheet .btn{width:100%;margin-top:8px;font-family:var(--body);font-size:1rem}
@media (max-width:880px){
  .nav-links,.nav-cta{display:none}
  .nav-toggle{display:grid}
}
@media (min-width:881px){.nav-sheet{display:none!important}}

/* ---------- hero ---------- */
.hero{position:relative;padding-top:calc(env(safe-area-inset-top,0px) + clamp(124px,15vw,176px));overflow:clip}
.hero::before{content:"";position:absolute;inset:0 0 30% 0;z-index:-1;pointer-events:none;opacity:.5;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:88px 88px;background-position:center top;
  -webkit-mask:radial-gradient(70% 70% at 30% 20%,#000,transparent 75%);mask:radial-gradient(70% 70% at 30% 20%,#000,transparent 75%)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:clamp(24px,4vw,64px);align-items:end}
.hero-title{font-size:clamp(3.1rem,1.3rem + 6.4vw,7.6rem);line-height:.92;font-weight:640;font-stretch:84%;letter-spacing:-.022em;margin:0 0 1.75rem}
.hero-title .line{display:block;overflow:hidden;padding-block:.08em .1em;margin-block:-.08em -.1em}
.hero-title .line>span{display:inline-block;will-change:transform}
.hero-lede{max-width:54ch;font-size:clamp(1.08rem,1rem + .35vw,1.26rem);color:var(--mist);line-height:1.6;margin:0 0 2.1rem;text-wrap:pretty}
.hero-lede strong{color:var(--pearl);font-weight:500}
.hero-ctas{display:flex;flex-wrap:wrap;gap:.8rem}

.status{padding:20px 20px 16px;border-radius:24px}
.status-head{display:flex;justify-content:space-between;align-items:center;gap:1rem;font:500 .7rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--mist);padding:0 4px 14px;border-bottom:1px solid var(--line)}
.status-head b{font-weight:500;color:var(--tide);display:inline-flex;align-items:center;gap:.5rem}
.status ul{list-style:none;margin:0;padding:0}
.status li a{display:grid;grid-template-columns:auto minmax(0,1fr) auto;column-gap:12px;align-items:center;padding:13px 4px;text-decoration:none;border-bottom:1px solid var(--line);border-radius:6px;transition:background .2s}
.status li a:hover{background:rgba(255,255,255,.04)}
.status .domain{font-weight:500;font-size:.96rem;overflow-wrap:anywhere}
.status .what{grid-column:2;font-size:.8rem;color:var(--mist);line-height:1.35}
.status .ms{grid-column:3;grid-row:1/span 2;font:500 .72rem/1 var(--mono);color:var(--mist);display:flex;align-items:center;gap:.4rem;white-space:nowrap}
.status .ms svg{width:12px;height:12px;opacity:.7}
.status .dot{grid-row:1/span 2}
.status-foot{font:400 .7rem/1.4 var(--mono);color:var(--mist);padding:12px 4px 0;letter-spacing:.02em}
.dot{width:8px;height:8px;border-radius:50%;background:var(--tide);flex:none;box-shadow:0 0 0 0 rgba(69,198,180,.55);animation:pulse 2.6s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(69,198,180,.55)}70%{box-shadow:0 0 0 9px rgba(69,198,180,0)}100%{box-shadow:0 0 0 0 rgba(69,198,180,0)}}

@media (max-width:1000px){.hero-grid{grid-template-columns:minmax(0,1fr)}.status{max-width:520px}}

/* 3D stage of real product screens */
.stage{position:relative;margin-top:clamp(48px,6vw,84px);perspective:2200px;perspective-origin:50% -10%}
.stage::after{content:"";position:absolute;left:8%;right:8%;bottom:-4%;height:36%;z-index:-1;pointer-events:none;filter:blur(50px);
  background:radial-gradient(closest-side,rgba(226,184,107,.28),rgba(69,198,180,.14) 55%,transparent)}
.fan-tilt,.fan{transform-style:preserve-3d}
.fan-tilt{will-change:transform}
.fan{position:relative;width:min(1180px,100%);margin-inline:auto;aspect-ratio:16/7.4;transform:rotateX(10deg);transform-origin:50% 0%}
.frame{position:absolute;margin:0;border-radius:14px;overflow:hidden;background:var(--deep);
  box-shadow:0 0 0 1px rgba(255,255,255,.11),0 60px 120px -40px rgba(0,0,0,.9),0 0 80px -30px rgba(226,184,107,.18)}
.frame-bar{height:clamp(22px,2.6vw,34px);display:flex;align-items:center;gap:6px;padding:0 12px;background:linear-gradient(#151d23,#0f161b);border-bottom:1px solid rgba(255,255,255,.06)}
.frame-bar i{width:clamp(6px,.7vw,9px);aspect-ratio:1;border-radius:50%;background:#2b353c;flex:none}
.frame-url{margin-inline:auto;font:500 clamp(.55rem,.5rem + .25vw,.72rem)/1 var(--mono);color:var(--mist);background:rgba(255,255,255,.05);padding:.4em 1em;border-radius:999px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:70%}
.frame img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top center}
.f-center{left:17%;width:66%;top:0}
.f-left{left:0;width:44%;top:10%;rotate:y 26deg;translate:0 0 -170px;transform-origin:100% 50%}
.f-right{right:0;width:44%;top:10%;rotate:y -26deg;translate:0 0 -170px;transform-origin:0% 50%}
.frame figcaption{position:absolute;left:12px;bottom:12px;font:500 .7rem/1 var(--mono);letter-spacing:.06em;padding:.5em .8em;border-radius:999px;background:rgba(5,8,11,.7);color:var(--pearl);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
@media (max-width:760px){
  .fan{aspect-ratio:16/11}
  .f-center{left:7%;width:86%}
  .f-left{left:-20%;width:62%;top:16%}
  .f-right{right:-20%;width:62%;top:16%}
  .frame figcaption{display:none}
}

/* proof strip */
.proof{position:relative;z-index:5;margin-top:clamp(-120px,-7vw,-28px)}
.proof-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:6px;border-radius:24px;list-style:none;margin:0}
.proof-item{padding:24px 24px 22px;border-left:1px solid var(--line);min-width:0}
.proof-item:first-child{border-left:0}
.proof-num{display:block;font-family:var(--display);font-stretch:78%;font-weight:620;font-size:clamp(2.3rem,1.7rem + 2vw,3.5rem);line-height:1;letter-spacing:-.035em;font-variant-numeric:tabular-nums}
.proof-label{margin:.7rem 0 .55rem;font-size:.95rem;line-height:1.4;color:var(--pearl)}
.proof-src{font:400 .7rem/1.45 var(--mono);color:var(--mist);letter-spacing:.02em}
@media (max-width:920px){
  .proof-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .proof-item:nth-child(3){border-left:0}
  .proof-item:nth-child(n+3){border-top:1px solid var(--line)}
}
@media (max-width:460px){
  .proof-grid{grid-template-columns:minmax(0,1fr)}
  .proof-item{border-left:0!important}
  .proof-item+.proof-item{border-top:1px solid var(--line)}
}

/* ---------- sections ---------- */
.section{position:relative;padding-block:clamp(96px,12vw,168px)}
.section-head{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);column-gap:clamp(20px,5vw,80px);row-gap:1.2rem;align-items:end;margin-bottom:clamp(48px,6vw,88px)}
.section-head .eyebrow{grid-column:1/-1;margin:0}
.section-head h2{font-size:clamp(2.4rem,1.3rem + 3.7vw,4.7rem);line-height:.98;font-stretch:86%;font-weight:620;letter-spacing:-.02em}
@media (max-width:860px){.section-head{grid-template-columns:minmax(0,1fr)}}

/* ---------- case studies ---------- */
.case{position:relative;padding-block:clamp(40px,6vw,88px)}
.case+.case::before{content:"";position:absolute;top:0;left:50%;width:min(var(--wrap),calc(100% - var(--gutter) * 2));translate:-50% 0;height:1px;background:linear-gradient(90deg,transparent,var(--line-strong) 20%,var(--line-strong) 80%,transparent)}
.case-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,80px);align-items:start}
.case-copy{padding-top:clamp(0px,2vw,24px)}
#quickcurate{padding-top:0}
.case--flip .case-grid{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.case--flip .case-copy{order:2}
.case-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;column-gap:2rem;row-gap:1.1rem;margin-bottom:clamp(28px,4vw,52px)}
.case-meta{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;padding-bottom:.6rem}
.chip{font:500 .7rem/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;padding:.6rem .85rem;border-radius:999px;background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px var(--line);color:var(--mist);white-space:nowrap}
.live{display:inline-flex;align-items:center;gap:.55rem;font:500 .78rem/1 var(--mono);padding:.55rem .85rem;border-radius:999px;text-decoration:none;color:var(--tide);background:rgba(69,198,180,.08);box-shadow:inset 0 0 0 1px rgba(69,198,180,.28);transition:background .2s}
.live:hover{background:rgba(69,198,180,.16)}
.live svg{width:12px;height:12px}
.case-title{font-size:clamp(2.7rem,1.1rem + 6vw,7.4rem);line-height:.88;font-stretch:82%;font-weight:660;letter-spacing:-.018em;margin:0;min-width:0;overflow-wrap:anywhere}
.case-lede{font-size:clamp(1.05rem,1rem + .2vw,1.15rem);color:var(--mist);max-width:50ch;margin:0 0 2rem;text-wrap:pretty}
.case-lede strong{color:var(--pearl);font-weight:500}
.case-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0 0 2rem;padding:0;list-style:none;border-block:1px solid var(--line)}
.case-stats li{padding:18px 14px 18px 0;min-width:0}
.case-stats li+li{padding-left:16px;border-left:1px solid var(--line)}
.case-stats b{display:block;font-family:var(--display);font-stretch:80%;font-weight:620;font-size:clamp(1.55rem,1.15rem + 1vw,2.15rem);letter-spacing:-.03em;line-height:1.05;font-variant-numeric:tabular-nums;white-space:nowrap}
.case-stats span{display:block;font-size:.82rem;color:var(--mist);margin-top:.4rem;line-height:1.4}
@media (max-width:520px){
  .case-stats{grid-template-columns:minmax(0,1fr)}
  .case-stats li+li{padding-left:0;border-left:0;border-top:1px solid var(--line)}
}
.built{margin-top:clamp(44px,5vw,72px);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:clamp(20px,3vw,40px);row-gap:32px}
.built>div{border-top:1px solid var(--line-strong);padding-top:18px;min-width:0}
.built h4{font-size:1.18rem;font-stretch:88%;font-weight:620;letter-spacing:-.015em;margin:0 0 .55rem;line-height:1.2}
.built p{color:var(--mist);font-size:.95rem;line-height:1.6;text-wrap:pretty}
.stack{display:flex;flex-wrap:wrap;gap:.45rem;margin:30px 0 0;padding:0;list-style:none;align-items:center}
.stack li{font:500 .76rem/1 var(--mono);padding:.55rem .75rem;border-radius:8px;background:rgba(255,255,255,.035);box-shadow:inset 0 0 0 1px var(--line);color:var(--pearl);white-space:nowrap}
.stack li.k{background:none;box-shadow:none;color:var(--brass);letter-spacing:.14em;text-transform:uppercase;font-size:.68rem;padding-left:0}
@media (max-width:1000px){
  .case-grid,.case--flip .case-grid{grid-template-columns:minmax(0,1fr)}
  .case--flip .case-copy{order:0}
  .built{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:560px){.built{grid-template-columns:minmax(0,1fr)}}

/* case visuals: images on a fixed-ratio canvas, cards overlay on desktop and flow below on phones */
.viz{display:grid;container-type:inline-size;min-width:0}
.viz-canvas,.viz-cards{grid-area:1/1;position:relative}
.viz-canvas{aspect-ratio:7/6;max-width:100%}
.viz-cards{pointer-events:none}
.viz-cards>*{pointer-events:auto}
.viz .frame{position:absolute}
.float{position:absolute;margin:0;border-radius:14px;overflow:hidden;box-shadow:0 0 0 1px rgba(255,255,255,.12),0 40px 90px -30px rgba(0,0,0,.9)}
.float img{width:100%;height:100%;object-fit:cover}
.card{position:absolute;padding:16px 16px 14px;border-radius:18px;font-size:.84rem;line-height:1.45}
.card.glass{background:linear-gradient(160deg,rgba(24,34,40,.82),rgba(9,14,18,.74))}
.card .k{display:flex;justify-content:space-between;gap:.75rem;font:500 .66rem/1.2 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mist);margin-bottom:10px}
.card .k b{font-weight:500;color:var(--brass)}
.row{display:flex;justify-content:space-between;align-items:center;gap:.75rem;padding:7px 0;border-top:1px solid var(--line)}
.row span:last-child{font:500 .74rem/1.3 var(--mono);text-align:right}
.ok{color:var(--tide)}
.warn{color:var(--brass)}
.pill{display:inline-flex;align-items:center;gap:.45rem;font:500 .74rem/1 var(--mono);padding:.5rem .7rem;border-radius:999px}
.pill-ok{background:rgba(69,198,180,.12);color:var(--tide);box-shadow:inset 0 0 0 1px rgba(69,198,180,.3)}
.pill-brass{background:rgba(226,184,107,.12);color:var(--brass-hi);box-shadow:inset 0 0 0 1px rgba(226,184,107,.32)}

.qc-viz .main{left:0;top:13%;width:80%}
.qc-viz .tv{right:0;top:0;width:47%;aspect-ratio:5/4;rotate:3deg}
.qc-viz .mug{left:4%;bottom:0;width:34%;aspect-ratio:5/4;rotate:-3.5deg}
.qc-viz .judge{right:0;bottom:6%;width:52%}

.das-viz .wall{position:absolute;right:0;top:0;width:78%;height:86%;border-radius:24px;overflow:hidden;padding:12px}
.wall-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;height:100%;
  -webkit-mask:linear-gradient(180deg,transparent,#000 12%,#000 88%,transparent);mask:linear-gradient(180deg,transparent,#000 12%,#000 88%,transparent)}
.wall-col{overflow:hidden;min-width:0}
.wall-track{display:flex;flex-direction:column;gap:10px;animation:wallUp var(--d,60s) linear infinite}
.wall-col:nth-child(2) .wall-track{animation-direction:reverse}
.wall:hover .wall-track{animation-play-state:paused}
.wall-track img{width:100%;border-radius:10px;background:#f6f1e7;box-shadow:0 0 0 1px rgba(255,255,255,.08)}
@keyframes wallUp{to{transform:translateY(calc(-50% - 5px))}}
.das-viz .main{left:0;bottom:2%;width:62%;rotate:-2deg}
.das-viz .scoop{left:0;top:4%;width:46%}
.das-viz .ledger{right:2%;bottom:0;width:44%}
.meter{height:8px;border-radius:99px;background:rgba(255,255,255,.08);position:relative;margin:12px 0 8px;overflow:hidden}
.meter span{position:absolute;inset:0 auto 0 0;width:var(--w,25%);border-radius:inherit;background:linear-gradient(90deg,var(--tide),var(--brass))}
.meter-ticks{display:flex;justify-content:space-between;font:500 .66rem/1 var(--mono);color:var(--mist)}
.big{font-family:var(--display);font-stretch:80%;font-weight:640;font-size:1.65rem;letter-spacing:-.03em;line-height:1}

.ctp-viz .main{left:0;top:0;width:80%}
.ctp-viz .calshot{right:0;bottom:0;width:58%}
.ctp-viz .curve{left:0;bottom:3%;width:50%}
.curve svg{width:100%;height:auto;display:block;overflow:visible}
.curve .axis{stroke:var(--line-strong);stroke-width:1}
.curve .grid{stroke:var(--line);stroke-width:1;stroke-dasharray:2 4}
.curve .tick{fill:var(--mist);font:500 11px var(--mono)}
.curve .nat{fill:none;stroke:var(--ember);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;opacity:.9}
.curve .rev{fill:none;stroke:var(--tide);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.curve .rdot{fill:var(--brass)}
.curve .rlab{fill:var(--brass-hi);font:600 10px var(--mono)}
.curve .endlab{font:600 12px var(--mono)}
.legend{display:flex;flex-wrap:wrap;gap:.4rem 1rem;margin-top:8px;font:500 .68rem/1.3 var(--mono);color:var(--mist)}
.legend i{display:inline-block;width:14px;height:2px;border-radius:2px;margin-right:.45rem;vertical-align:middle}

@media (max-width:640px){
  .viz-cards{grid-area:2/1;display:flex;flex-direction:column;gap:12px;margin-top:14px}
  .viz-cards>.card{position:relative;inset:auto;width:auto;rotate:0deg}
  .viz-canvas{aspect-ratio:7/5.4}
}

/* ---------- pipeline ---------- */
.pipeline{padding-top:clamp(56px,7vw,104px)}
.pipeline .section-head{margin-bottom:0}
.pipe-pin{min-height:100vh;min-height:100svh;display:flex;align-items:center;padding-block:clamp(88px,10vh,120px) 32px}
.pipe-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(24px,4.5vw,72px);align-items:center;width:100%}
.pipe-side{position:relative;min-width:0}
.pipe-steps{list-style:none;margin:0;padding:0;position:relative}
.pipe-steps::before,.pipe-rail{content:"";position:absolute;left:15.5px;top:18px;bottom:18px;width:1px;background:var(--line-strong)}
.pipe-rail{background:linear-gradient(var(--tide),var(--brass),var(--ember));transform-origin:50% 0;transform:scaleY(var(--pp,1))}
.pipe-steps button{all:unset;box-sizing:border-box;display:grid;grid-template-columns:32px minmax(0,1fr);column-gap:16px;width:100%;padding:9px 0;cursor:pointer;border-radius:10px}
.pipe-steps button:focus-visible{outline:2px solid var(--brass);outline-offset:4px}
.step-n{position:relative;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font:500 .7rem/1 var(--mono);background:var(--night);color:var(--mist);box-shadow:inset 0 0 0 1px var(--line-strong);transition:background .35s,color .35s,box-shadow .35s}
.step-t{font-family:var(--display);font-stretch:88%;font-weight:620;font-size:1.18rem;letter-spacing:-.015em;line-height:32px;color:var(--mist);transition:color .35s}
.step-d{grid-column:2;color:var(--mist);font-size:.93rem;line-height:1.55;max-height:0;opacity:0;overflow:hidden;transition:max-height .45s var(--ease),opacity .45s var(--ease),margin .45s var(--ease)}
.pipe-steps li.done .step-n{color:var(--tide);box-shadow:inset 0 0 0 1px rgba(69,198,180,.6)}
.pipe-steps li.active .step-n{background:var(--brass);color:var(--ink-on-brass);box-shadow:0 0 0 6px rgba(226,184,107,.16)}
.pipe-steps li.active .step-t,.pipe-steps li.done .step-t{color:var(--pearl)}
.pipe-steps li.active .step-d{max-height:7em;opacity:1;margin-top:2px}
.pipe-static .pipe-steps .step-d{max-height:none;opacity:1}

.pipe-stage{padding:14px;border-radius:28px;min-width:0}
.stage-bar{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:4px 8px 14px;font:500 .72rem/1 var(--mono);color:var(--mist)}
.stage-bar .pill{transition:background .3s,color .3s}
.stage-canvas{position:relative;aspect-ratio:4/3;border-radius:20px;overflow:hidden;container-type:inline-size;
  background:radial-gradient(120% 90% at 20% 0%,rgba(69,198,180,.10),transparent 60%),radial-gradient(100% 80% at 100% 100%,rgba(255,138,92,.10),transparent 60%),rgba(3,6,8,.55);
  box-shadow:inset 0 0 0 1px var(--line)}
.slot{position:absolute;left:4.5%;top:7%;width:46%;aspect-ratio:1}
.art-card,.mock{position:absolute;inset:0;border-radius:16px;overflow:hidden;box-shadow:0 0 0 1px rgba(255,255,255,.12),0 30px 70px -30px rgba(0,0,0,.9)}
.art-card{opacity:0;background:#fff}
.art-card img,.mock img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.checker{position:absolute;inset:0;opacity:0;background-color:#e9e6e1;background-image:linear-gradient(45deg,#cfcac3 25%,transparent 25%),linear-gradient(-45deg,#cfcac3 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#cfcac3 75%),linear-gradient(-45deg,transparent 75%,#cfcac3 75%);background-size:22px 22px;background-position:0 0,0 11px,11px -11px,-11px 0}
.art-cut{opacity:0}
.art-orig{clip-path:inset(0% 0% 0% 0%)}
.scan{position:absolute;left:-2%;right:-2%;top:0;height:2px;opacity:0;background:linear-gradient(90deg,transparent,var(--tide),var(--brass-hi),var(--tide),transparent);box-shadow:0 0 18px 4px rgba(69,198,180,.55)}
.phash{position:absolute;inset:0;display:grid;grid-template-columns:repeat(8,1fr);opacity:0;background:rgba(5,8,11,.35)}
.phash i{border:1px solid rgba(255,255,255,.18);transform:scale(0)}
.phash i.on{background:rgba(69,198,180,.55)}
.phash i.off{background:rgba(5,8,11,.55)}
.hash-chip{position:absolute;left:50%;bottom:7%;translate:-50% 0;opacity:0;white-space:nowrap;font-size:clamp(.56rem,1.5cqw,.74rem);background:rgba(5,8,11,.85)}
.mock{opacity:1}
.art-meta{position:absolute;left:4.5%;top:calc(7% + 46cqw + 2.4cqw);width:46%;display:flex;justify-content:space-between;gap:.5rem;font:500 clamp(.55rem,1.45cqw,.72rem)/1.2 var(--mono);color:var(--mist)}
.art-meta b{font-weight:500;color:var(--pearl);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.copy-card,.judge-card{position:absolute;right:4.5%;width:44%;padding:2.2cqw 2.4cqw;border-radius:14px;background:rgba(12,20,25,.78);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:inset 0 0 0 1px var(--line-strong),0 24px 60px -30px rgba(0,0,0,.9);font-size:clamp(.6rem,1.6cqw,.8rem);line-height:1.4}
.copy-card{top:7%}
.judge-card{top:53%}
.copy-card .k,.judge-card .k{display:flex;justify-content:space-between;font:500 clamp(.5rem,1.25cqw,.64rem)/1.2 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mist);margin-bottom:1.2cqw}
.copy-title{font-weight:500;color:var(--pearl);margin-bottom:1.3cqw}
.tags{display:flex;flex-wrap:wrap;gap:.6cqw}
.tags span{font:500 clamp(.5rem,1.3cqw,.68rem)/1 var(--mono);padding:.55em .7em;border-radius:99px;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px var(--line);color:var(--mist);white-space:nowrap}
.price{display:flex;justify-content:space-between;margin-top:1.3cqw;padding-top:1.1cqw;border-top:1px solid var(--line);font-family:var(--mono);color:var(--mist)}
.price b{color:var(--pearl);font-weight:500}
.jrow{display:flex;justify-content:space-between;gap:.6rem;padding:.55cqw 0;border-top:1px solid var(--line)}
.jrow:first-of-type{border-top:0}
.jrow span:last-child{font-family:var(--mono);text-align:right}
.verdict{margin-top:1cqw;display:flex;align-items:center;gap:.6em;font:600 clamp(.58rem,1.5cqw,.78rem)/1 var(--mono);color:var(--tide);padding:.8em .9em;border-radius:10px;background:rgba(69,198,180,.1);box-shadow:inset 0 0 0 1px rgba(69,198,180,.3)}
.dest{position:absolute;left:4.5%;right:4.5%;bottom:5%;display:flex;gap:1.4cqw}
.dchip{flex:1;display:flex;align-items:center;justify-content:center;gap:.6em;padding:1.5cqw 1cqw;border-radius:12px;font:500 clamp(.55rem,1.45cqw,.76rem)/1.1 var(--mono);text-align:center;
  color:var(--pearl);opacity:.3;background:rgba(69,198,180,.04);box-shadow:inset 0 0 0 1px rgba(69,198,180,.12);transition:opacity .35s,background .35s,box-shadow .35s}
.dchip.lit{opacity:1;background:rgba(69,198,180,.14);box-shadow:inset 0 0 0 1px rgba(69,198,180,.45),0 0 24px -8px rgba(69,198,180,.6)}
.dchip svg{width:1.2em;height:1.2em;color:var(--tide);flex:none}

@media (max-width:900px){
  .pipe-grid{grid-template-columns:minmax(0,1fr);gap:14px}
  .pipe-pin{padding-block:84px 16px;align-items:flex-start}
  .js-pinned .pipe-steps li{display:none}
  .js-pinned .pipe-steps li.active{display:block}
  .js-pinned .pipe-steps::before,.js-pinned .pipe-rail{display:none}
  .js-pinned .pipe-dots{display:flex}
  .stage-canvas{aspect-ratio:auto;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);grid-template-areas:"slot dest" "meta meta" "copy copy" "judge judge";gap:8px;padding:10px;align-items:start}
  .slot{position:relative;inset:auto;left:auto;top:auto;width:auto;grid-area:slot}
  .art-meta{position:static;grid-area:meta;width:auto;font-size:.66rem}
  .dest{position:static;grid-area:dest;flex-direction:column;gap:8px}
  .dchip{padding:10px 8px;font-size:.68rem;flex:none}
  .copy-card,.judge-card{position:relative;inset:auto;right:auto;top:auto;width:auto;padding:12px 13px;font-size:.76rem}
  .copy-card{grid-area:copy}
  .judge-card{grid-area:judge}
  .copy-card .k,.judge-card .k{font-size:.6rem;margin-bottom:8px}
  .copy-title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:8px}
  .tags{gap:4px}
  .tags span{font-size:.62rem}
  .tags span:nth-child(n+4){display:none}
  .price{display:none}
  .jrow{padding:4px 0}
  .verdict{font-size:.7rem;margin-top:6px}
  .hash-chip{font-size:.58rem}
}
.pipe-dots{display:none;gap:6px;margin-bottom:12px}
.pipe-dots i{flex:1;height:3px;border-radius:3px;background:var(--line-strong);transition:background .3s}
.pipe-dots i.on{background:linear-gradient(90deg,var(--tide),var(--brass))}

/* ---------- capabilities bento ---------- */
.bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:18px}
.cap{grid-column:span 6;padding:clamp(22px,2.6vw,32px);border-radius:24px;display:flex;flex-direction:column;gap:20px;min-width:0}
.cap:nth-child(1){grid-column:span 7}.cap:nth-child(2){grid-column:span 5}
.cap:nth-child(3){grid-column:span 5}.cap:nth-child(4){grid-column:span 7}
.cap h3{font-size:clamp(1.45rem,1.15rem + .9vw,1.9rem);font-stretch:84%;font-weight:640;letter-spacing:-.025em;line-height:1.05;margin-bottom:.6rem}
.cap p{color:var(--mist);font-size:.97rem;line-height:1.6;max-width:52ch;text-wrap:pretty}
.cap-viz{margin-top:auto;border-radius:16px;min-height:170px;position:relative;overflow:hidden;background:rgba(3,6,8,.45);box-shadow:inset 0 0 0 1px var(--line)}
@media (max-width:980px){.cap,.cap:nth-child(n){grid-column:span 12}}

.flow{display:flex;align-items:center;gap:12px;padding:18px 18px 0}
.node{flex:none;font:600 .78rem/1 var(--mono);padding:.7rem .9rem;border-radius:12px;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px var(--line-strong)}
.node small{display:block;font-weight:400;color:var(--mist);margin-top:.35rem;font-size:.66rem}
.wire{flex:1;height:2px;min-width:30px;border-radius:2px;background:repeating-linear-gradient(90deg,var(--tide) 0 8px,transparent 8px 16px);background-size:32px 2px;animation:wire 1.2s linear infinite;opacity:.8}
@keyframes wire{to{background-position:32px 0}}
.code{margin:14px 18px 18px;font:400 .76rem/1.65 var(--mono);color:var(--mist);white-space:pre;overflow-x:auto;padding:12px 14px;border-radius:10px;background:rgba(0,0,0,.35)}
.code .s{color:var(--brass-hi)}.code .n{color:var(--tide)}.code .p{color:var(--pearl)}

.hub{display:block;width:100%;height:auto}
.hub .ln{stroke:var(--line-strong);stroke-width:1.2;fill:none}
.hub .pulse{stroke:var(--brass);stroke-width:2;fill:none;stroke-dasharray:6 120;animation:dash 2.4s linear infinite}
.hub .pulse.t{stroke:var(--tide);animation-duration:3.1s}
@keyframes dash{to{stroke-dashoffset:-126}}
.hub rect{fill:rgba(255,255,255,.06);stroke:var(--line-strong)}
.hub .core{fill:rgba(226,184,107,.14);stroke:rgba(226,184,107,.55)}
.hub text{fill:var(--pearl);font:600 12px var(--body);text-anchor:middle;dominant-baseline:middle}
.hub .sub{fill:var(--mist);font:500 8px var(--mono)}

.compare{position:relative;aspect-ratio:16/9;min-height:0;--pos:62%;user-select:none;-webkit-user-select:none}
.compare .layer{position:absolute;inset:0}
.compare .layer img{position:absolute;left:50%;top:50%;height:100%;width:auto;max-width:none;translate:-50% -50%}
.compare .top{clip-path:inset(0 calc(100% - var(--pos)) 0 0);background:#fff}
.compare .bottom{background-color:#e9e6e1;background-image:linear-gradient(45deg,#cfcac3 25%,transparent 25%),linear-gradient(-45deg,#cfcac3 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#cfcac3 75%),linear-gradient(-45deg,transparent 75%,#cfcac3 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0}
.compare .handle{position:absolute;top:0;bottom:0;left:var(--pos);width:2px;translate:-1px 0;background:var(--pearl);box-shadow:0 0 12px rgba(0,0,0,.4);pointer-events:none}
.compare .handle::after{content:"";position:absolute;top:50%;left:50%;width:34px;height:34px;translate:-50% -50%;border-radius:50%;background:var(--pearl) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2305080b' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='M9 6l-6 6 6 6M15 6l6 6-6 6'/></svg>") center/18px no-repeat;box-shadow:0 6px 18px rgba(0,0,0,.4)}
.compare input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}
.compare .tag{position:absolute;top:10px;font:500 .66rem/1 var(--mono);letter-spacing:.06em;padding:.5em .7em;border-radius:99px;background:rgba(5,8,11,.72);color:var(--pearl);pointer-events:none}
.compare .tag.l{left:10px}.compare .tag.r{right:10px}

.cal{padding:16px}
.topics{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.topics button{all:unset;cursor:pointer;font:500 .7rem/1 var(--mono);padding:.5rem .7rem;border-radius:99px;color:var(--mist);background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px var(--line);transition:all .25s}
.topics button[aria-pressed="true"]{color:var(--ink-on-brass);background:var(--c);box-shadow:0 0 18px -4px var(--c)}
.topics button:focus-visible{outline:2px solid var(--brass);outline-offset:2px}
.days{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:4px}
.day{position:relative;border-radius:6px;aspect-ratio:1/1.05;padding:3px;background:rgba(255,255,255,.035);box-shadow:inset 0 0 0 1px var(--line);display:flex;flex-direction:column;gap:2px;transition:background .25s,box-shadow .25s}
.day b{font:500 .52rem/1 var(--mono);color:var(--mist);opacity:.8}
.day i{display:block;height:3px;border-radius:2px;background:var(--c);transition:opacity .25s,box-shadow .25s}
.cal.hl .day i{opacity:.16}
.cal.hl .day i.hit{opacity:1;box-shadow:0 0 8px var(--c)}
.cal.hl .day.hit{background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px var(--line-strong)}
.cap .cal-note{margin-top:10px;font:400 .68rem/1.45 var(--mono);color:var(--mist);max-width:none}
@media (max-width:420px){.days{grid-template-columns:repeat(6,minmax(0,1fr))}}

.term{padding:14px 16px 16px;font:400 .78rem/1.7 var(--mono);color:var(--mist);min-height:190px}
.term-bar{display:flex;gap:6px;margin-bottom:10px}
.term-bar i{width:9px;height:9px;border-radius:50%;background:#2b353c}
.term .cmd{color:var(--pearl)}
.term .cmd::before{content:"$ ";color:var(--tide)}
.term .out{color:var(--tide)}
.term .caret{display:inline-block;width:.55em;height:1.05em;vertical-align:-.15em;background:var(--brass);animation:blink 1s steps(2) infinite}
@keyframes blink{50%{opacity:0}}
.term-lines{white-space:pre-wrap;overflow-wrap:anywhere}

.svc{list-style:none;margin:0;padding:6px 16px}
.svc li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;padding:11px 0;border-top:1px solid var(--line);font-size:.88rem}
.svc li:first-child{border-top:0}
.svc b{font-weight:500}
.svc span{color:var(--mist);font-size:.8rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.svc em{font:500 .66rem/1 var(--mono);font-style:normal;color:var(--tide);letter-spacing:.06em;text-transform:uppercase}

/* ---------- field notes ---------- */
.notes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.note{padding:26px 24px 24px;display:flex;flex-direction:column;gap:12px;min-width:0;transition:transform .4s var(--ease),box-shadow .4s}
.note:hover{transform:translateY(-4px);box-shadow:inset 0 0 0 1px var(--line-strong)}
.note-top{display:flex;justify-content:space-between;align-items:center;gap:.6rem;font:500 .68rem/1 var(--mono);letter-spacing:.1em;text-transform:uppercase}
.note-top .p{color:var(--brass)}
.note-top .fx{color:var(--tide);display:inline-flex;align-items:center;gap:.4rem}
.note h3{font-size:1.32rem;font-stretch:86%;font-weight:620;letter-spacing:-.02em;line-height:1.15}
.note p{color:var(--mist);font-size:.94rem;line-height:1.6;text-wrap:pretty}
@media (max-width:1000px){.notes{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.notes{grid-template-columns:minmax(0,1fr)}}

/* ---------- approach ---------- */
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(20px,3vw,36px);list-style:none;margin:0;padding:0;position:relative}
.steps::before{content:"";position:absolute;left:0;right:0;top:27px;height:1px;background:linear-gradient(90deg,var(--tide),var(--brass),var(--ember),transparent)}
.steps li{position:relative;min-width:0;display:flex;flex-direction:column}
.steps li .eg{margin-top:auto}
.steps li p:not(.eg){margin-bottom:16px}
.steps .num{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;font:500 .85rem/1 var(--mono);color:var(--brass-hi);background:var(--night);box-shadow:inset 0 0 0 1px rgba(226,184,107,.5),0 0 0 8px var(--night);margin-bottom:26px}
.steps h3{font-size:1.45rem;font-stretch:86%;font-weight:640;letter-spacing:-.02em;margin-bottom:.65rem;line-height:1.1}
.steps p{color:var(--mist);font-size:.96rem;line-height:1.62;text-wrap:pretty}
.steps .eg{font:400 .74rem/1.55 var(--mono);color:var(--pearl);padding:12px 14px;border-radius:12px;background:rgba(255,255,255,.035);box-shadow:inset 0 0 0 1px var(--line)}
.steps .eg b{color:var(--brass);font-weight:500}
@media (max-width:980px){
  .steps{grid-template-columns:minmax(0,1fr);gap:34px;padding-left:76px}
  .steps::before{left:27px;right:auto;top:0;bottom:0;width:1px;height:auto;background:linear-gradient(var(--tide),var(--brass),var(--ember),transparent)}
  .steps .num{position:absolute;left:-76px;top:-6px;margin:0}
}

/* ---------- stack marquee ---------- */
.marquee-wrap{padding-block:clamp(56px,7vw,96px);border-block:1px solid var(--line);position:relative}
.marquee-label{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:28px;flex-wrap:wrap}
.marquee-label h2{font-size:clamp(1.6rem,1.2rem + 1.4vw,2.4rem);font-stretch:84%;letter-spacing:-.03em}
.marquee{overflow:hidden;-webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee+.marquee{margin-top:14px}
.marquee-track{display:flex;gap:14px;width:max-content;animation:mq 46s linear infinite}
.marquee.rev .marquee-track{animation-direction:reverse;animation-duration:54s}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee-track span{display:inline-flex;align-items:center;gap:.7rem;padding:.85rem 1.2rem;border-radius:14px;background:rgba(255,255,255,.035);box-shadow:inset 0 0 0 1px var(--line);font-family:var(--display);font-stretch:88%;font-weight:560;font-size:1.12rem;letter-spacing:-.01em;white-space:nowrap}
.marquee-track span small{font:500 .62rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mist)}
@keyframes mq{to{transform:translateX(calc(-50% - 7px))}}

/* ---------- contact ---------- */
.contact-panel{padding:clamp(32px,6vw,80px);border-radius:32px;overflow:hidden}
.contact-panel .glow{position:absolute;inset:auto -10% -60% 30%;height:120%;z-index:-1;pointer-events:none;filter:blur(60px);opacity:.55;
  background:radial-gradient(closest-side,rgba(255,138,92,.45),rgba(226,184,107,.25) 45%,rgba(69,198,180,.12) 70%,transparent)}
.contact-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(28px,5vw,72px);align-items:end}
.contact-panel h2{font-size:clamp(2.6rem,1.4rem + 4.2vw,5.4rem);line-height:.94;font-stretch:84%;font-weight:640;letter-spacing:-.022em;margin-bottom:1.4rem}
.contact-panel .lede{color:var(--pearl);opacity:.82}
.mailbox{display:flex;flex-direction:column;gap:14px}
.mail-label{font:500 .7rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--mist)}
.mail-addr{font-family:var(--display);font-stretch:82%;font-weight:600;font-size:clamp(1.35rem,1rem + 1.5vw,2.1rem);letter-spacing:-.02em;user-select:all;-webkit-user-select:all;overflow-wrap:anywhere;line-height:1.1}
.mail-actions{display:flex;flex-wrap:wrap;gap:.7rem}
.mail-status{font:400 .74rem/1.4 var(--mono);color:var(--tide);min-height:1.4em}
.engage{margin-top:clamp(36px,4vw,56px);padding-top:24px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.engage span{font:500 .74rem/1 var(--mono);padding:.6rem .8rem;border-radius:999px;background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px var(--line);color:var(--pearl)}
.engage span.k{background:none;box-shadow:none;color:var(--brass);letter-spacing:.14em;text-transform:uppercase;font-size:.66rem;padding-left:0}
@media (max-width:900px){.contact-grid{grid-template-columns:minmax(0,1fr)}}

/* ---------- footer ---------- */
.footer{padding-block:56px calc(env(safe-area-inset-bottom,0px) + 40px);color:var(--mist);font-size:.9rem}
.footer-grid{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(2,minmax(0,1fr));gap:32px;align-items:start}
.footer h4{font:500 .68rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--pearl);margin-bottom:14px}
.footer ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.footer a{text-decoration:none;color:var(--mist);transition:color .2s}
.footer a:hover{color:var(--pearl)}
.footer .brand{margin-bottom:14px}
.footer-base{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:44px;padding-top:22px;border-top:1px solid var(--line);font:400 .74rem/1.4 var(--mono)}
@media (max-width:720px){.footer-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.footer-grid>div:first-child{grid-column:1/-1}}

/* ---------- motion helpers ---------- */
.js .pre{opacity:0;transform:translateY(28px)}
.js .reveal-in{opacity:1;transform:none;transition:opacity 1s var(--ease),transform 1s var(--ease)}
.intro .nav-inner,.intro [data-intro],.intro .hero-title .line>span,.intro .frame,.intro .proof{opacity:0}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .wall-track,.marquee-track{animation:none!important}
}

[id]{scroll-margin-top:96px}
@media (max-width:900px) and (max-height:740px){.js-pinned .pipe-steps li.active .step-d{display:none}.pipe-pin{padding-top:76px}}