/* ============================================================
   Ontwerp B · Veldgids: de illustraties dragen de site.
   Crème papier, bosgroen, gidsen als geïllustreerde tegels,
   checker op een donkere bosband. Figtree, ronde vormen.
   ============================================================ */

@font-face { font-family: "MH Figtree"; src: url("../fonts/figtree-vf.woff2") format("woff2"); font-weight: 300 900; font-display: swap; }

:root {
  --mh-inkt: #1c2a20;
  --mh-bos: #213d2b;
  --mh-creme: #f4eee2;
  --mh-papier: #fffaf2;
  --mh-lijn: #e2d8c5;
  --mh-moslicht: #e5e9d7;
  --mh-gedempt: #5b5f53;
  --mh-lees: #37402f;
  --mh-oker: #a9521f;
  --mh-okerdonker: #8a4118;
  --mh-radius: 18px;
  --mh-font: "MH Figtree", "Figtree", ui-sans-serif, "Helvetica Neue", Arial, sans-serif;
  --mh-kop-gewicht: 800;
  --mh-body: 1.12rem;
}

body.pvh-design--veldgids { background: var(--mh-creme); }
body.pvh-design--veldgids h1 { letter-spacing: -0.025em; line-height: 1.04; }

/* header */
body.pvh-design--veldgids .pvh-top-wrap { background: var(--mh-creme); border-bottom-color: transparent; }
body.pvh-design--veldgids .pvh-nav a { color: var(--mh-inkt); border-radius: 999px; padding-inline: 14px; }
body.pvh-design--veldgids .pvh-nav a:hover { background: var(--mh-moslicht); }
body.pvh-design--veldgids .pvh-nav a[aria-current="page"] { background: var(--mh-bos); color: var(--mh-creme); text-decoration: none; }
body.pvh-design--veldgids .pvh-nav .pvh-nav__winkel { border-radius: 999px; background: var(--mh-oker); border-color: var(--mh-oker); color: #fff; }
body.pvh-design--veldgids .pvh-nav .pvh-nav__winkel:hover { background: var(--mh-okerdonker); color: #fff; }

/* voorpagina: grote illustratie */
@media (min-width: 861px) {
  body.pvh-design--veldgids .pvh-hero-home__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); }
}
body.pvh-design--veldgids .pvh-hero-home__tekst h1 { font-size: clamp(2.5rem, 5vw, 4.1rem); max-width: 13ch; }
body.pvh-design--veldgids .pvh-hero-home__beeld img { border-radius: 28px; aspect-ratio: 5 / 4; }
body.pvh-design--veldgids .pvh-hero-home__links a { color: var(--mh-okerdonker); }

/* checker op donkere band */
body.pvh-design--veldgids .pvh-checker-band { background: var(--mh-bos); border: 0; color: var(--mh-creme); }
body.pvh-design--veldgids .pvh-checker-band legend,
body.pvh-design--veldgids .pvh-checker-band .pvh-checker__niveau,
body.pvh-design--veldgids .pvh-checker-band .pvh-checker__intro { color: #fff; }
body.pvh-design--veldgids .pvh-checker-band .pvh-checker__eyebrow { color: #e9b98f; }
body.pvh-design--veldgids .pvh-checker-band .pvh-checker__optie,
body.pvh-design--veldgids .pvh-checker-band .pvh-checker__waarom,
body.pvh-design--veldgids .pvh-checker-band .pvh-checker__wacht,
body.pvh-design--veldgids .pvh-checker-band .pvh-checker__disclaimer { color: rgba(244, 238, 226, .86); border-color: rgba(244, 238, 226, .18); }
body.pvh-design--veldgids .pvh-checker-band .pvh-checker__opties,
body.pvh-design--veldgids .pvh-checker-band .pvh-checker__uitkomst { border-color: rgba(244, 238, 226, .18); }
body.pvh-design--veldgids .pvh-checker-band .pvh-checker__optie:has(input:checked) { color: #f3c79d; }
body.pvh-design--veldgids .pvh-checker-band .pvh-checker__optie input { accent-color: #e9b98f; }
body.pvh-design--veldgids .pvh-checker-band .pvh-checker__gids a { color: #f3c79d; }

/* gidsen als geïllustreerde tegels (beeld + titel verdient de tegel) */
body.pvh-design--veldgids .pvh-onderwerp__titel { border-bottom: 0; font-size: 1.35rem; }
body.pvh-design--veldgids .pvh-archieflijst .pvh-rijen, body.pvh-design--veldgids .pvh-onderwerp .pvh-rijen { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 24px; margin-top: 14px; }
body.pvh-design--veldgids .pvh-archieflijst .pvh-rij, body.pvh-design--veldgids .pvh-onderwerp .pvh-rij,
body.pvh-design--veldgids .pvh-archieflijst .pvh-rij:first-child, body.pvh-design--veldgids .pvh-onderwerp .pvh-rij:first-child { display: block; padding: 0; border: 0; }
body.pvh-design--veldgids .pvh-archieflijst .pvh-rij__beeld img, body.pvh-design--veldgids .pvh-onderwerp .pvh-rij__beeld img { width: 100%; aspect-ratio: 3 / 2; border-radius: 18px; }
body.pvh-design--veldgids .pvh-archieflijst .pvh-rij__tekst, body.pvh-design--veldgids .pvh-onderwerp .pvh-rij__tekst { display: block; margin-top: 14px; }
body.pvh-design--veldgids .pvh-onderwerp .pvh-rij__titel { font-size: 1.15rem; }
body.pvh-design--veldgids .pvh-onderwerp .pvh-rij__uittreksel { font-size: .95rem; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
body.pvh-design--veldgids .pvh-rij__beeld img { border-radius: 14px; }
@media (max-width: 860px) { body.pvh-design--veldgids .pvh-archieflijst .pvh-rijen, body.pvh-design--veldgids .pvh-onderwerp .pvh-rijen { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { body.pvh-design--veldgids .pvh-archieflijst .pvh-rijen, body.pvh-design--veldgids .pvh-onderwerp .pvh-rijen { grid-template-columns: 1fr; } }

/* artikel */
body.pvh-design--veldgids .pvh-hero { border-radius: 28px; width: min(1200px, calc(100% - 40px)); }
body.pvh-design--veldgids .pvh-hero img { aspect-ratio: 16 / 9; }
body.pvh-design--veldgids .pvh-kort { background: var(--mh-papier); border: 0; border-radius: 18px; padding: 20px 24px; }
body.pvh-design--veldgids .pvh-kort__eyebrow { color: var(--mh-oker); }
body.pvh-design--veldgids .pvh-verder { background: var(--mh-papier); border-top: 0; }
@media (max-width: 700px) { body.pvh-design--veldgids .pvh-hero { width: 100%; border-radius: 0; } }

/* footer */
body.pvh-design--veldgids .pvh-voet { background: #182c20; border-radius: 32px 32px 0 0; }
body.pvh-design--veldgids .pvh-paginering a, body.pvh-design--veldgids .pvh-paginering span { border-radius: 999px; }