/* Fonts loaded via <link> in index.html for non-blocking performance */

:root {
  /* ── Colors ── */
  --color-charcoal:    #3D3D3D;
  --color-blue-steel:  #4A7FAF;
  --color-blue-sky:    #29ABD4;
  --color-blue-navy:   #1E5EA8;
  --color-green-accent:#8DC63F;
  --color-white:       #FFFFFF;
  --color-light-bg:    #F5F7FA;
  --color-dark-bg:     #1A1F2E;
  --color-text-body:   #4A4A4A;
  --color-text-muted:  #5E6F87;

  /* ── Gradients ── */
  --gradient-blue:       linear-gradient(135deg, #1E5EA8 0%, #29ABD4 100%);
  --gradient-blue-green: linear-gradient(135deg, #1E5EA8 0%, #8DC63F 100%);
  --gradient-dark:       linear-gradient(135deg, #1A1F2E 0%, #2A3550 100%);

  /* ── Typography ── */
  --font-display: 'Syne', sans-serif;
  --font-body:    'Be Vietnam Pro', sans-serif;

  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-lg:   1.125rem;
  --text-xl:   1.375rem;
  --text-2xl:  1.75rem;
  --text-3xl:  2.25rem;
  --text-4xl:  3rem;
  --text-hero: clamp(2.5rem, 6vw, 5rem);
  --text-stat: clamp(2rem, 5vw, 4rem);

  /* ── Spacing & Layout ── */
  --section-padding: clamp(4rem, 8vw, 8rem) clamp(1.5rem, 5vw, 6rem);
  --container-max:   1200px;

  /* ── Border Radius ── */
  --radius-sm:   6px;
  --radius-md:   12px;
  --radius-lg:   24px;
  --radius-pill: 999px;

  /* ── Shadows ── */
  --shadow-card:   0 4px 24px rgba(30, 94, 168, 0.10);
  --shadow-strong: 0 8px 40px rgba(30, 94, 168, 0.20);
  --shadow-nav:    0 2px 20px rgba(30, 94, 168, 0.12);

  /* ── Hero (light theme) ── */
  --color-hero-bg:  oklch(97.5% 0.006 262);
  --color-hero-ink: oklch(13% 0.02 264);
}