/* ==========================================================================
   Carwash Beerse: merkwaarden. Bron: logo- en sloganbestanden uit de Drive-map
   "Logo & slogan" en de map "Gilroy Font" (aangeleverd 21-09-2026).
   Dit is het enige bestand met merkkleuren en letters.
   ========================================================================== */
@font-face { font-family: "Gilroy"; src: url("/assets/fonts/gilroy-regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Gilroy"; src: url("/assets/fonts/gilroy-semibold.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Gilroy"; src: url("/assets/fonts/gilroy-bold.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }

:root {
  /* Merk, uit de logobestanden */
  --brand: #222651;          /* navy: koppen, donkere secties, tekst op oranje */
  --brand-2: #2F3468;        /* iets lichter navy voor vlakken op donker */
  /* Eén merkoranje, overal (besluit Carlson 22-09-2026). Het staat onder de
     knoppen, in de bubbels, in de icooncirkels en als oranje tekst.
     Gemeten: wit op #EE740A is 2,94:1 en #EE740A als tekst op wit is ook
     2,94:1. WCAG AA vraagt 4,5:1 voor tekst en 3,0:1 voor grote tekst en
     vormen, dus dit voldoet daar niet aan. Bewust zo gekozen: het merkbeeld
     gaat hier voor. De vorige opzet met een tweede, dieper oranje (#B85400,
     4,88:1) staat in git en in de README als het ooit terug moet. */
  --accent: #EE740A;
  --accent-diep: #EE740A;    /* zelfde oranje: knopvlak en oranje tekst */
  --accent-donker: #D0650A;  /* alleen de aanwijsstand, iets dieper */
  --accent-tekst: #FFFFFF;

  /* Neutraal, afgestemd op het navy */
  --ink: #1C1F3A;
  --muted: #5B5F7A;
  --muted-licht: #A3A6BC;
  --bg: #FFFFFF;
  --surface: #FFFFFF;
  --surface-2: #F3F4F9;
  --line: #E1E3EE;
  --line-deep: rgba(255, 255, 255, .18);
  --plaatshouder-1: #D9DCEA;
  --plaatshouder-2: #B9BED6;
  --open: #1E9E5A;
  --dicht: #C9302C;

  /* Vorm en letters */
  --radius: 11px;
  --font-kop: "Gilroy", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-body: "Gilroy", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}