/* ==========================================================================
   VARIABLES.CSS — Design tokens for the whole site.

   This is the ONE file to edit to change fonts, font sizes, colors or
   spacing anywhere on the site. Every other stylesheet reads these
   values with var(--token-name) instead of hard-coding values, so a
   change here updates every page at once.

   Load this file FIRST, before style.css and any page-specific CSS.
   ========================================================================== */

:root {
  /* ---- Colors ---- */
  --color-bg: #111827;
  --color-card: #1F2937;
  --color-primary: #F97316;
  --color-accent: #FB923C;
  --color-heading: #F9FAFB;
  --color-paragraph: #D1D5DB;
  --color-muted: #9CA3AF;
  --color-border: #374151;

  /* ---- Typography ---- */
  /* Swap either font family here to re-theme every page's type at once. */
  --font-heading: 'Oswald', sans-serif;
  --font-body: 'Lato', sans-serif;

  /* Font sizes, largest to smallest. Used by style.css's h1/h2/h3/body rules. */
  --fs-hero: 72px;
  --fs-h1: 56px;
  --fs-h2: 42px;
  --fs-h3: 30px;
  --fs-body: 18px;
  --fs-small: 16px;

  /* ---- Layout ---- */
  --container-width: 1280px;
  --section-spacing: 80px;
  --radius: 16px;
  --shadow-soft: 0 20px 60px -20px rgba(0, 0, 0, 0.55);
  --shadow-glow: 0 0 0 1px rgba(249, 115, 22, 0.15), 0 20px 45px -15px rgba(249, 115, 22, 0.25);
  --transition: 0.25s ease;
}