/* onderhoud.css, wachtlijstpagina tijdens Academy-onderhoud (besluit Carlo 04-10-2026).
   Bouwt op consumer.css (--paper/--surface/--ink/--stone/--mist/--accent/--navy, licht + donker).
   Geen hardcoded kleuren, alle maten in rem. */
.oh { min-height: 100vh; display: flex; flex-direction: column; }
.oh-main { flex: 1; width: 100%; max-width: 68rem; margin: 0 auto; padding: 3.5rem 3rem 2.5rem;
  display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 3rem; align-items: start; }
.oh-label { display: inline-block; font-size: .75rem; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: var(--bronze-ink); }
.oh h1 { font-family: var(--serif); font-size: 2.75rem; line-height: 1.12; margin: .5rem 0 1rem; color: var(--navy); }
.oh h1 em { font-style: normal; color: var(--accent); }
.oh-lead { font-size: 1.125rem; color: var(--ink); margin: 0 0 1.5rem; max-width: 36rem; }
.oh-cijfers { display: flex; gap: 2.5rem; margin: 0 0 1.75rem; padding: 0; list-style: none; flex-wrap: wrap; }
.oh-cijfers b { display: block; font-family: var(--serif); font-size: 2.25rem; line-height: 1.1; color: var(--accent); }
.oh-cijfers span { font-size: .875rem; color: var(--stone); }
.oh-tekst { color: var(--stone); font-size: .9375rem; margin: 0 0 .75rem; max-width: 36rem; }
.oh-kaart { background: var(--surface); border: 1px solid var(--mist); border-radius: .75rem; padding: 1.5rem; }
.oh-kaart h2 { font-family: var(--serif); font-size: 1.25rem; margin: 0 0 .5rem; color: var(--navy); }
.oh-kaart p { margin: 0 0 1rem; font-size: .9375rem; color: var(--stone); }
.oh-form label.oh-veld { display: block; font-size: .8125rem; font-weight: 600; margin: 0 0 .35rem; color: var(--ink); }
.oh-form input[type=email] { width: 100%; font: inherit; font-size: 1rem; padding: .7rem .8rem; border: 1px solid var(--mist);
  border-radius: .4rem; background: var(--paper); color: var(--ink); }
.oh-form input[type=email]:focus { outline: 2px solid var(--accent); outline-offset: 1px; }
.oh-akkoord { display: flex; gap: .6rem; align-items: flex-start; margin: 1rem 0; font-size: .8125rem; color: var(--stone); }
.oh-akkoord input { margin-top: .2rem; width: 1rem; height: 1rem; flex: none; accent-color: var(--accent); }
.oh-akkoord a { color: var(--ink); }
.oh-knop { width: 100%; font: inherit; font-size: 1rem; font-weight: 700; }
.oh-knop:disabled { opacity: .6; cursor: default; }
.oh-hp { position: absolute; left: -100rem; width: 1px; height: 1px; overflow: hidden; }
.oh-melding { margin: .85rem 0 0; font-size: .875rem; min-height: 1.25rem; }
.oh-melding.goed { color: var(--good); }
.oh-melding.fout { color: var(--accent); }
.oh-klaar { display: none; }
.oh-kaart.verstuurd .oh-form { display: none; }
.oh-kaart.verstuurd .oh-klaar { display: block; }
.oh-klaar h2 { color: var(--good); }
.oh-voet { display: flex; gap: 1.25rem; flex-wrap: wrap; align-items: center; padding: 1rem 3rem; border-top: 1px solid var(--mist);
  font-size: .8125rem; color: var(--stone); }
.oh-voet a { color: inherit; text-decoration: none; display: inline-block; padding: .35rem 0; }
.oh-voet a:hover { color: var(--accent); }
.oh-sp { flex: 1; }
@media (max-width: 60rem) {
  .oh-main { grid-template-columns: 1fr; gap: 2rem; padding: 2rem 1rem; }
  .oh h1 { font-size: 2rem; line-height: 1.18; }
  .oh-lead { font-size: 1rem; }
  .oh-cijfers { gap: 1.75rem; }
  .oh-cijfers b { font-size: 1.875rem; }
  .oh-voet { padding: 1rem; }
}
.oh-cijfers b small { font-family: var(--sans); font-size: .875rem; font-weight: 600; color: var(--ink); } /* 14px op accent haalt 4,24:1; ink haalt AA (axe 06-10) */
