/* =========================================
   VARIABLES — TexUS Core Design System
   Role: design tokens only (no layout, no components)
   ========================================= */

:root {

  /* ===== BRAND PALETTE (never use directly in components) ===== */

  --tx-navy: #1A1F2B;
  --tx-navy-accent: #000053;
  --tx-red: #C8102E;
  --tx-white: #ffffff;

  --tx-gray-light: #f4f4f4;
  --tx-gray-mid: #dddddd;
  --tx-gray-muted: #808080;

  /* ===== SEMANTIC COLORS (UI layer) ===== */

  --bg-main: var(--tx-white);
  --bg-light: var(--tx-gray-light);
  --bg-dark: var(--tx-navy);

  --text-main: var(--tx-navy);
  --text-light: var(--tx-white);
  --text-muted: var(--tx-gray-muted);

  --surface-card: var(--tx-white);
  --elevation-card: 0 6px 20px rgba(0, 0, 0, 0.08);

  /* ===== OVERLAYS ===== */

  --overlay-dark: rgba(0, 0, 0, 0.55);

  /* ===== SPACING SCALE ===== */

  --space-xxs: 0.25rem;
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 2rem;
  --space-xl: 3rem;
  --space-xxl: 4rem;

  /* ===== RADII ===== */

  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;

  /* ===== SHADOWS ===== */

  --shadow-soft: 0 0 10px rgba(0,0,0,0.05);
  --shadow-medium: 0 0 16px rgba(0,0,0,0.1);

  /* ===== BREAKPOINT TOKENS (reference only) ===== */

  --bp-mobile: 480px;
  --bp-tablet: 768px;
  --bp-desktop: 1024px;
  --bp-wide: 1280px;
}

/* ===== TYPOGRAPHY TOKENS ===== */

:root {

  /* Font families */
  --font-brand: "Cinzel";
  --font-serif: "CormorantSC";
  --font-sans: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-script: "Kaushan";

  /* Font sizes */
  --fs-xl: 2rem;
  --fs-lg: 1.5rem;
  --fs-md: 1.25rem;
  --fs-base: 1rem;
  --fs-sm: 0.875rem;

  /* Line heights */
  --lh-tight: 1.15;
  --lh-normal: 1.35;
  --lh-relaxed: 1.6;
}