:root {
  --background: #0C4137;
  --hero-bg: #04322A;
  --surface: #061F1A;
  --surface-muted: #0B241E;
  --surface-elevated: #125548;
  --ink: #E6FBF6;
  --muted: #94D8C8;
  --line: rgba(148,216,200,0.20);
  --line-strong: #267864;
  --brand: #06D6A0;
  --brand-strong: #38BDF8;
  --on-accent: #00281C;
  --warm: #FF9F34;
  --danger: #FF9D91;
  --shadow: 0 28px 70px rgba(0,0,0,0.5);
  --glass: rgba(6,31,26,0.72);
  --logo-grad: linear-gradient(135deg, #06D6A0 0%, #38BDF8 100%);
  --head-grad: linear-gradient(120deg, #B4F3E4 0%, #06D6A0 42%, #38BDF8 100%);
  --topbar-grad: linear-gradient(90deg, #1FC79B 0%, #5FDEC0 58%, #B4F3E4 100%);
  --deep-grad: radial-gradient(circle at 16% 8%, rgba(44,229,171,0.22) 0%, transparent 46%), linear-gradient(150deg, #086045 0%, #0A7A55 42%, #05392B 100%);
  --warm-grad: linear-gradient(145deg, #FF9F34 0%, #FF6B22 100%);
  --font-display: "IBM Plex Sans", sans-serif;
  --font-body: "Inter", sans-serif;
  --font-mono: "IBM Plex Mono", monospace;
  --radius-card: 18px;
  --radius-button: 13px;
  --radius-pill: 999px;
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
}

:root[data-theme="light"] {
  --background: #F2FCFA;
  --hero-bg: #F2FCFA;
  --surface: #FFFFFF;
  --surface-muted: #F0FAF6;
  --surface-elevated: #E7F5F0;
  --ink: #0C4137;
  --muted: #4F6E64;
  --line: rgba(12,65,55,0.10);
  --line-strong: rgba(12,65,55,0.20);
  --brand: #0A7A55;
  --brand-strong: #0369A1;
  --on-accent: #00281C;
  --warm: #C25A12;
  --danger: #C21F1F;
  --shadow: 0 26px 60px rgba(12,65,55,0.16);
  --glass: rgba(255,255,255,0.80);
  --head-grad: linear-gradient(120deg, #0A7A55 0%, #0369A1 100%);
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
  --background: #F2FCFA;
  --hero-bg: #F2FCFA;
  --surface: #FFFFFF;
  --surface-muted: #F0FAF6;
  --surface-elevated: #E7F5F0;
  --ink: #0C4137;
  --muted: #4F6E64;
  --line: rgba(12,65,55,0.10);
  --line-strong: rgba(12,65,55,0.20);
  --brand: #0A7A55;
  --brand-strong: #0369A1;
  --on-accent: #00281C;
  --warm: #C25A12;
  --danger: #C21F1F;
  --shadow: 0 26px 60px rgba(12,65,55,0.16);
  --glass: rgba(255,255,255,0.80);
  --head-grad: linear-gradient(120deg, #0A7A55 0%, #0369A1 100%);
}
}

.theme-light { color-scheme: light; }
:root:not([data-theme="light"]) { color-scheme: dark; }
:root[data-theme="light"] { color-scheme: light; }

@media (prefers-reduced-motion: reduce) {
  :root { scroll-behavior: auto; }
}

@media (prefers-reduced-motion: no-preference) {
  :root { scroll-behavior: smooth; }
}