:root {
  --bg: #ffffff;
  --bg-soft: #f5f7f7;
  --surface: rgba(255, 255, 255, 0.78);
  --surface-strong: #ffffff;
  --surface-dark: #0e1411;
  --surface-dark-alt: #16201b;
  --text: #111715;
  --text-soft: #42504a;
  --text-inverse: #f3f7f5;
  --line: rgba(17, 23, 21, 0.1);
  --line-strong: rgba(17, 23, 21, 0.18);
  --accent: #1d8f63;
  --accent-2: #2fbf83;
  --accent-3: #d9f7e8;
  --error: #c53d2f;
  --shadow: 0 18px 50px rgba(11, 17, 15, 0.08);
  --shadow-soft: 0 8px 24px rgba(11, 17, 15, 0.06);
  --radius: 1.25rem;
  --radius-sm: 1.05rem;
  --container: min(1240px, calc(100vw - 1.5rem));
  --font-display: "Manrope", sans-serif;
  --font-body: "Instrument Sans", sans-serif;
  --transition: 240ms ease;
}

:root[data-theme="dark"] {
  --bg: #0b100e;
  --bg-soft: #101715;
  --surface: rgba(22, 31, 27, 0.82);
  --surface-strong: #161f1b;
  --surface-dark: #0b100e;
  --surface-dark-alt: #1a2620;
  --text: #edf5f0;
  --text-soft: #b8c6bf;
  --text-inverse: #edf5f0;
  --line: rgba(237, 245, 240, 0.1);
  --line-strong: rgba(237, 245, 240, 0.18);
  --accent: #32c487;
  --accent-2: #6ff0b4;
  --accent-3: rgba(50, 196, 135, 0.18);
  --error: #ff8f84;
  --shadow: 0 18px 50px rgba(0, 0, 0, 0.28);
  --shadow-soft: 0 8px 24px rgba(0, 0, 0, 0.22);
}

@media (min-width: 768px) {
  :root {
    --container: min(1240px, calc(100vw - 3rem));
  }
}