/* ==========================================================================
   2SC · PRE-CPP — Design tokens
   Breakpoints referenced across the project (CSS custom props can't live
   inside @media, kept here as the single source of truth in comments):
     xs   0–359     compact phones (iPhone SE)
     sm   360–479   standard phones
     md   480–767   large phones / small phablets
     tab  768–1023  tablets (portrait iPad, Android tablets)
     lg   1024–1279 tablet landscape / small laptop
     xl   1280–1439 laptop
     xxl  1440–1919 desktop
     ultra 1920+    large desktop
   ========================================================================== */
:root {
  /* --- Color: ink / navy scale (security, authority, technology) --- */
  --ink: #070b13;
  --navy-950: #0a1122;
  --navy-900: #0d1830;
  --navy-800: #12213e;
  --navy-700: #1a2f52;
  --navy-600: #24406c;
  --navy-line: rgba(212, 224, 255, 0.1);
  --navy-line-soft: rgba(212, 224, 255, 0.06);

  /* --- Color: gold scale (certification, achievement, premium) --- */
  --gold-300: #f2dfa1;
  --gold-400: #e6c479;
  --gold-500: #cda153;
  --gold-600: #a97e3a;
  --gold-glow: rgba(230, 196, 121, 0.35);

  /* --- Text on dark --- */
  --text-1: #f6f4ee;
  --text-2: #c7cee0;
  --text-3: #8b93aa;

  /* --- Paper (light) sections — warm ivory, not clinical white --- */
  --paper: #f1ede2;
  --paper-raised: #faf8f2;
  --paper-ink-1: #0e1626;
  --paper-ink-2: #3c4356;
  --paper-ink-3: #6b7284;
  --paper-line: rgba(14, 22, 38, 0.12);

  /* --- Semantic --- */
  --accent: var(--gold-400);
  --accent-strong: var(--gold-300);
  --danger: #e0654f;
  --success: #6fbf8b;
  --whatsapp: #2fbf6d;

  /* --- Type --- */
  --font-display: "Fraunces", "Iowan Old Style", "Georgia", serif;
  --font-body: "Inter", -apple-system, "Segoe UI", sans-serif;

  /* --- Fluid type scale (clamp: mobile compact -> desktop full) --- */
  --fs-eyebrow: clamp(0.66rem, 0.6rem + 0.25vw, 0.78rem);
  --fs-body: clamp(0.9rem, 0.86rem + 0.16vw, 1rem);
  --fs-body-lg: clamp(1rem, 0.95rem + 0.2vw, 1.15rem);
  --fs-h3: clamp(1.15rem, 1.05rem + 0.55vw, 1.55rem);
  --fs-h2: clamp(1.55rem, 1.3rem + 1.2vw, 2.4rem);
  --fs-h1: clamp(2.1rem, 1.5rem + 3.2vw, 4.6rem);
  --fs-stat: clamp(1.8rem, 1.4rem + 2vw, 3rem);

  /* --- Spacing scale --- */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 2.75rem;
  --sp-8: 3.5rem;
  --sp-9: 4.5rem;

  /* section vertical rhythm — deliberately compact on mobile */
  --section-pad: clamp(2.75rem, 2.2rem + 2.5vw, 6rem);

  /* --- Radii / shadow / motion --- */
  --r-sm: 10px;
  --r-md: 16px;
  --r-lg: 24px;
  --r-pill: 999px;

  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.4), 0 6px 20px -6px rgba(0, 0, 0, 0.5);
  --shadow-2: 0 12px 40px -12px rgba(0, 0, 0, 0.55);
  --shadow-gold: 0 10px 30px -8px rgba(205, 161, 83, 0.35);

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 180ms;
  --dur-med: 420ms;
  --dur-slow: 800ms;

  --container: 1180px;
  --container-wide: 1360px;

  --nav-h: 64px;
}

@media (min-width: 1024px) {
  :root {
    --nav-h: 76px;
  }
}