/* MDDB America v2 — design tokens
   Colour palette carried over from v1 (assets/css/variables.css); layout and
   type system modelled on prosion.eu. */

:root {
  /* Brand palette (unchanged from v1) */
  --navy-950: #0a1628;   /* dark sections, menu, footer  (v1 --color-footer) */
  --navy-900: #0a1f4e;   /* headings on light            (v1 --color-primary-darker) */
  --navy-700: #0a3d6b;   /* deep accent                  (v1 --color-primary-dark) */
  --blue-500: #1a8cff;   /* primary                      (v1 --color-primary) */
  --blue-600: #0a6cd4;   /* primary hover                (v1 --color-primary-hover) */
  --blue-300: #7cc4ff;   /* light tint of primary, used on dark backgrounds */
  --blue-200: #5fb0ff;
  --blue-100: #e8f2ff;   /* v1 --color-light-input */
  --blue-50:  #f0f6ff;   /* light sections               (v1 --color-light-card) */
  --white:    #ffffff;

  --ink:        #0a1f4e;
  --ink-body:   #1a1a2e; /* v1 --color-text-dark */
  --ink-muted:  #4a5568; /* v1 --color-text-muted */
  --ink-subtle: #6b7a90;

  /* Gradients (blues only) */
  --grad-on-light: linear-gradient(120deg, #0a3d6b 0%, #1a8cff 100%);
  --grad-on-dark:  linear-gradient(120deg, #1a8cff 0%, #9fd3ff 100%);
  --grad-line:     linear-gradient(90deg, #0a3d6b 0%, #1a8cff 55%, #7cc4ff 100%);

  /* Contextual colours — overridden per [data-theme] */
  --bg: var(--blue-50);
  --fg: var(--ink);
  --fg-muted: var(--ink-muted);
  --fg-subtle: var(--ink-subtle);
  --line: rgba(10, 31, 78, 0.12);
  --grad: var(--grad-on-light);
  --accent: var(--blue-500);

  /* Typography */
  --font: "Geist", "Inter Tight", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --fs-display: clamp(2.75rem, 1rem + 4.4vw, 5.25rem);
  --fs-h-l:     clamp(2.25rem, 1.35rem + 3vw, 4rem);
  --fs-h-m:     clamp(1.6rem, 1.1rem + 2vw, 3rem);
  --fs-h-s:     clamp(1.5rem, 1.15rem + 1.3vw, 2.5rem);
  --fs-h-xs:    clamp(1.3rem, 1.1rem + 0.8vw, 2rem);
  --fs-h-xxs:   clamp(1.15rem, 1.05rem + 0.4vw, 1.5rem);
  --fs-text-xl: clamp(1.125rem, 1rem + 0.45vw, 1.5rem);
  --fs-text-l:  clamp(1.0625rem, 0.98rem + 0.3vw, 1.25rem);
  --fs-text-m:  1.0625rem;
  --fs-label:   0.8125rem;
  --fs-label-s: 0.75rem;

  /* Layout */
  --container: 1200px;
  --page-pad: clamp(20px, 4vw, 40px);
  --nav-h: 88px;
  --section-y: clamp(88px, 10vw, 140px);
  --radius-card: 10px;
  --radius-lg: 20px;
  --radius-section: clamp(24px, 3vw, 40px);

  /* Motion */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

  /* Shadows */
  --shadow-card: 0 1px 2px rgba(10, 22, 40, 0.04), 0 8px 24px rgba(10, 22, 40, 0.05);
  --shadow-card-hover: 0 18px 40px rgba(10, 22, 40, 0.12);
}

[data-theme="dark"] {
  --bg: var(--navy-950);
  --fg: var(--white);
  --fg-muted: rgba(255, 255, 255, 0.74);
  --fg-subtle: rgba(255, 255, 255, 0.52);
  --line: rgba(255, 255, 255, 0.12);
  --grad: var(--grad-on-dark);
  --accent: var(--blue-300);
}

[data-theme="light"] {
  --bg: var(--blue-50);
  --fg: var(--ink);
  --fg-muted: var(--ink-muted);
  --fg-subtle: var(--ink-subtle);
  --line: rgba(10, 31, 78, 0.12);
  --grad: var(--grad-on-light);
  --accent: var(--blue-500);
}

@media (max-width: 767px) {
  :root { --nav-h: 72px; }
}
