/* Trend Machine — design system & styles
   Brand tokens live in :root (base #0C0E1A, green gradient #107239 -> #7CC62E -> #99D42E).
   Reuse these tokens as the foundation for the product UI. */

  :root{
    color-scheme: dark;
    box-sizing: border-box;
    padding-top: env(safe-area-inset-top, 0px);
    padding-bottom: env(safe-area-inset-bottom, 0px);

    /* ——— Trend Machine design tokens ——— */
    --bg:        #0C0E1A;   /* brand base */
    --bg-deep:   #080A12;
    --panel:     #121627;
    --panel-2:   #171C30;
    --line:      rgba(255,255,255,.08);
    --line-soft: rgba(255,255,255,.05);

    --ink:   #EEF1F7;
    --dim:   #99A2B4;
    --faint: #626C80;

    --g1: #107239;  /* forest  */
    --g2: #7CC62E;  /* lime    */
    --g3: #99D42E;  /* bright  */
    --grad: linear-gradient(103deg, var(--g1) 0%, var(--g2) 56%, var(--g3) 100%);
    --grad-soft: linear-gradient(103deg, rgba(16,114,57,.18), rgba(153,212,46,.18));
    --alert: #E7B64B;  /* used ONLY for brand-safety signalling */

    --r-s: 12px; --r-m: 18px; --r-l: 26px; --r-xl: 34px;
    --wrap: 1180px;
    --fs-display: clamp(2.4rem, 5vw, 3.5rem);
    --fs-h2: clamp(1.9rem, 3.4vw, 3rem);
    --fs-h3: clamp(1.15rem, 1.6vw, 1.4rem);
  }
  *{ box-sizing: border-box; }
  html{ scroll-behavior: smooth; scroll-padding-top: calc(78px + env(safe-area-inset-top, 0px)); -webkit-text-size-adjust: 100%; }
  body{
    margin:0;
    font-family:"Inter", system-ui, -apple-system, Segoe UI, sans-serif;
    background: var(--bg);
    color: var(--ink);
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  h1,h2,h3,h4{ font-family:"Outfit", system-ui, sans-serif; line-height:1.05; margin:0; letter-spacing:-.02em; font-weight:600; }
  p{ margin:0; }
  a{ color:inherit; text-decoration:none; }
  img{ max-width:100%; display:block; }
  ::selection{ background: rgba(153,212,46,.3); color:#fff; }

  .wrap{ width:100%; max-width:var(--wrap); margin:0 auto; padding-inline:clamp(20px,5vw,40px); }
  .section{ position:relative; padding-block: clamp(72px, 11vw, 140px); }
  .kicker{ display:inline-flex; align-items:center; gap:9px; font-size:.82rem; font-weight:500; color:var(--g3); letter-spacing:.01em; margin-bottom:20px; }
  .kicker::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--g3); box-shadow:0 0 12px rgba(153,212,46,.9); }
  .lead{ color:var(--dim); font-size:1.08rem; max-width:62ch; }
  .grad-text{ background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }

  /* ——— buttons ——— */
  .btn{ display:inline-flex; align-items:center; justify-content:center; gap:10px; font-family:"Inter"; font-weight:600; font-size:.98rem; padding:14px 26px; border-radius:999px; cursor:pointer; border:1px solid transparent; transition:transform .18s ease, box-shadow .25s ease, background .2s ease, border-color .2s ease; white-space:nowrap; }
  .btn-primary{ background:var(--grad); color:#0A1206; box-shadow:0 10px 34px -10px rgba(124,198,46,.6); }
  .btn-primary:hover{ transform:translateY(-2px); box-shadow:0 16px 40px -10px rgba(124,198,46,.75); }
  .btn-ghost{ background:rgba(255,255,255,.035); color:var(--ink); border-color:var(--line); }
  .btn-ghost:hover{ background:rgba(255,255,255,.07); border-color:rgba(255,255,255,.18); }

  /* ——— nav ——— */
  .nav{ position:fixed; inset:0 0 auto 0; z-index:50; padding-top: env(safe-area-inset-top, 0px); transition:background .3s ease, border-color .3s ease, backdrop-filter .3s ease; border-bottom:1px solid transparent; }
  .nav.scrolled{ background:rgba(10,12,20,.72); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); border-bottom-color:var(--line); }
  .nav-inner{ height:78px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
  .brand{ display:flex; align-items:center; gap:12px; font-family:"Outfit"; font-weight:600; font-size:1.18rem; letter-spacing:-.02em; }
  .brand img{ width:34px; height:34px; filter:drop-shadow(0 4px 12px rgba(124,198,46,.45)); }
  .nav-links{ display:flex; align-items:center; gap:30px; }
  .nav-links a{ font-size:.93rem; color:var(--dim); font-weight:500; transition:color .18s ease; }
  .nav-links a:hover{ color:var(--ink); }
  .nav-cta{ display:flex; align-items:center; gap:14px; }
  .menu-btn{ display:none; background:none; border:0; color:var(--ink); cursor:pointer; padding:8px; }

  /* ——— hero ——— */
  .hero{ position:relative; padding-top: clamp(130px, 17vw, 190px); padding-bottom: clamp(60px, 8vw, 90px); overflow:hidden; }
  .hero-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:36px; align-items:center; }
  .hero-pill{ display:inline-flex; align-items:center; gap:10px; padding:7px 15px 7px 11px; border:1px solid var(--line); border-radius:999px; background:rgba(255,255,255,.03); font-size:.84rem; color:var(--dim); margin-bottom:28px; }
  .hero-pill b{ color:var(--g3); font-weight:600; }
  .hero h1{ font-size:var(--fs-display); font-weight:700; line-height:1.0; letter-spacing:-.035em; }
  .hero h1 .ln{ display:block; }
  .hero-sub{ color:var(--dim); font-size:1.18rem; max-width:52ch; margin-top:26px; }
  .hero-actions{ display:flex; gap:14px; margin-top:36px; flex-wrap:wrap; }
  .hero-note{ margin-top:30px; font-size:.86rem; color:var(--faint); }

  /* hero load animation (hidden only when JS is present) */
  .js .hero h1 .ln, .js .hero-pill, .js .hero-sub, .js .hero-actions, .js .hero-note{ opacity:0; transform:translateY(16px); }
  body.loaded .hero-pill{ animation:rise .7s .05s cubic-bezier(.2,.7,.3,1) forwards; }
  body.loaded .hero h1 .ln:nth-child(1){ animation:rise .7s .18s cubic-bezier(.2,.7,.3,1) forwards; }
  body.loaded .hero h1 .ln:nth-child(2){ animation:rise .7s .30s cubic-bezier(.2,.7,.3,1) forwards; }
  body.loaded .hero h1 .ln:nth-child(3){ animation:rise .7s .42s cubic-bezier(.2,.7,.3,1) forwards; }
  body.loaded .hero-sub{ animation:rise .7s .56s cubic-bezier(.2,.7,.3,1) forwards; }
  body.loaded .hero-actions{ animation:rise .7s .66s cubic-bezier(.2,.7,.3,1) forwards; }
  body.loaded .hero-note{ animation:rise .7s .76s cubic-bezier(.2,.7,.3,1) forwards; }
  @keyframes rise{ to{ opacity:1; transform:none; } }

  /* hero visual */
  .hero-visual{ position:relative; min-height:420px; display:flex; align-items:center; justify-content:center; }
  .hero-glow{ position:absolute; width:min(520px,90%); aspect-ratio:1; border-radius:50%;
    background:radial-gradient(circle at 60% 45%, rgba(124,198,46,.34), rgba(16,114,57,.14) 45%, transparent 70%); filter:blur(8px); }
  .hero-arrow{ position:relative; width:min(380px,78%); z-index:2;
    filter:drop-shadow(0 30px 60px rgba(16,114,57,.45)); }
  .js .hero-arrow{ opacity:0; transform:scale(.9) rotate(-3deg); }
  body.loaded .hero-arrow{ animation:arrowIn 1s .35s cubic-bezier(.2,.8,.25,1) forwards; }
  @keyframes arrowIn{ to{ opacity:1; transform:scale(1) rotate(0); } }
  body.loaded .hero-arrow{ animation:arrowIn 1s .35s cubic-bezier(.2,.8,.25,1) forwards, float 7s 1.4s ease-in-out infinite; }
  @keyframes float{ 0%,100%{ transform:translateY(0) rotate(0); } 50%{ transform:translateY(-14px) rotate(.6deg); } }

  .spark{ position:absolute; inset:0; z-index:1; width:100%; height:100%; overflow:visible; }
  .spark path{ fill:none; stroke:url(#sg); stroke-width:2.4; stroke-linecap:round; }
  .js .spark path{ stroke-dasharray:1; stroke-dashoffset:1; }
  body.loaded .spark path{ animation:draw 1.8s .6s ease forwards; }
  @keyframes draw{ to{ stroke-dashoffset:0; } }

  .float-chip{ position:absolute; z-index:3; background:rgba(18,22,39,.82); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); border:1px solid var(--line); border-radius:14px; padding:11px 15px; box-shadow:0 18px 44px -18px rgba(0,0,0,.8); }
  .js .float-chip{ opacity:0; }
  .float-chip .fc-label{ font-size:.72rem; color:var(--faint); }
  .float-chip .fc-val{ font-family:"Outfit"; font-weight:600; font-size:1.1rem; display:flex; align-items:center; gap:7px; }
  .chip-a{ top:16%; left:-2%; }
  .chip-b{ bottom:14%; right:-1%; }
  body.loaded .chip-a{ animation:rise .7s 1.1s cubic-bezier(.2,.7,.3,1) forwards; }
  body.loaded .chip-b{ animation:rise .7s 1.3s cubic-bezier(.2,.7,.3,1) forwards; }
  .dot-up{ color:var(--g3); }

  /* ——— platform coverage strip ——— */
  .coverage{ border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft); }
  .coverage .wrap{ padding-block:26px; display:flex; align-items:center; gap:28px; flex-wrap:wrap; justify-content:center; }
  .coverage .cv-label{ font-size:.82rem; color:var(--faint); }
  .cv-list{ display:flex; gap:12px; flex-wrap:wrap; justify-content:center; }
  .cv-item{ font-family:"Outfit"; font-weight:500; font-size:.96rem; color:var(--dim); padding:6px 15px; border:1px solid var(--line); border-radius:999px; }
  .cv-more{ color:var(--g3); border-color:rgba(124,198,46,.32); font-weight:600; }

  /* ——— capabilities ——— */
  .cap-head{ max-width:760px; margin-bottom:54px; }
  .cap-head h2{ font-size:var(--fs-h2); margin-bottom:18px; }
  .cap-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
  .cap{ background:var(--panel); border:1px solid var(--line); border-radius:var(--r-l); padding:28px 24px; position:relative; overflow:hidden; transition:border-color .25s ease, transform .25s ease; }
  .cap:hover{ border-color:rgba(124,198,46,.4); transform:translateY(-4px); }
  .cap-ic{ width:48px; height:48px; border-radius:13px; display:flex; align-items:center; justify-content:center; background:var(--grad-soft); border:1px solid rgba(124,198,46,.22); color:var(--g3); margin-bottom:20px; }
  .cap h3{ font-size:1.22rem; margin-bottom:9px; }
  .cap p{ color:var(--dim); font-size:.95rem; }

  /* ——— audience split ——— */
  .split-head{ text-align:center; max-width:720px; margin:0 auto 56px; }
  .split-head h2{ font-size:var(--fs-h2); margin-bottom:16px; }
  .split{ display:grid; grid-template-columns:1fr auto 1fr; gap:0; align-items:stretch; }
  .side{ background:var(--panel); border:1px solid var(--line); padding:clamp(28px,3vw,42px); }
  .side.left{ border-radius:var(--r-xl) 0 0 var(--r-xl); border-right:0; }
  .side.right{ border-radius:0 var(--r-xl) var(--r-xl) 0; border-left:0; background:linear-gradient(180deg, rgba(23,28,48,.7), var(--panel)); }
  .seam{ width:62px; display:flex; flex-direction:column; align-items:center; justify-content:center; position:relative; background:transparent; }
  .seam .line{ position:absolute; top:10%; bottom:10%; width:1px; background:linear-gradient(180deg,transparent, var(--line) 20%, var(--line) 80%, transparent); }
  .seam .knot{ width:52px; height:52px; border-radius:50%; background:var(--bg); border:1px solid rgba(124,198,46,.5); display:flex; align-items:center; justify-content:center; color:var(--g3); box-shadow:0 0 30px rgba(124,198,46,.35); z-index:2; }
  .side .tag{ font-family:"Outfit"; font-weight:600; font-size:.9rem; color:var(--g3); margin-bottom:6px; }
  .side h3{ font-size:clamp(1.5rem,2.2vw,2rem); margin-bottom:10px; }
  .side > p{ color:var(--dim); font-size:.98rem; margin-bottom:26px; }
  .feat{ list-style:none; padding:0; margin:0; display:grid; gap:18px; }
  .feat li{ display:flex; gap:14px; }
  .feat .fi{ flex:0 0 auto; width:26px; height:26px; border-radius:8px; background:rgba(124,198,46,.12); color:var(--g3); display:flex; align-items:center; justify-content:center; margin-top:2px; }
  .feat b{ font-family:"Outfit"; font-weight:600; font-size:1.02rem; display:block; margin-bottom:2px; }
  .feat span{ color:var(--dim); font-size:.92rem; }

  /* ——— product preview ——— */
  .preview{ background:var(--bg-deep); border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft); }
  .pv-grid{ display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(36px,5vw,72px); align-items:center; }
  .pv-copy h2{ font-size:var(--fs-h2); margin-bottom:18px; }
  .pv-copy p{ color:var(--dim); margin-bottom:14px; }
  .pv-copy .dashrow{ display:flex; gap:10px; flex-wrap:wrap; margin-top:24px; }
  .dash-chip{ font-size:.85rem; color:var(--ink); border:1px solid var(--line); background:rgba(255,255,255,.03); padding:8px 15px; border-radius:999px; }
  .dash-chip b{ color:var(--g3); font-weight:600; }

  .mock{ background:linear-gradient(160deg,#141A2E,#0E1120); border:1px solid var(--line); border-radius:var(--r-l); padding:18px; box-shadow:0 40px 90px -40px rgba(0,0,0,.9); }
  .mock-bar{ display:flex; align-items:center; gap:7px; padding:4px 4px 16px; }
  .mock-bar i{ width:11px; height:11px; border-radius:50%; background:#2a3147; }
  .mock-bar .mb-title{ margin-left:10px; font-size:.8rem; color:var(--faint); }
  .mock-body{ display:grid; gap:14px; }
  .trend-card{ background:var(--panel); border:1px solid var(--line); border-radius:var(--r-m); padding:18px; }
  .tc-top{ display:flex; justify-content:space-between; align-items:flex-start; gap:12px; margin-bottom:14px; }
  .tc-top .tc-name{ font-family:"Outfit"; font-weight:600; font-size:1.1rem; }
  .tc-plats{ display:flex; gap:6px; margin-top:7px; }
  .tc-plats span{ font-size:.7rem; color:var(--dim); border:1px solid var(--line); border-radius:6px; padding:2px 7px; }
  .fit{ text-align:center; flex:0 0 auto; }
  .fit .ring{ width:58px; height:58px; border-radius:50%; background:conic-gradient(var(--g3) 92%, rgba(255,255,255,.08) 0); display:flex; align-items:center; justify-content:center; }
  .fit .ring span{ width:46px; height:46px; border-radius:50%; background:var(--panel); display:flex; align-items:center; justify-content:center; font-family:"Outfit"; font-weight:700; font-size:1.05rem; }
  .fit small{ display:block; font-size:.68rem; color:var(--faint); margin-top:5px; }
  .tc-spark{ width:100%; height:52px; }
  .tc-stats{ display:flex; gap:18px; margin-top:12px; }
  .tc-stats div{ font-size:.75rem; color:var(--faint); }
  .tc-stats b{ display:block; font-family:"Outfit"; font-size:1.05rem; color:var(--ink); font-weight:600; font-variant-numeric:tabular-nums; }
  .tc-stats b.pos{ color:var(--g3); }
  .mock-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
  .mini{ background:var(--panel); border:1px solid var(--line); border-radius:var(--r-m); padding:16px; }
  .mini .ml{ font-size:.74rem; color:var(--faint); margin-bottom:8px; }
  .mini .mv{ font-family:"Outfit"; font-weight:600; font-size:1.25rem; font-variant-numeric:tabular-nums; }
  .safe-chip{ display:inline-flex; align-items:center; gap:7px; font-size:.82rem; font-weight:600; color:var(--g3); background:rgba(124,198,46,.1); border:1px solid rgba(124,198,46,.3); padding:6px 12px; border-radius:999px; }

  /* ——— brand safety ——— */
  .safety{ position:relative; overflow:hidden; }
  .safety-card{ position:relative; background:linear-gradient(140deg, rgba(231,182,75,.07), rgba(18,22,39,.4) 42%), var(--panel); border:1px solid rgba(231,182,75,.25); border-radius:var(--r-xl); padding:clamp(34px,4.5vw,64px); display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(30px,4vw,56px); align-items:center; }
  .safety .kicker::before{ background:var(--alert); box-shadow:0 0 12px rgba(231,182,75,.9); }
  .safety-card .sh-ic{ width:52px; height:52px; border-radius:14px; background:rgba(231,182,75,.14); border:1px solid rgba(231,182,75,.35); color:var(--alert); display:flex; align-items:center; justify-content:center; margin-bottom:22px; }
  .safety-card h2{ font-size:clamp(1.7rem,3vw,2.6rem); margin-bottom:18px; }
  .safety-card p{ color:var(--dim); margin-bottom:14px; }
  .safety-card .pill-row{ display:flex; gap:10px; flex-wrap:wrap; margin-top:22px; }
  .safety-card .pill-row span{ font-size:.82rem; color:var(--dim); border:1px solid var(--line); border-radius:999px; padding:7px 14px; }
  .alert-demo{ background:var(--bg-deep); border:1px solid var(--line); border-radius:var(--r-m); padding:22px; }
  .alert-demo .ad-head{ display:flex; align-items:center; gap:10px; margin-bottom:16px; font-size:.78rem; color:var(--faint); }
  .alert-box{ border:1px solid rgba(231,182,75,.4); background:rgba(231,182,75,.07); border-radius:14px; padding:16px; margin-bottom:12px; }
  .alert-box .ab-top{ display:flex; align-items:center; gap:9px; color:var(--alert); font-weight:600; font-family:"Outfit"; font-size:.95rem; margin-bottom:7px; }
  .alert-box p{ color:var(--dim); font-size:.88rem; margin:0; }
  .ok-box{ border:1px solid rgba(124,198,46,.35); background:rgba(124,198,46,.07); border-radius:14px; padding:16px; }
  .ok-box .ab-top{ display:flex; align-items:center; gap:9px; color:var(--g3); font-weight:600; font-family:"Outfit"; font-size:.95rem; }

  /* ——— pricing matrix ——— */
  .pm-head{ max-width:720px; margin-bottom:46px; }
  .pm-head h2{ font-size:var(--fs-h2); margin-bottom:16px; }
  .matrix-scroll{ overflow-x:auto; border:1px solid var(--line); border-radius:var(--r-l); background:var(--panel); }
  .matrix{ width:100%; border-collapse:collapse; min-width:680px; }
  .matrix th, .matrix td{ padding:16px 18px; text-align:left; border-bottom:1px solid var(--line-soft); }
  .matrix thead th{ font-family:"Outfit"; font-weight:600; font-size:.9rem; color:var(--dim); background:rgba(255,255,255,.02); }
  .matrix thead th:first-child{ color:var(--ink); }
  .matrix tbody tr:last-child td{ border-bottom:0; }
  .matrix tbody tr:hover td{ background:rgba(124,198,46,.04); }
  .matrix .tier{ display:flex; flex-direction:column; }
  .matrix .tier b{ font-family:"Outfit"; font-weight:600; font-size:1rem; color:var(--ink); }
  .matrix .tier small{ color:var(--faint); font-size:.78rem; }
  .matrix td.rate{ font-variant-numeric:tabular-nums; color:var(--ink); font-size:.95rem; }
  .matrix td.rate span{ color:var(--faint); }
  .pm-note{ margin-top:16px; font-size:.82rem; color:var(--faint); }

  /* ——— directory ——— */
  .dir-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:40px; flex-wrap:wrap; }
  .dir-head h2{ font-size:var(--fs-h2); }
  .dir-grid{ display:grid; grid-template-columns:1fr 1fr; gap:22px; }
  .dir-col{ background:var(--panel); border:1px solid var(--line); border-radius:var(--r-l); padding:24px; }
  .dir-col > header{ display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
  .dir-col > header h3{ font-size:1.2rem; }
  .dir-col > header .count{ font-size:.78rem; color:var(--faint); }
  .listing{ display:flex; align-items:center; gap:14px; padding:14px; border:1px solid var(--line-soft); border-radius:var(--r-m); margin-bottom:12px; transition:border-color .2s ease, background .2s ease; }
  .listing:last-child{ margin-bottom:0; }
  .listing:hover{ border-color:rgba(124,198,46,.35); background:rgba(124,198,46,.03); }
  .av{ flex:0 0 auto; width:44px; height:44px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-family:"Outfit"; font-weight:600; color:#0A1206; font-size:1rem; }
  .listing .li-main{ flex:1 1 auto; min-width:0; }
  .listing .li-name{ font-family:"Outfit"; font-weight:600; font-size:.98rem; display:flex; align-items:center; gap:8px; }
  .listing .li-sub{ font-size:.82rem; color:var(--dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .tierbadge{ font-size:.68rem; font-weight:600; color:var(--g3); border:1px solid rgba(124,198,46,.3); border-radius:6px; padding:1px 7px; }
  .listing .li-rate{ flex:0 0 auto; text-align:right; }
  .listing .li-rate b{ font-family:"Outfit"; font-weight:600; font-size:.92rem; font-variant-numeric:tabular-nums; }
  .listing .li-rate small{ display:block; font-size:.7rem; color:var(--faint); }
  .matchpill{ font-size:.7rem; font-weight:600; color:#0A1206; background:var(--grad); border-radius:6px; padding:2px 7px; }

  /* ——— enterprise ——— */
  .ent-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:52px; }
  .ent-card{ border:1px solid var(--line); border-radius:var(--r-l); padding:28px 24px; background:var(--panel); }
  .ent-card .ec-tag{ font-size:.76rem; color:var(--g3); font-family:"Outfit"; font-weight:600; margin-bottom:12px; }
  .ent-card h3{ font-size:1.25rem; margin-bottom:10px; }
  .ent-card p{ color:var(--dim); font-size:.92rem; }
  .ent-head{ max-width:720px; }
  .ent-head h2{ font-size:var(--fs-h2); margin-bottom:16px; }

  /* ——— cta ——— */
  .cta-wrap{ position:relative; background:linear-gradient(150deg, rgba(16,114,57,.16), rgba(153,212,46,.08) 60%, transparent), var(--panel); border:1px solid rgba(124,198,46,.25); border-radius:var(--r-xl); padding:clamp(40px,6vw,80px); text-align:center; overflow:hidden; }
  .cta-wrap::after{ content:""; position:absolute; width:460px; height:460px; border-radius:50%; background:radial-gradient(circle, rgba(124,198,46,.22), transparent 68%); top:-200px; right:-120px; pointer-events:none; }
  .cta-wrap h2{ font-size:clamp(2rem,4vw,3.2rem); margin-bottom:18px; position:relative; }
  .cta-wrap p{ color:var(--dim); max-width:52ch; margin:0 auto 34px; position:relative; }
  .signup{ display:flex; gap:12px; max-width:480px; margin:0 auto; position:relative; flex-wrap:wrap; justify-content:center; }
  .signup input{ flex:1 1 240px; background:var(--bg-deep); border:1px solid var(--line); color:var(--ink); border-radius:999px; padding:14px 22px; font-family:"Inter"; font-size:.98rem; outline:none; transition:border-color .2s ease; }
  .signup input:focus{ border-color:rgba(124,198,46,.6); }
  .signup input::placeholder{ color:var(--faint); }
  .cta-check{ display:inline-flex; align-items:center; gap:10px; margin-top:20px; font-size:.88rem; color:var(--dim); cursor:pointer; position:relative; }
  .cta-check input{ appearance:none; -webkit-appearance:none; width:19px; height:19px; border:1px solid var(--line); border-radius:6px; background:var(--bg-deep); cursor:pointer; flex:0 0 auto; position:relative; transition:border-color .18s ease, background .18s ease, box-shadow .18s ease; }
  .cta-check:hover input{ border-color:rgba(124,198,46,.55); }
  .cta-check input:checked{ background:var(--grad); border-color:transparent; box-shadow:0 0 0 1px rgba(124,198,46,.35), 0 6px 16px -5px rgba(124,198,46,.6); }
  .cta-check input:checked::after{ content:""; position:absolute; left:6px; top:2.5px; width:4px; height:9px; border:solid #0A1206; border-width:0 2px 2px 0; transform:rotate(45deg); }
  .cta-check input:focus-visible{ outline:2px solid var(--g3); outline-offset:2px; }
  .cta-fine{ margin-top:12px; font-size:.82rem; color:var(--faint); position:relative; min-height:1.2em; }

  /* ——— footer ——— */
  .footer{ border-top:1px solid var(--line); padding-block:48px 40px; }
  .foot-grid{ display:flex; justify-content:space-between; align-items:flex-start; gap:40px; flex-wrap:wrap; }
  .foot-brand{ max-width:320px; }
  .foot-brand .brand{ margin-bottom:14px; }
  .foot-brand p{ color:var(--faint); font-size:.88rem; }
  .foot-links{ display:flex; gap:56px; flex-wrap:wrap; }
  .foot-col h4{ font-family:"Outfit"; font-size:.78rem; color:var(--faint); font-weight:600; margin-bottom:14px; letter-spacing:.04em; }
  .foot-col a{ display:block; color:var(--dim); font-size:.9rem; margin-bottom:10px; transition:color .18s ease; }
  .foot-col a:hover{ color:var(--ink); }
  .foot-bottom{ margin-top:40px; padding-top:24px; border-top:1px solid var(--line-soft); display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; align-items:center; }
  .foot-bottom p{ font-size:.82rem; color:var(--faint); }
  .foot-bottom .pdg{ font-size:.78rem; color:var(--faint); letter-spacing:.03em; }
  .foot-bottom .pdg b{ color:var(--dim); font-weight:600; }

  /* ——— responsive ——— */
  @media (min-width:981px){ .hero h1 .ln{ white-space:nowrap; } }
  @media (max-width:980px){
    .hero-grid{ grid-template-columns:1fr; gap:10px; }
    .hero-visual{ order:-1; min-height:300px; }
    .hero-arrow{ width:230px; }
    .cap-grid{ grid-template-columns:1fr 1fr; }
    .pv-grid{ grid-template-columns:1fr; }
    .safety-card{ grid-template-columns:1fr; }
    .ent-grid{ grid-template-columns:1fr; }
    .dir-grid{ grid-template-columns:1fr; }
    .nav-links{ display:none; }
    .menu-btn{ display:inline-flex; }
    .chip-a{ left:0; } .chip-b{ right:0; }
    .nav.open{ background:rgba(10,12,20,.92); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); border-bottom-color:var(--line); }
    .nav.open .nav-links{ display:flex; position:absolute; top:100%; left:0; right:0; flex-direction:column; align-items:flex-start; gap:4px; padding:12px clamp(20px,5vw,40px) 22px; background:rgba(10,12,20,.98); border-bottom:1px solid var(--line); }
    .nav.open .nav-links a{ padding:11px 0; width:100%; font-size:1rem; }
  }
  @media (max-width:560px){
    .cap-grid{ grid-template-columns:1fr; }
    .split{ grid-template-columns:1fr; }
    .side.left{ border-radius:var(--r-xl) var(--r-xl) 0 0; border-right:1px solid var(--line); border-bottom:0; }
    .side.right{ border-radius:0 0 var(--r-xl) var(--r-xl); border-left:1px solid var(--line); }
    .seam{ width:100%; height:62px; flex-direction:row; }
    .seam .line{ top:auto; left:10%; right:10%; bottom:auto; width:auto; height:1px; background:linear-gradient(90deg,transparent,var(--line),transparent); }
    .nav-cta .btn-ghost{ display:none; }
  }
  @media (prefers-reduced-motion: reduce){
    *{ animation:none !important; transition:none !important; scroll-behavior:auto !important; }
    .hero h1 .ln, .hero-pill, .hero-sub, .hero-actions, .hero-note, .hero-arrow, .float-chip{ opacity:1 !important; transform:none !important; }
    .spark path{ stroke-dashoffset:0 !important; }
  }