/* ABR design tokens. Every colour, space, radius, shadow and type value lives here.
   Variants override only the block scoped to [data-theme]. */
:root {
  /* Brand */
  --navy: #101F38;
  --navy-900: #0B1628;
  --navy-800: #16294A;
  --navy-700: #213759;
  --navy-600: #33496C;
  --gold: #D6AD60;
  --gold-300: #E7CD9A;
  --gold-100: #F6ECD8;
  --gold-ink: #7A5B1C;      /* gold for text on light backgrounds, 5.9:1 on white */
  --ivory: #F8F6F1;
  --white: #FFFFFF;
  --slate: #52647B;
  --slate-300: #B4BFCD;     /* secondary text on navy, 9.3:1 */
  --line: #E5E2DA;
  --line-dark: rgba(255, 255, 255, .14);
  --success: #1F7A55;
  --success-bg: #E5F3EC;
  --danger: #A63A32;
  --danger-bg: #F9E9E7;

  /* Type */
  --font-heading: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --fs-xs: .8125rem;
  --fs-sm: .9375rem;
  --fs-md: 1.0625rem;
  --fs-lg: 1.1875rem;
  --fs-h3: 1.25rem;
  --fs-h2: clamp(1.875rem, 1.3rem + 2.2vw, 2.75rem);
  --fs-h1: clamp(2.25rem, 1.5rem + 3vw, 3.5rem);
  --lh-tight: 1.12;
  --lh-snug: 1.3;
  --lh-body: 1.6;

  /* Space, multiples of 4 */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px;
  --s-6: 32px; --s-7: 40px; --s-8: 48px; --s-9: 64px; --s-10: 80px; --s-11: 112px;

  /* Layout */
  --wrap: 1200px;
  --gutter: 16px;
  --section-y: 64px;
  --header-h: 72px;

  /* Shape */
  --r-sm: 8px; --r-md: 12px; --r-lg: 16px; --r-xl: 24px; --r-full: 999px;

  /* Elevation */
  --shadow-sm: 0 1px 2px rgba(16, 31, 56, .06), 0 2px 8px rgba(16, 31, 56, .05);
  --shadow-md: 0 4px 12px rgba(16, 31, 56, .07), 0 16px 32px rgba(16, 31, 56, .08);
  --shadow-lg: 0 8px 24px rgba(11, 22, 40, .16), 0 32px 64px rgba(11, 22, 40, .24);

  /* Motion */
  --ease: cubic-bezier(.22, .8, .24, 1);
  --t-fast: 160ms;
  --t-med: 280ms;
  --t-reveal: 640ms;
  --focus: 0 0 0 3px var(--white), 0 0 0 5px var(--navy);
}

@media (min-width: 768px) { :root { --gutter: 32px; --section-y: 88px; } }
@media (min-width: 1100px) { :root { --gutter: 40px; --section-y: 112px; } }

[data-theme="institutional"] {
  --t-reveal: 900ms;
  --fw-h1: 500;
  --fw-h2: 500;
  --track-h: -.022em;
}
[data-theme="saas"] {
  --t-reveal: 480ms;
  --fw-h1: 800;
  --fw-h2: 800;
  --track-h: -.032em;
  --mist: #F3F5F9;
  --line: #E4E8EF;
  --header-h: 64px;
}
