/* PROBLEEM-DONKER — het ws-probleem-contract (css/werving-selectie/ws2.css) als donkere band.
   GEDEELD, 14-09-2026 (avond), structuurronde Timo: "sectie 2 is altijd donker, zoals es2 op ES,
   anders is de hero niet meer mooi". ws2.css is sinds 13-09 licht-only; deze inversie staat
   daarom apart en werkt op elke pagina die .probleem-donker naast .ws-probleem zet, samen met
   .section--dark .on-dark (base.css: navy vlak, witte koppen, oranje eyebrow).
   Bovenruimte normaal in plaats van 0: de harde seam na de witte logostrook IS de overgang
   (het es2-recept). De hairline van ws2 was de overgang vanuit een donkere hero; hier weg.
   ⛔ Wijzig je dit bestand, meet dan elke pagina: grep -rl "probleem-donker.css" cms/templates/shells/ */
.probleem-donker { padding-block: var(--space-section) var(--space-section-s); }
.probleem-donker .ws-probleem-rule { display: none; }
/* ⛔ 15-09-2026, Timo: GEEN SCHEIDINGSLIJN tussen de alinea's. "Die voegt niks toe en maakt die
   rechterkant van dat kader onnodig hoog." ws2.css zet er een op .ws-probleem-alinea + .alinea;
   hier gaat hij uit. Allebei de lijnen, niet alleen de eerste: een pagina met een lijn tussen
   alinea 2 en 3 maar niet tussen 1 en 2 leest als een fout, en alinea 3 heeft de oranje
   kickerlijn al als eigen markering - een hairline 18px daarboven is dubbelop.
   Met de lijn vervalt ook de reden voor de ruime padding eromheen (30px boven en onder per
   alinea, want er moest lucht om een streep). Als gewone alinea's is 16px genoeg; de conclusie
   houdt iets meer, zodat de oranje kicker als omslag blijft lezen.
   Gemeten winst in de rechterkolom: 44px korter. */
.probleem-donker .ws-probleem-alinea + .ws-probleem-alinea { border-top: 0; }
.probleem-donker .ws-probleem-alinea { padding-block: clamp(12px, 1.6vw, 16px); }
.probleem-donker .ws-probleem-alinea:first-child { padding-top: 0; }
.probleem-donker .ws-probleem-alinea:last-child { padding-bottom: 0; }
.probleem-donker .ws-probleem-alinea--keer { padding-top: clamp(20px, 2.6vw, 28px); }
.probleem-donker .ws-probleem-alinea p { color: var(--text-body-inv); }
.probleem-donker .ws-probleem-alinea--keer p { color: var(--text-strong-inv); }
