:root{
    --bg:#0a0607; --bg-2:#060304;
    --red:#c40016; --red-2:#8b0010; --red-3:#5a000a; --red-hi:#e5121f;
    --ink:#f5eaeb; --ink-dim:#cbb4b6; --muted:#95797c;
    --line:rgba(210,28,40,.14); --line-2:rgba(210,28,40,.26);
    --card:#150b0d; --card-2:#0f0708;
    --good:#3ecf8e; --part:#e0a93c; --no:#e0606a; --na:#7a6264;
    --disp:'Anton',Impact,'Arial Narrow Bold',sans-serif;
    --serif:'Fraunces',Georgia,'Times New Roman',serif;
    --sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
    --maxw:1180px;
  }
  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);line-height:1.6;
    -webkit-font-smoothing:antialiased;overflow-x:hidden;}
  a{color:inherit}
  /* ---- silk aurora (fixed, behind everything) ---- */
  #aurora{position:fixed;inset:0;width:100%;height:100%;z-index:-2;display:block;
    background:radial-gradient(1200px 700px at 50% -10%,rgba(139,0,16,.42),transparent 60%),
               radial-gradient(900px 600px at 85% 20%,rgba(90,0,10,.30),transparent 60%),var(--bg-2);}
  .grain{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.05;mix-blend-mode:overlay;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}
  /* ---- nav ---- */
  nav{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:22px;
    padding:14px clamp(18px,4vw,40px);backdrop-filter:blur(14px);
    background:linear-gradient(180deg,rgba(10,6,7,.86),rgba(10,6,7,.55));border-bottom:1px solid var(--line);}
  .logo{font-family:var(--serif);font-weight:600;font-size:22px;letter-spacing:.01em;color:#fff;text-decoration:none;
    display:flex;align-items:center;gap:9px;}
  .logo .dot{width:9px;height:9px;border-radius:50%;background:var(--red);box-shadow:0 0 12px var(--red-hi);}
  nav .links{display:flex;gap:20px;margin-left:auto;align-items:center;font-size:14.5px;font-weight:500;}
  nav .links a{color:var(--ink-dim);text-decoration:none;transition:color .2s;}
  nav .links a:hover{color:#fff;}
  nav .navcta{padding:9px 18px;border-radius:10px;font-weight:700;font-size:14px;color:#fff;text-decoration:none;
    background:linear-gradient(180deg,var(--red),var(--red-2));border:1px solid rgba(220,42,54,.35);
    box-shadow:0 6px 20px rgba(139,0,16,.5);}
  /* hamburger (injected by site.js; hidden on desktop) */
  nav .navtoggle{display:none;margin-left:auto;width:42px;height:38px;flex-direction:column;gap:4px;
    align-items:center;justify-content:center;padding:0;border:1px solid var(--line);border-radius:9px;
    background:var(--card-2);cursor:pointer;}
  nav .navtoggle span{display:block;width:18px;height:2px;background:#fff;border-radius:2px;transition:transform .25s,opacity .25s;}
  nav.open .navtoggle span:nth-child(1){transform:translateY(6px) rotate(45deg);}
  nav.open .navtoggle span:nth-child(2){opacity:0;}
  nav.open .navtoggle span:nth-child(3){transform:translateY(-6px) rotate(-45deg);}
  @media(max-width:820px){
    nav .navtoggle{display:flex;}
    nav .links{position:absolute;top:100%;left:0;right:0;margin:0;flex-direction:column;align-items:stretch;gap:0;
      background:var(--card);border-bottom:1px solid var(--line);box-shadow:0 18px 40px rgba(0,0,0,.5);
      max-height:0;overflow:hidden;transition:max-height .3s ease;}
    nav.open .links{max-height:70vh;}
    nav .links a{padding:15px 22px;border-top:1px solid var(--line);font-size:16px;}
    nav .links a.navcta{margin:12px 22px 16px;border-radius:10px;text-align:center;border-top:none;}
  }
  /* ---- layout ---- */
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(18px,4vw,28px);}
  section{margin-top:clamp(56px,9vw,96px);}
  .eyebrow{font-family:var(--sans);letter-spacing:.32em;font-size:11.5px;font-weight:800;text-transform:uppercase;
    color:var(--red-hi);}
  h2.sec{font-family:var(--serif);font-weight:600;font-size:clamp(28px,4.2vw,44px);line-height:1.08;margin:12px 0 6px;
    color:#fff;text-wrap:balance;letter-spacing:-.01em;}
  .lead{font-size:clamp(17px,2vw,20px);color:var(--ink-dim);max-width:760px;margin:6px 0 26px;}
  /* ---- HERO ---- */
  .hero{position:relative;text-align:center;padding:clamp(48px,9vw,96px) clamp(18px,4vw,28px) clamp(30px,5vw,52px);}
  .hero .eyebrow{display:block;margin-bottom:22px;}
  .h-oreml{font-family:var(--sans);font-weight:800;font-size:clamp(26px,4.2vw,50px);letter-spacing:.04em;
    color:var(--ink);line-height:1;}
  .tilt-wrap{perspective:1000px;margin:6px 0 2px;}
  .h-gold{font-family:var(--disp);font-weight:400;font-size:clamp(52px,12vw,140px);line-height:.92;letter-spacing:.005em;
    text-transform:uppercase;display:inline-block;
    background:linear-gradient(176deg,#e5121f 0%,var(--red) 30%,var(--red-2) 66%,#420008 100%);
    -webkit-background-clip:text;background-clip:text;color:transparent;
    filter:drop-shadow(0 6px 30px rgba(196,0,22,.5)) drop-shadow(0 0 60px rgba(139,0,16,.35));cursor:default;}
  .h-tag{font-family:var(--sans);font-weight:700;font-size:clamp(19px,3vw,32px);letter-spacing:-.01em;margin-top:14px;
    color:var(--ink);}
  .h-tag b{background:linear-gradient(90deg,#e5121f,var(--red));-webkit-background-clip:text;background-clip:text;color:transparent;}
  .powered{position:relative;margin-top:clamp(20px,4vw,40px);}
  .powered .pby{font-family:var(--sans);font-weight:600;letter-spacing:.28em;font-size:12.5px;text-transform:uppercase;
    color:var(--muted);display:block;margin-bottom:2px;}
  .powered .chim{position:relative;z-index:2;font-family:var(--sans);font-weight:800;letter-spacing:.06em;
    font-size:clamp(19px,3vw,32px);line-height:1;color:#f7eef0;text-shadow:0 2px 24px rgba(0,0,0,.5);}
  .powered .chim .the{font-weight:500;color:var(--muted);letter-spacing:.02em;font-size:.42em;vertical-align:middle;
    margin-right:.28em;text-transform:none;}
  #dots{position:absolute;left:50%;top:50%;transform:translate(-50%,-46%);z-index:1;pointer-events:none;}

  .h-sub{max-width:720px;margin:clamp(22px,4vw,36px) auto 0;color:var(--ink-dim);font-size:clamp(15.5px,1.9vw,18px);}
  .h-sub b{color:#fff;font-weight:700;}
  /* ---- pricing CTAs ---- */
  /* The top margin is what separates the cards from the hero paragraph above
     them. It was 0, so "manual mode — your call." sat directly on the top
     card edge and the two read as one block. Scales with the viewport the
     same way .h-sub's own margin does, so the gap stays proportional
     instead of collapsing on a small screen and gaping on a large one. */
  .ctas{display:grid;grid-template-columns:1fr 1fr;gap:18px;max-width:860px;
    margin:clamp(30px,4.5vw,52px) auto 0;}
  @media(max-width:680px){.ctas{grid-template-columns:1fr}}
  .cta-card{position:relative;overflow:hidden;text-align:left;text-decoration:none;display:block;border-radius:18px;
    padding:26px 26px 24px;border:1px solid var(--line-2);background:linear-gradient(180deg,var(--card),var(--card-2));
    transition:transform .25s cubic-bezier(.2,.7,.2,1),border-color .25s,box-shadow .25s;}
  .cta-card:hover{transform:translateY(-4px);border-color:var(--red);box-shadow:0 18px 50px rgba(139,0,16,.4);}
  .cta-card.paid{background:linear-gradient(180deg,#1f0a0d,#150708);border-color:rgba(210,28,40,.4);}
  /* ---- shared cursor spotlight: ONE light rides across every card (easemize) ---- */
  .spot-host{position:relative;--sz:440px;}
  .spot-host>.spot{position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:0;
    background:radial-gradient(var(--sz) var(--sz) at var(--x,-600px) var(--y,-600px),rgba(229,18,31,.18),transparent 62%);
    background-attachment:fixed;}
  .spot-host::before,.spot-host::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:1;
    padding:1.4px;background-attachment:fixed;
    -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
    mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;}
  .spot-host::before{background:radial-gradient(calc(var(--sz)*.78) calc(var(--sz)*.78) at var(--x,-600px) var(--y,-600px),rgba(240,32,44,.95),transparent 72%);filter:brightness(1.35);}
  .spot-host::after{background:radial-gradient(calc(var(--sz)*.5) calc(var(--sz)*.5) at var(--x,-600px) var(--y,-600px),rgba(255,224,226,.8),transparent 70%);}
  .spot-host>.t,.spot-host>.d,.spot-host .kick,.spot-host .big,.spot-host>p,.spot-host .go{position:relative;z-index:2;}
  .cta-card .kick{font-size:11.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--red-hi);}
  .cta-card .big{font-family:var(--serif);font-weight:600;font-size:clamp(22px,3vw,29px);color:#fff;margin:8px 0 2px;line-height:1.1;}
  .cta-card .big .amt{font-family:var(--sans);font-weight:800;}
  .cta-card .big .amt small{font-size:.5em;font-weight:600;color:var(--ink-dim);}
  .cta-card p{color:var(--ink-dim);font-size:14px;margin:8px 0 16px;}
  .cta-card p b{color:#fff;}
  .cta-card .go{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:14.5px;color:#fff;}
  .cta-card .go .arw{transition:transform .25s;}
  .cta-card:hover .go .arw{transform:translateX(5px);}
  .cta-card.paid .go{color:#ffd9dc;}
  /* ---- "watch it run" — empty demo slot above the two pricing cards ----------
     Deliberately holds nothing but its label; the demo video drops in here later.
     It inherits the pricing cards' width (860px) and the large top gap they used
     to own, so the spacing under the hero paragraph is unchanged, and
     `.watch-card + .ctas` then falls back to the grid's own 18px gutter so the
     stack reads on one even rhythm. min-height reserves the slot now so adding
     the demo is a content swap rather than a layout reflow. */
  .watch-card{position:relative;overflow:hidden;display:grid;place-items:center;
    max-width:860px;margin:clamp(30px,4.5vw,52px) auto 0;padding:16px 20px;
    min-height:clamp(68px,9vw,96px);
    border-radius:18px;border:1px solid var(--line-2);
    background:linear-gradient(115deg,#1d080c,var(--card-2) 62%);}
  .watch-card+.ctas{margin-top:18px;}
  .wc-label{font-family:var(--sans);font-weight:800;letter-spacing:.22em;text-transform:uppercase;
    font-size:clamp(12px,1.5vw,14px);color:var(--red-hi);
    animation:wc-flick 20s linear infinite;}
  /* Neon-sign flicker once per 20s. The whole cycle is 20s and the burst occupies
     only 90%->94.5% of it (~0.9s at 18s in), so the panel sits still almost all
     the time and the flick reads as a deliberate signal rather than a loop. The
     card's rim pulses on the same keyframe offsets so the two move together. */
  @keyframes wc-flick{
    0%,89.9%,95%,100%{opacity:1;text-shadow:0 0 12px rgba(229,18,31,.35);}
    90.3%{opacity:.22;text-shadow:none;}
    90.8%{opacity:1;text-shadow:0 0 20px rgba(229,18,31,.95);}
    91.6%{opacity:.12;text-shadow:none;}
    92.3%{opacity:1;text-shadow:0 0 26px rgba(229,18,31,1);}
    93.1%{opacity:.4;text-shadow:none;}
    93.9%{opacity:1;text-shadow:0 0 18px rgba(229,18,31,.7);}
  }
  a.watch-card{animation:wc-rim 20s linear infinite;}
  @keyframes wc-rim{
    0%,89.9%,95%,100%{border-color:var(--line-2);box-shadow:none;}
    90.8%{border-color:var(--red);box-shadow:0 0 26px rgba(196,0,22,.35);}
    91.6%{border-color:var(--line-2);box-shadow:none;}
    92.3%{border-color:var(--red-hi);box-shadow:0 0 34px rgba(229,18,31,.45);}
    93.9%{border-color:var(--red);box-shadow:0 0 20px rgba(196,0,22,.28);}
  }
  /* a hover must never be fighting the flicker for the same properties */
  a.watch-card:hover{animation:none;}
  @media(prefers-reduced-motion:reduce){
    .wc-label,a.watch-card{animation:none;}
  }
  /* it opens the demo, so it has to look pressable */
  a.watch-card{text-decoration:none;cursor:pointer;
    transition:transform .25s cubic-bezier(.2,.7,.2,1),border-color .25s,box-shadow .25s;}
  a.watch-card:hover{transform:translateY(-3px);border-color:var(--red);box-shadow:0 16px 44px rgba(139,0,16,.38);}
  a.watch-card:focus-visible{outline:2px solid var(--red-hi);outline-offset:3px;}
  /* ---- demo player modal (reuses the .modal system the signup form uses) ---- */
  .modal-panel.demo{max-width:min(920px,94vw);background:#0b0405;border:1px solid var(--line-2);
    border-radius:16px;padding:44px 16px 16px;box-shadow:0 30px 80px rgba(0,0,0,.6);}
  #demo-video{display:block;width:100%;max-height:72vh;border-radius:10px;background:#000;}
  #demo-video[hidden]{display:none;}
  .demo-soon{margin:0;padding:44px 12px;text-align:center;color:var(--ink-dim);font-size:15px;}
  /* ---- reveal ---- */
  .rv{opacity:0;transform:translateY(26px) scale(.985);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1);}
  .rv.in{opacity:1;transform:none;}
  @media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}.h-gold{animation:none}}
  /* ---- cards / grids ---- */
  .grid{display:grid;gap:16px;}
  .g2{grid-template-columns:repeat(2,1fr);} .g3{grid-template-columns:repeat(3,1fr);}
  @media(max-width:760px){.g2,.g3{grid-template-columns:1fr}}
  .card{position:relative;overflow:hidden;border-radius:16px;padding:22px 22px;border:1px solid var(--line);
    background:linear-gradient(180deg,var(--card),var(--card-2));transition:transform .25s,border-color .25s;}
  .card:hover{transform:translateY(-3px);border-color:var(--line-2);}
  /* card cursor-light provided by the shared .spot-host system above */
  .card .t{font-weight:700;color:#fff;font-size:17px;margin-bottom:6px;display:flex;gap:11px;align-items:baseline;}
  /* The title is a flex container so the numbered badge can sit beside the text.
     Any INLINE element inside the title would otherwise become its own flex item and
     collect an 11px `gap` on both sides — rendering e.g. "Leakage  detection  , not
     just avoidance". `display:contents` removes those boxes from the flex layout while
     keeping their inherited styling (italic/bold), so the title stays ONE text run. */
  .card .t > i,.card .t > em,.card .t > b,.card .t > strong,.card .t > span:not(.n){display:contents;}
  .card .t .n{flex:none;width:26px;height:26px;border-radius:8px;display:grid;place-items:center;font-size:13px;font-weight:800;
    color:#f2c2c6;background:rgba(210,28,40,.12);border:1px solid var(--line-2);}
  .card .d{color:var(--ink-dim);font-size:14.5px;}
  .card .d b{color:#fff;}
  .card.red{background:linear-gradient(165deg,var(--red-2),var(--red-3));border-color:rgba(220,42,54,.28);}
  .card.red .t,.card.red .d b{color:#fff;} .card.red .d{color:#f6d7da;}
  .card.red .t .n{background:rgba(0,0,0,.28);color:#fff;border-color:rgba(255,255,255,.24);}
  /* ---- decision ledger (Mission "How") ----------------------------------
     A question/answer table rather than a card grid: the left column is what a
     senior data scientist argues about, the right is the measurement that
     settles it. 1px gaps over a line-coloured background give hairline rules
     without per-row borders doubling up at the seams. */
  .ledger{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);
    border-radius:16px;overflow:hidden;margin-top:8px;}
  .ledger .lrow{display:grid;grid-template-columns:minmax(190px,.85fr) 1.55fr;gap:10px 22px;
    padding:17px 21px;background:var(--card-2);transition:background .25s;}
  .ledger .lrow:hover{background:var(--card);}
  .ledger .lq{font-family:var(--serif);font-weight:600;color:#fff;font-size:16.5px;line-height:1.3;}
  .ledger .la{color:var(--ink-dim);font-size:14.5px;}
  .ledger .la b{color:#fff;}
  @media(max-width:760px){
    .ledger .lrow{grid-template-columns:1fr;gap:5px;padding:15px 17px;}
    .ledger .lq{font-size:16px;}
  }
  /* ---- evidence / pull ---- */
  .evid{list-style:none;padding:0;margin:0;display:grid;gap:11px;}
  .evid li{border-radius:12px;padding:14px 16px;font-size:15px;color:#e7cfd1;
    background:var(--card-2);border:1px solid var(--line);border-left:3px solid var(--red);}
  .evid li b{color:#fff;}
  .pull{margin-top:22px;border-radius:18px;padding:26px 28px;font-family:var(--serif);font-weight:500;font-style:italic;
    font-size:clamp(20px,2.6vw,26px);color:#fff;line-height:1.4;
    background:radial-gradient(700px 240px at 0 0,rgba(210,28,40,.22),transparent),linear-gradient(180deg,#1a080a,#120607);
    border:1px solid var(--line-2);}
  .pull span{color:#e5121f;font-style:normal;}
  /* ---- not list ---- */
  .not{display:grid;gap:11px;}
  .not .row{display:flex;gap:13px;align-items:flex-start;border-radius:12px;padding:13px 16px;
    background:var(--card-2);border:1px solid var(--line);}
  .not .x{color:var(--no);font-weight:900;font-size:17px;line-height:1.4;}
  .not b{color:#fff;}
  /* ---- table ---- */
  .tablewrap{overflow-x:auto;border:1px solid var(--line-2);border-radius:18px;background:#0d0607;}
  table{border-collapse:collapse;width:100%;min-width:900px;font-size:13px;}
  th,td{padding:11px 10px;text-align:center;border-bottom:1px solid var(--line);}
  thead th{background:#170709;font-size:11.5px;color:var(--muted);font-weight:800;vertical-align:bottom;
    text-transform:uppercase;letter-spacing:.03em;line-height:1.25;}
  td:first-child,th:first-child{text-align:left;color:var(--ink);font-weight:700;min-width:220px;position:sticky;left:0;background:#0d0607;}
  thead th:first-child{background:#170709;}
  thead th.me,tbody td.me{background:rgba(210,28,40,.15);}
  thead th.me{color:#e5121f;font-weight:900;}
  .mk{font-weight:900;font-size:15px;} .mk.good{color:var(--good)} .mk.part{color:var(--part)} .mk.no{color:var(--no)} .mk.na{color:var(--na)}
  td .note{display:block;color:var(--na);font-size:10.5px;margin-top:1px;}
  /* ---- stats ---- */
  .stat{border-radius:16px;padding:20px;background:var(--card-2);border:1px solid var(--line);}
  .stat .v{font-size:31px;font-weight:900;color:#e5121f;line-height:1;}
  .stat .l{color:var(--ink-dim);font-size:13.5px;margin-top:8px;} .stat .l b{color:var(--ink);}
  .stat .src{color:var(--na);font-size:11px;font-style:italic;}
  .stat.accent{display:grid;place-items:center;text-align:center;background:linear-gradient(150deg,var(--red-2),var(--red-3));border-color:rgba(220,42,54,.28);}
  .stat.accent .l{color:#fff;font-weight:600;font-size:15.5px;font-family:var(--serif);}
  /* ---- signup modal ----------------------------------------------------------
   The signup form used to sit inline under the pricing cards, which pushed the
   two-up card grid down the page and made "start a trial" a scroll instead of a
   click. It is now a modal opened by every trial/pay CTA ([data-signup]).

   z-index 100 clears the sticky nav (z-index 50) — a modal that the nav bar can
   overlap is not a modal. `hidden` does the actual hiding, so the panel is inert
   for assistive tech until opened; .modal[hidden]{display:none} is stated
   explicitly because `display:flex` below would otherwise beat the UA default
   for [hidden] and the panel would be permanently visible. */
.modal{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:20px;}
.modal[hidden]{display:none;}
.modal-scrim{position:absolute;inset:0;background:rgba(0,0,0,.72);backdrop-filter:blur(3px);
  animation:modal-fade .18s ease-out;}
.modal-panel{position:relative;z-index:1;width:100%;max-width:520px;max-height:calc(100vh - 40px);
  overflow-y:auto;animation:modal-rise .22s cubic-bezier(.2,.7,.2,1);}
/* The panel keeps the .signup class so every existing form rule still applies;
   only the two properties that made sense INLINE are overridden here. */
.modal-panel.signup{margin:0;box-shadow:0 30px 80px rgba(0,0,0,.6);}
.modal-x{position:absolute;top:12px;right:14px;width:34px;height:34px;display:grid;place-items:center;
  border:none;border-radius:9px;background:transparent;color:var(--ink-dim);font-size:26px;line-height:1;
  cursor:pointer;transition:color .2s,background .2s;}
.modal-x:hover{color:#fff;background:var(--card-2);}
.modal-x:focus-visible{outline:2px solid var(--red-hi);outline-offset:2px;}
.signup .turnstile-box{margin:2px 0 18px;min-height:65px;}
@keyframes modal-fade{from{opacity:0}to{opacity:1}}
@keyframes modal-rise{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
/* Honour the OS setting: an entrance animation is decoration, and this project
   already respects prefers-reduced-motion elsewhere (the scroll-reveal delay). */
@media(prefers-reduced-motion:reduce){
  .modal-scrim,.modal-panel{animation:none;}
}
/* Scroll lock. Applied to <html> rather than <body> so it also pins the
   scroll position in WebKit, which otherwise jumps to the top on unlock. */
html.modal-open{overflow:hidden;}

/* ---- signup form (email capture -> cardless trial via the Paddle-Keygen Worker) ---- */
  .signup{max-width:520px;margin:30px auto 0;text-align:left;border-radius:18px;padding:26px 26px 24px;
    border:1px solid var(--line-2);background:linear-gradient(180deg,var(--card),var(--card-2));}
  .signup h3{font-family:var(--serif);font-weight:600;font-size:clamp(20px,2.6vw,24px);color:#fff;margin:0 0 6px;}
  .signup .signup-sub{color:var(--ink-dim);font-size:14px;margin:0 0 20px;}
  .signup .field{margin-bottom:16px;}
  .signup label{display:block;font-size:13px;font-weight:600;color:var(--ink-dim);margin-bottom:6px;}
  .signup input[type=email]{width:100%;padding:12px 14px;border-radius:10px;font-size:15px;font-family:var(--sans);
    color:var(--ink);background:var(--card-2);border:1px solid var(--line-2);transition:border-color .2s;}
  .signup input[type=email]::placeholder{color:var(--muted);}
  .signup input[type=email]:focus-visible{outline:2px solid var(--red-hi);outline-offset:2px;border-color:var(--red-hi);}
  .signup fieldset.kind{border:none;padding:0;margin:0 0 18px;}
  .signup fieldset.kind legend{font-size:13px;font-weight:600;color:var(--ink-dim);margin-bottom:8px;padding:0;}
  .signup .radio{display:inline-flex;align-items:center;gap:7px;font-size:14px;color:var(--ink);font-weight:500;
    margin-right:22px;cursor:pointer;}
  .signup .radio input{accent-color:var(--red-hi);width:16px;height:16px;cursor:pointer;margin:0;}
  .signup .radio input:focus-visible{outline:2px solid var(--red-hi);outline-offset:2px;}
  .signup .cf-turnstile{margin:2px 0 18px;}
  .signup button[type=submit]{width:100%;}
  .signup button[type=submit]:focus-visible{outline:2px solid #fff;outline-offset:3px;}
  .signup button[type=submit]:disabled{opacity:.6;cursor:not-allowed;}
  .signup .status{margin:14px 0 0;font-size:13.5px;line-height:1.5;min-height:1.4em;color:var(--ink-dim);}
  .signup .status.ok{color:var(--good);}
  .signup .status.err{color:var(--no);}
  /* ---- final cta ---- */
  .finalcta{margin-top:clamp(56px,9vw,90px);text-align:center;border-radius:22px;padding:clamp(34px,6vw,56px) 28px;
    background:radial-gradient(800px 300px at 50% -40px,rgba(210,28,40,.24),transparent),linear-gradient(180deg,#1c080a,#120607);
    border:1px solid var(--line-2);}
  .finalcta h3{font-family:var(--serif);font-weight:600;font-size:clamp(26px,4vw,38px);color:#fff;margin:0 0 10px;}
  .finalcta p{color:var(--ink-dim);margin:0 auto 24px;max-width:600px;} .finalcta p b{color:#fff;}
  .btnrow{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}
  .btn{display:inline-block;padding:14px 26px;border-radius:12px;font-weight:700;font-size:15px;text-decoration:none;cursor:pointer;}
  .btn.pri{color:#fff;background:linear-gradient(180deg,var(--red),var(--red-2));border:1px solid rgba(220,42,54,.35);box-shadow:0 8px 28px rgba(139,0,16,.5);}
  .btn.ghost{color:var(--ink);background:rgba(255,255,255,.03);border:1px solid var(--line-2);}
  /* ---- footer ---- */
  .fhero{position:relative;overflow:hidden;margin-top:clamp(56px,9vw,88px);text-align:center;
    padding:clamp(50px,9vw,90px) 24px;border-top:1px solid var(--line-2);
    background:radial-gradient(700px 300px at 50% 120%,rgba(139,0,16,.4),transparent 60%);}
  .fhero .built{font-family:var(--sans);font-weight:600;letter-spacing:.24em;text-transform:uppercase;font-size:12px;color:var(--muted);}
  .fhero .pr{font-family:var(--disp);font-weight:400;font-size:clamp(46px,11vw,120px);line-height:.9;margin-top:8px;
    background:linear-gradient(180deg,#fff 0%,#e5121f 55%,var(--red-2) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;
    background-size:100% 220%;animation:shine 7s ease-in-out infinite;}
  @keyframes shine{0%,100%{background-position:0 0}50%{background-position:0 100%}}
  @media(prefers-reduced-motion:reduce){.fhero .pr{animation:none}}
  .pr-img{display:block;max-width:min(188px,52vw);height:auto;margin:4px auto 0;}
  .foot{padding:26px 24px 40px;text-align:center;color:var(--na);font-size:12.5px;border-top:1px solid var(--line);}
  .foot .cprt{color:var(--ink-dim);} .foot .cprt b{color:#fff;font-weight:700;}
  .foot a{color:var(--ink-dim);text-decoration:none;} .foot a:hover{color:#fff;}
  .foot .row2{margin-top:10px;display:flex;gap:16px;justify-content:center;flex-wrap:wrap;}
  .foot .em{color:var(--red-hi);font-weight:700;}