/* Design tokens — single source for colors, type scale, spacing and motion.
   Dark values are declared twice: once for the system preference (unless the
   visitor forced light), once for an explicit data-theme="dark". */
:root {
  color-scheme: light;

  --paper: #f8f7f3;
  --surface: #ffffff;
  --surface-soft: #efeee8;
  --ink: #171714;
  --ink-soft: #3f3f39;
  --muted: #6b6b63;
  --line: #deddd5;
  --line-strong: #c9c7bd;
  --accent: #df5d43;
  --accent-dark: #b9432d;
  --accent-soft: #f7ded7;
  --success: #39a768;
  --danger: #c2412d;
  --warning: #b7791f;
  --info: #3a6ea5;

  /* A band that stays dark in both themes (contact blocks, toasts) */
  --band: #171714;
  --band-ink: #f8f7f3;
  --band-muted: #c5c4bb;
  --band-line: rgba(248, 247, 243, 0.2);

  --glow: rgba(223, 93, 67, 0.08);
  --nav-bg: rgba(248, 247, 243, 0.88);
  --shadow: 0 18px 45px rgba(23, 23, 20, 0.06);

  --font-serif: "Playfair Display", Georgia, serif;
  --font-sans: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "DM Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  --step--1: clamp(0.8rem, 0.78rem + 0.1vw, 0.86rem);
  --step-0: clamp(1rem, 0.96rem + 0.2vw, 1.08rem);
  --step-1: clamp(1.25rem, 1.1rem + 0.6vw, 1.6rem);
  --step-2: clamp(1.6rem, 1.3rem + 1.4vw, 2.4rem);
  --step-3: clamp(2.2rem, 1.6rem + 3vw, 4rem);
  --step-4: clamp(2.6rem, 1.8rem + 4.2vw, 5.6rem);

  --space-section: clamp(4.5rem, 10vw, 8rem);
  --radius: 0;
  --radius-pill: 999px;
  --ease: cubic-bezier(0.2, 0.7, 0, 1);

  /* Bootstrap bridge, so admin pages and leftover utilities follow the theme */
  --bs-primary: var(--accent);
  --bs-primary-rgb: 223, 93, 67;
  --bs-secondary: var(--muted);
  --bs-secondary-rgb: 107, 107, 99;
  --bs-body-bg: var(--paper);
  --bs-body-color: var(--ink);
  --bs-body-font-family: var(--font-sans);
  --bs-border-color: var(--line);
  --bs-link-color: var(--ink);
  --bs-link-color-rgb: 23, 23, 20;
  --bs-link-hover-color: var(--accent-dark);
  --bs-emphasis-color: var(--ink);
  --bs-secondary-color: var(--muted);
  --bs-tertiary-bg: var(--surface-soft);
  --bs-heading-color: var(--ink);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;

    --paper: #121210;
    --surface: #1a1a17;
    --surface-soft: #22221e;
    --ink: #f1efe8;
    --ink-soft: #cfcdc4;
    --muted: #9c9a90;
    --line: #2c2c27;
    --line-strong: #45443d;
    --accent: #ec7a62;
    --accent-dark: #f29a86;
    --accent-soft: #3a211b;
    --success: #5cc98b;
    --danger: #f07a66;
    --warning: #e0a84a;
    --info: #7fb0e6;

    --band: #1f1f1b;
    --band-ink: #f1efe8;
    --band-muted: #b3b1a7;
    --band-line: rgba(241, 239, 232, 0.14);

    --glow: rgba(236, 122, 98, 0.1);
    --nav-bg: rgba(18, 18, 16, 0.85);
    --shadow: 0 18px 45px rgba(0, 0, 0, 0.35);

    --bs-primary-rgb: 236, 122, 98;
    --bs-secondary-rgb: 156, 154, 144;
    --bs-link-color-rgb: 241, 239, 232;
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;

  --paper: #121210;
  --surface: #1a1a17;
  --surface-soft: #22221e;
  --ink: #f1efe8;
  --ink-soft: #cfcdc4;
  --muted: #9c9a90;
  --line: #2c2c27;
  --line-strong: #45443d;
  --accent: #ec7a62;
  --accent-dark: #f29a86;
  --accent-soft: #3a211b;
  --success: #5cc98b;
  --danger: #f07a66;
  --warning: #e0a84a;
  --info: #7fb0e6;

  --band: #1f1f1b;
  --band-ink: #f1efe8;
  --band-muted: #b3b1a7;
  --band-line: rgba(241, 239, 232, 0.14);

  --glow: rgba(236, 122, 98, 0.1);
  --nav-bg: rgba(18, 18, 16, 0.85);
  --shadow: 0 18px 45px rgba(0, 0, 0, 0.35);

  --bs-primary-rgb: 236, 122, 98;
  --bs-secondary-rgb: 156, 154, 144;
  --bs-link-color-rgb: 241, 239, 232;
}