/* Rally — Insights section (#insights). Linked directly above the section in index.html.
   Everything is scoped to .insights / .ins-*; colours, type and motion come from tokens.css. */

/* ── section shell ───────────────────────────────────────────────── */
.insights{padding:clamp(56px,8vw,112px) 0;border-top:1px solid var(--sp-border-separator);scroll-margin-top:70px}
.insights [hidden]{display:none!important}
.ins-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,3vw,40px);align-items:stretch}
.ins-card{display:flex;flex-direction:column;gap:14px;min-width:0;padding:clamp(22px,3vw,40px);background:var(--sp-bg-primary);border:1px solid var(--sp-border-opaque);border-top:2px solid var(--sp-content-primary);border-radius:var(--sp-r-card)}
.ins-card:nth-child(2){transition-delay:.1s}
.ins-card>:is(.ins-demo,.ins-block,.ins-wait){margin-top:clamp(8px,1.2vw,16px)}
@media(max-width:960px){.ins-grid{grid-template-columns:minmax(0,1fr)}.ins-card:nth-child(2){transition-delay:0s}}

/* ── card header ─────────────────────────────────────────────────── */
.ins-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
.ins-top .ovr{color:var(--sp-content-secondary)}
.ins-card h3{font:700 clamp(28px,3.4vw,42px)/1.04 var(--sp-font-secondary);letter-spacing:-.03em}
.ins-lead{font:400 15px/1.6 var(--sp-font-primary);color:var(--sp-content-secondary);max-width:54ch}
.ins-sub{font:500 11px/1 var(--sp-font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--sp-content-secondary)}
.ins-block{display:flex;flex-direction:column;gap:14px;padding-top:clamp(18px,2vw,24px);border-top:1px solid var(--sp-border-opaque)}

