/**
 * Layout: containers, sectieritme, banden. Scheiding via achtergrondwissel
 * en hairlines — niet via kaders en schaduwen.
 */

.ww-container {
  width: min(100% - clamp(32px, 6vw, 96px), var(--ww-standaard));
  margin-inline: auto;
}

/* Verticaal sectieritme voor volle-breedte-groepen */
.ww-sectie { padding-block: var(--ww-sectie); }
.ww-sectie-kl { padding-block: var(--ww-sectie-kl); }

main .wp-block-group.alignfull { scroll-margin-top: 90px; }

/* Zachte band: paper met hairlines boven/onder */
.ww-band-zacht {
  background: var(--ww-paper);
  box-shadow: inset 0 1px 0 var(--ww-lijn), inset 0 -1px 0 var(--ww-lijn);
  border: none;
}

/* Donkere band: forest met licht op donker */
.ww-donkerband { background: var(--ww-forest); color: var(--ww-licht); }
.ww-donkerband a { color: var(--ww-licht); }
.ww-donkerband .ww-eyebrow { color: var(--ww-licht-gedempt); }
.ww-donkerband .ww-eyebrow::before { background: var(--ww-clay); }
.ww-donkerband h2.wp-block-heading, .ww-donkerband h3.wp-block-heading { color: var(--ww-paper); }

/* Hairline-scheiding als los element */
.ww-hairline { border: none; border-top: 1px solid var(--ww-lijn); margin: 0; }

/* Sectiekoppen in volle-breedte-secties uitlijnen op het brede raster */
.wp-block-post-content .wp-block-group.alignfull > .ww-eyebrow,
.wp-block-post-content .wp-block-group.alignfull > h2.wp-block-heading {
  max-width: var(--wp--style--global--wide-size);
}