/* Four Seasons Air Solutions v2 — Design Tokens (D + 3: Archivo + Hot/Cold)
   Single source of truth for color, type, spacing, radii, shadow, motion. */

:root {
  /* --- Surface system --- */
  --canvas: #F4F8FB;
  --canvas-deep: #E8EFF7;
  --paper: #FFFFFF;
  --slate: #142D4C;
  --slate-deep: #0A1A33;

  /* --- Ink --- */
  --ink: #142D4C;
  --ink-muted: #5C6A82;
  --ink-soft: #8B96A8;
  --ink-on-dark: #FFFFFF;
  --ink-on-dark-muted: rgba(255, 255, 255, 0.78);
  --ink-on-dark-soft: rgba(255, 255, 255, 0.55);

  /* --- Brand colors --- */
  --navy: #142D4C;
  --navy-deep: #0A1A33;
  --navy-mid: #0B4F77;
  --coral: #FF6B45;
  --coral-deep: #E04A28;
  --sky: #76B5DB;
  --sky-soft: #C5DCEB;

  /* Legacy palette aliases — kept so older component selectors continue to resolve */
  --ember: #FF6B45;
  --ember-deep: #E04A28;
  --honey: #76B5DB;
  --pine: #0B4F77;

  /* --- Borders / hairlines --- */
  --rule: #D4DFEC;
  --rule-strong: #B6C5D9;
  --rule-on-dark: rgba(255, 255, 255, 0.14);

  /* --- Status --- */
  --success: #0B4F77;
  --warning: #FF6B45;
  --danger: #E04A28;

  /* --- Typography --- */
  --font-display: "Archivo", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-body: "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --fs-display: clamp(2.75rem, 6vw + 1rem, 5.5rem);
  --fs-h1: clamp(2.5rem, 5vw + 1rem, 5rem);
  --fs-h2: clamp(1.875rem, 2vw + 1rem, 3rem);
  --fs-h3: 1.5rem;
  --fs-h4: 1.125rem;
  --fs-body: 1.0625rem;
  --fs-small: 0.9375rem;
  --fs-eyebrow: 0.75rem;

  --lh-display: 0.95;
  --lh-heading: 1.05;
  --lh-body: 1.6;

  --tracking-eyebrow: 0.16em;
  --tracking-tight: -0.02em;
  --tracking-tighter: -0.04em;

  /* --- Spacing --- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 2.5rem;
  --space-8: 3rem;
  --space-9: 4rem;
  --space-10: 5rem;
  --space-11: 6rem;
  --space-12: 8rem;

  --section-y: clamp(4rem, 6vw, 6rem);
  --container: 1200px;
  --container-prose: 760px;
  --gutter: 1.5rem;

  /* --- Radii --- */
  --radius-sm: 8px;
  --radius: 18px;
  --radius-lg: 28px;
  --radius-pill: 999px;

  /* --- Shadows --- */
  --shadow-card: 0 12px 32px -20px rgba(20, 45, 76, 0.30);
  --shadow-card-hover: 0 20px 44px -20px rgba(20, 45, 76, 0.38);
  --shadow-soft: 0 24px 60px -28px rgba(10, 26, 51, 0.40);
  --shadow-cta: 0 12px 28px -10px rgba(255, 107, 69, 0.55);
  --shadow-cta-hover: 0 18px 38px -10px rgba(255, 107, 69, 0.65);
  --shadow-float: 0 12px 32px -16px rgba(20, 45, 76, 0.22);

  /* --- Motion --- */
  --ease-out: cubic-bezier(0.2, 0.7, 0.2, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 160ms;
  --dur-base: 240ms;
  --dur-slow: 360ms;

  /* --- Z layers --- */
  --z-header: 50;
  --z-sticky-cta: 60;
  --z-overlay: 80;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast: 0ms;
    --dur-base: 0ms;
    --dur-slow: 0ms;
  }
}