/* Autogeschillen: nachtblauw, wit, staalblauw, leiblauw, ijsblauw (brandbook 16-10-2026, nieuwe-labels/bouw/paletten.py).
   Contrast gemeten: nachtblauw op wit 16,67; leiblauw op wit 6,77; staalblauw op nachtblauw 5,73. */
:root {
  --bg: #FFFFFF;
  --tekst: #0C1F33;
  --kop: #0C1F33;
  --zacht: #4A5D72;
  --lijn: #DCE4EC;
  --lijn-sterk: #B7C5D3;
  --vlak: #F2F5F8;
  --kaart: #FFFFFF;
  --invoer: #FFFFFF;
  --accent: #7B9BB7;
  --vink: #4A5D72;
  --icoon-bg: #0C1F33;
  --icoon-kleur: #FFFFFF;
  --donker: #0C1F33;
  --op-donker: #FFFFFF;
  --op-donker-hover: #DCE4EC;
  --op-donker-zacht: #DCE4EC;
  --op-donker-lijn: rgba(123, 155, 183, .35);
  --accent-donker: #7B9BB7;
  --glas: rgba(12, 31, 51, .62);
  --knop: #0C1F33;
  --knop-tekst: #FFFFFF;
  --knop-hover: #1D3550;
  --focus: #4A5D72;
  --focus-zacht: rgba(123, 155, 183, .35);
  --fout: #A8382A;
  --fout-vlak: #FBEDEB;
  --goed: #1F5E3B;
  --goed-vlak: #E9F4EE;
  --intake-bg: #1A3352;
  --schaduw: 0 10px 30px rgba(12, 31, 51, .08);
  --radius: 8px;
  --radius-groot: 12px;
  --kop-bg: #0C1F33;
  --kop-tekst: #FFFFFF;
  --kop-lijn: rgba(123, 155, 183, .25);
  --kop-lijn-sterk: rgba(123, 155, 183, .6);
  --kop-accent: #7B9BB7;
  --kop-knop: #FFFFFF;
  --kop-knop-tekst: #0C1F33;
  --kop-knop-rand: #FFFFFF;
  --kop-knop-hover: #DCE4EC;
  --logo-hoogte: 48px;
  --logo-hoogte-mobiel: 36px;
  --logo-breedte-mobiel: 220px;
  --held-focus: 70% center;
  --held-focus-mobiel: 84% center;
  --held-verloop: linear-gradient(90deg, rgba(12, 31, 51, .85) 0%, rgba(12, 31, 51, .6) 32%, rgba(12, 31, 51, 0) 55%);
  --held-verloop-mobiel: linear-gradient(180deg, rgba(12, 31, 51, .78) 0%, rgba(12, 31, 51, .92) 60%, #0C1F33 100%);
  --band-verloop: linear-gradient(90deg, #0C1F33 0%, rgba(12, 31, 51, .92) 34%, rgba(12, 31, 51, .5) 60%, rgba(12, 31, 51, .05) 85%);
  --band-verloop-mobiel: linear-gradient(180deg, rgba(12, 31, 51, .85), rgba(12, 31, 51, .95));
}
/* Geen bovenbalk bij Autogeschillen: de mockup heeft hem niet, het adres staat in de voet en op de contactpagina. */
.topbalk { display: none; }
.held { min-height: 640px; }
.held h1 { font-size: clamp(2.2rem, 1.4rem + 3vw, 3.8rem); }
