/* ============================================================
   HOLT Crane & Equipment - Design Tokens
   Source: HOLT Crane & Equipment Brand Guidelines (July 2024)
   These map 1:1 onto WordPress theme.json at build time.
   ============================================================ */

:root {
  /* ---- Brand palette (from brand guide) ---- */
  --hce-black: #2d2926;      /* primary - HCE BLACK */
  --hce-brick: #c4161c;      /* primary - HCE BRICK */
  --hce-l-grey: #e2e3e5;     /* secondary - HCE L GREY */
  --hce-d-grey: #4f4f4f;     /* secondary - HCE D GREY */
  --hce-yellow: #f7ce46;     /* accent - HCE YELLOW */
  --hce-maroon: #6a1d32;     /* accent - HCE MAROON */

  /* ---- Derived neutrals ---- */
  --grey-25: #fafafb;
  --grey-50: #f4f4f6;
  --grey-100: var(--hce-l-grey);
  --grey-400: #9a9a9c;
  --grey-600: #6e6e70;

  /* ---- Semantic aliases ---- */
  --color-bg: #ffffff;
  --color-bg-alt: var(--grey-50);
  --color-bg-dark: var(--hce-black);
  --color-text: var(--hce-black);
  --color-text-muted: var(--hce-d-grey);
  --color-text-on-dark: #f5f5f4;
  --color-primary: var(--hce-brick);
  --color-primary-hover: #a91217;

  /* ---- Typography ----
     Brand: Univers family (licensed). Web stand-ins:
     Archivo ≈ Univers 65 Bold / 75 Black (headlines)
     Inter   ≈ Univers 55 Roman (body)
     JetBrains Mono - technical accents (spec plates, eyebrows) */
  --font-heading: "Archivo", "Arial", sans-serif;
  --font-body: "Inter", "Segoe UI", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", "Consolas", monospace;

  --text-xs: 0.8125rem;
  --text-sm: 0.9375rem;
  --text-base: 1.0625rem;
  --text-lg: clamp(1.05rem, 0.95rem + 0.5vw, 1.25rem);
  --text-xl: clamp(1.375rem, 1.2rem + 0.9vw, 1.75rem);
  --text-2xl: clamp(1.75rem, 1.5rem + 1.3vw, 2.5rem);
  --text-3xl: clamp(2.25rem, 1.9rem + 1.8vw, 3.25rem);
  --text-hero: clamp(2.5rem, 1.9rem + 4.4vw, 5.25rem);

  /* ---- Spacing ---- */
  --space-2xs: 0.375rem;
  --space-xs: 0.625rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2.5rem;
  --space-xl: 4rem;
  --space-2xl: clamp(4rem, 3rem + 5vw, 7rem);

  /* ---- Layout / motion ---- */
  --content-width: 74rem;
  --header-height: 64px;
  --radius-sm: 6px;
  --radius-md: 14px;
  --radius-pill: 40px;
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --shadow-card: 0 2px 10px rgba(45, 41, 38, 0.07), 0 12px 30px rgba(45, 41, 38, 0.09);
  --shadow-card-hover: 0 4px 14px rgba(45, 41, 38, 0.11), 0 20px 44px rgba(45, 41, 38, 0.16);
}