/* ============================================================
   HELM — LIGHT THEME
   Loaded AFTER styles.css; overrides tokens + the rules that
   hardcode dark surfaces. Same engine, same markup.
   ============================================================ */
:root{
  --bg:#eef1f8;
  --bg-soft:#ffffff;
  --ink:#0d1322;
  --ink-dim:#53607a;
  --ink-faint:#5e6a85;
  --line:rgba(13,19,34,.10);
  --glass:rgba(255,255,255,.62);
  --glass-2:rgba(255,255,255,.78);

  /* accents deepened for contrast on light */
  --c-user:#6366f1;
  --c-gm:#7c4dff;
  --c-design:#e2603a;
  --c-eng:#2563eb;
  --c-mkt:#ec4899;
  --c-sales:#059669;
  --c-cs:#0ea5e9;
  --c-fin:#b57708;
}

/* readable gradient headline on light */
.grad{
  background:linear-gradient(110deg,#2563eb 0%,#6d4dff 45%,#0ea5e9 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}

/* nav */
.nav{background:linear-gradient(to bottom,rgba(238,241,248,.82),transparent)}
.nav__logo{box-shadow:0 0 16px rgba(124,77,255,.35)}

/* ---- background video layers ---- */
.bg-video{filter:saturate(1.02) brightness(1.02)}
.bg-video.is-on{opacity:.32}

/* keep the light-theme agent rail as-is (dark base now brightens it for the dark site) */
.rail__item{color:var(--ink-faint);opacity:.5}
.film__bg::before{
  background:
    radial-gradient(60% 50% at 18% 18%,rgba(124,77,255,.12),transparent 60%),
    radial-gradient(60% 60% at 85% 72%,rgba(14,165,233,.12),transparent 60%),
    radial-gradient(50% 50% at 50% 110%,rgba(207,138,8,.08),transparent 60%),
    var(--bg);
}
.film__vignette{
  background:
    radial-gradient(120% 90% at 50% 30%,transparent 30%,rgba(238,241,248,.55) 74%,var(--bg) 100%),
    linear-gradient(to right,var(--bg) 0%,transparent 22%,transparent 78%,var(--bg) 100%);
}
.film__grain{opacity:.035;mix-blend-mode:multiply}

/* soft legibility scrim behind the text-only scenes (hero + report) */
.scene[data-scene="0"] .scene__inner.center,
.scene[data-scene="8"] .scene__inner.center{
  position:relative;
}

/* ---- agent cards ---- */
.agent-card{
  background:linear-gradient(180deg,rgba(255,255,255,.88),rgba(255,255,255,.66));
  box-shadow:0 34px 80px -34px rgba(24,33,66,.34),inset 0 1px 0 rgba(255,255,255,.7);
}
.agent-card::after{opacity:.12}
.agent-card__badge{color:#fff}

/* sales ticker glow softer on light */
.ticker__value{text-shadow:0 1px 1px rgba(0,0,0,.05)}
.ledger__row--net b{text-shadow:0 1px 1px rgba(0,0,0,.05)}

/* chat outgoing bubble keeps colored fill but darker text for contrast */
.bubble--out{background:linear-gradient(135deg,#0ea5e9,#2563eb);color:#fff}

/* ---- report ---- */
.report{
  background:linear-gradient(180deg,rgba(255,255,255,.9),rgba(255,255,255,.68));
  box-shadow:0 44px 100px -40px rgba(24,33,66,.4);
}

/* ---- buttons ---- */
.btn--primary{
  color:#fff;background:linear-gradient(135deg,#6d4dff,#0ea5e9);
  box-shadow:0 16px 40px -14px rgba(94,77,255,.55);
}
.btn--primary:hover{box-shadow:0 22px 52px -14px rgba(94,77,255,.7)}
.btn--ghost:hover{background:rgba(13,19,34,.05)}

/* ---- composer ---- */
.composer{box-shadow:0 26px 60px -24px rgba(24,33,66,.3),inset 0 0 0 1px rgba(255,255,255,.4)}
.composer__avatar{border-color:rgba(99,102,241,.5);color:var(--c-user)}
.composer__send{color:#fff}

/* ---- controls ---- */
.controls{background:rgba(255,255,255,.5);box-shadow:0 12px 34px -16px rgba(24,33,66,.32)}
.ctrl{color:#fff;box-shadow:0 12px 30px -10px rgba(99,102,241,.6)}
.ctrl:hover{transform:translateY(-1px);filter:brightness(1.06)}
.pausebtn:hover{background:rgba(13,19,34,.06)}

/* ---- end ---- */
.end{background:linear-gradient(to bottom,var(--bg),#e4e9f2)}

/* ---- mobile hamburger nav ---- */
.nav__burger{display:none;flex-direction:column;gap:4px;background:none;border:0;cursor:pointer;padding:8px}
.nav__burger span{display:block;width:20px;height:2px;background:var(--ink);border-radius:2px;transition:.2s}
@media(max-width:620px){
  .nav__burger{display:flex}
  .nav__links{position:absolute;top:100%;right:clamp(12px,4vw,24px);flex-direction:column;align-items:stretch;gap:6px;
    background:var(--bg-soft);border:1px solid var(--line);border-radius:14px;padding:12px;min-width:180px;
    box-shadow:0 24px 56px -22px rgba(24,33,66,.4);opacity:0;visibility:hidden;transform:translateY(-6px);transition:.18s var(--ease)}
  .nav.nav--open .nav__links{opacity:1;visibility:visible;transform:none}
  .nav__links a:not(.nav__cta){display:block!important}
  .nav__links a{padding:8px 10px}
  .nav__cta{text-align:center}
}