[data-theme="light"] {
  --bg: #f6f8fc;
  --bg-deep: #edf2f8;
  --surface: rgba(255,255,255,.88);
  --surface-strong: #ffffff;
  --surface-soft: rgba(18,37,63,.045);
  --line: rgba(25,42,70,.11);
  --line-strong: rgba(25,42,70,.18);
  --text: #122033;
  --muted: #5f6f84;
  --shadow: 0 24px 70px rgba(56,74,108,.14);
}

[data-theme="light"] body {
  background:
    radial-gradient(circle at 75% 4%, rgba(117,135,255,.14), transparent 30rem),
    radial-gradient(circle at 8% 32%, rgba(114,215,255,.12), transparent 28rem),
    linear-gradient(180deg,#f8fbff 0%,#f3f6fb 52%,#edf2f8 100%);
  color: var(--text);
}

[data-theme="light"] .main-nav,
[data-theme="light"] .eyebrow,
[data-theme="light"] .section-kicker,
[data-theme="light"] .hero-lead,
[data-theme="light"] .section-heading > p:last-child,
[data-theme="light"] .roadmap-copy p,
[data-theme="light"] .site-footer,
[data-theme="light"] .product-card-copy > p:last-child,
[data-theme="light"] .visual-copy span,
[data-theme="light"] .floating-chip small {
  color: var(--muted);
}

[data-theme="light"] .nav-cta,
[data-theme="light"] .theme-toggle,
[data-theme="light"] .button-secondary {
  background: rgba(255,255,255,.72);
  color: #24344b;
}

[data-theme="light"] .visual-card,
[data-theme="light"] .product-card,
[data-theme="light"] .roadmap-card,
[data-theme="light"] .floating-chip {
  background: linear-gradient(155deg,rgba(255,255,255,.94),rgba(244,247,252,.9));
  box-shadow: var(--shadow);
}

[data-theme="light"] .puzzle-grid span {
  background: rgba(37,58,91,.035);
}

[data-theme="light"] .product-label,
[data-theme="light"] .hero-note,
[data-theme="light"] .site-footer strong {
  color: #68788d;
}

[data-theme="light"] .product-card-footer {
  color: #33455d;
  border-top-color: rgba(25,42,70,.08);
}

[data-theme="light"] .roadmap-status {
  color: #40536d;
  background: rgba(91,111,143,.08);
}

.theme-toggle {
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:40px;
  padding:0 13px;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(255,255,255,.045);
  color:#dce4ef;
  font:inherit;
  font-size:.84rem;
  font-weight:700;
  cursor:pointer;
}

.theme-toggle:hover { border-color:var(--line-strong); }
.theme-toggle [data-theme-icon] { font-size:1rem; line-height:1; }

.roadmap {
  width:min(calc(100% - 40px),var(--max-width));
  margin:0 auto 110px;
  padding-top:70px;
}

.roadmap-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  margin-top:34px;
}

.roadmap-card {
  min-height:210px;
  padding:26px;
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  background:linear-gradient(155deg,rgba(17,31,51,.88),rgba(10,21,36,.82));
}

.roadmap-card-top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:24px;
}

.roadmap-step {
  color:var(--blue);
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.roadmap-status {
  padding:7px 10px;
  border:1px solid var(--line);
  border-radius:999px;
  color:#9aa7ba;
  background:rgba(255,255,255,.04);
  font-size:.7rem;
  font-weight:760;
}

.roadmap-status.active {
  color:#a9f5db;
  border-color:rgba(111,230,192,.2);
  background:rgba(111,230,192,.08);
}

.roadmap-card h3 {
  margin-bottom:12px;
  font-size:1.35rem;
  letter-spacing:-.035em;
}

.roadmap-copy p { margin-bottom:0; line-height:1.65; }

@media (max-width:850px) {
  .theme-toggle [data-theme-label] { display:none; }
  .theme-toggle { width:42px; padding:0; justify-content:center; }
}

@media (max-width:760px) {
  .roadmap-grid { grid-template-columns:1fr; }
  .roadmap { margin-bottom:76px; padding-top:46px; }
}