/* ── status pills ────────────────────────────────────────────────── */
.ins-pill{display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border-radius:var(--sp-r-pill);font:500 11px/1 var(--sp-font-mono);letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.ins-pill--live{background:var(--sp-bg-success-subtle);color:var(--sp-content-success)}
.ins-pill--wait{background:var(--sp-gold-bg);color:var(--sp-gold-ink);box-shadow:inset 0 0 0 1px var(--sp-gold-halo)}
.ins-pill--soon{background:var(--sp-bg-tertiary);color:var(--sp-content-secondary)}
.ins-dot{display:inline-block;flex-shrink:0;width:7px;height:7px;border-radius:50%;background:var(--sp-content-success);animation:ins-pulse 2.4s var(--sp-ease-elegant) infinite}
@keyframes ins-pulse{0%{box-shadow:0 0 0 0 rgba(15,122,58,.45)}70%{box-shadow:0 0 0 7px rgba(15,122,58,0)}100%{box-shadow:0 0 0 0 rgba(15,122,58,0)}}

/* ── freedom: the illustrative demo ──────────────────────────────── */
.ins-demo{display:flex;flex-direction:column;gap:18px;padding:clamp(18px,2.4vw,28px);background:var(--sp-bg-quiet)}
.ins-demo-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px 14px}
.ins-demo-head h4{font:600 17px/1.25 var(--sp-font-primary)}
.ins-tag{padding:5px 9px;border:1px solid var(--sp-content-secondary);border-radius:var(--sp-r-pill);font:500 11px/1 var(--sp-font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--sp-content-secondary)}
.ins-result{display:flex;flex-direction:column;gap:10px}
.ins-k{font:500 11px/1 var(--sp-font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--sp-content-secondary)}
.ins-age-row{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 16px}
.ins-age{font:800 clamp(54px,7vw,88px)/.92 var(--sp-font-secondary);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.ins-passive{font:500 15px/1 var(--sp-font-primary);color:var(--sp-content-secondary)}
.ins-freeby{font:500 14px/1.2 var(--sp-font-mono)}
.ins-chips{display:flex;flex-wrap:wrap;gap:8px}
.ins-chip{display:inline-flex;align-items:center;padding:8px 12px;border:1px solid var(--sp-border-opaque);border-radius:var(--sp-r-pill);background:var(--sp-bg-primary);font:500 13px/1 var(--sp-font-primary);font-variant-numeric:tabular-nums}
.ins-chip--good{border-color:transparent;background:var(--sp-bg-success-subtle);color:var(--sp-content-success)}
.ins-lever{display:flex;flex-direction:column;gap:8px;padding-top:18px;border-top:1px solid var(--sp-border-opaque)}
.ins-lever-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.ins-lever-row label{font:600 15px/1.2 var(--sp-font-primary)}
.ins-extra{font:700 24px/1 var(--sp-font-secondary);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.ins-ends{display:flex;justify-content:space-between;font:500 11.5px/1 var(--sp-font-mono);font-variant-numeric:tabular-nums;color:var(--sp-content-secondary)}
.ins-hint,.ins-assume{font:400 12.5px/1.5 var(--sp-font-primary);color:var(--sp-content-secondary)}

/* the slider: ink fill up to --p (set by insights.js), 26px thumb for touch */
.ins-range{--p:66.67%;display:block;width:100%;height:30px;margin:0;background:transparent;cursor:pointer;touch-action:pan-y;-webkit-appearance:none;appearance:none}
.ins-range::-webkit-slider-runnable-track{height:6px;border-radius:99px;background:linear-gradient(to right,var(--sp-content-primary) var(--p),var(--sp-gray-300) var(--p))}
.ins-range::-moz-range-track{height:6px;border-radius:99px;background:var(--sp-gray-300)}
.ins-range::-moz-range-progress{height:6px;border-radius:99px;background:var(--sp-content-primary)}
.ins-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:26px;height:26px;margin-top:-10px;border:2px solid var(--sp-content-primary);border-radius:50%;background:#fff;box-shadow:var(--sp-shadow-300);transition:transform .15s var(--sp-ease-elegant)}
.ins-range::-moz-range-thumb{box-sizing:border-box;width:26px;height:26px;border:2px solid var(--sp-content-primary);border-radius:50%;background:#fff;box-shadow:var(--sp-shadow-300)}
.ins-range:active::-webkit-slider-thumb{transform:scale(1.1)}
.ins-range:focus-visible{outline:none}
.ins-range:focus-visible::-webkit-slider-thumb{outline:3px solid var(--sp-bg-accent);outline-offset:3px}
.ins-range:focus-visible::-moz-range-thumb{outline:3px solid var(--sp-bg-accent);outline-offset:3px}

/* ── freedom: steps, reassurance, sources ────────────────────────── */
.ins-steps{list-style:none}
.ins-steps li{display:grid;grid-template-columns:34px minmax(0,1fr);gap:8px;align-items:baseline;padding:11px 0;border-bottom:1px solid var(--sp-border-opaque);font:400 14.5px/1.5 var(--sp-font-primary)}
.ins-n{font:500 12px/1.5 var(--sp-font-mono);font-variant-numeric:tabular-nums;color:var(--sp-content-secondary)}
.ins-ticks{list-style:none;display:grid;gap:10px}
.ins-ticks li{position:relative;padding-left:28px;font:400 14.5px/1.5 var(--sp-font-primary)}
.ins-ticks li::before{content:"";position:absolute;left:0;top:.18em;width:18px;height:18px;border-radius:50%;background:rgba(15,122,58,.14)}
.ins-ticks li::after{content:"";position:absolute;left:6.5px;top:calc(.18em + 4px);width:5px;height:8px;border:solid var(--sp-content-success);border-width:0 2px 2px 0;transform:rotate(45deg)}
.ins-callout{padding:14px 16px;background:var(--sp-bg-success-subtle)}
.ins-sources{list-style:none;display:grid;gap:10px}
.ins-sources li{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.ins-sources .ins-pill{justify-content:center;min-width:108px}
.ins-src{padding:8px 12px;border:1px solid var(--sp-border-hairline);border-radius:var(--sp-r-pill);font:600 14px/1 var(--sp-font-primary)}
.ins-sources-soon .ins-src{border-style:dashed;color:var(--sp-content-secondary)}
.ins-trust{font:400 13px/1.5 var(--sp-font-primary);color:var(--sp-content-secondary)}
.ins-cta{display:flex;align-items:center;flex-wrap:wrap;gap:12px 16px}
.ins-cta--end{justify-content:space-between;margin-top:auto;padding-top:clamp(18px,2vw,24px);border-top:1px solid var(--sp-border-opaque)}
.ins-share{font:700 clamp(20px,2vw,22px)/1.1 var(--sp-font-secondary);letter-spacing:-.02em}

/* ── fitness: pillars, bands, waitlist, privacy ──────────────────── */
.ins-block--grow{flex:1 1 auto}
.ins-block--grow .ins-pillars{display:flex;flex-direction:column;flex:1}
.ins-block--grow .ins-pillars li{flex:1}
.ins-pillars{list-style:none}
.ins-pillars li{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) 2.4ch;align-items:center;gap:6px 14px;padding:14px 0;border-bottom:1px solid var(--sp-border-opaque)}
.ins-pn{font:600 15px/1.25 var(--sp-font-primary)}
.ins-pn small{display:block;margin-top:2px;font:400 12.5px/1.3 var(--sp-font-primary);color:var(--sp-content-secondary)}
.ins-pbar{display:block;height:8px;border-radius:99px;background:var(--sp-bg-tertiary);overflow:hidden}
.ins-pbar i{display:block;width:var(--w);height:100%;border-radius:inherit;background:var(--sp-content-primary);transform:scaleX(0);transform-origin:left center;transition:transform .9s var(--sp-ease-elegant) .25s}
.ins-card.in .ins-pbar i{transform:none}
.ins-pw{font:600 18px/1 var(--sp-font-primary);text-align:right;font-variant-numeric:tabular-nums}
.ins-bands{list-style:none;display:grid;grid-template-columns:40fr 40fr minmax(64px,21fr);gap:4px;margin-top:4px}
.ins-band{display:flex;flex-direction:column;gap:8px;min-width:0;padding:14px 12px 13px}
.ins-band b{font:600 15px/1 var(--sp-font-primary)}
.ins-band span{font:500 12px/1 var(--sp-font-mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.ins-band--weak{background:var(--sp-bg-tertiary);color:var(--sp-content-primary)}
.ins-band--fit{background:var(--sp-bg-accent-subtle);color:var(--sp-blue-600)}
.ins-band--peak{background:var(--sp-bg-success-subtle);color:var(--sp-content-success)}
.ins-wait{display:flex;flex-direction:column;gap:16px;padding:clamp(20px,2.6vw,30px);background:#101010;color:#fff}
.ins-wait h4{font:700 clamp(22px,2.4vw,30px)/1.08 var(--sp-font-secondary);letter-spacing:-.025em}
.ins-wait .ins-ticks{gap:0}
.ins-wait .ins-ticks li{padding:13px 0 13px 28px;border-top:1px solid rgba(255,255,255,.14);color:rgba(255,255,255,.86)}
.ins-wait .ins-ticks li::before{top:calc(13px + .18em);background:rgba(255,255,255,.16)}
.ins-wait .ins-ticks li::after{top:calc(13px + .18em + 4px);border-color:#fff}
.ins-wait .btn-fill{background:#fff;color:var(--sp-content-primary)}
.ins-cta-note{font:400 12.5px/1.4 var(--sp-font-primary);color:rgba(255,255,255,.7)}
.ins-more{font:400 14.5px/1.55 var(--sp-font-primary);color:var(--sp-content-secondary)}
.ins-more b{font-weight:600;color:var(--sp-content-primary)}
.ins-privacy{display:flex;flex-direction:column;gap:12px;padding:16px 18px;background:var(--sp-bg-quiet)}
.ins-privacy .ins-ticks li{font-size:14px}

/* ── rollout note ────────────────────────────────────────────────── */
.ins-rollout{display:flex;align-items:center;gap:10px;margin-top:clamp(24px,3vw,36px);font:400 13px/1.5 var(--sp-font-primary);color:var(--sp-content-secondary)}

/* ── small screens ───────────────────────────────────────────────── */
@media(max-width:520px){
  .ins-card{padding:20px}
  .ins-cta--end .btn-line{width:100%;justify-content:center}
}

/* ── motion + contrast preferences ───────────────────────────────── */
@media(prefers-reduced-motion:reduce){
  .ins-dot{animation:none}
  .ins-pbar i{transform:none;transition:none}
  .ins-range::-webkit-slider-thumb{transition:none}
}
@media(forced-colors:active){
  .ins-range::-webkit-slider-runnable-track,.ins-range::-moz-range-track{border:1px solid CanvasText}
  .ins-pill,.ins-chip,.ins-band,.ins-tag{border:1px solid CanvasText}
}
