/* ============================================================
   Project Weve homepage
   Brand tokens, cinematic dark + cream content rhythm.
   ============================================================ */
:root{
  --paper:#F1EADC;
  --surface:#FBF6EE;
  --ink:#191B1F;
  --walnut:#6E5E48;
  --ink-blue:#1F4A5C;   /* primary */
  --teal:#2E83A6;       /* secondary */
  --rust:#C2613B;
  --gold:#D9A24A;       /* spark only */
  --dark:#0e1418;
  --dark-2:#163243;
  --line:rgba(25,27,31,.12);
  --line-d:rgba(241,234,220,.14);
  --maxw:1200px;
  --ease:cubic-bezier(.16,.84,.34,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:'Inter',system-ui,sans-serif;
  background:var(--paper);
  color:var(--ink);
  line-height:1.55;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-family:'Space Grotesk',system-ui,sans-serif;font-weight:600;line-height:1.04;letter-spacing:-.02em}
.mono{font-family:'IBM Plex Mono',ui-monospace,monospace}
a{color:inherit;text-decoration:none}
.italic{font-style:italic}
.teal{color:var(--teal)}
.gold{color:var(--gold)}
.rust{color:var(--rust)}
section{position:relative}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px;position:relative;z-index:2}

/* ---------- kickers ---------- */
.kicker{
  font-family:'IBM Plex Mono',monospace;font-size:12.5px;font-weight:500;
  letter-spacing:.22em;text-transform:uppercase;color:var(--teal);
  display:inline-flex;align-items:center;gap:9px;margin-bottom:22px;
}
.kicker.on-dark{color:#7bc4e0}
.kicker::before{content:"";width:22px;height:1px;background:currentColor;opacity:.6}


/* ============================================================
   NAV
   ============================================================ */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 32px;
  transition:background .4s var(--ease),border-color .4s var(--ease),padding .35s var(--ease);
  border-bottom:1px solid transparent;
}
.nav.scrolled{
  background:rgba(251,246,238,.82);backdrop-filter:blur(14px) saturate(1.2);
  border-bottom:1px solid var(--line);padding:11px 32px;
}
.nav.on-dark{color:var(--paper)}
.nav.on-dark.scrolled{background:rgba(14,20,24,.86);border-bottom:1px solid var(--line-d)}
.nav-left{display:flex;align-items:center;gap:18px}
.wordmark{font-family:'Inter',sans-serif;font-weight:700;font-size:22px;letter-spacing:-.03em;color:inherit;display:inline-flex;align-items:baseline}
.wordmark .dot{color:var(--gold)}
.led{
  font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.12em;
  text-transform:uppercase;display:inline-flex;align-items:center;gap:7px;
  color:var(--walnut);opacity:.92;
}
.nav.on-dark .led{color:rgba(241,234,220,.72)}
.led-dot{width:7px;height:7px;border-radius:50%;background:var(--rust);position:relative}
.led-dot::after{content:"";position:absolute;inset:-4px;border-radius:50%;background:var(--rust);opacity:.45;animation:ping 1.9s var(--ease) infinite}
@keyframes ping{0%{transform:scale(.6);opacity:.55}70%,100%{transform:scale(2.4);opacity:0}}
.nav-links{display:flex;align-items:center;gap:30px}
.nav-links a{font-size:14.5px;font-weight:500;opacity:.82;transition:opacity .2s}
.nav-links a:hover{opacity:1}
.nav-links a.cta{
  background:var(--ink-blue);color:var(--paper);padding:9px 18px;border-radius:999px;
  opacity:1;font-weight:600;transition:transform .2s var(--ease),background .2s;
}
.nav-links a.cta:hover{transform:translateY(-1px);background:var(--teal)}
.nav.on-dark .nav-links a.cta{background:var(--gold);color:var(--ink)}
.nav.on-dark .nav-links a.cta:hover{background:#e8b663}
.nav-toggle{display:none;background:none;border:0;color:inherit;cursor:pointer;font-size:24px;line-height:1}

/* ============================================================
   HERO  - the reel
   ============================================================ */
.hero{
  min-height:100vh;min-height:100svh;
  background:var(--dark);color:var(--paper);
  display:flex;align-items:center;
  overflow:hidden;padding:120px 0 70px;
}
/* gradient mesh - 3 slow drifting radial blobs (transform-only animation) */
.mesh{position:absolute;inset:-25%;z-index:0;pointer-events:none}
.blob{position:absolute;border-radius:50%;filter:blur(60px);opacity:.62;will-change:transform}
.blob.b1{width:62vw;height:62vw;left:-8%;top:-12%;
  background:radial-gradient(circle at 35% 35%,var(--teal),transparent 62%);
  animation:drift1 26s ease-in-out infinite alternate}
.blob.b2{width:54vw;height:54vw;right:-12%;top:8%;
  background:radial-gradient(circle at 60% 40%,var(--ink-blue),transparent 60%);
  animation:drift2 32s ease-in-out infinite alternate}
.blob.b3{width:50vw;height:50vw;left:18%;bottom:-18%;
  background:radial-gradient(circle at 50% 50%,var(--dark-2),transparent 64%);
  opacity:.85;animation:drift3 38s ease-in-out infinite alternate}
@keyframes drift1{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(7%,5%,0) scale(1.12)}}
@keyframes drift2{from{transform:translate3d(0,0,0) scale(1.05)}to{transform:translate3d(-6%,7%,0) scale(.95)}}
@keyframes drift3{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(5%,-6%,0) scale(1.15)}}
.hero::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    radial-gradient(120% 80% at 50% 0%,transparent 55%,rgba(14,20,24,.55) 100%),
    linear-gradient(180deg,rgba(14,20,24,.25),transparent 30%,rgba(14,20,24,.45));
}
/* film grain / vignette accent line */
.hero-grid{position:relative;z-index:3}

