/* ==========================================================================
   CERTINAL — home.css   (homepage sections only)
   --------------------------------------------------------------------------
   Section styles for the homepage: hero, reveal, reality, unlock, offering,
   stacking deck, command, proof, impact, awards, health, cases, get-demo.
   Loaded ONLY on the homepage (index.astro → Base pageStyles).
   Depends on tokens.css (variables/reset/helpers) + shell.css being loaded
   first. New pages get their OWN <page>.css alongside this one — do not add
   other pages' sections here.
   ========================================================================== */

/* ==========================================================================
   HERO
      Full-bleed light stage w/ decorative lime washes (CSS stands in for
      the scraped bg image), centered copy, spinning CTA, glass stat bar.
   ========================================================================== */
.hero{position:relative;overflow:hidden;background:var(--n-50);min-height:min(92vh,980px);display:flex;flex-direction:column}
.heroBg{position:absolute;inset:0;pointer-events:none}
/* Green now fills the lower ~70% (glows raised to 64–72% + lime introduced by
   ~40% of the vertical ramp); top ~24% stays light for heading readability. */
.heroBg::before{content:"";position:absolute;inset:0;background:
  radial-gradient(62% 58% at 16% 72%,rgba(205,247,87,.52),transparent 72%),
  radial-gradient(56% 52% at 86% 64%,rgba(212,249,121,.46),transparent 72%),
  linear-gradient(#F5F7FC 0%,#FBFEF2 24%,#EFFAD5 56%,#E3F6BE 100%)}
.heroBg::after{content:"";position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(121,150,27,.07) 1px,transparent 1px),
  linear-gradient(rgba(121,150,27,.07) 1px,transparent 1px);
  background-size:32px 32px;
  -webkit-mask-image:linear-gradient(transparent 30%,rgba(0,0,0,.8));mask-image:linear-gradient(transparent 30%,rgba(0,0,0,.8))}
/* brand "layered circle" ripple — HORIZONTALLY CENTERED, rising from the bottom
   of the banner. Centered via left:0/right:0 + margin-inline:auto so the drift/
   breathe animations own `translate`/`scale` with no conflict. Sits above the
   wash but behind content (z-index:1 on .heroInner/.heroStats). */
.hero::after{content:"";position:absolute;left:0;right:0;margin-inline:auto;bottom:-160px;width:min(640px,64%);aspect-ratio:1;
  background:url('/assets/patterns/layered-circle.svg') no-repeat center/contain;opacity:.4;pointer-events:none;z-index:0}
@media (prefers-reduced-motion:no-preference){
  .hero::after{animation:certBreathe 6s ease-in-out infinite,certDrift 9s ease-in-out infinite}
}
/* top padding reserves room for the fixed nav (98px) + product-tabs pill (~68px)
   plus breathing space so the eyebrow never crowds the pill */
.heroInner{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center;max-width:min(1240px,100vw - 48px);margin:0 auto;padding:calc(var(--nav-offset) + clamp(48px,7vh,88px)) clamp(20px,4vw,48px) clamp(28px,4vh,40px)}
.heroEyebrow{font-size:var(--text-xs);font-weight:var(--w-primary);letter-spacing:.2em;text-transform:uppercase;color:var(--lime-800);margin-bottom:18px}
.heroTitle{font-size:var(--h1);font-weight:var(--w-primary);line-height:var(--lh-h1);letter-spacing:-.03em;color:var(--n-950);max-width:26ch;text-wrap:balance}
.heroSub{font-size:var(--text-lg);line-height:var(--lh-body);color:var(--text-secondary);max-width:720px;margin-top:clamp(22px,3vh,30px)}
.heroCtas{display:inline-flex;flex-wrap:wrap;gap:var(--s-2);margin-top:clamp(28px,4vh,40px)}

/* glass stat bar floating at hero bottom */
.heroStats{position:relative;z-index:1;margin:auto auto clamp(24px,4vh,40px);display:flex;justify-content:space-evenly;align-items:center;gap:clamp(20px,3vw,40px);width:min(860px,100% - 32px);padding:28px clamp(32px,5vw,64px);background:rgba(255,255,255,.82);backdrop-filter:blur(10px) saturate(135%);border:1px solid rgba(255,255,255,.9);border-radius:var(--r-lg);box-shadow:0 18px 44px rgba(62,79,5,.14),inset 0 1px #fff}
.statBarItem{text-align:center}
.statBarNum{display:block;font-size:clamp(2rem,3.4vw,2.8rem);font-weight:var(--w-stat);line-height:1;letter-spacing:-.02em;background:var(--grad-text);-webkit-background-clip:text;background-clip:text;color:transparent;font-variant-numeric:tabular-nums}
.statBarLabel{display:block;margin-top:8px;font-size:var(--text-sm);color:var(--text-secondary)}
.statBarDivider{width:1px;height:46px;background:linear-gradient(transparent,rgba(121,150,27,.45),transparent)}

/* ==========================================================================
   REVEAL SECTION — word-by-word brighten on scroll + 3 arc cards
   ========================================================================== */
.revealSection{background:linear-gradient(#F1FCDB 0%,#FAFDF2 55%,#fff 100%);padding:clamp(64px,12vh,130px) 0 clamp(12px,2vh,22px)}
.revealText{max-width:1120px;margin:0 auto;text-align:center;font-size:clamp(1.05rem,1.5vw,1.45rem);font-weight:var(--w-primary);line-height:1.45;letter-spacing:-.012em;color:var(--n-900);text-wrap:balance}
.revealWord{display:inline;opacity:.12;will-change:opacity} /* JS raises opacity per scroll progress */

.arcBlock{margin-top:clamp(56px,9vh,100px);padding-bottom:clamp(48px,8vh,90px)}
.arcEyebrow{text-align:center;font-size:var(--h5);font-weight:var(--w-secondary);color:var(--heading-2);margin-bottom:var(--s-4)}
.arcGrid{display:flex;align-items:stretch;justify-content:center;gap:var(--s-2);max-width:1140px;margin:0 auto}
.arcCard{flex:1;background:linear-gradient(#fff,#FDFFF4);border:1px solid var(--border);border-radius:var(--r-lg);padding:clamp(24px,2.6vw,32px);box-shadow:inset 0 1px #fff,0 8px 24px rgba(62,79,5,.06);transition:transform .3s var(--ease-lift),box-shadow .3s,border-color .3s}
.arcCard:hover{transform:translateY(-5px);border-color:rgba(153,186,53,.5);box-shadow:0 18px 42px rgba(121,150,27,.16)}
.arcTop{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--s-2)}
.arcIcon{width:44px;height:44px;border-radius:var(--r-md);background:linear-gradient(135deg,var(--lime-100),var(--lime-300));display:grid;place-items:center;color:var(--lime-900)}
.arcNum{font-size:var(--text-xs);font-weight:var(--w-primary);letter-spacing:.14em;color:var(--text-muted)}
.arcTitle{font-size:var(--h5);font-weight:var(--w-primary);letter-spacing:-.01em;margin-bottom:8px}
.arcBody{font-size:var(--text-sm);line-height:var(--lh-sm);color:var(--text-secondary)}
.arcArrow{align-self:center;color:var(--lime-700);flex:0 0 auto}

/* ==========================================================================
   REALITY SECTION — pinned copy left, sticky-stacked stat cards right
   ========================================================================== */
.realitySection{background:linear-gradient(#fff,#F5F7FC);isolation:isolate;overflow-x:clip;padding:clamp(12px,2vh,24px) 0 clamp(56px,9vh,110px)}
.realityGrid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(40px,6vw,96px);max-width:1280px;margin:0 auto;padding:0 clamp(20px,4vw,56px);align-items:start}
.realityCopy{position:sticky;top:0;height:100vh;padding:var(--reality-pin-top) 0 24px;align-self:start}
.realityTitle{font-size:var(--h2);font-weight:var(--w-primary);line-height:var(--lh-h2);letter-spacing:-.025em;margin-bottom:28px}
.realityQuote{background:#fff;border:1px solid var(--border);border-radius:var(--r-lg);padding:26px 28px;box-shadow:0 10px 30px rgba(62,79,5,.07)}
.realityQuoteText{color:var(--lime-800);font-style:italic;font-size:1.3rem;font-weight:var(--w-primary);line-height:1.4;margin-bottom:10px}
.realityQuoteSub{font-size:var(--text-sm);line-height:var(--lh-sm);color:var(--text-secondary)}
.realityStack{min-height:210vh} /* tall runway so the sticky cards stack through */
.realitySlot{position:sticky;margin:0 0 12vh}
/* stagger the stick offsets so each card rests slightly below the previous */
.realitySlot:nth-child(1){top:calc(var(--reality-pin-top) + 64px);z-index:1}
.realitySlot:nth-child(2){top:calc(var(--reality-pin-top) + 180px);z-index:2}
.realitySlot:nth-child(3){top:calc(var(--reality-pin-top) + 296px);z-index:3}
.realityCard{position:relative;background:linear-gradient(#fff,#FDFFF7);border:1px solid var(--border);border-radius:var(--r-lg);padding:clamp(32px,3.4vw,44px) clamp(30px,3.2vw,44px);box-shadow:inset 0 1px #fff,0 8px 24px rgba(62,79,5,.05),0 24px 48px rgba(62,79,5,.06);overflow:hidden}
.realityCard::before{content:"";position:absolute;top:-60px;right:-60px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(205,247,87,.35),transparent 70%)}
.realityCard[data-top="true"]{box-shadow:inset 0 1px #fff,0 14px 32px rgba(62,79,5,.1),0 32px 64px rgba(62,79,5,.12)}
.realityCardTag{position:absolute;top:22px;right:24px;font-size:var(--text-xs);font-weight:var(--w-secondary);letter-spacing:.08em;text-transform:uppercase;color:var(--lime-900);background:linear-gradient(135deg,rgba(241,252,219,.9),rgba(227,246,190,.7));border:1px solid rgba(153,186,53,.35);border-radius:var(--r-full);padding:6px 12px}
.realityCardStat{display:block;font-size:clamp(2.4rem,3.6vw,3.1rem);font-weight:var(--w-stat);line-height:1;letter-spacing:-.02em;background:var(--grad-text);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:18px}
.realityCardBody{font-size:var(--text-md);line-height:var(--lh-body);color:var(--text-secondary);max-width:44ch}
.realityCardNote{display:flex;align-items:center;gap:8px;margin-top:20px;font-size:var(--text-xs);color:var(--text-muted)}
.realityCardNoteDot{width:6px;height:6px;border-radius:50%;background:var(--lime-600)}

/* ==========================================================================
   UNLOCK SECTION — grid-paper bg, glass panel, sweep divider, glow card
   ========================================================================== */
.unlockSection{position:relative;isolation:isolate;overflow:hidden;padding:clamp(56px,9vh,110px) 0 clamp(64px,10vh,120px);background:
  radial-gradient(40% 34% at 16% 18%,rgba(212,249,121,.35),transparent 70%),
  radial-gradient(38% 30% at 86% 70%,rgba(205,247,87,.3),transparent 70%),
  linear-gradient(#fff,#F7FBEA 55%,#EFF8D8)}
.unlockSection::before{content:"";position:absolute;inset:0;z-index:-1;background:
  linear-gradient(90deg,rgba(121,150,27,.08) 1px,transparent 1px),
  linear-gradient(rgba(121,150,27,.08) 1px,transparent 1px);
  background-size:32px 32px;
  -webkit-mask-image:linear-gradient(transparent,rgba(0,0,0,.7) 28%,rgba(0,0,0,.9));mask-image:linear-gradient(transparent,rgba(0,0,0,.7) 28%,rgba(0,0,0,.9))}
.unlockHead{max-width:760px;margin:0 auto var(--s-6);text-align:center}
.unlockTitle{font-size:var(--h2);font-weight:var(--w-primary);line-height:var(--lh-h2);letter-spacing:-.025em}
.unlockSub{font-size:var(--text-lg);color:var(--text-secondary);margin-top:14px}
.unlockSub em{color:var(--n-800)}
.unlockPanel{display:grid;grid-template-columns:minmax(0,1fr) minmax(200px,30%);gap:clamp(20px,2.6vw,32px);max-width:1140px;margin:0 auto;padding:clamp(24px,3vw,40px);background:rgba(255,255,255,.72);backdrop-filter:blur(20px) saturate(160%);border:1px solid rgba(255,255,255,.8);border-radius:var(--r-lg);box-shadow:inset 0 1px #fff,0 18px 50px rgba(92,115,18,.1)}
.unlockFlow{display:flex;flex-direction:column;gap:18px;justify-content:center}
.unlockRow{display:grid;grid-template-columns:clamp(76px,8vw,96px) 1fr;gap:14px;align-items:center}
.unlockRowLabel{display:flex;align-items:center;gap:8px;font-size:var(--text-xs);font-weight:var(--w-primary);letter-spacing:.1em;text-transform:uppercase;color:var(--lime-900)}
.unlockDot{width:8px;height:8px;border-radius:50%;background:var(--lime-600)}
.unlockDotB{background:var(--lime-800)}
.unlockChips{display:flex;gap:10px}
.unlockChip{flex:1 1 0;text-align:center;font-size:.86rem;font-weight:var(--w-primary);border-radius:var(--r-md);padding:14px 16px;transition:transform .26s var(--ease-lift),background .26s,border-color .26s,box-shadow .26s}
.unlockChipA{background:rgba(205,247,87,.18);border:1px solid rgba(153,186,53,.3);color:var(--n-900)}
.unlockChipA:hover{transform:translateY(-3px);box-shadow:0 10px 22px rgba(121,150,27,.2)}
.unlockChipB{background:rgba(92,115,18,.08);border:1px solid rgba(92,115,18,.22);color:var(--n-900)}
.unlockChipB:hover{transform:translateY(-3px);box-shadow:0 10px 22px rgba(92,115,18,.18)}
/* animated sweep divider between the two rows */
.unlockDivider{display:flex;align-items:center;gap:14px}
.unlockDividerLine{flex:1;height:2px;border-radius:2px;background:linear-gradient(90deg,rgba(205,247,87,0),var(--lime-500) 25%,var(--lime-300) 50%,var(--lime-500) 75%,rgba(205,247,87,0)) 0 0/220% 100%;animation:unlockSweep 3s linear infinite}
.unlockDividerLabel{font-size:var(--text-xs);letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted)}
@keyframes unlockSweep{0%{background-position:220% 0}to{background-position:-220% 0}}
/* solid lime result card with breathing glow (dark text — Certinal rule) */
.unlockFill{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:12px;background:linear-gradient(160deg,var(--lime-300),var(--lime-400) 50%,var(--lime-500));border-radius:var(--r-lg);padding:clamp(24px,2.6vw,32px);color:var(--n-950);box-shadow:0 14px 34px rgba(121,150,27,.32),inset 0 1px rgba(255,255,255,.4)}
.unlockFill::before{content:"";position:absolute;left:50%;top:-40%;width:160%;height:120%;transform:translateX(-50%);background:radial-gradient(circle,rgba(255,255,255,.5),transparent 65%);animation:unlockGlow 5s ease-in-out infinite}
@keyframes unlockGlow{0%,to{opacity:.7;transform:translateX(-50%) scale(1)}50%{opacity:1;transform:translateX(-50%) scale(1.12)}}
.unlockFillIcon{position:relative;width:50px;height:50px;border-radius:var(--r-md);background:rgba(20,20,21,.9);color:var(--lime-400);display:grid;place-items:center}
.unlockFillTag{position:relative;font-size:clamp(1.6rem,2.4vw,2rem);font-weight:800;letter-spacing:-.02em}
.unlockFillCaption{position:relative;font-size:var(--text-sm);line-height:var(--lh-sm);color:var(--n-900)}
.unlockFootnote{max-width:1140px;margin:18px auto 0;font-size:var(--text-sm);color:var(--text-muted)}
.unlockNote{display:flex;gap:14px;max-width:1140px;margin:var(--s-4) auto 0;background:#fff;border:1px solid var(--border);border-radius:var(--r-md);padding:20px 24px}
.unlockNoteIcon{flex:0 0 auto;width:38px;height:38px;border-radius:var(--r-sm);background:var(--lime-100);color:var(--lime-900);display:grid;place-items:center}
.unlockNoteTitle{font-weight:var(--w-primary);margin-bottom:4px}
.unlockNoteBody{font-size:var(--text-sm);line-height:var(--lh-sm);color:var(--text-secondary)}

/* ==========================================================================
   OFFERING SECTION — dotted bg, 3 lift cards with top accent bar
   ========================================================================== */
.offeringSection{position:relative;background:#fff;padding:clamp(56px,9vh,110px) 0 clamp(64px,10vh,120px)}
.offeringSection::before{content:"";position:absolute;inset:0;background:radial-gradient(circle,rgba(121,150,27,.2) .9px,transparent 1px);background-size:20px 20px;-webkit-mask-image:linear-gradient(rgba(0,0,0,.7),transparent 55%);mask-image:linear-gradient(rgba(0,0,0,.7),transparent 55%)}
.offeringHead{position:relative;max-width:760px;margin:0 auto var(--s-6);text-align:center}
.offeringTitle{font-size:var(--h2);font-weight:var(--w-primary);line-height:var(--lh-h2);letter-spacing:-.025em}
.offeringSub{font-size:var(--text-lg);color:var(--text-secondary);margin-top:14px}
.offeringGrid{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,2.4vw,28px);max-width:1280px;margin:0 auto;padding:0 clamp(20px,4vw,56px)}
.offeringCard{position:relative;overflow:hidden;background:linear-gradient(#fff,#FDFFF7 55%,#FAFDF0);border:1px solid var(--border);border-radius:var(--r-lg);padding:clamp(28px,2.8vw,36px);box-shadow:inset 0 1px #fff,0 8px 24px rgba(62,79,5,.06);transition:transform .32s var(--ease-lift),box-shadow .32s,border-color .32s}
.offeringCard::after{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad-strip);opacity:0;transition:opacity .32s}
.offeringCard:hover{transform:translateY(-6px);border-color:rgba(153,186,53,.5);box-shadow:0 20px 48px rgba(121,150,27,.16)}
.offeringCard:hover::after{opacity:1}
.offeringStep{display:inline-block;font-size:11px;font-weight:var(--w-primary);letter-spacing:.14em;text-transform:uppercase;color:var(--lime-800);background:var(--lime-50);border-radius:var(--r-full);padding:6px 12px;margin-bottom:18px}
.offeringCardTitle{font-size:var(--h4);font-weight:var(--w-primary);line-height:var(--lh-h4);letter-spacing:-.015em;margin-bottom:12px}
.offeringCardBody{font-size:var(--text-md);line-height:var(--lh-body);color:var(--text-secondary)}

/* ==========================================================================
   STACKING DECK — 260vh runway, sticky stage, JS-driven card stack.
      Static fallback list replaces it under 900px.
   ========================================================================== */
.deckSection{position:relative;background:linear-gradient(#fff,#F5F7FC);padding:24px 32px 64px}
.deckSection::before{content:"";position:absolute;inset:0;background:radial-gradient(circle,rgba(121,150,27,.18) .9px,transparent 1px);background-size:20px 20px;-webkit-mask-image:linear-gradient(rgba(0,0,0,.8),transparent 22%);mask-image:linear-gradient(rgba(0,0,0,.8),transparent 22%)}
.deckIntro{position:relative;text-align:center;max-width:1444px;margin:0 auto 40px}
.deckIntroTitle{font-size:var(--h2);font-weight:var(--w-primary);line-height:1.08;letter-spacing:-.03em;max-width:24ch;margin:12px auto 0}
.deckScrollArea{position:relative;height:260vh;max-width:1444px;margin:0 auto}
.deckStage{position:sticky;top:12px;height:calc(var(--card-h) + 220px);overflow:clip;overflow-clip-margin:70px;perspective:1000px}
.deckCard{height:var(--card-h);background:#fff;border:1px solid var(--n-200);border-radius:var(--r-md);display:flex;flex-direction:column;overflow:hidden;box-shadow:0 22px 55px -18px rgba(92,115,18,.34),0 6px 18px -8px rgba(92,115,18,.16)}
.deckStage .deckCard{position:absolute;left:0;right:0;top:0;will-change:transform} /* JS interpolates translateY/scale */
/* strip header on each deck card */
.strip{display:flex;align-items:center;gap:26px;flex-wrap:wrap;background:linear-gradient(#F7FBEA,#EFF6DC);border-bottom:1px solid var(--n-200);min-height:84px;padding:20px 38px}
.stripNum{font-size:38px;font-weight:var(--w-stat);line-height:1;background:var(--grad-text);-webkit-background-clip:text;background-clip:text;color:transparent}
.stripTitle{font-size:clamp(24px,2vw,35px);font-weight:var(--w-stat);letter-spacing:-.02em;background:var(--grad-text);-webkit-background-clip:text;background-clip:text;color:transparent}
.stripLede{flex:1;min-width:240px;font-size:15.5px;line-height:1.45;color:var(--text-secondary)}
.deckCardBody{flex:1;padding:24px;display:grid;gap:16px;min-height:0}
.duo50{grid-template-columns:1fr 1fr}
.duo4060{grid-template-columns:2fr 3fr}
.duo6040{grid-template-columns:3fr 2fr}
.colStack{display:flex;flex-direction:column;gap:16px;min-height:0}
.panel{background:#FCFDF6;border:1px solid var(--n-100);border-radius:var(--r-md);padding:20px;display:flex;flex-direction:column;gap:12px;min-height:0}
.panelHead{display:flex;align-items:center;gap:12px}
.panelIcon{width:38px;height:38px;border-radius:var(--r-sm);background:linear-gradient(135deg,var(--lime-100),var(--lime-300));color:var(--lime-900);display:grid;place-items:center;flex:0 0 auto}
.panelTitle{font-size:clamp(18px,1.5vw,24px);font-weight:var(--w-primary);letter-spacing:-.01em}
.panelBody{font-size:var(--text-md);line-height:1.55;color:var(--text-secondary)}
/* stat tiles inside deck cards */
.statRow{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:auto}
.statTile{background:#fff;border:1px solid var(--n-100);border-radius:var(--r-md);padding:16px;text-align:center;transition:transform .25s var(--ease-lift),background .25s,box-shadow .25s}
.statTile:hover{transform:translateY(-3px);background:rgba(255,255,255,.6);backdrop-filter:blur(10px);box-shadow:0 12px 26px rgba(92,115,18,.14)}
.statNum{display:block;font-size:clamp(20px,1.8vw,28px);font-weight:var(--w-stat);color:var(--lime-900)}
.statLabel{display:block;font-size:12px;color:var(--text-muted);margin-top:4px}
.split{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.splitLabel{font-size:11px;font-weight:var(--w-primary);letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted)}
.splitList{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.splitList li{font-size:14px;color:var(--text-secondary);padding-left:16px;position:relative}
.splitList li::before{content:"";position:absolute;left:0;top:.55em;width:6px;height:6px;border-radius:2px;background:var(--lime-500)}
/* placeholder visual block (stands in for scraped product screenshots) */
.visualPh{flex:1;min-height:120px;border-radius:var(--r-md);border:1px solid var(--n-100);background:
  linear-gradient(90deg,rgba(121,150,27,.09) 1px,transparent 1px),
  linear-gradient(rgba(121,150,27,.09) 1px,transparent 1px),
  linear-gradient(135deg,#F1FCDB,#E3F6BE 60%,#D1ED96);
  background-size:24px 24px,24px 24px,cover;display:grid;place-items:center}
.visualPh span{font-size:12px;font-weight:var(--w-secondary);letter-spacing:.14em;text-transform:uppercase;color:var(--lime-900);background:rgba(255,255,255,.7);border-radius:var(--r-full);padding:6px 14px}
/* chip grids (channels / formats) */
.groupLabel{font-size:11px;font-weight:var(--w-primary);letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted)}
.chipGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:10px}
.chipItem{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--n-100);border-radius:var(--r-sm);padding:10px 12px;font-size:13px;font-weight:var(--w-secondary);color:var(--n-800);transition:transform .22s var(--ease-lift),border-color .22s}
.chipItem:hover{transform:translateY(-2px);border-color:var(--lime-600)}
.chipDot{width:8px;height:8px;border-radius:2px;background:var(--lime-500);flex:0 0 auto}
/* market mini-cards */
.market{display:flex;flex-direction:column;gap:14px;min-height:0}
.marketGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.marketCard{background:#fff;border:1px solid var(--n-100);border-radius:var(--r-md);padding:16px;transition:transform .25s var(--ease-lift),box-shadow .25s}
.marketCard:hover{transform:translateY(-3px);box-shadow:0 12px 26px rgba(92,115,18,.12)}
.marketCardTitle{font-size:15px;font-weight:var(--w-primary);margin:8px 0 4px}
.marketCardBody{font-size:12.5px;line-height:1.5;color:var(--text-muted)}
.marketIcon{width:30px;height:30px;border-radius:8px;background:var(--lime-100);color:var(--lime-900);display:grid;place-items:center}
.marketVisualWrap{position:relative;flex:1;min-height:140px;display:flex}
.overlayBtn{position:absolute;bottom:14px;right:14px;background:var(--n-950);color:var(--lime-400);font-size:13px;font-weight:var(--w-button);border-radius:var(--r-full);padding:10px 18px;transition:transform .2s var(--ease-lift)}
.overlayBtn:hover{transform:translateY(-2px)}
/* measure card: flow steps + metric chips + dashboard tiles */
.flow{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.flowStep{font-size:13px;font-weight:var(--w-secondary);color:var(--n-800);background:#fff;border:1px solid var(--n-100);border-radius:var(--r-full);padding:8px 14px}
.flowFill{background:var(--lime-400);border-color:var(--lime-400);color:var(--n-950);font-weight:var(--w-primary)}
.footnote{font-size:12px;color:var(--text-muted)}
.metricChips{display:flex;gap:8px;flex-wrap:wrap}
.metricChip{font-size:12px;font-weight:var(--w-secondary);color:var(--lime-900);background:var(--lime-50);border:1px solid rgba(153,186,53,.3);border-radius:var(--r-full);padding:6px 12px}
.panelGradient{background:linear-gradient(160deg,#FCFDF6,#F1FCDB)}
.liveBadge{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:var(--w-primary);color:var(--success-text);background:var(--success-bg);border-radius:var(--r-full);padding:5px 12px;margin-left:auto}
.liveDot{position:relative;width:7px;height:7px;border-radius:50%;background:var(--success);box-shadow:0 0 0 3px rgba(0,134,57,.18)}
.liveDot::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--success);animation:livePulse 1.8s ease-out infinite}
@keyframes livePulse{0%{opacity:.6;transform:scale(1)}70%,to{opacity:0;transform:scale(3.2)}}
.dashGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:auto}
.dashTile{min-height:150px;display:flex;flex-direction:column;justify-content:center;text-align:center;gap:6px;background:radial-gradient(80% 80% at 50% 0%,rgba(205,247,87,.28),transparent),#fff;border:1px solid var(--n-100);border-radius:var(--r-lg);padding:18px;transition:transform .25s var(--ease-lift),box-shadow .25s}
.dashTile:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(92,115,18,.14)}
.dashNum{font-size:clamp(22px,1.9vw,30px);font-weight:var(--w-stat);color:var(--lime-900);transition:transform .25s var(--ease-lift)}
.dashTile:hover .dashNum{transform:scale(1.07)}
.dashLabel{font-size:12px;color:var(--text-muted)}
.reference{font-size:12.5px;color:var(--text-muted)}
.reference strong{color:var(--n-800)}
/* closing pill + fallback */
.deckClosing{position:relative;width:fit-content;margin:32px auto 0;background:rgba(255,255,255,.7);backdrop-filter:blur(10px);border:1px solid var(--border);border-radius:var(--r-full);padding:13px 26px;font-style:italic;font-size:clamp(14px,1.3vw,16.5px);line-height:1.55;color:var(--text-secondary)}
.deckFallback{display:none;max-width:720px;margin:0 auto}

/* ==========================================================================
   COMMAND SECTION — 2-col: visual panel + hover-slide feature rows
   ========================================================================== */
.commandSection{background:#fff;padding:clamp(110px,13vh,160px) clamp(20px,4vw,40px)}
.commandInner{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,3vw,48px);max-width:1434px;margin:0 auto;align-items:stretch}
.commandVisual{position:relative;overflow:hidden;background:var(--lime-100) url('/assets/patterns/opt/bg4.jpg') center/cover no-repeat;border-radius:var(--r-lg);min-height:520px;display:flex}
/* let the panel's brand pattern show through the placeholder box */
.commandVisual > .visualPh,.demoVisual > .visualPh{background:none;border:0}
.commandBadge{position:absolute;top:20px;left:20px;z-index:2;display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.85);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.9);border-radius:var(--r-full);padding:9px 16px;font-size:13px;font-weight:var(--w-primary);color:var(--n-900)}
.commandBadgeDot{position:relative;width:8px;height:8px;border-radius:50%;background:var(--lime-600);box-shadow:0 0 0 4px rgba(153,186,53,.28)}
.commandBadgeDot::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--lime-600);animation:livePulse 1.8s ease-out infinite}
.commandFormPanel{background:var(--n-50);border:1px solid var(--n-100);border-radius:var(--r-lg);padding:clamp(28px,3vw,44px);display:flex;flex-direction:column}
.commandTitle{font-size:var(--h2);font-weight:var(--w-primary);line-height:1.08;letter-spacing:-.025em;max-width:22ch}
.commandBody{font-size:var(--text-md);line-height:var(--lh-body);color:var(--text-secondary);margin:16px 0 28px}
.commandRows{display:flex;flex-direction:column;gap:12px;margin-top:auto}
.commandRow{display:flex;align-items:baseline;gap:14px;background:#fff;border:1px solid var(--n-200);border-radius:var(--r-md);padding:14px 18px;transition:transform .24s var(--ease-lift),border-color .24s,box-shadow .24s}
.commandRow:hover{transform:translateX(4px);border-color:var(--lime-500);box-shadow:0 12px 26px rgba(121,150,27,.14)}
.rowName{flex:0 0 auto;font-size:15px;font-weight:var(--w-primary);color:var(--n-950);min-width:88px}
.rowDesc{font-size:var(--text-sm);color:var(--text-secondary)}

/* ==========================================================================
   PROOF SECTION — 4 tall cards, gradient stat numbers, hover glow
   ========================================================================== */
.proofSection{position:relative;isolation:isolate;padding:clamp(56px,9vh,110px) 0;background:
  radial-gradient(36% 30% at 12% 12%,rgba(212,249,121,.3),transparent 70%),
  linear-gradient(#fff,#FAFDF2)}
.proofWrap{max-width:1480px;margin:0 auto;padding:0 clamp(20px,4vw,56px)}
.proofHead{max-width:760px;margin-bottom:var(--s-6)}
.proofTitle{font-size:var(--h2);font-weight:var(--w-primary);line-height:var(--lh-h2);letter-spacing:-.025em}
.proofGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,2vw,24px)}
.proofCard{position:relative;overflow:hidden;min-height:clamp(320px,26vw,380px);display:flex;flex-direction:column;background:linear-gradient(#fff,#FDFFF7);border:1px solid var(--border);border-radius:var(--r-lg);padding:clamp(24px,2.4vw,32px);box-shadow:inset 0 1px #fff,0 8px 22px rgba(62,79,5,.06);transition:transform .3s var(--ease-lift),border-color .3s,box-shadow .3s}
.proofCard::before{content:"";position:absolute;top:-80px;right:-80px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(205,247,87,.4),transparent 70%);opacity:0;transition:opacity .3s}
.proofCard:hover{transform:translateY(-5px);border-color:rgba(153,186,53,.55);box-shadow:0 18px 40px rgba(121,150,27,.16)}
.proofCard:hover::before{opacity:1}
.proofTag{display:inline-block;width:fit-content;font-size:11px;font-weight:var(--w-primary);letter-spacing:.14em;text-transform:uppercase;color:var(--lime-800);background:var(--lime-50);border-radius:var(--r-full);padding:6px 12px;margin-bottom:22px}
.proofStats{display:flex;flex-direction:column;gap:16px}
.proofStat{display:flex;align-items:baseline;gap:12px}
.proofStatNum{min-width:76px;font-size:clamp(1.5rem,2.1vw,1.85rem);font-weight:var(--w-stat);letter-spacing:-.01em;background:var(--grad-text);-webkit-background-clip:text;background-clip:text;color:transparent}
.proofStatLabel{font-size:var(--text-sm);color:var(--text-secondary)}
.proofCardBody{font-size:var(--text-sm);line-height:var(--lh-sm);color:var(--text-muted);border-top:1px solid var(--n-100);padding-top:18px;margin-top:auto}
.proofSource{margin-top:var(--s-3);font-size:var(--text-xs);color:var(--text-muted)}

/* ==========================================================================
   IMPACT SECTION — 6-col divided grid, count-up values
   ========================================================================== */
.impactSection{position:relative;overflow:hidden;background:var(--n-50);min-height:600px;display:flex;flex-direction:column;justify-content:center;padding:clamp(56px,9vh,110px) 0}
/* faint brand ripple accents in two corners — behind the dark-on-light counters */
.impactSection::before,.impactSection::after{content:"";position:absolute;width:min(440px,38%);aspect-ratio:1;background:url('/assets/patterns/layered-circle.svg') no-repeat center/contain;opacity:.14;pointer-events:none;z-index:0}
.impactSection::before{left:-150px;bottom:-160px}
.impactSection::after{right:-150px;top:-160px;rotate:180deg}
.impactWrap{position:relative;z-index:1;max-width:1480px;margin:0 auto;padding:0 clamp(20px,4vw,56px);width:100%}
.impactHead{text-align:center;margin-bottom:var(--s-6)}
.impactChiclet{display:inline-block;font-size:11px;font-weight:var(--w-primary);letter-spacing:.14em;text-transform:uppercase;color:var(--lime-800);background:var(--lime-50);border:1px solid rgba(153,186,53,.3);border-radius:var(--r-full);padding:6px 14px;margin-bottom:16px}
.impactTitle{font-size:var(--h2);font-weight:var(--w-primary);line-height:var(--lh-h2);letter-spacing:-.025em}
.impactGrid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0}
.impactCard{min-height:220px;padding:36px 18px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;border-left:1px solid var(--n-200);transition:transform .26s var(--ease-lift),background .26s,box-shadow .26s}
.impactCard:first-child{border-left:0}
.impactCard:hover{background:rgba(255,255,255,.8);transform:translateY(-5px);box-shadow:0 12px 28px -16px rgba(92,115,18,.4)}
.impactIcon{width:40px;height:40px;border-radius:var(--r-sm);background:linear-gradient(135deg,var(--lime-100),var(--lime-300));color:var(--lime-900);display:grid;place-items:center;transition:transform .26s var(--ease-lift)}
.impactCard:hover .impactIcon{transform:scale(1.05)}
.impactValue{font-size:clamp(2.2rem,3vw,3rem);font-weight:var(--w-primary);line-height:1;letter-spacing:-.03em;color:var(--n-950);font-variant-numeric:tabular-nums}
.impactLabel{font-size:var(--text-sm);line-height:var(--lh-sm);color:var(--text-secondary);max-width:18ch}

/* ==========================================================================
   AWARDS & RECOGNITION — centered kicker/headline + wrap-grid of
        square award tiles (6/row → 4 → 3 → 2), hover lift + sheen + zoom
   ========================================================================== */
.awardsSection{position:relative;overflow:hidden;background:linear-gradient(#fff 0%,#FAFDF2 50%,#F1F8DE 100%);padding:80px clamp(20px,4vw,40px) clamp(72px,9vh,110px)}
.awardsSection::before{content:"";position:absolute;inset:0;pointer-events:none;background:
  linear-gradient(90deg,rgba(121,150,27,.06) 1px,transparent 1px),
  linear-gradient(rgba(121,150,27,.06) 1px,transparent 1px);
  background-size:32px 32px;
  -webkit-mask-image:linear-gradient(transparent 0%,rgba(0,0,0,.4) 50%,transparent 100%);mask-image:linear-gradient(transparent 0%,rgba(0,0,0,.4) 50%,transparent 100%)}
.awardsInner{position:relative;display:flex;flex-direction:column;align-items:center;gap:clamp(20px,3vh,32px);max-width:1320px;margin:0 auto}
.awardsKicker{font-size:.74rem;font-weight:var(--w-primary);letter-spacing:.22em;text-transform:uppercase;text-align:center;color:var(--text-muted)}
.awardsHeadline{text-align:center;font-size:var(--h2);font-weight:var(--w-primary);line-height:var(--lh-h2);letter-spacing:-.02em}
.awardsGrid{display:flex;flex-wrap:wrap;justify-content:center;gap:4px;width:100%;max-width:1320px}
.awardTile{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;flex:0 0 calc(16.6667% - 3.34px);aspect-ratio:.92;cursor:default;background:#fff;border:1px solid rgba(62,79,5,.1);border-radius:16px;padding:clamp(16px,1.5vw,22px) clamp(10px,1.1vw,14px) clamp(12px,1.2vw,16px);box-shadow:0 4px 14px rgba(62,79,5,.06);transition:transform .32s var(--ease-lift),box-shadow .32s,border-color .32s,background-color .32s}
.awardTile::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(135deg,rgba(255,255,255,.5) 0%,transparent 55%);opacity:0;transition:opacity .32s}
.awardTile:hover{transform:translateY(-4px);border-color:rgba(153,186,53,.55);box-shadow:0 18px 38px rgba(92,115,18,.22)}
.awardTile:hover::after{opacity:1}
.awardYear{position:absolute;top:8px;right:9px;z-index:2;font-size:.56rem;font-weight:var(--w-primary);letter-spacing:.04em;color:var(--lime-900);background:rgba(205,247,87,.35);border-radius:var(--r-full);padding:1px 7px}
.awardLogoWrap{flex:auto;display:flex;align-items:center;justify-content:center;width:100%;min-height:0}
/* placeholder award mark (stands in for the scraped award logos) */
.awardMark{position:relative;z-index:1;width:clamp(44px,4.6vw,64px);height:clamp(44px,4.6vw,64px);border-radius:50%;background:linear-gradient(135deg,var(--lime-100),var(--lime-300));border:1px solid rgba(153,186,53,.4);display:grid;place-items:center;font-size:clamp(12px,1.1vw,15px);font-weight:var(--w-stat);letter-spacing:.02em;color:var(--lime-900);transition:transform .32s var(--ease-lift)}
.awardTile:hover .awardMark{transform:scale(1.12)}
.awardDetail{width:100%;margin:11px 0 0;padding-top:11px;border-top:1px solid rgba(62,79,5,.1);text-align:center;font-size:clamp(.64rem,.72vw,.76rem);font-weight:var(--w-text);line-height:1.38;letter-spacing:-.005em;color:var(--text-secondary);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
@media (max-width:1100px){.awardTile{flex-basis:calc(25% - 3px)}}
@media (max-width:900px){.awardTile{flex-basis:calc(33.3333% - 2.67px)}}
@media (max-width:600px){.awardTile{flex-basis:calc(50% - 2px)}}

/* ==========================================================================
   HEALTH SECTION — 2 feature cards + infinite compliance-chip marquee
   ========================================================================== */
.healthSection{background:linear-gradient(#fff,#FAFDF2);padding:clamp(56px,9vh,110px) 0 clamp(48px,8vh,90px)}
.healthHead{max-width:760px;margin:0 auto var(--s-5);text-align:center}
.healthTitle{font-size:var(--h2);font-weight:var(--w-primary);line-height:var(--lh-h2);letter-spacing:-.025em}
.healthSub{font-size:var(--text-lg);color:var(--text-secondary);margin-top:14px}
.healthCards{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,2.4vw,30px);max-width:1040px;margin:0 auto var(--s-6);padding:0 clamp(20px,4vw,56px)}
.healthCard{display:flex;gap:18px;background:#fff;border:1px solid var(--border);border-radius:var(--r-lg);padding:clamp(24px,2.4vw,32px);box-shadow:inset 0 1px #fff,0 8px 24px rgba(62,79,5,.06);transition:transform .3s var(--ease-lift),border-color .3s,box-shadow .3s}
.healthCard:hover{transform:translateY(-5px);border-color:rgba(153,186,53,.55);box-shadow:0 18px 42px rgba(121,150,27,.16)}
.healthCardIcon{flex:0 0 auto;width:50px;height:50px;border-radius:var(--r-md);background:linear-gradient(135deg,var(--lime-50),var(--lime-200));color:var(--lime-900);display:grid;place-items:center}
.healthCardTitle{font-size:var(--h5);font-weight:var(--w-primary);margin-bottom:8px}
.healthCardTitle sup{font-size:.5em}
.healthCardBody{font-size:var(--text-sm);line-height:var(--lh-sm);color:var(--text-secondary)}
/* marquee: duplicated track, -50% translate loop, edge fade mask */
.healthMarquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.healthTrack{display:flex;gap:14px;width:max-content;animation:healthScroll 40s linear infinite;will-change:transform}
.healthMarquee:hover .healthTrack{animation-play-state:paused}
@keyframes healthScroll{0%{transform:translateX(-50%)}to{transform:translateX(0)}}
.healthChip{display:inline-flex;align-items:center;gap:10px;white-space:nowrap;background:#fff;border:1px solid var(--n-100);border-radius:var(--r-full);padding:13px 22px;font-size:.95rem;font-weight:var(--w-primary);color:var(--n-800);box-shadow:0 4px 12px rgba(62,79,5,.06)}
.healthChipIcon{color:var(--lime-700);display:inline-flex}

/* ==========================================================================
   CASES SECTION — arrow carousel (3 visible of 4), cardEnter animation
   ========================================================================== */
.casesSection{position:relative;overflow:hidden;background:linear-gradient(#fff,#FAFDF2 72%,#EFF8D8);padding:26px 12px 116px}
.casesSection::before{content:"";position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(121,150,27,.06) 1px,transparent 1px),
  linear-gradient(rgba(121,150,27,.06) 1px,transparent 1px);
  background-size:32px 32px;-webkit-mask-image:linear-gradient(transparent 40%,rgba(0,0,0,.9));mask-image:linear-gradient(transparent 40%,rgba(0,0,0,.9))}
.casesSection::after{content:"";position:absolute;bottom:-200px;left:50%;transform:translateX(-50%);width:900px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(205,247,87,.4),transparent 70%);pointer-events:none}
.casesInner{position:relative;max-width:min(1580px,100vw - 32px);margin:0 auto;z-index:1}
.casesHeader{text-align:center;max-width:740px;margin:0 auto var(--s-5)}
.casesBadge{display:inline-block;font-size:11px;font-weight:var(--w-primary);letter-spacing:.14em;text-transform:uppercase;color:var(--lime-800);background:var(--lime-50);border-radius:var(--r-full);padding:6px 14px;margin-bottom:14px}
.casesTitle{font-size:var(--h2);font-weight:var(--w-primary);line-height:1.16;letter-spacing:-.025em}
.casesSubtitle{font-size:var(--text-lg);color:var(--text-secondary);margin-top:12px}
.casesMarquee{display:flex;align-items:center;gap:14px}
.casesViewport{flex:1;overflow:hidden}
.casesTrack{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 36px)/3);gap:18px;transition:transform .5s var(--ease-lift)}
.caseArrow{flex:0 0 auto;width:44px;height:44px;border-radius:50%;border:1px solid var(--border);background:#fff;color:var(--n-800);display:grid;place-items:center;transition:border-color .2s,transform .2s var(--ease-lift),opacity .2s}
.caseArrow:hover:not(:disabled){border-color:var(--lime-700);transform:translateY(-2px)}
.caseArrow:disabled{opacity:.38;cursor:default}
.caseCard{background:#fff;border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;transition:transform .22s var(--ease-lift),border-color .22s,box-shadow .22s,opacity .28s}
.caseCard:hover{transform:translateY(-3px);border-color:var(--lime-300);box-shadow:0 10px 26px rgba(121,150,27,.14)}
.caseCard.entering{animation:cardEnter .42s var(--ease-lift) both}
@keyframes cardEnter{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
/* thumbnail = a brand gradient PATTERN (assigned per-card inline, cycling bg1–8) */
.caseVisual{position:relative;aspect-ratio:2;margin:14px;border-radius:var(--r-md);overflow:hidden;background-color:var(--lime-100);background-size:cover;background-position:center;background-repeat:no-repeat}
.caseDate{position:absolute;bottom:10px;right:10px;background:#fff;border-radius:var(--r-full);padding:6px 12px;font-size:12px;font-weight:var(--w-secondary);color:var(--n-800)}
.caseBody{padding:6px 20px 22px}
.caseTitle{font-size:var(--h5);font-weight:var(--w-primary);line-height:var(--lh-h5);margin-bottom:10px}
.caseExcerpt{font-size:var(--text-sm);line-height:var(--lh-sm);color:var(--text-secondary);margin-bottom:16px}
.caseChip{display:inline-block;font-size:11px;font-weight:var(--w-primary);letter-spacing:.06em;text-transform:uppercase;color:var(--lime-900);background:var(--lime-100);border-radius:var(--r-full);padding:5px 12px}

/* ==========================================================================
   GET-DEMO SECTION — 2-col: visual + form panel
   ========================================================================== */
.demoSection{background:#fff;padding:clamp(32px,5vw,56px) 0 clamp(48px,7vw,100px)}
.demoInner{display:grid;grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);gap:clamp(10px,1.4vw,18px);max-width:1360px;margin:0 auto;padding:0 clamp(20px,4vw,40px);min-height:min(78vh,920px)}
.demoVisual{position:relative;overflow:hidden;background:var(--lime-100) url('/assets/patterns/opt/bg8.jpg') center/cover no-repeat;border-radius:var(--r-lg);display:flex}
.demoFormPanel{background:var(--n-50);border:1px solid var(--n-100);border-radius:var(--r-lg);padding:clamp(28px,3vw,44px)}
.demoTitle{font-size:var(--h2);font-weight:var(--w-primary);line-height:1.16;letter-spacing:-.025em}
.demoSubtitle{font-size:var(--text-md);color:var(--text-secondary);margin:12px 0 28px}
.demoForm{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.demoForm .full{grid-column:1/-1}
.demoForm input:not([type="checkbox"]),.demoForm select,.demoForm textarea{width:100%;height:54px;padding:0 16px;font-family:var(--font);font-size:15px;color:var(--n-950);background:#fff;border:1px solid var(--n-200);border-radius:var(--r-md);transition:border-color .18s,box-shadow .18s;appearance:none}
.demoForm textarea{height:110px;padding:14px 16px;resize:vertical}
.demoForm input:not([type="checkbox"]):focus,.demoForm select:focus,.demoForm textarea:focus{outline:none;border-color:var(--lime-600);box-shadow:0 0 0 3px rgba(205,247,87,.35)}
.selectWrap{position:relative}
.selectWrap::after{content:"";position:absolute;right:18px;top:50%;width:8px;height:8px;border-right:2px solid var(--n-600);border-bottom:2px solid var(--n-600);transform:translateY(-70%) rotate(45deg);pointer-events:none}
.consentRow{grid-column:1/-1;display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--text-muted)}
.consentRow input{flex:0 0 auto;width:18px;height:18px;margin:3px 0 0;accent-color:var(--lime-700);cursor:pointer}
.demoSubmit{grid-column:1/-1;height:52px;border:none;border-radius:var(--r-sm);background:var(--lime-400);color:var(--n-950);font-size:var(--btn-size);font-weight:var(--w-button);box-shadow:0 10px 22px rgba(121,150,27,.28);transition:background .2s,transform .2s var(--ease-lift),box-shadow .2s}
.demoSubmit:hover{background:var(--lime-500);transform:translateY(-2px);box-shadow:0 16px 32px rgba(121,150,27,.38)}

/* ==========================================================================
   RESPONSIVE — homepage collapse points: 900px (scroll set-pieces → static),
       768px (section grids to 1 col), 600px (impact / demo grids)
   ========================================================================== */
@media (max-width:1100px){
  .chipGrid{grid-template-columns:repeat(2,1fr)}
  .proofGrid{grid-template-columns:1fr 1fr}
}
@media (max-width:900px){
  /* reality: unpin — cards flow normally */
  .realityGrid{grid-template-columns:1fr}
  .realityCopy{position:static;height:auto;padding:0 0 var(--s-4)}
  .realityStack{min-height:0}
  .realitySlot{position:static;top:auto!important;margin:0 0 var(--s-3)}
  /* deck: hide pinned runway, show static fallback */
  .deckScrollArea{display:none}
  .deckFallback{display:block}
  .deckFallback .deckCard{height:auto;margin-bottom:24px}
  .deckCardBody,.duo50,.duo4060,.duo6040{grid-template-columns:1fr;display:grid}
  .split,.statRow,.marketGrid,.dashGrid{grid-template-columns:1fr}
  .strip{flex-wrap:wrap;padding:18px 22px}
  .impactGrid{grid-template-columns:repeat(3,1fr)}
  .impactCard:nth-child(3n+1){border-left:0}
  .impactCard:nth-child(-n+3){border-bottom:1px solid var(--n-200)}
  .commandInner,.demoInner{grid-template-columns:1fr}
  .commandVisual,.demoVisual{min-height:320px}
  .casesTrack{grid-auto-columns:calc((100% - 18px)/2)}
  .healthCards{grid-template-columns:1fr}
  .arcGrid{flex-direction:column}
  .arcArrow{transform:rotate(90deg)}
}
@media (max-width:768px){
  .heroStats{flex-wrap:wrap;padding:20px}
  .statBarDivider{display:none}
  .unlockPanel{grid-template-columns:1fr}
  .unlockRow{grid-template-columns:1fr}
  .unlockChips{flex-direction:column}
  .unlockFill{flex-direction:row;align-items:center}
  .offeringGrid{grid-template-columns:1fr}
  .casesTrack{grid-auto-columns:100%}
}
@media (max-width:600px){
  .impactGrid{grid-template-columns:repeat(2,1fr)}
  .impactCard{border-left:0;border-bottom:1px solid var(--n-200)}
  .impactCard:nth-child(2n){border-left:1px solid var(--n-200)}
  .demoForm{grid-template-columns:1fr}
}

/* ---- reduced motion: kill marquees, sweeps, glows, pulses -------------- */
@media (prefers-reduced-motion:reduce){
  .healthTrack,.unlockDividerLine,.unlockFill::before,.liveDot::after,.commandBadgeDot::after{animation:none!important}
  .revealWord{opacity:1!important}
}
