body.classic {
  color-scheme: light;
  --bg: #e7ece0;
  --panel: #f8faf3;
  --line: #c1d2c3;
  --ink: #13281e;
  --muted: #3d5a4b;
  --accent: #075c39;
  --on-accent: #fff;
  --radius: 16px;
}
.classic .site-header { padding-inline: 20px; }
.classic-hero { position: relative; isolation: isolate; overflow: hidden; border-radius: var(--radius); background: #133e2d; color: #fff; }
.classic-hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-position: center 44%; z-index: -2; }
.classic-hero::after { position: absolute; inset: 0; content: ""; background: linear-gradient(90deg, #08291fea 12%, #0a2d23b8 46%, #0a2d233b); z-index: -1; }
.classic-intro { max-width: 640px; padding: clamp(26px, 6vw, 90px); }
.classic-intro .wordmark { font-size: clamp(70px, 12vw, 160px); }
.classic-intro .wordmark span, .classic-intro .kicker { color: #c7ec9c; }
.classic-intro .button { background: #e6f4d3; color: #123428; }
.classic-meta { margin-top: 13px; color: #dfefe2; font-size: 14px; font-weight: 700; }
.classic-meta span { color: #c7ec9c; padding-inline: 6px; }
.classic-body { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 18px; margin-top: 22px; }
.classic .app-band { background: #0a5036; color: #fff; }
.classic .app-band .kicker, .classic .app-band p { color: #e4f5d6; }
.classic .app-band .button { background: #e6f4d3; color: #123428; }
@media (max-width: 720px) {
  .classic-body { grid-template-columns: 1fr; }
  .classic .site-header { padding-inline: 0; }
  .classic-hero::after { background: linear-gradient(90deg, #08291fea, #0a2d2366); }
}
