/* ==========================================================================
   COLORS — Lamborghini Design System
   Monochrome-plus-gold. True black canvas, white voice, one chromatic accent.
   ========================================================================== */

:root {
  /* --- Brand / Primary ------------------------------------------------ */
  --lambo-gold: #FFC000;        /* signature accent — primary CTAs ONLY */
  --lambo-gold-dark: #917300;   /* gold hover / pressed */
  --lambo-gold-text: #FFCE3E;   /* lighter gold for inline text accents */
  --white: #FFFFFF;             /* primary voice on dark */
  --black: #000000;             /* the abyss */

  /* --- Surfaces (the darkness gradient) ------------------------------- */
  --surface-abyss: #000000;     /* L0 — page background, hero, header, footer */
  --surface-iron: #181818;      /* L1 — deep sections, footer variant */
  --surface-charcoal: #202020;  /* L1 — cards, panels, text containers */
  --surface-near-white: #F8F8F8;/* rare light-mode content blocks */
  --surface-mist: #E6E6E6;      /* light-mode secondary containers */

  /* --- Overlays (elevation via dimming, not shadow) ------------------- */
  --overlay-70: rgba(0, 0, 0, 0.70); /* L2 — modal backdrop, video dim */
  --overlay-50: rgba(0, 0, 0, 0.50); /* L3 — lighter overlay, hover */
  --overlay-25: rgba(0, 0, 0, 0.25); /* L4 — subtle depth hint */

  /* --- Neutrals / Text ------------------------------------------------ */
  --smoke: #F5F5F5;    /* secondary text on dark, softer than white */
  --steel: #969696;    /* disabled text, subtle labels, gray-button bg */
  --ash: #7D7D7D;      /* muted text, timestamps, metadata */
  --slate: #666666;    /* alt mid-gray secondary content */
  --iron-text: #555555;/* body text variant */
  --graphite: #494949; /* dark gray text on light surfaces */
  --shadow-gray: #313131; /* very dark text on dark where white is too strong */

  /* --- Semantic / Accent (informational only — never decorative) ------ */
  --cyan-pulse: #29ABE2;  /* informational highlight, interactive feedback */
  --link-blue: #3860BE;   /* universal hyperlink hover */
  --teal-action: #1EAEDB; /* ghost-button hover background */

  /* --- Borders -------------------------------------------------------- */
  --border-hairline: #202020;              /* section dividers on black */
  --border-ghost: rgba(255, 255, 255, 0.5);/* ghost-button border, white @50% */
  --border-input: #DDDDDD;                 /* switch / form borders */

  /* ====================================================================
     SEMANTIC ALIASES — reach for these in product code
     ==================================================================== */
  --bg-page: var(--surface-abyss);
  --bg-elevated: var(--surface-charcoal);
  --bg-deep: var(--surface-iron);

  --text-heading: var(--white);
  --text-body: var(--ash);
  --text-body-strong: var(--smoke);
  --text-muted: var(--steel);
  --text-on-gold: var(--black);
  --text-on-light: var(--graphite);

  --accent-primary: var(--lambo-gold);
  --accent-primary-hover: var(--lambo-gold-dark);
  --accent-info: var(--cyan-pulse);

  --link-hover: var(--link-blue);

  --divider: var(--border-hairline);
}