/* =============================================================
   tokens.css — Four Seasons Air Solutions
   Locked at style-preview approval. Every value on the site
   resolves to a var() defined here.
   ============================================================= */

:root {
  /* ---- Color: brand --------------------------------------- */
  /* Deep corporate blue from logo banner */
  --color-brand:            #0B3D7A;
  --color-brand-strong:     #082B57;
  --color-brand-soft:       #E8F0FB;

  /* Sun-gold primary CTA (vivid, drawn from logo sun) */
  --color-accent:           #F5B400;
  --color-accent-strong:    #D89A00;
  --color-accent-soft:      #FFF4D1;

  /* Seasonal orange + leaf-green micro-highlights from logo */
  --color-season-orange:    #EE7A1A;
  --color-season-green:     #4FAE3E;

  /* ---- Color: neutrals (tinted toward brand hue) ---------- */
  --color-ink:              #0F1B2D;
  --color-ink-muted:        #5B6878;
  --color-line:             #D8DEE7;
  --color-surface:          #FFFFFF;
  --color-surface-raised:   #F6F8FC;
  --color-surface-inverse:  #082B57;
  --color-on-inverse:       #FFFFFF;
  --color-on-accent:        #0F1B2D;

  /* ---- Color: state --------------------------------------- */
  --color-focus:            #F5B400;
  --color-error:            #C5283D;
  --color-success:          #2E8B57;

  /* ---- Typography ----------------------------------------- */
  --font-head:              "Inter", "Helvetica Neue", Arial, sans-serif;
  --font-body:              "Inter", "Helvetica Neue", Arial, sans-serif;
  --font-weight-body:       400;
  --font-weight-medium:     500;
  --font-weight-semibold:   600;
  --font-weight-bold:       700;

  --scale-ratio:            1.333;
  --text-xs:                0.75rem;     /* 12px */
  --text-sm:                0.875rem;    /* 14px */
  --text-base:              1rem;        /* 16px */
  --text-lg:                1.125rem;    /* 18px */
  --text-h4:                1.25rem;     /* 20px */
  --text-h3:                1.563rem;    /* 25px */
  --text-h2:                clamp(1.75rem, 1.4rem + 1.6vw, 2.5rem);
  --text-h1:                clamp(2.25rem, 1.7rem + 2.6vw, 3.25rem);
  --text-display:           clamp(2.75rem, 2rem + 3.6vw, 4.25rem);

  --leading-body:           1.6;
  --leading-tight:          1.15;
  --tracking-caps:          0.08em;
  --measure:                70ch;

  /* ---- Spacing (4pt grid) --------------------------------- */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-6:  24px;
  --space-8:  32px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;
  --section-y: clamp(48px, 6vw, 96px);

  /* ---- Radius --------------------------------------------- */
  --radius-sm:              6px;
  --radius-md:              10px;
  --radius-lg:              16px;
  --radius-pill:            999px;

  /* ---- Border --------------------------------------------- */
  --border-width:           1px;
  --border:                 var(--border-width) solid var(--color-line);

  /* ---- Shadow --------------------------------------------- */
  --shadow-sm:              0 1px 2px rgba(11, 61, 122, 0.06);
  --shadow-md:              0 6px 18px rgba(11, 61, 122, 0.10);
  --shadow-lg:              0 18px 40px rgba(11, 61, 122, 0.16);

  /* ---- Motion --------------------------------------------- */
  --ease:                   cubic-bezier(0.2, 0.6, 0.2, 1);
  --dur-fast:               120ms;
  --dur:                    220ms;
  --dur-slow:               420ms;

  /* ---- Layout containers ---------------------------------- */
  --container-max:          1200px;
  --container-narrow:       880px;

  /* ---- Brand gradients ------------------------------------ */
  --gradient-brand:         linear-gradient(135deg, #0B3D7A 0%, #144DA0 60%, #1E63C2 100%);
  --gradient-warm:          linear-gradient(135deg, #F5B400 0%, #EE7A1A 100%);
}

/* Honor reduced-motion at the foundation level. */
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast: 0.01ms;
    --dur:      0.01ms;
    --dur-slow: 0.01ms;
  }
}
