/* Homepage only: cover, spreads, legend, operators, news. */
.cover img{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:50% 60%}
.credit{margin:6px 0 0;color:var(--muted);font:400 .8125rem/1.4 var(--serif)}
.credit a{color:var(--muted)}
.cover-tekst{display:grid;gap:var(--s5);padding:28px 0 40px;border-bottom:1px solid var(--rule)}
.cover-tekst h1{font-size:clamp(2.6rem,11.5vw,6.5rem);font-weight:800;font-stretch:100%;line-height:.92;letter-spacing:-.025em}
.dek{max-width:36em;margin:20px 0 0;font-size:1.1875rem;line-height:1.55}
.snel{align-self:end;padding-left:var(--s4);border-left:3px solid var(--red);font-size:1rem}
.snel p{margin:0 0 var(--s2)}
.snel ul{margin:0;padding:0;list-style:none}
.snel a{display:inline-flex;align-items:center;min-height:44px;font:600 1rem/1.25 var(--sans)}

.spreads{display:grid;gap:40px}
.spread{display:flex;flex-direction:column;min-width:0}
.spread-foto{display:block}
.spread img{width:100%;aspect-ratio:3/2;object-fit:cover}
.spread .naam{margin:18px 0 6px;font-size:clamp(2rem,8vw,2.375rem);font-weight:800;font-stretch:112%;line-height:.98;letter-spacing:-.02em}
.spread .naam a{text-decoration:none}
.spread .naam a:hover{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:.1em}
.spread .regio{margin:0 0 14px;color:var(--muted);font-style:italic}
.spread .feiten{margin-top:auto}
.spread .lede{max-width:34em;margin:20px 0 0}
.spread .meer{margin-top:var(--s2)}
.spread-lead .naam{font-size:clamp(2.5rem,11vw,4.75rem);line-height:.95}
.spreads+.bron{margin-top:var(--s5)}

.legenda{display:grid;gap:var(--s5)}
.legenda h3{margin-bottom:var(--s2);font-size:1.25rem;font-stretch:112%}
.legenda p{max-width:30em;margin:0}

.ops{display:grid;margin:0;padding:0;list-style:none;border-top:1px solid var(--ink)}
.ops li{display:flex;flex-direction:column;padding:var(--s4) var(--s4) var(--s4) 0;border-bottom:1px solid var(--rule)}
.ops h3{font-size:1.125rem;font-stretch:112%}
.ops p{margin:var(--s1) 0 var(--s2);color:var(--muted);font-size:.9375rem}
.ops a{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin-top:auto;font:600 .9375rem/1.25 var(--sans)}
.ops-alle{margin:var(--s5) 0 0}

.nieuws{display:grid;gap:var(--s5);margin:0;padding:0;list-style:none}
.nieuws li{padding-top:var(--s3);border-top:1px solid var(--ink)}
.nieuws time{color:var(--muted);font:500 .8125rem var(--sans)}
.nieuws h3{margin:6px 0 var(--s2);font-size:1.25rem;font-stretch:106%;line-height:1.2}
.nieuws h3 a{text-decoration:none}
.nieuws h3 a:hover{text-decoration:underline}
.nieuws p{margin:0;font-size:.9375rem}

@media (min-width:760px){
  /* a short wide banner: the h1 and the lead stay in the first viewport (1280 x 800) */
  .cover img{aspect-ratio:3/1;max-height:min(520px,42vh)}
  .cover-tekst h1{font-stretch:125%}
  .spreads{grid-template-columns:1fr 1fr;gap:48px 32px}
  .spread-lead{grid-column:1/-1}
  .spread-lead .naam{font-stretch:125%}
  .legenda{grid-template-columns:repeat(3,1fr);gap:40px}
  .ops{grid-template-columns:repeat(2,1fr)}
  .nieuws{grid-template-columns:repeat(3,1fr);gap:32px}
}
@media (min-width:960px){
  .cover-tekst{grid-template-columns:minmax(0,1fr) 300px;gap:48px}
  .spreads{grid-template-columns:repeat(3,minmax(0,1fr));gap:56px 32px}
  .spread-lead{display:grid;grid-template-columns:7fr 5fr;gap:40px;align-items:stretch}
  .spread-lead .spread-foto img{height:100%;min-height:420px;aspect-ratio:auto}
  .spread-lead .naam{margin-top:0}
  .spread-lead .spread-tekst{display:flex;flex-direction:column}
  .spread-lead .feiten{margin-top:var(--s4)}
  .ops{grid-template-columns:repeat(3,1fr)}
}
@media (prefers-reduced-motion:no-preference){
  .cover{overflow:clip}
  .cover img{animation:onthul .9s ease-out both}
}