/* ==========================================================================
   Evidence Platform page - Full Elevate brand, LIME (the umbrella product, so
   it wears the primary lime/forest accent; the differentiator boxes borrow each
   product's pairing). Tokens from ../../../brand/elevate-tokens.css; chrome from
   ../../site.css. Spacing on the 4px grid. Product screens are placeholders -
   swap each .shot__body for an <img> when the real screen is ready.
   ========================================================================== */
body{overflow-x:hidden;}

/* highlight pill + reveal-on-scroll (the shared motion language) */
.hl{background:var(--lime-300);color:var(--forest);font-family:var(--font-display);font-weight:700;border-radius:8px;padding:4px 12px;-webkit-box-decoration-break:clone;box-decoration-break:clone;}
.r{opacity:0;transform:translateY(20px);transition:opacity .6s var(--ease-silk),transform .6s var(--ease-silk);}
.r.in{opacity:1;transform:none;}
@media(prefers-reduced-motion:reduce){.r{opacity:1;transform:none;transition:none;}}
.nb{white-space:nowrap;}   /* keep hyphenated compounds (evidence-based, warranty-backed) from splitting */

/* shared section type */
.plat-h{font-family:var(--font-display);font-weight:700;font-size:clamp(32px,4.6vw,56px);line-height:1.1;letter-spacing:-0.03em;color:var(--ink);margin:0;text-align:center;}
.plat-lead{font-family:var(--font-display);font-weight:700;font-size:clamp(20px,2.4vw,28px);line-height:1.3;letter-spacing:-0.02em;color:var(--ink);max-width:40em;margin:16px auto 0;text-align:center;}
.plat-foot{font-size:18px;line-height:1.6;color:var(--ink);max-width:44em;margin:var(--space-md) auto 0;text-align:center;}

/* ---------- placeholder product screen ---------- */
.shot{background:var(--fill-1);border-radius:var(--radius-card);overflow:hidden;width:100%;}
.shot__bar{display:flex;align-items:center;gap:8px;padding:16px 20px;background:var(--fill-2);}
.shot__bar span{width:12px;height:12px;border-radius:var(--radius-pill);background:var(--slate-300);}
.shot__body{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;aspect-ratio:16/10;}
.shot__tag{font-family:var(--font-body);font-size:14px;font-weight:700;color:var(--green-700);background:var(--lime-100);border-radius:var(--radius-pill);padding:4px 12px;}
.shot__label{font-family:var(--font-display);font-weight:700;font-size:clamp(18px,2vw,24px);color:var(--slate-400);}

/* ---------- 1 hero ---------- */
.plathero__grid{display:grid;grid-template-columns:1fr 1.05fr;gap:64px;align-items:center;}
@media(max-width:880px){.plathero__grid{grid-template-columns:1fr;gap:40px;}}
.plathero__h{font-family:var(--font-display);font-weight:700;font-size:clamp(40px,5.6vw,80px);line-height:1.04;letter-spacing:-0.035em;color:var(--ink);margin:0;}
.plathero__lead{font-family:var(--font-display);font-weight:700;font-size:clamp(20px,2.4vw,28px);line-height:1.3;letter-spacing:-0.02em;color:var(--ink);max-width:20em;margin:24px 0 0;}
.plathero__cta{display:flex;gap:16px;flex-wrap:wrap;margin-top:36px;}
.shot--hero{box-shadow:0 25px 60px -20px color-mix(in srgb, var(--forest) 30%, transparent);}

/* ---------- 2 value prop: a scroll-scrubbed green-box takeover (mirrors the homepage warranty beat) ---------- */
.platbeat{min-height:400vh;}   /* the tall driver; platform.js scrubs the fixed .pbeat layer off it */
.pbeat{position:fixed;inset:0;z-index:4;display:flex;align-items:center;justify-content:center;pointer-events:none;opacity:0;overflow:hidden;}
.pbeat__bg{position:absolute;left:50%;top:50%;width:min(880px,92vw);height:460px;transform:translate(-50%,-50%) scale(1);transform-origin:center;background:var(--lime-300);border-radius:28px;}
.pbeat__bg-dark{position:absolute;inset:0;background:var(--surface-dark);opacity:0;}
.pbeat__phase{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:100%;max-width:1040px;padding:0 24px;text-align:center;opacity:0;}
.pbeat__a{opacity:1;}   /* the JS drives all three; A starts visible before the script runs */
.pbeat__h{font-family:var(--font-display);font-weight:700;font-size:clamp(34px,5vw,68px);line-height:1.06;letter-spacing:-0.035em;color:var(--forest);margin:0 auto;max-width:16ch;}
.pbeat__sub{font-family:var(--font-display);font-weight:700;font-size:clamp(20px,2.4vw,30px);line-height:1.3;letter-spacing:-0.02em;color:var(--forest);max-width:24em;margin:24px auto 0;}
.pbeat__qh{font-family:var(--font-display);font-weight:700;font-size:clamp(30px,4.4vw,56px);line-height:1.1;letter-spacing:-0.03em;color:var(--forest);margin:0 auto;max-width:17em;}
.platq__cols{display:grid;grid-template-columns:1fr 1fr;gap:48px;max-width:1000px;margin:var(--space-lg) auto 0;text-align:left;}
@media(max-width:760px){.platq__cols{grid-template-columns:1fr;gap:32px;}}
.qcol__h{font-family:var(--font-display);font-weight:700;font-size:clamp(20px,2.2vw,26px);letter-spacing:-0.01em;color:var(--forest);margin:0 0 24px;}
.qlist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:20px;}
.qlist li{display:flex;gap:16px;align-items:flex-start;font-family:var(--font-body);font-weight:600;font-size:clamp(16px,1.7vw,20px);line-height:1.4;color:var(--forest);}
.qchip{flex:none;width:36px;height:36px;border-radius:var(--radius-pill);background:var(--forest);color:var(--lime-300);display:flex;align-items:center;justify-content:center;}
.qchip i,.qchip svg{width:22px;height:22px;stroke-width:3;}
.pbeat__c{display:flex;flex-direction:column;align-items:center;gap:40px;}
.pbeat__ch{font-family:var(--font-display);font-weight:700;font-size:clamp(32px,4.6vw,60px);line-height:1.3;letter-spacing:-0.03em;color:var(--on-dark);margin:0;max-width:18ch;}
.pbeat__ch .hl{line-height:1.5;}
@media(prefers-reduced-motion:reduce){   /* no scrub: show the three phases as static stacked blocks */
  .platbeat{min-height:0;}
  .pbeat{position:static;opacity:1;display:block;overflow:visible;}
  .pbeat__bg,.pbeat__bg-dark{display:none;}
  .pbeat__phase{position:static;transform:none;opacity:1;margin:0 auto;padding:var(--space-lg) 24px;}
  .pbeat__b{background:var(--lime-300);}
  .pbeat__c{background:var(--surface-dark);}
}