/* ----- the reel overlay (plays first, then settles) ----- */
.reel{
  position:absolute;inset:0;z-index:6;display:flex;align-items:center;justify-content:center;
  text-align:center;pointer-events:none;
}
.reel.done{opacity:0;visibility:hidden;transition:opacity .8s var(--ease),visibility .8s}
.reel-scene{
  position:absolute;opacity:0;
  font-family:'Space Grotesk',sans-serif;font-weight:600;letter-spacing:-.03em;
  color:var(--paper);font-size:clamp(40px,9vw,120px);line-height:.98;
}
.reel-scene .clip{display:inline-block;overflow:hidden;padding-bottom:.08em}
.reel-scene .clip > span{display:inline-block;transform:translateY(110%)}
.reel-scene.in .clip > span{
  transform:translateY(0);
  transition:transform .85s var(--ease);
}
.reel-scene.in{opacity:1;animation:sceneScale 2.5s var(--ease) forwards}
@keyframes sceneScale{0%{transform:scale(.97)}100%{transform:scale(1.02)}}
.reel-scene.out{opacity:0;transform:scale(1.08);transition:opacity .5s ease,transform .6s var(--ease)}
.reel-scene.resolve{font-size:clamp(48px,11vw,148px)}
.reel-scene.resolve .grad{
  background:linear-gradient(100deg,#7bc4e0,var(--gold) 60%,#7bc4e0);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.reel-dots{position:absolute;bottom:9vh;left:50%;transform:translateX(-50%);display:flex;gap:11px;z-index:7}
.reel-dots .d{width:8px;height:8px;border-radius:50%;background:rgba(241,234,220,.28);transition:all .4s var(--ease)}
.reel-dots .d.on{background:var(--gold);width:26px;border-radius:5px;box-shadow:0 0 14px rgba(217,162,74,.6)}

/* ----- resolved persistent hero ----- */
.hero-content{
  position:relative;z-index:3;max-width:920px;
  opacity:0;transform:translateY(18px);
}
.hero-content.show{opacity:1;transform:none;transition:opacity 1s var(--ease),transform 1s var(--ease)}
.hero-eyebrow{
  font-family:'IBM Plex Mono',monospace;font-size:13px;letter-spacing:.22em;
  text-transform:uppercase;color:#7bc4e0;margin-bottom:22px;display:inline-flex;align-items:center;gap:10px;
}
.hero-eyebrow::before{content:"";width:24px;height:1px;background:currentColor;opacity:.6}
.hero h1{font-size:clamp(40px,6.6vw,84px);font-weight:600;letter-spacing:-.035em;margin-bottom:26px}
.hero h1 .l2{display:block;color:var(--teal);font-style:italic;color:#5fb3d4}
.hero-sub{font-size:clamp(16px,1.45vw,19px);line-height:1.62;color:rgba(241,234,220,.82);max-width:640px;margin-bottom:34px}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.btn{
  font-family:'Inter',sans-serif;font-weight:600;font-size:15px;
  padding:14px 26px;border-radius:999px;cursor:pointer;border:1px solid transparent;
  transition:transform .2s var(--ease),background .2s,box-shadow .25s;display:inline-flex;align-items:center;gap:9px;
}
.btn-primary{background:var(--gold);color:var(--ink);box-shadow:0 8px 30px -8px rgba(217,162,74,.5)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 14px 38px -8px rgba(217,162,74,.6)}
.btn-ghost{background:transparent;color:var(--paper);border-color:rgba(241,234,220,.32)}
.btn-ghost:hover{transform:translateY(-2px);border-color:var(--paper);background:rgba(241,234,220,.06)}
.scroll-hint{
  position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:5;
  font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(241,234,220,.5);display:flex;flex-direction:column;align-items:center;gap:8px;
  opacity:0;transition:opacity .8s .4s var(--ease);
}
.hero-content.show ~ .scroll-hint{opacity:1}
.scroll-hint .bar{width:1px;height:34px;background:linear-gradient(rgba(241,234,220,.5),transparent);animation:scrollPulse 2s ease-in-out infinite}
@keyframes scrollPulse{0%,100%{transform:scaleY(1);opacity:.5}50%{transform:scaleY(.55);opacity:1}}

/* ============================================================
   WHAT WE DO  (cinematic dark)
   ============================================================ */
.whatwedo{background:var(--dark);color:var(--paper);padding:120px 0;overflow:hidden}
.whatwedo .mesh{opacity:.8}
.whatwedo .blob{filter:blur(70px);opacity:.4}
.whatwedo h2{font-size:clamp(34px,5.2vw,68px);max-width:14ch;margin-bottom:30px}
.whatwedo h2 .l2{display:block;color:var(--gold);font-style:italic}
.wwd-mono{
  font-family:'IBM Plex Mono',monospace;font-size:14px;letter-spacing:.04em;
  color:rgba(241,234,220,.7);display:inline-flex;align-items:center;gap:10px;
  border:1px solid var(--line-d);border-radius:999px;padding:10px 18px;
}
.wwd-mono .live{color:var(--teal);font-size:9px}

/* ============================================================
   THE MODEL  (cream)
   ============================================================ */
.model{background:var(--surface);padding:120px 0;border-top:1px solid var(--line)}
.model-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.model h2{font-size:clamp(30px,4vw,52px);margin-bottom:0}
.model-body{font-size:18px;line-height:1.7;color:var(--walnut)}
.model-body strong{color:var(--ink);font-weight:600}
/* layered build stack illustration */
.stack{position:relative;height:320px;display:flex;flex-direction:column;justify-content:center;gap:14px}
.stack-row{
  border:1px solid var(--line);border-radius:14px;background:var(--paper);
  padding:16px 20px;display:flex;align-items:center;gap:14px;
  box-shadow:0 1px 0 rgba(25,27,31,.04);transform-origin:left center;
  opacity:0;transform:translateX(-16px);
}
.stack.in .stack-row{opacity:1;transform:none;transition:opacity .6s var(--ease),transform .6s var(--ease)}
.stack.in .stack-row:nth-child(1){transition-delay:.05s}
.stack.in .stack-row:nth-child(2){transition-delay:.18s}
.stack.in .stack-row:nth-child(3){transition-delay:.31s}
.stack.in .stack-row:nth-child(4){transition-delay:.44s}
.stack-ic{width:34px;height:34px;border-radius:9px;flex:none;display:grid;place-items:center;background:var(--ink-blue);color:var(--paper);font-family:'IBM Plex Mono',monospace;font-size:12px;font-weight:600}
.stack-row:nth-child(2) .stack-ic{background:var(--teal)}
.stack-row:nth-child(3) .stack-ic{background:var(--rust)}
.stack-row:nth-child(4) .stack-ic{background:var(--gold);color:var(--ink)}
.stack-t{font-weight:600;font-size:15px}
.stack-d{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--walnut);letter-spacing:.03em}
.stack-row.cap{background:var(--ink-blue);color:var(--paper);border-color:var(--ink-blue)}
.stack-row.cap .stack-d{color:rgba(241,234,220,.7)}
.stack-row.cap .stack-ic{background:var(--gold);color:var(--ink)}

/* ============================================================
   DEMOS  - the auto-advancing centerpiece carousel (dark)
   ============================================================ */
.demos{background:var(--dark);color:var(--paper);padding:120px 0 130px;overflow:hidden}
.demos .mesh{opacity:.7}
.demos .blob{filter:blur(80px);opacity:.34}
.demos-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:46px;flex-wrap:wrap}
.demos-head h2{font-size:clamp(32px,4.6vw,60px)}
.demos-lead{max-width:430px;font-size:16px;line-height:1.65;color:rgba(241,234,220,.74)}
.stage{position:relative;border:1px solid var(--line-d);border-radius:22px;overflow:hidden;
  background:linear-gradient(160deg,rgba(22,50,67,.55),rgba(14,20,24,.6));
  box-shadow:0 40px 90px -40px rgba(0,0,0,.7)}
.stage-viewport{position:relative;height:520px}
.scene{
  position:absolute;inset:0;display:grid;grid-template-columns:1.05fr 1fr;gap:0;
  opacity:0;visibility:hidden;transform:scale(1.02);
  transition:opacity .7s var(--ease),transform .9s var(--ease),visibility .7s;
}
.scene.active{opacity:1;visibility:visible;transform:scale(1)}
.scene-info{padding:54px 50px;display:flex;flex-direction:column;justify-content:center;gap:18px;border-right:1px solid var(--line-d)}
.scene-tag{align-self:flex-start;font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  padding:6px 13px;border-radius:999px;border:1px solid;display:inline-flex;align-items:center;gap:7px}
.tag-live{color:var(--gold);border-color:rgba(217,162,74,.45);background:rgba(217,162,74,.08)}
.tag-ship{color:#7bc4e0;border-color:rgba(123,196,224,.4);background:rgba(46,131,166,.1)}
.tag-ext{color:#9fd6a0;border-color:rgba(120,190,130,.4);background:rgba(120,190,130,.08)}
.tag-house{color:var(--paper);border-color:rgba(241,234,220,.4);background:rgba(241,234,220,.06)}
.scene-tag .blip{width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 8px currentColor}
.scene-info h3{font-size:clamp(28px,3.4vw,44px);font-weight:600}
.scene-desc{font-size:16.5px;line-height:1.6;color:rgba(241,234,220,.82);max-width:34ch}
.scene-ledger{font-family:'IBM Plex Mono',monospace;font-size:12.5px;letter-spacing:.04em;color:rgba(241,234,220,.6);
  border-top:1px solid var(--line-d);padding-top:16px;margin-top:6px}
.scene-mock{position:relative;padding:38px;display:flex;align-items:center;justify-content:center;background:
  radial-gradient(120% 100% at 70% 20%,rgba(46,131,166,.14),transparent 60%)}

/* --- mock UI: email inbox + draft --- */
.mk{width:100%;max-width:380px;border-radius:14px;border:1px solid var(--line-d);overflow:hidden;
  background:rgba(14,20,24,.72);box-shadow:0 20px 50px -20px rgba(0,0,0,.6);font-size:12px}
.mk-bar{display:flex;align-items:center;gap:6px;padding:10px 12px;border-bottom:1px solid var(--line-d);background:rgba(241,234,220,.04)}
.mk-bar .dot{width:9px;height:9px;border-radius:50%}
.mk-bar .r{background:#e06a52}.mk-bar .y{background:var(--gold)}.mk-bar .g{background:#6fbf8a}
.mk-bar .lbl{margin-left:8px;font-family:'IBM Plex Mono',monospace;font-size:10px;color:rgba(241,234,220,.55);letter-spacing:.06em}
.mk-body{padding:14px}
.mail-from{display:flex;justify-content:space-between;font-family:'IBM Plex Mono',monospace;font-size:10.5px;color:rgba(241,234,220,.55);margin-bottom:6px}
.mail-subj{font-weight:600;font-size:13px;color:var(--paper);margin-bottom:8px}
.mail-line{height:7px;border-radius:4px;background:rgba(241,234,220,.13);margin-bottom:7px}
.mail-line.s{width:70%}.mail-line.m{width:90%}
.draft{margin-top:14px;border:1px solid rgba(217,162,74,.4);border-radius:10px;padding:12px;background:rgba(217,162,74,.06)}
.draft-h{font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);margin-bottom:8px;display:flex;align-items:center;gap:6px}
.draft .l{height:6px;border-radius:3px;background:rgba(241,234,220,.22);margin-bottom:6px;animation:typeIn 2.4s var(--ease) infinite}
.draft .l:nth-child(2){width:96%;animation-delay:0s}
.draft .l:nth-child(3){width:88%;animation-delay:.25s}
.draft .l:nth-child(4){width:62%;animation-delay:.5s}
@keyframes typeIn{0%,100%{opacity:.35}50%{opacity:.85}}
.draft-foot{margin-top:10px;display:flex;align-items:center;gap:8px;font-family:'IBM Plex Mono',monospace;font-size:9.5px;color:rgba(241,234,220,.55)}
.draft-foot .wait{padding:3px 8px;border-radius:999px;border:1px solid rgba(241,234,220,.2);color:#7bc4e0}

/* --- mock flow graph --- */
.flow{position:relative;width:100%;max-width:300px;margin:0 auto;display:flex;flex-direction:column;gap:14px;align-items:center}
.flow::before{content:"";position:absolute;left:30px;top:28px;bottom:28px;width:2px;z-index:0;background:linear-gradient(var(--teal),rgba(46,131,166,.32))}
.flow::after{content:"";position:absolute;left:29px;top:26px;width:4px;height:26px;border-radius:2px;z-index:0;background:var(--gold);filter:blur(.4px);animation:flowSpine 3s linear infinite}
@keyframes flowSpine{0%{transform:translateY(0);opacity:0}12%{opacity:1}82%{opacity:.9}100%{transform:translateY(188px);opacity:0}}
.fnode{width:100%;max-width:300px;border-radius:11px;border:1px solid var(--line-d);background:rgba(12,18,24,.95);
  padding:13px 16px;display:flex;align-items:center;gap:12px;position:relative;z-index:2}
.fnode .fic{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;flex:none;font-family:'IBM Plex Mono',monospace;font-size:13px;font-weight:600}
.fnode .ft{font-size:13px;font-weight:600;color:var(--paper)}
.fnode .fd{font-family:'IBM Plex Mono',monospace;font-size:9.5px;color:rgba(241,234,220,.5)}
.fnode .ftm{margin-left:auto;font-family:'IBM Plex Mono',monospace;font-size:10px;color:rgba(241,234,220,.4);flex:none;padding-left:8px}
.fnode .ftm.ok{color:var(--gold)}
.fnode.trig .fic{background:var(--teal);color:#fff}
.fnode.step .fic{background:rgba(241,234,220,.12);color:var(--paper)}
.fnode.out .fic{background:var(--gold);color:var(--ink)}
.fnode.out{border-color:rgba(217,162,74,.4);background:rgba(217,162,74,.06)}
.fedge{display:none}
.fedge::after{content:"";position:absolute;left:-1px;top:-40%;width:4px;height:40%;background:var(--gold);border-radius:2px;
  filter:blur(1px);animation:flowPulse 2.4s linear infinite}
@keyframes flowPulse{0%{top:-40%}100%{top:120%}}

/* --- mock site thumbnail --- */
.site{width:100%;max-width:360px;border-radius:12px;overflow:hidden;border:1px solid var(--line-d);
  box-shadow:0 24px 50px -22px rgba(0,0,0,.65);background:var(--surface)}
.site-top{height:30px;background:var(--ink-blue);display:flex;align-items:center;padding:0 12px;gap:6px}
.site-top .sd{width:7px;height:7px;border-radius:50%;background:rgba(241,234,220,.45)}
.site-hero{padding:26px 22px;background:linear-gradient(160deg,#fff,var(--surface));color:var(--ink)}
.site-hero .sh-k{font-family:'IBM Plex Mono',monospace;font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--teal);margin-bottom:8px}
.site-hero .sh-h{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:19px;line-height:1.1;color:var(--ink);margin-bottom:10px}
.site-hero .sh-l{height:6px;border-radius:3px;background:rgba(25,27,31,.12);margin-bottom:5px}
.site-hero .sh-l.s{width:60%}
.site-hero .sh-btn{margin-top:12px;display:inline-block;font-family:'IBM Plex Mono',monospace;font-size:9px;background:var(--rust);color:#fff;padding:6px 12px;border-radius:6px}
.site-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:7px;padding:0 22px 22px}
.site-grid .c{height:42px;border-radius:7px;background:rgba(25,27,31,.07)}

/* --- mock app screen (worldcup) --- */
.app{width:100%;max-width:320px;border-radius:16px;overflow:hidden;border:1px solid var(--line-d);
  background:rgba(14,20,24,.78);box-shadow:0 24px 56px -24px rgba(0,0,0,.7)}
.app-top{padding:14px 16px;border-bottom:1px solid var(--line-d);display:flex;justify-content:space-between;align-items:center}
.app-top .at{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:14px;color:var(--paper)}
.app-top .live{font-family:'IBM Plex Mono',monospace;font-size:9px;color:#9fd6a0;display:flex;align-items:center;gap:5px}
.app-top .live::before{content:"";width:6px;height:6px;border-radius:50%;background:#6fbf8a;box-shadow:0 0 8px #6fbf8a;animation:typeIn 1.6s infinite}
.match{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;border-bottom:1px solid var(--line-d)}
.match .team{display:flex;align-items:center;gap:9px;font-size:12px;color:var(--paper);font-weight:500}
.match .flag{width:22px;height:15px;border-radius:3px}
.match .score{font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:15px;color:var(--gold)}
.match .pct{font-family:'IBM Plex Mono',monospace;font-size:9px;color:rgba(241,234,220,.5);margin-top:3px}
.pred-bar{height:5px;border-radius:3px;background:rgba(241,234,220,.12);margin:0 16px 12px;overflow:hidden;position:relative}
.pred-bar i{position:absolute;left:0;top:0;bottom:0;width:64%;background:linear-gradient(90deg,var(--teal),var(--gold))}

/* ===== in-house arsenal mocks ===== */
/* shared light card (Sous / Robin / Logo Lab render as a light card on the dark stage) */
.lcard{width:100%;max-width:358px;border-radius:14px;overflow:hidden;border:1px solid rgba(25,27,31,.1);
  background:linear-gradient(165deg,#fff,var(--surface));color:var(--ink);box-shadow:0 24px 56px -24px rgba(0,0,0,.6);font-size:12px}
.lc-top{display:flex;align-items:center;gap:7px;padding:10px 14px;border-bottom:1px solid rgba(25,27,31,.08)}
.lc-k{font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--teal)}
.lc-body{padding:16px}

/* Nemova constellation */
.nmg{width:100%;max-width:382px;border-radius:14px;overflow:hidden;border:1px solid var(--line-d);
  background:radial-gradient(120% 100% at 58% 26%,rgba(46,131,166,.2),rgba(8,12,16,.94));box-shadow:0 22px 54px -22px rgba(0,0,0,.7)}
.nmg svg{display:block;width:100%;height:auto}
.nmg-foot{display:flex;align-items:center;gap:7px;padding:9px 13px;border-top:1px solid var(--line-d);
  font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.05em;color:rgba(241,234,220,.5)}
.nmg-foot .chip{padding:3px 8px;border-radius:999px;border:1px solid rgba(241,234,220,.18)}
.nmg-foot .chip.on{color:var(--ink);background:var(--gold);border-color:var(--gold)}
.nmg-head{display:flex;justify-content:space-between;align-items:baseline;padding:11px 14px 2px;gap:8px}
.nmg-head b{font-family:'Space Grotesk',system-ui,sans-serif;font-weight:600;font-size:13px;color:var(--paper);letter-spacing:-.01em}
.nmg-head span{font-family:'IBM Plex Mono',monospace;font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:rgba(241,234,220,.4)}
.nmg-stat b{color:var(--paper);font-weight:600}
.nmg-chip{margin-left:auto;padding:3px 9px;border-radius:999px;color:var(--ink);background:var(--gold);border:1px solid var(--gold);font-size:8.5px;letter-spacing:.04em}

/* Fiden cockpit */
.fdn{width:100%;max-width:382px;border-radius:14px;overflow:hidden;border:1px solid var(--line-d);
  background:rgba(10,16,22,.85);box-shadow:0 22px 54px -22px rgba(0,0,0,.7);font-size:12px}
.fdn-top{display:flex;justify-content:space-between;align-items:center;padding:11px 14px;border-bottom:1px solid var(--line-d)}
.fdn-top b{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:13px;color:var(--paper);letter-spacing:.04em}
.fdn-top span{font-family:'IBM Plex Mono',monospace;font-size:8.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal)}
.fdn-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:14px}
.fdn-kpi{border:1px solid var(--line-d);border-radius:9px;padding:10px;background:rgba(241,234,220,.03)}
.fdn-kpi .v{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:20px;color:var(--paper);line-height:1}
.fdn-kpi .l{font-family:'IBM Plex Mono',monospace;font-size:8px;letter-spacing:.08em;text-transform:uppercase;color:rgba(241,234,220,.5);margin-top:5px}
.fdn-kpi.hot{border-color:rgba(217,162,74,.5);background:rgba(217,162,74,.08)}
.fdn-kpi.hot .v{color:var(--gold)}
.fdn-packs{padding:0 14px 13px}
.fdn-packs .pl{font-family:'IBM Plex Mono',monospace;font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:rgba(241,234,220,.45);margin-bottom:8px}
.fdn-packs .row{display:flex;gap:6px;flex-wrap:wrap}
.fdn-packs .pk{font-family:'IBM Plex Mono',monospace;font-size:9px;color:rgba(241,234,220,.7);padding:4px 8px;border-radius:6px;border:1px solid var(--line-d);background:rgba(241,234,220,.03)}
.fdn-packs .pk.on{color:var(--ink);background:var(--teal);border-color:var(--teal)}
.fdn-clients{padding:0 14px 6px}
.fdn-clients .pl{font-family:'IBM Plex Mono',monospace;font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:rgba(241,234,220,.45);margin-bottom:6px}
.fdn-cl{display:flex;align-items:center;gap:8px;font-size:12px;color:rgba(241,234,220,.85);padding:5px 0}
.fdn-cl+.fdn-cl{border-top:1px solid rgba(241,234,220,.05)}
.fdn-cl .dot{width:6px;height:6px;border-radius:50%;background:rgba(241,234,220,.3);flex:none}
.fdn-cl .dot.ok{background:var(--gold);box-shadow:0 0 7px rgba(217,162,74,.6)}
.fdn-cl .st{margin-left:auto;font-family:'IBM Plex Mono',monospace;font-size:8.5px;letter-spacing:.05em;text-transform:uppercase;color:rgba(241,234,220,.4)}

/* Callit prediction-market bet card */
.clt{width:100%;max-width:330px;border-radius:14px;overflow:hidden;border:1px solid rgba(120,120,150,.22);
  background:#0a0a0f;box-shadow:0 22px 54px -22px rgba(0,0,0,.85);font-size:12px}
.clt-top{display:flex;justify-content:space-between;align-items:center;padding:11px 14px;border-bottom:1px solid rgba(120,120,150,.16)}
.clt-top b{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:13px;color:#f1eadc}
.clt-top .pts{font-family:'IBM Plex Mono',monospace;font-size:9px;color:#ffb13b}
.clt-q{padding:14px 14px 4px;font-weight:600;font-size:13.5px;color:#f1eadc;line-height:1.25}
.clt-sides{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:10px 14px}
.clt-side{border:1px solid rgba(120,120,150,.22);border-radius:9px;padding:10px;text-align:center}
.clt-side .s{font-family:'IBM Plex Mono',monospace;font-size:8.5px;color:rgba(241,234,220,.55);text-transform:uppercase;letter-spacing:.08em}
.clt-side .p{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:17px;color:#f1eadc;margin-top:5px}
.clt-side.win{border-color:rgba(56,224,139,.5);background:rgba(56,224,139,.08)}
.clt-side.win .p{color:#38e08b}
.clt-foot{display:flex;justify-content:space-between;align-items:center;padding:11px 14px;border-top:1px solid rgba(120,120,150,.16);
  font-family:'IBM Plex Mono',monospace;font-size:9px;color:rgba(241,234,220,.5)}
.clt-foot .badge{color:#38e08b;border:1px solid rgba(56,224,139,.4);border-radius:999px;padding:3px 9px}
.clt-foot .stake{color:#ffb13b}

/* Sous cook mode (light) */
.sous-steps{display:flex;flex-direction:column;gap:9px}
.sous-step{display:flex;align-items:center;gap:10px;font-size:12.5px;color:#54545a}
.sous-step .n{width:21px;height:21px;border-radius:6px;display:grid;place-items:center;flex:none;font-family:'IBM Plex Mono',monospace;font-size:10px;background:rgba(25,27,31,.08);color:var(--ink)}
.sous-step.on{color:var(--ink);font-weight:600}
.sous-step.on .n{background:var(--gold);color:var(--ink)}
.sous-timer{margin-top:14px;display:flex;align-items:center;justify-content:space-between;border:1px solid rgba(217,162,74,.5);background:rgba(217,162,74,.1);border-radius:10px;padding:9px 14px}
.sous-timer .t{font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:21px;color:var(--ink-blue)}
.sous-timer .go{font-family:'IBM Plex Mono',monospace;font-size:9px;color:var(--ink);background:var(--gold);padding:6px 10px;border-radius:6px}
.sous-ver{margin-top:13px;font-family:'IBM Plex Mono',monospace;font-size:9.5px;color:var(--walnut);display:flex;align-items:center;gap:8px}
.sous-ver .vt{color:var(--ink-blue);background:rgba(31,74,92,.08);border:1px solid rgba(31,74,92,.16);padding:3px 8px;border-radius:999px}

/* Robin call split (light) */
.rbn-call{display:flex;align-items:flex-start;gap:10px;margin-bottom:12px}
.rbn-av{width:30px;height:30px;border-radius:50%;flex:none;background:var(--gold);color:var(--ink);display:grid;place-items:center;font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:13px}
.rbn-bub{background:rgba(31,74,92,.07);border:1px solid rgba(31,74,92,.14);border-radius:12px;border-top-left-radius:3px;padding:9px 12px;font-size:12.5px;color:var(--ink)}
.rbn-bub .who{font-family:'IBM Plex Mono',monospace;font-size:8.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--teal);margin-bottom:5px}
.rbn-alert{display:flex;align-items:center;gap:10px;border:1px solid rgba(194,97,59,.35);background:rgba(194,97,59,.08);border-radius:10px;padding:10px 12px}
.rbn-alert .ic{width:24px;height:24px;border-radius:7px;background:var(--rust);color:#fff;display:grid;place-items:center;font-size:13px;font-weight:700;flex:none}
.rbn-alert .tx{font-size:11.5px;color:var(--ink);line-height:1.4}
.rbn-alert .tx b{color:var(--rust)}

/* Logo Lab (light) */
.lgl-stage{display:flex;align-items:center;justify-content:center;gap:30px;padding:6px 0 16px}
.lgl-mark{text-align:center}
.lgl-mark svg{display:block;margin:0 auto}
.lgl-cap{margin-top:8px;font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--walnut)}
.lgl-fmark{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:42px;color:var(--ink-blue);line-height:1;height:64px;display:flex;align-items:center;justify-content:center}
.lgl-fmark .dot{color:var(--gold)}
.lgl-toggle{display:flex;align-items:center;justify-content:center;gap:8px}
.lgl-toggle i{width:13px;height:13px;border-radius:50%;border:1px solid rgba(25,27,31,.2)}
.lgl-toggle i.a{background:var(--ink-blue);border-color:var(--ink-blue)}
.lgl-toggle i.b{background:var(--gold);border-color:var(--gold)}
.lgl-toggle i.c{background:var(--teal);border-color:var(--teal)}

/* carousel controls + dots */
.stage-foot{display:flex;align-items:center;justify-content:space-between;padding:18px 26px;border-top:1px solid var(--line-d);background:rgba(14,20,24,.4)}
.caro-dots{display:flex;gap:9px;align-items:center}
.caro-dots .cd{width:9px;height:9px;border-radius:50%;background:rgba(241,234,220,.22);cursor:pointer;transition:all .4s var(--ease);border:0;padding:0}
.caro-dots .cd.on{background:var(--gold);width:30px;border-radius:5px;box-shadow:0 0 12px rgba(217,162,74,.55)}
.caro-prog{flex:1;margin:0 24px;height:2px;background:rgba(241,234,220,.14);border-radius:2px;overflow:hidden;position:relative}
.caro-prog i{position:absolute;left:0;top:0;bottom:0;background:var(--gold);width:0}
.caro-nav{display:flex;gap:8px}
.caro-nav button{width:40px;height:40px;border-radius:50%;border:1px solid var(--line-d);background:transparent;color:var(--paper);
  cursor:pointer;font-size:16px;display:grid;place-items:center;transition:all .2s var(--ease)}
.caro-nav button:hover{background:rgba(241,234,220,.08);border-color:var(--paper);transform:translateY(-1px)}
.caro-count{font-family:'IBM Plex Mono',monospace;font-size:11px;color:rgba(241,234,220,.5);letter-spacing:.08em}
.caro-meta{display:flex;align-items:center;gap:16px;flex:none;padding-left:4px}
.caro-now{font-family:'Space Grotesk',system-ui,sans-serif;font-weight:600;font-size:13.5px;color:var(--paper);letter-spacing:-.01em;white-space:nowrap}
.caro-count{display:inline-flex;align-items:center;gap:5px}
.caro-count #caroNum{color:var(--gold)}
.cc-sep{opacity:.4}
.caro-nav{margin-left:6px}

/* ============================================================
   HOW IT WORKS (cream)
   ============================================================ */
.how{background:var(--paper);padding:120px 0;border-top:1px solid var(--line)}
.how h2{font-size:clamp(32px,4.4vw,58px);margin-bottom:56px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.step{
  border-top:2px solid var(--line);padding-top:24px;position:relative;
  opacity:0;transform:translateY(20px);
}
.steps.in .step{opacity:1;transform:none;transition:opacity .6s var(--ease),transform .6s var(--ease)}
.steps.in .step:nth-child(2){transition-delay:.12s}
.steps.in .step:nth-child(3){transition-delay:.24s}
.step::before{content:"";position:absolute;top:-2px;left:0;width:42px;height:2px;background:var(--ink-blue);transition:width .8s .3s var(--ease)}
.steps.in .step:nth-child(2)::before{background:var(--teal)}
.steps.in .step:nth-child(3)::before{background:var(--rust)}
.step-n{font-family:'IBM Plex Mono',monospace;font-size:13px;color:var(--walnut);letter-spacing:.1em;margin-bottom:10px}
.step h3{font-size:24px;font-weight:600;margin-bottom:12px}
.step p{font-size:16px;line-height:1.65;color:var(--walnut)}

/* ============================================================
   OFFER LADDER (cream surface)
   ============================================================ */
.offer{background:var(--surface);padding:120px 0;border-top:1px solid var(--line)}
.offer-head{text-align:center;max-width:680px;margin:0 auto 56px}
.offer-head h2{font-size:clamp(32px,4.4vw,56px);margin-bottom:18px}
.offer-head p{font-size:17px;color:var(--walnut);line-height:1.6}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:stretch}
.card{
  background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:34px 30px;
  display:flex;flex-direction:column;position:relative;transition:transform .3s var(--ease),box-shadow .3s var(--ease);
}
.card:hover{transform:translateY(-6px);box-shadow:0 24px 50px -24px rgba(25,27,31,.22)}
.card.hot{background:var(--ink-blue);color:var(--paper);border-color:var(--ink-blue);transform:scale(1.015)}
.card.hot:hover{transform:scale(1.015) translateY(-6px)}
.card-tag{position:absolute;top:18px;right:18px;font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  background:var(--gold);color:var(--ink);padding:5px 11px;border-radius:999px;font-weight:600}
.card-name{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:22px;margin-bottom:10px}
.card-price{font-family:'IBM Plex Mono',monospace;font-size:26px;font-weight:600;letter-spacing:-.01em;margin-bottom:18px;color:var(--ink-blue)}
.card.hot .card-price{color:var(--gold)}
.card-desc{font-size:15px;line-height:1.6;color:var(--walnut);margin-bottom:20px}
.card.hot .card-desc{color:rgba(241,234,220,.82)}
.card-foot{font-family:'IBM Plex Mono',monospace;font-size:11.5px;line-height:1.5;color:var(--teal);margin-bottom:22px;margin-top:auto;
  border-top:1px solid var(--line);padding-top:16px}
.card.hot .card-foot{color:#8fd0ea;border-color:var(--line-d)}
.card .card-cta{
  font-family:'Inter',sans-serif;font-weight:600;font-size:14.5px;text-align:center;
  padding:13px;border-radius:999px;background:var(--ink-blue);color:var(--paper);
  transition:transform .2s var(--ease),background .2s;
}
.card .card-cta:hover{transform:translateY(-2px);background:var(--teal)}
.card.hot .card-cta{background:var(--gold);color:var(--ink)}
.card.hot .card-cta:hover{background:#e8b663}
.offer-note{text-align:center;margin-top:34px;font-family:'IBM Plex Mono',monospace;font-size:13px;
  color:var(--walnut);letter-spacing:.02em;line-height:1.8}
.offer-note span{color:var(--ink-blue);font-weight:500}

/* ============================================================
   MOAT (dark)
   ============================================================ */
.moat{background:var(--dark);color:var(--paper);padding:120px 0;overflow:hidden}
.moat .mesh{opacity:.7}
.moat .blob{filter:blur(80px);opacity:.32}
.moat-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:64px;align-items:center}
.moat h2{font-size:clamp(30px,4.2vw,54px);margin-bottom:26px;max-width:16ch}
.moat-body{font-size:17px;line-height:1.72;color:rgba(241,234,220,.78)}
.moat-points{display:flex;flex-direction:column;gap:16px}
.mp{
  border:1px solid var(--line-d);border-radius:14px;padding:22px 24px;display:flex;align-items:center;gap:18px;
  background:linear-gradient(120deg,rgba(46,131,166,.08),transparent);
  opacity:0;transform:translateX(18px);
}
.moat-points.in .mp{opacity:1;transform:none;transition:opacity .6s var(--ease),transform .6s var(--ease)}
.moat-points.in .mp:nth-child(2){transition-delay:.13s}
.moat-points.in .mp:nth-child(3){transition-delay:.26s}
.mp-ic{width:46px;height:46px;border-radius:12px;flex:none;display:grid;place-items:center;
  font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:18px;background:rgba(241,234,220,.08);color:var(--gold)}
.mp:nth-child(1) .mp-ic{color:#7bc4e0}
.mp:nth-child(3) .mp-ic{color:var(--rust)}
.mp-t{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:18px}

/* ============================================================
   ABOUT (cream)
   ============================================================ */
.about{background:var(--paper);padding:120px 0;border-top:1px solid var(--line)}
.about-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:60px;align-items:start}
.about h2{font-size:clamp(30px,4.2vw,52px);position:sticky;top:110px}
.about-body{font-size:18px;line-height:1.74;color:var(--walnut)}
.about-body strong{color:var(--ink);font-weight:600}
.about-sign{font-family:'IBM Plex Mono',monospace;font-size:13px;color:var(--ink-blue);margin-top:30px;
  border-left:2px solid var(--gold);padding-left:16px;letter-spacing:.02em}

/* ============================================================
   CONTACT (dark)
   ============================================================ */
.contact{background:var(--dark);color:var(--paper);padding:120px 0;overflow:hidden}
.contact .mesh{opacity:.75}
.contact .blob{filter:blur(80px);opacity:.4}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start}
.contact h2{font-size:clamp(32px,4.6vw,58px);margin-bottom:22px}
.contact-lead{font-size:17px;line-height:1.7;color:rgba(241,234,220,.8);max-width:42ch}
.contact-lead .slots{color:var(--gold);font-family:'IBM Plex Mono',monospace;font-size:14px;display:block;margin-top:16px}
.form{display:flex;flex-direction:column;gap:18px;
  background:rgba(241,234,220,.04);border:1px solid var(--line-d);border-radius:20px;padding:36px}
.field label{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  color:rgba(241,234,220,.6);display:block;margin-bottom:8px}
.field input,.field textarea{
  width:100%;background:rgba(14,20,24,.55);border:1px solid var(--line-d);border-radius:11px;
  padding:14px 16px;color:var(--paper);font-family:'Inter',sans-serif;font-size:15px;transition:border-color .2s,box-shadow .2s;
}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px rgba(46,131,166,.18)}
.field textarea{resize:vertical;min-height:110px}
.form .btn-primary{justify-content:center;margin-top:4px}
.form-alt{font-family:'IBM Plex Mono',monospace;font-size:12px;color:rgba(241,234,220,.55);text-align:center;margin-top:4px}
.form-alt a{color:#7bc4e0}

/* ============================================================
   CLOSING (cinematic)
   ============================================================ */
.closing{background:var(--dark);color:var(--paper);padding:140px 0 120px;text-align:center;overflow:hidden;border-top:1px solid var(--line-d)}
.closing .mesh{opacity:.85}
.closing .blob{filter:blur(70px);opacity:.5}
.closing-big{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:clamp(48px,11vw,150px);letter-spacing:-.04em;line-height:.95;
  display:inline-flex;align-items:baseline;gap:.2em;flex-wrap:wrap;justify-content:center}
.closing-big .check{color:var(--gold);font-weight:600}
.closing-mono{font-family:'IBM Plex Mono',monospace;font-size:13px;letter-spacing:.1em;color:rgba(241,234,220,.6);margin-top:28px}

/* ============================================================
   FOOTER
   ============================================================ */
.footer{background:var(--ink);color:var(--paper);padding:60px 0 50px}
.footer-grid{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap}
.footer .wordmark{font-size:30px}
.footer-tag{font-family:'Space Grotesk',sans-serif;font-weight:500;font-size:18px;color:rgba(241,234,220,.85);margin-top:8px}
.footer-tag .dot{color:var(--gold)}
.footer-meta{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.08em;color:rgba(241,234,220,.55);text-align:right;line-height:1.9}
.footer-meta a{color:#7bc4e0}

/* ============================================================
   SCROLL REVEAL (generic)
   ============================================================ */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal.in{opacity:1;transform:none}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:900px){
  .wrap{padding:0 22px}
  .nav-links{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;
    background:rgba(14,20,24,.96);backdrop-filter:blur(14px);padding:12px 22px 22px;align-items:stretch}
  .nav-links.open{display:flex}
  .nav-links a{padding:13px 0;border-bottom:1px solid var(--line-d);opacity:.92;color:var(--paper)}
  .nav-links a.cta{margin-top:12px;text-align:center;border-bottom:0;background:var(--gold);color:var(--ink)}
  .nav .led{display:none}
  .nav-toggle{display:block}
  .nav.on-dark .nav-toggle,.nav-toggle{color:var(--paper)}
  .nav.scrolled:not(.on-dark) .nav-toggle{color:var(--ink)}
  .model-grid,.moat-grid,.about-grid,.contact-grid{grid-template-columns:1fr;gap:40px}
  .steps,.cards{grid-template-columns:1fr}
  .demos-head{flex-direction:column;align-items:flex-start}
  .stage-viewport{height:auto}
  .scene{position:relative;grid-template-columns:1fr;height:auto}
  .scene:not(.active){display:none}
  .scene-info{border-right:0;border-bottom:1px solid var(--line-d);padding:40px 30px}
  .scene-mock{padding:36px 30px}
  .about h2{position:static}
  .closing-big{font-size:clamp(40px,16vw,90px)}
}
@media (max-width:480px){
  .wrap{padding:0 18px}
  .hero{padding:110px 0 60px}
  .hero h1{font-size:clamp(32px,9vw,46px)}
  .reel-scene{font-size:clamp(30px,12vw,56px)}
  .reel-scene.resolve{font-size:clamp(34px,13vw,62px)}
  .btn{width:100%;justify-content:center}
  .hero-cta{flex-direction:column;align-items:stretch}
  .scene-info{padding:32px 22px}
  .scene-mock{padding:28px 22px}
  .stage-foot{padding:14px 16px;flex-wrap:wrap;gap:14px;justify-content:center}
  .caro-prog{order:3;flex-basis:100%;margin:0}
  .footer-grid{flex-direction:column;align-items:flex-start}
  .footer-meta{text-align:left}
}

/* ============================================================
   REDUCED MOTION  - freeze on resolved / first scene, all visible
   ============================================================ */
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important}
  .blob{animation:none !important}
  .reveal,.hero-content,.stack-row,.step,.mp,.scene-info,.scene-mock{opacity:1 !important;transform:none !important}
  .reel{opacity:0 !important;visibility:hidden !important}      /* hide the reel overlay entirely */
  .hero-content{opacity:1 !important;transform:none !important}
  .scroll-hint{opacity:1 !important}
  .scene{opacity:0;visibility:hidden}
  .scene.active{opacity:1 !important;visibility:visible !important;transform:none !important}
  .reel-scene .clip>span{transform:none !important}
}
/* ===== FIDEN (main attraction, editorial / de-slopped) ===== */
.fiden{position:relative;background:#0a0f13;color:var(--paper);padding:clamp(74px,9vw,124px) 0;overflow:hidden}
.fiden::before{content:"";position:absolute;top:-18%;right:-6%;width:58%;height:75%;background:radial-gradient(closest-side,rgba(79,156,245,.17),transparent 70%);pointer-events:none}
.fiden-tex{position:absolute;inset:0;pointer-events:none;opacity:.6;background-image:linear-gradient(rgba(241,234,220,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(241,234,220,.035) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:linear-gradient(180deg,transparent,#000 14%,#000 58%,transparent);mask-image:linear-gradient(180deg,transparent,#000 14%,#000 58%,transparent)}
.fiden .wrap{position:relative;z-index:2}
.fiden-bar{display:flex;align-items:center;gap:16px;margin-bottom:clamp(28px,4vw,48px)}
.fiden-dept{font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:#7bc4e0;white-space:nowrap}
.fiden-bar .rl{flex:1;height:1px;background:linear-gradient(90deg,rgba(123,196,224,.5),rgba(241,234,220,.08))}
.fiden-lock{font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.06em;color:rgba(241,234,220,.6);white-space:nowrap}
.fiden-lock b{color:var(--paper);font-weight:600}
.fiden-lock em{color:var(--gold);font-style:normal;margin:0 5px}
@media (max-width:420px){.fiden-bar{flex-wrap:wrap}.fiden-lock{white-space:normal;flex-basis:100%}}
.fiden-top{display:grid;grid-template-columns:1.25fr .9fr;gap:clamp(28px,5vw,72px);align-items:end;margin-bottom:clamp(32px,4vw,48px)}
.fiden-top h2{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:clamp(36px,5.2vw,70px);line-height:1.0;letter-spacing:-.035em}
.fiden-top h2 .it{font-style:italic;font-weight:500;color:var(--gold)}
.fiden-lead{margin-top:20px;color:rgba(241,234,220,.74);font-size:clamp(15px,1.25vw,18px);line-height:1.62;max-width:46ch}
.fiden-cta{margin-top:26px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.fiden-open{display:inline-flex;align-items:center;gap:10px;font-family:'IBM Plex Mono',monospace;font-weight:500;font-size:15px;color:var(--ink);background:var(--gold);padding:14px 22px;border-radius:30px;text-decoration:none;box-shadow:0 12px 36px -10px rgba(217,162,74,.6);transition:transform .18s var(--ease),box-shadow .25s}
.fiden-open:hover{transform:translateY(-2px);box-shadow:0 18px 48px -12px rgba(217,162,74,.78)}
.fiden-open .arr{font-size:17px;line-height:1}
.fiden-cta-note{font-family:'IBM Plex Mono',monospace;font-size:12px;color:rgba(241,234,220,.5);letter-spacing:.03em}
.fiden-notes{list-style:none;margin:0;padding:0}
.fiden-notes li{display:flex;gap:16px;padding:15px 0;border-top:1px solid rgba(241,234,220,.13)}
.fiden-notes li:last-child{border-bottom:1px solid rgba(241,234,220,.13)}
.fn-n{font-family:'IBM Plex Mono',monospace;font-size:13px;color:var(--gold);padding-top:3px}
.fiden-notes b{display:block;font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:16px;margin-bottom:4px}
.fiden-notes span{display:block;color:rgba(241,234,220,.62);font-size:13.5px;line-height:1.5}
.fiden-stage{display:block;position:relative;border-radius:14px;overflow:hidden;border:1px solid rgba(241,234,220,.14);box-shadow:0 50px 130px -50px rgba(0,0,0,.85),0 0 70px -22px rgba(79,156,245,.22);cursor:pointer;text-decoration:none}
.fiden-chrome{display:flex;align-items:center;gap:8px;padding:11px 16px;background:#11141c;border-bottom:1px solid rgba(241,234,220,.07)}
.fc-dot{width:11px;height:11px;border-radius:50%;display:inline-block}.fc-dot.r{background:#e05555}.fc-dot.y{background:#f0a020}.fc-dot.g{background:#25c48a}
.fc-url{margin-left:10px;font-family:'IBM Plex Mono',monospace;color:#74829b;font-size:12px;letter-spacing:.03em}
.fc-open{margin-left:auto;font-family:'IBM Plex Mono',monospace;color:var(--gold);font-size:12px;letter-spacing:.06em}
.fiden-screen{position:relative;width:100%;overflow:hidden;background:#08090d url('assets/demo-shot.png') top center/cover no-repeat;height:716px}
.fiden-screen iframe{position:absolute;top:0;left:0;width:1556px;height:980px;border:0;transform:scale(.731);transform-origin:top left;pointer-events:none}
.fiden-hover{position:absolute;left:50%;bottom:26px;transform:translateX(-50%) translateY(10px);font-family:'IBM Plex Mono',monospace;font-size:14px;color:var(--ink);background:var(--gold);padding:12px 22px;border-radius:30px;opacity:0;transition:opacity .25s,transform .25s;box-shadow:0 16px 40px -12px rgba(0,0,0,.7);pointer-events:none}
.fiden-stage:hover .fiden-hover{opacity:1;transform:translateX(-50%) translateY(0)}
.fiden-mobile{display:none;width:100%}
@media(max-width:880px){
  .fiden-top{grid-template-columns:1fr;gap:30px;align-items:start;margin-bottom:30px}
  .fiden-screen{display:none}
  .fiden-mobile{display:block}
}

/* ============================================================
   ALIVE — shared upgrades (fixes + arsenal performances + mark)
   Ambient per direction is injected by the direction module.
   ============================================================ */
:root{--pop:cubic-bezier(.34,1.4,.5,1)}

/* hero: calm the ambient field directly behind the headline so type stays crisp */
.hero-scrim{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(56% 80% at 27% 52%,rgba(14,20,24,.74),rgba(14,20,24,.26) 46%,transparent 72%)}
@media(max-width:900px){.hero-scrim{width:100%;background:radial-gradient(120% 70% at 50% 46%,rgba(14,20,24,.72),rgba(14,20,24,.3) 50%,transparent 78%)}}

/* de-slop: kill the blurred mesh blobs everywhere; repurpose .mesh as the
   ambient/fx mount (hero + demos) and as a flat crafted grid on quiet sections */
.blob{display:none!important}
.mesh{inset:0}
.whatwedo .mesh,.moat .mesh,.contact .mesh,.closing .mesh{
  background-image:linear-gradient(rgba(241,234,220,.05) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(241,234,220,.05) 1px,transparent 1px);
  background-size:60px 60px;opacity:.6;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 18%,#000 62%,transparent);
  mask-image:linear-gradient(180deg,transparent,#000 18%,#000 62%,transparent);
}
.hero .mesh canvas,.demos .mesh canvas{position:absolute;inset:0;width:100%;height:100%;display:block}

/* shipped Weve mark (inherits currentColor via <use>) */
.mark-svg{height:26px;width:42px;display:inline-block;vertical-align:-.16em;flex:none}
.nav-left .mark-svg{height:24px;width:38px}
.footer .mark-svg{height:30px;width:48px}
.wordmark{display:inline-flex;align-items:center;gap:10px}

/* ===== Fiden hero: native "mission control" cockpit — depth + data-viz + live ===== */
.fiden-screen{height:auto!important;position:relative;overflow:hidden;background:radial-gradient(120% 130% at 80% -10%,#123545,#0a1219 62%)}
/* the "Open the live demo" CTA rides IN FRONT of the cockpit (was occluded behind it), always visible */
.fiden-screen::after{content:"";position:absolute;left:0;right:0;bottom:0;height:70px;z-index:4;pointer-events:none;
  background:linear-gradient(transparent,rgba(8,13,18,.5) 52%,rgba(8,13,18,.82))}
.fiden-hover{opacity:1;z-index:6;bottom:16px;transform:translateX(-50%);
  box-shadow:0 10px 26px -8px rgba(0,0,0,.6),0 0 0 1px rgba(217,162,74,.4)}
.fiden-stage:hover .fiden-hover{transform:translateX(-50%) translateY(-2px);box-shadow:0 16px 40px -10px rgba(0,0,0,.7),0 0 0 1px rgba(217,162,74,.6)}
@media(max-width:560px){.fiden-hover{font-size:12px;padding:9px 15px;bottom:12px;white-space:nowrap}}
.fdnc{position:relative;z-index:2;padding:clamp(15px,1.9vw,24px);display:flex;flex-direction:column;gap:clamp(11px,1.4vw,15px);font-family:'Inter',sans-serif}
.fdnc-glow{position:absolute;z-index:0;width:64%;height:72%;right:-10%;top:-20%;pointer-events:none;background:radial-gradient(circle,rgba(46,131,166,.26),transparent 66%)}
.fdnc-sheen{position:absolute;z-index:1;top:-30%;left:-60%;width:42%;height:160%;pointer-events:none;background:linear-gradient(105deg,transparent,rgba(143,212,255,.06),transparent);transform:translateX(0) skewX(-12deg);animation:fdncSheen 9s ease-in-out infinite}
@keyframes fdncSheen{0%,55%,100%{transform:translateX(0) skewX(-12deg)}30%{transform:translateX(380%) skewX(-12deg)}}
.fdnc-head{display:flex;justify-content:space-between;align-items:center;gap:12px}
.fdnc-htl{display:flex;align-items:center;gap:11px}
.fdnc-chip{font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#7bc4e0;border:1px solid rgba(123,196,224,.35);border-radius:7px;padding:5px 9px;background:rgba(46,131,166,.12)}
.fdnc-biz{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:clamp(16px,1.8vw,20px);color:var(--paper);letter-spacing:-.01em}
.fdnc-eng{display:flex;align-items:center;gap:6px;font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.05em;color:rgba(241,234,220,.55);margin-top:3px}
.fdnc-eng i{width:6px;height:6px;border-radius:50%;background:#7bc4e0;box-shadow:0 0 8px #7bc4e0;animation:livePulse 1.5s ease-in-out infinite}
.fdnc-live{flex:none;display:inline-flex;align-items:center;gap:6px;font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#9fd6a0;border:1px solid rgba(120,190,130,.35);border-radius:999px;padding:4px 9px;background:rgba(60,180,137,.08)}
.fdnc-live i{width:6px;height:6px;border-radius:50%;background:#6fbf8a;box-shadow:0 0 8px #6fbf8a;animation:livePulse 1.7s ease-in-out infinite}
@keyframes livePulse{50%{opacity:.3}}
/* pipeline hero + sparkline */
.fdnc-hero{position:relative;border:1px solid rgba(123,196,224,.22);border-radius:14px;overflow:hidden;padding:15px 16px 0;background:linear-gradient(160deg,rgba(46,131,166,.14),rgba(14,20,24,.35));box-shadow:inset 0 1px 0 rgba(241,234,220,.06)}
.fdnc-hero-top{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;position:relative;z-index:2}
.fdnc-hero-v{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.fdnc-hero-v .v{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:clamp(26px,3.3vw,38px);color:var(--paper);line-height:1;letter-spacing:-.02em}
.fdnc-hero .l{font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:rgba(241,234,220,.5);margin-top:7px}
.delta{font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:500;padding:3px 7px;border-radius:6px;white-space:nowrap}
.delta.up{color:#7fe0b0;background:rgba(60,180,137,.14);border:1px solid rgba(60,180,137,.3)}
.fdnc-mini{display:flex;gap:16px;text-align:right}
.fdnc-mini-i{display:flex;flex-direction:column;align-items:flex-end;gap:3px}
.fdnc-mini-i .v{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:clamp(16px,1.8vw,21px);color:var(--paper);line-height:1}
.fdnc-mini-i em{font-family:'IBM Plex Mono',monospace;font-size:8.5px;letter-spacing:.08em;text-transform:uppercase;color:rgba(241,234,220,.45);font-style:normal}
.fdnc-spark{display:block;width:calc(100% + 32px);height:62px;margin:8px -16px 0}
.spk-line{stroke-dasharray:1;stroke-dashoffset:1;filter:drop-shadow(0 0 4px rgba(143,212,255,.5))}
.fiden-stage.seen .spk-line{stroke-dashoffset:0;transition:stroke-dashoffset 1.5s var(--ease) .25s}
.spk-area{opacity:0}.fiden-stage.seen .spk-area{opacity:1;transition:opacity 1s ease .9s}
.spk-line{stroke-linecap:round}
/* cards */
.fdnc-cols{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fdnc-card{position:relative;border:1px solid var(--line-d);border-radius:14px;padding:14px;background:linear-gradient(160deg,rgba(20,32,42,.55),rgba(12,18,24,.45));box-shadow:inset 0 1px 0 rgba(241,234,220,.04)}
.fdnc-card.needs{border-color:rgba(217,162,74,.28)}
.fdnc-ct{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:13.5px;color:var(--paper);display:flex;align-items:center;gap:8px;margin-bottom:12px}
.fdnc-ct .n{font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:rgba(241,234,220,.38);font-weight:400;margin-left:auto}
.fdnc-badge{font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--ink);background:var(--gold);border-radius:999px;min-width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;padding:0 5px;font-weight:600;box-shadow:0 0 10px rgba(217,162,74,.5)}
.fdnc-appr{display:flex;align-items:center;gap:10px;border:1px solid rgba(217,162,74,.25);background:rgba(217,162,74,.05);border-radius:10px;padding:9px 11px;margin-bottom:8px}
.fdnc-appr:last-child{margin-bottom:0}
.fdnc-appr .tx{flex:1;font-size:12.5px;color:var(--paper);line-height:1.3}
.fdnc-appr .amt{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--gold)}
.fdnc-appr .rv{font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--ink);background:var(--gold);padding:5px 9px;border-radius:6px;font-weight:600}
/* agent icon badges (masked shipped icons, tinted per agent) */
.ico,.fico{flex:none;position:relative;border-radius:7px;background:rgba(241,234,220,.05);border:1px solid var(--line-d)}
.ico{width:26px;height:26px}.fico{width:22px;height:22px}
.ico::after,.fico::after{content:"";position:absolute;inset:0;margin:auto;background:currentColor;-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
.ico::after{width:15px;height:15px}.fico::after{width:12px;height:12px}
.i-proposal{color:#7bc4e0;--ic:url(assets/icons/document.svg)}
.i-caller{color:#e0a45a;--ic:url(assets/icons/thread.svg)}
.i-lead{color:#7fe0b0;--ic:url(assets/icons/growth.svg)}
.i-inbox{color:#7bc4e0;--ic:url(assets/icons/message.svg)}
.i-books{color:#D9A24A;--ic:url(assets/icons/ship-log.svg)}
/* live activity ticker */
.fdnc-feed{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px;min-height:158px}
.fdnc-feed li{display:flex;gap:9px;align-items:center;font-size:12px;color:rgba(241,234,220,.82)}
.fdnc-feed li.enter{animation:feedIn .32s var(--ease)}
@keyframes feedIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.fdnc-feed .ft{font-family:'IBM Plex Mono',monospace;font-size:9.5px;color:rgba(241,234,220,.4);flex:none;width:40px}
.fdnc-feed .fe{flex:1;line-height:1.3}.fdnc-feed .fe b{color:var(--paper);font-weight:600}
/* entrance */
.fdnc-hero,.fdnc-card{opacity:0;transform:translateY(10px)}
.fiden-stage.seen .fdnc-hero,.fiden-stage.seen .fdnc-card{opacity:1;transform:none;transition:opacity .6s var(--ease),transform .6s var(--ease)}
.fiden-stage.seen .fdnc-card:nth-child(2){transition-delay:.1s}
@media(max-width:560px){.fdnc-cols{grid-template-columns:1fr}.fdnc-mini{gap:12px}}
@media(prefers-reduced-motion:reduce){
  .fdnc-hero,.fdnc-card{opacity:1!important;transform:none!important}
  .spk-line{stroke-dashoffset:0!important}.spk-area{opacity:1!important}.fdnc-sheen{display:none}
}
@media(max-width:880px){.fiden-screen{display:block!important}.fiden-mobile{display:none!important}}

/* contact form confirmation */
.form-ok{display:none;font-family:'IBM Plex Mono',monospace;font-size:12.5px;
  color:#8fd0ea;text-align:center;margin-top:2px}
.form.sent .form-ok{display:block;animation:okIn .5s var(--ease) both}
/* no-JS submit lands on /#thanks; :target reveals a confirmation (JS path uses .form.sent) */
.form-thanks{display:none}
#thanks:target{display:block;font-family:'IBM Plex Mono',monospace;font-size:12.5px;color:#8fd0ea;text-align:center;margin-top:16px;animation:okIn .5s var(--ease) both}
@keyframes okIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.form .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}
.form-err{display:none;font-family:'IBM Plex Mono',monospace;font-size:12.5px;color:#e0a45a;text-align:center;margin-top:2px}
.form-err a{color:#8fd0ea}
.form.error .form-err{display:block;animation:okIn .5s var(--ease) both}
.form.sent .field,.form.sent .btn-primary,.form.sent .form-alt{display:none}


/* ---------- arsenal PERFORMS: each scene animates when active ---------- */
.scene.active .mk,.scene.active .flow,.scene.active .site,.scene.active .app,
.scene.active .lcard,.scene.active .nmg,.scene.active .fdn,.scene.active .clt{
  animation:mockIn .6s var(--ease) both}
@keyframes mockIn{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}

/* flow: nodes pop in staggered when active (transform/opacity only) */
.flow .fnode{opacity:.18;transform:translateY(8px)}
.scene.active .flow .fnode{opacity:1;transform:none;transition:opacity .45s var(--ease),transform .45s var(--pop)}
.scene.active .flow .fnode:nth-child(3){transition-delay:.14s}
.scene.active .flow .fnode:nth-child(5){transition-delay:.28s}
.scene.active .flow .fnode:nth-child(7){transition-delay:.42s}
.merge-stamp{position:absolute;top:8px;right:10px;font-family:'IBM Plex Mono',monospace;
  font-size:10px;letter-spacing:.14em;color:var(--ink);background:var(--gold);
  padding:4px 9px;border-radius:6px;font-weight:600;opacity:0;transform:scale(.5) rotate(-8deg)}
.merge-stamp.on{animation:stampIn .5s var(--pop) forwards}
@keyframes stampIn{to{opacity:1;transform:none}}

/* worldcup: prediction bars fill (scaleX, not width) when active */
.pred-bar i{transform-origin:left center}
.scene.active .pred-bar i{animation:barFill 1.1s var(--ease) .2s both}
@keyframes barFill{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* site scene: grid cells stagger in */
.scene.active .site-grid .c{animation:cellIn .5s var(--ease) both}
.scene.active .site-grid .c:nth-child(2){animation-delay:.1s}
.scene.active .site-grid .c:nth-child(3){animation-delay:.2s}
@keyframes cellIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* Robin: safety alert slides in after the call bubble types */
.rbn-alert{opacity:0;transform:translateY(10px)}
.rbn-alert.on{opacity:1;transform:none;transition:opacity .5s var(--ease),transform .5s var(--pop)}

/* moat: shipped line icons masked to currentColor, in a stronger tinted badge */
.mp-ic{width:54px!important;height:54px!important;border-radius:14px;
  background:rgba(123,196,224,.10);border:1px solid rgba(123,196,224,.26)}
.mp:nth-child(2) .mp-ic{background:rgba(217,162,74,.10);border-color:rgba(217,162,74,.28)}
.mp:nth-child(3) .mp-ic{background:rgba(194,97,59,.12);border-color:rgba(194,97,59,.30)}
.mp-ic i{width:27px;height:27px;display:block;background:currentColor;
  -webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
.mp-ic svg{width:28px;height:28px;display:block}

/* site scene mock: real-looking content */
.site-hero .sh-p{font-size:9px;line-height:1.45;color:rgba(25,27,31,.55);margin:2px 0 11px;max-width:94%}
.site-grid .c{display:grid;place-items:center}
.site-grid .c span{font-family:'IBM Plex Mono',monospace;font-size:7.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-blue)}

/* Nemova graph: edges draw on activate (dashoffset set in JS) */
.nmg svg line{transition:stroke-dashoffset 1s var(--ease)}

/* typewriter caret */
.tw-caret::after{content:"";display:inline-block;width:.5em;height:1em;
  background:currentColor;margin-left:1px;vertical-align:-.12em;animation:caret .8s steps(1) infinite}
@keyframes caret{50%{opacity:0}}

/* ---------- calligraphic hero mark (draws on reel resolve) ---------- */
.hero-mark{display:block;margin-bottom:20px}
.hero-mark svg{width:clamp(46px,5vw,60px);height:auto;overflow:visible;display:block}
.hero-mark .hm-stroke{fill:none;stroke:#7bc4e0;stroke-width:4.6;stroke-linejoin:round;stroke-linecap:round;
  pathLength:1000;stroke-dasharray:1000;stroke-dashoffset:1000;
  animation:hmDraw 2.1s cubic-bezier(.85,0,.15,1) forwards;animation-play-state:paused}
@keyframes hmDraw{to{stroke-dashoffset:0}}
.hero-mark .hm-flood rect{transform-origin:left center;transform:scaleX(0);
  animation:hmFlood 1s cubic-bezier(.5,0,.15,1) 1.85s forwards;animation-play-state:paused}
@keyframes hmFlood{to{transform:scaleX(1)}}
.hero-mark .hm-fill{fill:var(--paper)}
.hero-content.show .hero-mark .hm-stroke,
.hero-content.show .hero-mark .hm-flood rect{animation-play-state:running}

@media (prefers-reduced-motion:reduce){
  .hero-mark .hm-stroke{stroke-dashoffset:0!important;opacity:0}
  .hero-mark .hm-flood rect{transform:scaleX(1)!important}
  .rbn-alert{opacity:1!important;transform:none!important}
  .merge-stamp{opacity:1!important;transform:none!important}
  .flow .fnode{opacity:1!important;transform:none!important}
}

/* Logo Lab card — clean brand tile */
.lgl-stage{flex-direction:column!important;gap:12px!important;padding:16px 0 6px!important}
.lgl-bigmark{width:116px;height:72px;color:#1F4A5C;display:block;margin:0 auto}
.lgl-wm{font-family:'Space Grotesk',system-ui,sans-serif;font-weight:600;font-size:21px;letter-spacing:-.02em;color:#1F4A5C}
.lgl-palette{display:flex;gap:9px;justify-content:center;margin-top:2px}
.lgl-palette i{width:18px;height:18px;border-radius:50%;display:block;box-shadow:0 1px 3px rgba(25,27,31,.18)}
.lgl-cap2{text-align:center;font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--walnut);margin-top:10px}

/* closing subline */
.closing-sub{font-family:'Space Grotesk',system-ui,sans-serif;font-weight:500;font-size:clamp(15px,1.9vw,21px);color:rgba(241,234,220,.68);margin-top:16px}

/* externalized inline-style attributes (CSP: no inline styles) */
.pal1{background:#1F4A5C}.pal2{background:#2E83A6}.pal3{background:#7bc4e0}.pal4{background:#D9A24A}
.fl-bra{background:linear-gradient(90deg,#009b3a 50%,#fedf00 50%)}
.fl-arg{background:linear-gradient(#75aadb 33%,#fff 33%,#fff 66%,#75aadb 66%)}
.fl-fra{background:linear-gradient(90deg,#002654 33%,#fff 33%,#fff 66%,#ce1126 66%)}
.fl-eng{background:#cf142b}
.jc-end{justify-content:flex-end}
.mt22{margin-top:22px}.mt6{margin-top:6px}
.svgdefs{position:absolute;pointer-events:none}
.ta-right{text-align:right}
.pred-bar i.pw51{width:51%}