/* ---------- 3 how it works: a pinned heading; the three steps stack beneath it ---------- */
.platwork-stack{position:relative;background:var(--canvas);padding:var(--space-md) 24px var(--space-lg);}
.pstack__head{position:sticky;top:84px;z-index:3;max-width:920px;margin:0 auto var(--space-md);text-align:center;}
.pstack__lead{font-size:clamp(16px,1.6vw,18px);line-height:1.6;color:var(--ink);max-width:42em;margin:12px auto 0;}
.platwork-stack .stack-list{max-width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:120px;}
.platwork-stack .stack-list::after{content:"";height:30vh;}   /* hold the last card pinned a beat longer */
.srow{position:sticky;display:flex;gap:48px;align-items:center;padding:48px;border-radius:32px;overflow:hidden;}
.srow:nth-child(1){top:232px;background:var(--lime-100);z-index:4;}   /* three shades of green; z above the pinned heading so the cards cover it as they slide up */
.srow:nth-child(2){top:264px;z-index:5;}
.srow:nth-child(3){top:296px;background:var(--lime);z-index:6;}
@media(max-width:880px){
  .pstack__head{position:static;}
  .srow{position:static;flex-direction:column;align-items:flex-start;padding:28px;gap:28px;}
  .platwork-stack .stack-list{gap:28px;}
  .platwork-stack .stack-list::after{display:none;}   /* no stacking on mobile, so no hold spacer */
}
.srow--lime{background:var(--lime-300);}
.srow__copy{flex:0.85;}
.srow__n{font-family:var(--font-display);font-weight:700;font-size:clamp(40px,4.4vw,64px);line-height:1;letter-spacing:-0.03em;font-variant-numeric:tabular-nums;}
.srow__h{font-family:var(--font-display);font-weight:700;font-size:clamp(32px,3.6vw,52px);line-height:1.04;letter-spacing:-0.02em;margin:8px 0 16px;}
.srow__p{font-size:clamp(16px,1.5vw,19px);line-height:1.55;margin:0;}
.srow__p .cu{font-weight:700;}
.srow--lime .srow__n,.srow--lime .srow__h,.srow--lime .srow__p{color:var(--forest);}
.srow__panel{flex:1.3;display:flex;align-items:center;justify-content:center;min-height:440px;background:rgba(255,255,255,0.4);border-radius:24px;padding:32px;overflow:hidden;}
@media(max-width:880px){.srow__panel{width:100%;flex:none;min-height:280px;}}
.srow__panel .shot{width:100%;box-shadow:0 25px 50px -12px color-mix(in srgb, var(--ink) 16%, transparent);}

/* ---------- 4 the edge ---------- */
.platedge__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:var(--space-lg);}
@media(max-width:880px){.platedge__grid{grid-template-columns:1fr;}}
.edge{background:var(--fill-1);color:var(--ink);border-radius:var(--radius-card);padding:36px;}
.edge h3{font-family:var(--font-display);font-weight:700;font-size:22px;letter-spacing:-0.02em;margin:20px 0 8px;}
.edge p{font-size:16px;line-height:1.55;margin:0;}
.edge__ic{display:inline-flex;width:48px;height:48px;border-radius:14px;align-items:center;justify-content:center;}
.edge__ic i,.edge__ic svg{width:28px;height:28px;stroke-width:2.5;}
/* color-code the icon chip only, not the whole box */
.edge--blueberry .edge__ic{background:var(--blueberry);color:var(--blueberry-companion);}
.edge--grapefruit .edge__ic{background:var(--grapefruit);color:var(--grapefruit-companion);}
.edge--lime .edge__ic{background:var(--lime-300);color:var(--forest);}

/* ---------- 5 closer ---------- */
.platcta__panel{background:var(--surface-dark);border-radius:var(--radius-card);padding:80px 56px;text-align:center;}
@media(max-width:880px){.platcta__panel{padding:48px 24px;}}
.platcta__h{font-family:var(--font-display);font-weight:700;font-size:clamp(30px,4.4vw,56px);line-height:1.06;letter-spacing:-0.03em;color:var(--on-dark);margin:0;}
.platcta__p{font-size:20px;line-height:1.6;color:var(--on-dark);max-width:40em;margin:20px auto var(--space-md);}
.btn--lime{background:var(--lime);color:var(--forest);}
.btn--lime:hover{background:var(--lime-300);}

/* content sections flow at a tight, consistent rhythm; full height is opt-in via .deck-full */
.platedge,.platcta{padding:var(--space-xl) 0;}