/*
  Ontwerp van De Loteling (Aldeneik). Palet uit hun eigen beeld:
  deurgroen (voordeur en kozijnen), inkt (logo op de menukaart), baksteen (gevel), wit en buxus (gedekte tafels, hagen),
  haardgloed (alleen op deurgroen). Letters: Bodoni Moda (titels, rond 1800 zoals de lotelingen) en Alegreya Sans (tekst).
  Contrast nagerekend (WCAG AA). Nooit tekst onder 16 px; op donker een tikje zwaarder.
*/
:root {
  --groen: #1F3A2E;
  --inkt: #3D2433;
  --baksteen: #9B5A44;
  --laken: #FFFFFF;
  --buxus: #EEF1EA;
  --gloed: #E0A458;

  --vlak: var(--laken);
  --vlak-2: var(--buxus);
  --tekst: var(--inkt);
  --zacht: #5A4653;
  --lijn: rgba(61, 36, 51, .17);
  --accent: var(--baksteen);
  --op-accent: #FFFFFF;
  --link: var(--inkt);
  --lavendel: var(--baksteen);
  --focus: var(--baksteen);
  --kop-vlak: rgba(255, 255, 255, .96);
  --letter-tekst: 'Alegreya Sans', 'Segoe UI', system-ui, sans-serif;
  --letter-kop: 'Bodoni Moda', Didot, 'Bodoni MT', Georgia, serif;
  --kop-gewicht: 500;
  --rond: 2px;
  --breed: 1200px;
  --kop-h: 72px;
  --voet-vlak: var(--groen);
  --voet-tekst: #FFFFFF;
  --rv-vlak: #FFFFFF;
  --rv-tripadvisor: #00754F;
  --rv-schaduw: none;

  --ow-vlak: var(--groen);
  --ow-tekst: #FFFFFF;
  --ow-zacht: #D5DFD9;
  --ow-lijn: rgba(255, 255, 255, .22);
  --ow-accent: var(--gloed);
  --ow-op-accent: var(--groen);
  --ow-kop: var(--letter-kop);
  --ow-hand: var(--letter-tekst);
  --ow-rond: 4px;
}

/* Donkere vlakken: deurgroen, met haardgloed als accent */
.donker {
  --vlak: var(--groen); --vlak-2: #29483A; --tekst: #FFFFFF; --zacht: #D5DFD9; --lijn: rgba(255, 255, 255, .22);
  --accent: var(--gloed); --op-accent: var(--groen); --link: #FFFFFF; --lavendel: var(--gloed); --focus: var(--gloed);
  --kop-gewicht: 520;
  background: var(--vlak); color: var(--tekst); font-weight: 500;
}
.buxus { background: var(--buxus); --vlak-2: #FFFFFF; }

body { font-size: 1.125rem; line-height: 1.6; }
h1, h2, h3 { font-optical-sizing: auto; letter-spacing: -.005em; }
.blok-titel { font-size: clamp(2.1rem, 1.55rem + 2.3vw, 3.3rem); line-height: 1.06; margin-bottom: .5em; }
.blok-intro { font-size: 1.2rem; }
.knop { font-weight: 700; letter-spacing: .01em; }
.knop .ico { width: 1.25em; height: 1.25em; }
.tekst-link { color: var(--link); }
.klein-titel { font-weight: 700; font-size: 1.05rem; }
main > section + section.buxus, main > section.buxus + section { border-top: 0; }

/* Seizoen: winter (oktober tot en met maart) of zomer. Zonder script: winter. */
html:not([data-jaargetijde="zomer"]) [data-alleen="zomer"],
html[data-jaargetijde="zomer"] [data-alleen="winter"] { display: none !important; }

/* ---------- kop ---------- */
.kop { border-bottom: 1px solid transparent; }
html.is-gescrold .kop { box-shadow: none; border-bottom-color: var(--lijn); }
.kop-binnen { gap: 10px; }
.kop-merk { margin-right: auto; padding-block: 4px; color: var(--inkt); }
.kop-logo { width: auto; height: 42px; }
.kop-nav a[aria-current="page"] { text-decoration: underline; text-decoration-color: var(--baksteen); text-decoration-thickness: 2px; text-underline-offset: 6px; }
.kop-bel { padding-inline: .9em; }
.kop-bel-lang { display: none; }
.kop-open {
  display: inline-flex; align-items: center; gap: .45rem; min-height: 44px; padding: 0 .85rem;
  border: 1.5px solid color-mix(in srgb, var(--inkt) 40%, transparent); border-radius: var(--rond);
  background: transparent; color: var(--inkt); font: 700 1rem/1 var(--letter-tekst); cursor: pointer;
}
.kop-open-ico { display: grid; }
.kop-open-ico .ico { grid-area: 1 / 1; width: 1.25em; height: 1.25em; }
.kop-open[aria-expanded="true"] .ico:first-child, .kop-open[aria-expanded="false"] .ico:last-child { visibility: hidden; }
@media (max-width: 419px) {
  .kop-bel { width: 44px; padding: 0; }
  .kop-bel-kort { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .kop-logo { height: 38px; }
}
@media (max-width: 1099px) {
  .kop-nav {
    display: none; position: fixed; inset: var(--kop-h) 0 auto 0; z-index: 49; max-height: calc(100dvh - var(--kop-h)); overflow-y: auto;
    padding: 4px var(--rand) 24px; background: var(--laken); border-bottom: 1px solid var(--lijn);
    box-shadow: 0 24px 40px -30px rgba(31, 58, 46, .6);
  }
  html.nav-open .kop-nav { display: block; }
  .kop-nav ul { flex-direction: column; gap: 0; }
  .kop-nav a { display: block; padding: 14px 0; font-size: 1.3rem; font-family: var(--letter-kop); border-bottom: 1px solid var(--lijn); }
}
@media (min-width: 1100px) {
  :root { --kop-h: 84px; }
  .kop-binnen { gap: 28px; }
  .kop-logo { height: 54px; }
  .kop-nav { display: block; }
  .kop-nav ul { gap: 1.7rem; }
  .kop-nav a { font-size: 1.08rem; font-weight: 500; }
  .kop-open { display: none; }
  .kop-bel-kort { display: none; }
  .kop-bel-lang { display: inline; }
}

/* ---------- eerste schermen: gedeeld ---------- */
.held { position: relative; padding: 0; }
.held h1 { font-size: clamp(2.35rem, 1.6rem + 3.4vw, 4.6rem); line-height: 1.03; letter-spacing: -.012em; margin-bottom: .45em; }
.held-regel { font-size: 1.2rem; line-height: 1.5; max-width: 30em; margin-bottom: 1.1rem; }
.held-status {
  display: inline-flex; align-items: center; gap: .55rem; margin: 0 0 1.1rem; padding: .3em .9em;
  border: 1.5px solid var(--lijn); border-radius: 999px; font-size: 1rem; font-weight: 700;
}
.held-status.is-open { background: var(--accent); border-color: var(--accent); color: var(--op-accent); }
.held-status.is-open .status-stip { background: var(--op-accent); box-shadow: none; }
.prijzen-kort { display: flex; flex-wrap: wrap; align-items: baseline; gap: .2rem 1.3rem; margin: 0 0 .2rem; }
.prijzen-kort li { display: flex; align-items: baseline; gap: .45rem; }
.prijzen-kort .prijs-gangen { font-weight: 500; }
.prijzen-kort .prijs-bedrag { font-family: var(--letter-kop); font-size: 1.85rem; line-height: 1; font-weight: 500; font-variant-numeric: lining-nums; }
.prijzen-kort .prijs-pp { display: none; }
.held-prijsnaam { font-size: 1rem; color: var(--zacht); margin: 0; }
.held .blok-knoppen { margin-top: 1.3rem; }
@media (max-width: 559px) { .held .blok-knoppen .knop { flex: 1 1 100%; } }

/* A: haard of tuin */
.held-a-beeld { position: relative; }
.held-a-beeld img { width: 100%; height: clamp(190px, 31vh, 320px); object-fit: cover; object-position: 50% 55%; border-radius: 0; }
.held-a-beeld [data-alleen="zomer"] img { object-position: 50% 62%; }
.held-a-tekst { padding-block: 20px 44px; }
.seizoen-wissel {
  position: absolute; left: var(--rand); bottom: 12px; z-index: 2; display: flex; gap: 4px; padding: 4px;
  border-radius: 999px; background: rgba(255, 255, 255, .95); box-shadow: 0 6px 18px -8px rgba(31, 58, 46, .55);
}
.seizoen-wissel button {
  min-height: 40px; min-width: 76px; padding: 0 .95rem; border: 0; border-radius: 999px; background: transparent; color: var(--inkt);
  font: 700 1rem/1 var(--letter-tekst); cursor: pointer;
}
.seizoen-wissel button[aria-pressed="true"] { background: var(--baksteen); color: #FFFFFF; }
.seizoen-wissel-label { align-self: center; padding: 0 .4rem 0 .7rem; font-size: 1rem; font-weight: 500; }
@media (max-width: 899px) { .seizoen-wissel-label { display: none; } }
@media (min-width: 900px) {
  .held-a { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr); min-height: min(calc(100svh - var(--kop-h)), 860px); }
  .held-a-tekst {
    order: -1; align-self: center; width: 100%; max-width: calc(var(--breed) / 2 + 20px); margin-left: auto;
    padding: 56px clamp(32px, 5vw, 72px) 64px var(--rand);
  }
  .held-a-beeld img { height: 100%; min-height: 100%; position: absolute; inset: 0; }
  .held-a-beeld > [data-alleen] { position: absolute; inset: 0; }
  .seizoen-wissel { left: 24px; bottom: 24px; }
}

/* B: Marijke en Rudi */
.held-b { padding-block: 28px 0; }
.held-b-raster { display: grid; gap: 28px; }
.held-citaat { margin: 0 0 1.4rem; }
.held-citaat blockquote { margin: 0; }
.held-citaat p {
  font-family: var(--letter-kop); font-weight: 500; font-size: clamp(1.9rem, 1.35rem + 2.5vw, 3.6rem); line-height: 1.08;
  letter-spacing: -.012em; text-wrap: balance;
}
.held-citaat p::before { content: "\201C"; }
.held-citaat p::after { content: "\201D"; }
.held-citaat figcaption { display: flex; align-items: center; gap: .55rem; margin-top: .7rem; font-size: 1rem; font-weight: 500; color: var(--zacht); }
.held-citaat figcaption svg { width: 24px; height: 24px; }
.held-b h1 { font-size: clamp(1.55rem, 1.25rem + 1.3vw, 2.2rem); line-height: 1.2; margin-bottom: .5em; }
.held-scores { display: flex; flex-wrap: wrap; gap: 10px 28px; margin: 0 0 1.2rem; }
.held-scores li { display: flex; align-items: center; gap: .55rem; }
.held-scores .rv-logo { position: static; width: 30px; height: 30px; }
.held-scores strong { font-family: var(--letter-kop); font-size: 1.9rem; font-weight: 500; line-height: 1; }
.held-scores span { font-size: 1rem; line-height: 1.3; color: var(--zacht); }
.held-b-beeld img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
@media (max-width: 899px) { .held-b-beeld { margin-inline: calc(var(--rand) * -1); } .held-b-beeld img { border-radius: 0; } }
@media (min-width: 900px) {
  .held-b { padding-block: 64px 72px; }
  .held-b-raster { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); align-items: center; gap: 64px; }
  .held-b-beeld img { aspect-ratio: 4 / 5; object-position: 40% 50%; }
}

/* C: feesten tot 16 */
.held-c-beeld { position: relative; }
.held-c-beeld .foto-groot img { width: 100%; height: clamp(190px, 30vh, 320px); object-fit: cover; border-radius: 0; }
.held-c-beeld .foto-klein { display: none; }
.held-c-tekst { padding-block: 22px 44px; }
.feest-soorten { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 .4rem; }
.feest-soorten li { padding: .25em .8em; border-radius: 999px; background: var(--buxus); font-size: 1rem; font-weight: 500; }
.held-c-kijk { margin-top: 1rem; font-size: 1.05rem; color: var(--zacht); }
@media (min-width: 900px) {
  .held-c { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr); min-height: min(calc(100svh - var(--kop-h)), 860px); }
  .held-c-tekst { order: -1; align-self: center; width: 100%; max-width: calc(var(--breed) / 2 + 20px); margin-left: auto; padding: 56px clamp(32px, 5vw, 72px) 64px var(--rand); }
  .held-c-beeld .foto-groot img { position: absolute; inset: 0; height: 100%; }
  .held-c-beeld .foto-klein { display: block; position: absolute; left: -56px; bottom: 48px; width: clamp(220px, 20vw, 300px); border: 8px solid var(--laken); box-shadow: 0 20px 40px -24px rgba(31, 58, 46, .7); }
}

/* D: het verhaal (zoals de menukaart: gecentreerd, de gravure bovenaan) */
.held-d { padding-block: 24px 48px; text-align: center; }
.held-d .soldaten { width: min(70%, 440px); height: auto; margin: 0 auto 4px; }
.held-d h1 { margin: 0 auto .55rem; color: var(--inkt); }
.held-d h1 svg { width: min(64%, 400px); height: auto; margin-inline: auto; }
.held-d .held-regel { margin-inline: auto; font-size: 1.25rem; }
.held-d .prijzen-kort, .held-d .blok-knoppen { justify-content: center; }
.held-d .held-prijsnaam { margin-bottom: .1rem; }
.held-d .held-status { margin: 1.2rem auto 0; }
@media (min-width: 900px) { .held-d { padding-block: 36px 80px; } }

/* ---------- pagina's: kop van een pagina ---------- */
.pagina-kop { padding-block: clamp(36px, 6vw, 72px) clamp(28px, 4vw, 48px); }
.pagina-kop h1 { font-size: clamp(2.4rem, 1.7rem + 3vw, 4.4rem); line-height: 1.04; margin-bottom: .4em; }
.pagina-kop .blok-intro { font-size: 1.25rem; color: var(--tekst); max-width: 34em; }
.pagina-kop-raster { display: grid; gap: 24px; align-items: center; }
.pagina-kop .soldaten { width: min(100%, 460px); height: auto; }
@media (min-width: 900px) { .pagina-kop-raster { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 56px; } }

/* ---------- blokken ---------- */
.soldaten { display: block; height: auto; }

/* Officierenmenu in het kort */
.officier-raster { display: grid; gap: 28px; align-items: center; }
.officier-gravure .soldaten { width: min(100%, 440px); margin-inline: auto; }
.officier-noot { font-size: 1.05rem; color: var(--zacht); max-width: 34em; }
.prijzen-groot { grid-template-columns: 1fr 1fr; max-width: 30rem; margin-top: 1.4rem; }
.prijzen li { padding: 1rem 1.1rem; }
.prijs-bedrag { font-weight: 500; font-size: 2.2rem; }
@media (min-width: 900px) { .officier-raster { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1fr); gap: 72px; } }

/* Band met gerechten (op deurgroen) */
.band-foto img { border-radius: var(--rond); }

/* Mensen */
.mensen-foto { max-width: none; }
.mensen-beeld img { aspect-ratio: 4 / 3; object-fit: cover; }
.mensen-sinds { margin-top: 1.2rem; font-weight: 700; color: var(--accent); }
.citaat { margin: 1.6rem 0 0; padding-top: 1.2rem; border-top: 1px solid var(--lijn); }
.citaat blockquote { margin: 0; }
.citaat p { font-family: var(--letter-kop); font-size: 1.45rem; line-height: 1.35; font-weight: 500; }
.citaat p::before { content: "\201C"; }
.citaat p::after { content: "\201D"; }
.citaat figcaption { margin-top: .5rem; font-size: 1rem; color: var(--zacht); }
@media (min-width: 900px) { .mensen-raster { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); align-items: center; } }

/* Reviews */
.rv-kaart { border-radius: var(--rond); }
.rv-kaart .rv-logo { position: static; width: 28px; height: 28px; }
.rv-tekst p { font-size: 1.3rem; line-height: 1.4; font-weight: 500; }
.rv-tekst strong { font-weight: 700; }
.rv-wie { padding-top: .7rem; }
.rv-score-getal { font-weight: 500; }

/* Seizoenen op de homepage */
.seizoenen { display: grid; gap: 28px; }
.seizoen-kaart h3 { font-size: clamp(1.6rem, 1.3rem + 1vw, 2.1rem); line-height: 1.15; margin: 1rem 0 .4rem; }
.seizoen-kaart img { aspect-ratio: 4 / 3; object-fit: cover; }
.seizoen-kaart p { max-width: 32em; }
@media (min-width: 760px) { .seizoenen { grid-template-columns: 1fr 1fr; gap: 40px; } }

/* Feesten */
.feest-fotos { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.feest-fotos img { aspect-ratio: 3 / 2; object-fit: cover; }
.feest-fotos-2 img { aspect-ratio: 4 / 5; }
.feest-fotos-3 > :first-child { grid-column: 1 / -1; }
.feest-tekst p { max-width: 34em; }
.stappen { margin-top: .6rem; }
.stappen li::before { border-color: var(--accent); font-weight: 600; }
.stappen span { color: var(--zacht); }
@media (min-width: 900px) { .feest-raster { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; } }

/* Wijn */
.wijn-foto img { aspect-ratio: 1; object-fit: cover; max-width: 440px; }
@media (min-width: 900px) { .wijn-raster { grid-template-columns: minmax(0, 1fr) minmax(0, 440px); } }

/* Aldeneik en de naam */
.aldeneik-foto img { aspect-ratio: 4 / 3; object-fit: cover; }
.aldeneik-tekst p, .naam-tekst p { max-width: 34em; }
@media (min-width: 900px) { .aldeneik-raster { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); align-items: center; } }
.naam-raster { display: grid; gap: 24px; align-items: center; }
.naam-gravure .soldaten { width: min(100%, 420px); }
.naam-vraag { font-family: var(--letter-kop); font-size: 1.4rem; line-height: 1.35; margin-top: 1.2rem; }
@media (min-width: 900px) { .naam-raster { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1fr); gap: 64px; } }

/* Gerechten die genoemd werden: met foto in een raster, zonder foto als lijst eronder */
.genoemd { display: grid; grid-template-columns: 1fr; gap: 20px; margin-top: 1.6rem; }
.genoemd-item { display: flex; flex-direction: column; gap: .25rem; }
.genoemd-item img { aspect-ratio: 1; object-fit: cover; margin-bottom: .55rem; }
.genoemd-naam { margin: 0; font-family: var(--letter-kop); font-size: 1.35rem; line-height: 1.25; font-weight: 500; }
.genoemd-bron { margin: 0; font-size: 1rem; color: var(--zacht); }
.genoemd-lijst { display: grid; gap: 0; margin-top: 2rem; border-top: 1px solid var(--lijn); }
.genoemd-lijst .genoemd-item { padding: 1rem 0; border-bottom: 1px solid var(--lijn); }
@media (min-width: 420px) { .genoemd { grid-template-columns: 1fr 1fr; } }
@media (min-width: 900px) {
  .genoemd { grid-template-columns: repeat(3, 1fr); gap: 28px; }
  .genoemd-lijst { grid-template-columns: repeat(3, 1fr); column-gap: 28px; }
}

/* Menupagina: prijzen en wat erbij hoort */
.menu-detail { display: grid; gap: 28px; }
.menu-detail .klein-titel { margin-top: 0; }
.menu-detail p { max-width: 34em; }
.menu-lunch { padding: 1.2rem 1.3rem; background: var(--vlak-2); border-radius: var(--rond); }
.menu-lunch strong { font-family: var(--letter-kop); font-size: 1.8rem; font-weight: 500; }
@media (min-width: 900px) { .menu-detail { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; } }

/* Tuin en zaal */
.plek-fotos { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.plek-fotos > :first-child { grid-column: 1 / -1; }
.plek-fotos img { aspect-ratio: 3 / 2; object-fit: cover; }
.plek-fotos > :first-child img { aspect-ratio: 4 / 3; }
.plek-tekst p { max-width: 32em; }
@media (min-width: 900px) {
  .plek-raster { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); align-items: center; }
  .plek-omgekeerd .plek-tekst { order: 2; }
  .plek-omgekeerd.plek-raster, .plek-omgekeerd .plek-raster { grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr); }
}
.galerij { columns: 1; column-gap: 12px; margin-top: 1.2rem; }
.galerij li { break-inside: avoid; margin-bottom: 12px; }
@media (min-width: 600px) { .galerij { columns: 2; } }
@media (min-width: 1100px) { .galerij { columns: 3; } }

/* Bezoek */
.bel-groot { margin: 1.2rem 0 .2rem; }
.bel-groot a {
  display: inline-flex; align-items: center; gap: .6rem; min-height: 48px;
  font-family: var(--letter-kop); font-size: clamp(1.8rem, 1.4rem + 1.6vw, 2.6rem); font-weight: 500; line-height: 1;
  color: var(--tekst); text-decoration: none; font-variant-numeric: lining-nums;
}
.bel-groot a:hover { text-decoration: underline; text-decoration-thickness: 2px; }
.bel-groot .ico { width: .8em; height: .8em; stroke-width: 1.5; color: var(--accent); }
.bezoek-status.is-open { color: var(--tekst); }
.is-open .status-stip { background: var(--accent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 28%, transparent); }
.route-tekst { max-width: 30rem; }
.res-form { margin-top: 1.8rem; padding-top: 1.6rem; border-top: 1px solid var(--lijn); }
.uren-tabel tr.vandaag > :first-child { border-radius: 4px 0 0 4px; }
.uren-tabel tr.vandaag > :last-child { border-radius: 0 4px 4px 0; }
.vandaag-label { font-size: 1rem; }

/* ---------- voet ---------- */
.voet { padding-block: 64px 36px; font-weight: 500; }
.voet-raster { gap: 36px; }
.voet-merk { flex-direction: column; align-items: flex-start; gap: 16px; }
.voet-logo { width: 240px; color: #FFFFFF; }
.voet-leus { font-size: 1.3rem; max-width: 18em; }
.voet-kop { font-family: var(--letter-tekst); font-size: 1rem; font-weight: 700; margin-bottom: .5rem; color: var(--gloed); }
.voet-nav ul { display: grid; gap: 0; }
.voet-nav a { display: inline-block; padding-block: .3rem; text-decoration: none; }
.voet-nav a:hover, .voet-nav a[aria-current="page"] { text-decoration: underline; }
.voet-onder { border-top-color: rgba(255, 255, 255, .22); }
.wisselaar { margin: 0; color: #D5DFD9; }
.wisselaar a { display: inline-grid; place-items: center; min-width: 32px; min-height: 32px; padding: 0 .3rem; text-decoration: none; border-radius: 4px; }
.wisselaar a[aria-current="page"] { background: var(--gloed); color: var(--groen); font-weight: 700; }
.wisselaar a:last-child { text-decoration: underline; margin-left: .4rem; }
@media (min-width: 760px) {
  .voet-raster { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, .8fr); align-items: start; }
}

/* ---------- belbalk ---------- */
.onderbalk { grid-template-columns: 1.3fr 1fr; }

/* ---------- cijfers altijd in de tekstletter ----------
   In Bodoni Moda lijkt de 4 op een 1 en de € op een C (Raf, 8 nov 2026: "ik dacht dat het 1,7 en 1,8 was").
   Scores, prijzen, uren en het telefoonnummer staan daarom in Alegreya Sans, vet, met gewone cijfers. */
.prijs-bedrag, .prijzen-kort .prijs-bedrag, .held-scores strong, .rv-score-getal, .menu-lunch strong,
.bel-groot a, .res-samen, .wijn-prijzen, .erkenning-groot {
  font-family: var(--letter-tekst); font-weight: 700; letter-spacing: 0;
  font-variant-numeric: lining-nums tabular-nums; font-feature-settings: "lnum" 1, "tnum" 1;
}
.prijzen-kort .prijs-bedrag { font-size: 1.7rem; }
.prijs-bedrag { font-size: 2rem; }
.held-scores strong, .rv-score-getal { font-size: 1.85rem; }
.bel-groot a { font-size: clamp(1.7rem, 1.35rem + 1.4vw, 2.3rem); }
.res-samen { font-size: 1.2rem; }

/* ---------- gsm: tekst van het eerste scherm niet tegen de rand, hoofdknop binnen het eerste scherm ---------- */
@media (max-width: 899px) {
  .held-a-tekst, .held-c-tekst { padding-inline: var(--rand); }
  .held-a-beeld img, .held-c-beeld .foto-groot img { height: clamp(160px, 25vh, 300px); }
  .held h1 { font-size: clamp(2.05rem, 1.5rem + 2.6vw, 2.8rem); }
  .held-a-tekst { padding-top: 16px; }
  .held-status { margin-bottom: .8rem; }
}

/* ---------- gsm, na de test van 8 nov: hoofdknop boven ca. 560 px, niets breder dan het scherm ---------- */
.officier-raster > *, .held-b-raster > * { min-width: 0; }
@media (max-width: 419px) {
  .prijzen-groot { grid-template-columns: 1fr; }
}
@media (max-width: 899px) {
  /* A: de melding "vanavond open" staat op de foto, de knopjes Winter en Zomer ook */
  .held-a .held-status { position: absolute; top: 12px; left: var(--rand); z-index: 2; margin: 0; box-shadow: 0 6px 18px -8px rgba(31, 58, 46, .6); }
  .held-a .held-status:not(.is-open) { background: rgba(255, 255, 255, .95); }
  .held-a-beeld img { height: clamp(150px, 23vh, 280px); }
  /* B: eerst de zin van de gast, wie ze zijn, de prijs en de knop; de scores net daaronder */
  .held-b-tekst { display: flex; flex-direction: column; }
  .held-b-tekst .held-scores { order: 2; margin: 1.3rem 0 0; }
  .held-b-tekst .held-status-onder { order: 3; margin-top: 1rem; align-self: flex-start; }
  .held-b-tekst .blok-knoppen { order: 1; }
  .held-citaat { margin-bottom: 1rem; }
  .held-citaat p { font-size: clamp(1.7rem, 1.3rem + 2vw, 2.4rem); }
  .held-b h1 { font-size: 1.4rem; }
  .held-b { padding-top: 20px; }
}
@media (max-width: 899px) {
  /* C: de soorten feesten net onder de knoppen */
  .held-c-tekst { display: flex; flex-direction: column; }
  .held-c-tekst .feest-soorten { order: 2; margin-top: 1.1rem; }
  .held-c-tekst .held-c-kijk { order: 3; }
  .held-c-beeld .foto-groot img { height: clamp(150px, 23vh, 280px); }
  /* D: gravure en logo iets kleiner, zodat prijs en knop in beeld blijven */
  .held-d .soldaten { width: min(62%, 270px); }
  .held-d h1 svg { width: min(58%, 250px); }
  .held-d { padding-top: 16px; }
}
@media (max-width: 380px) {
  .held h1 { font-size: 1.95rem; }
  .held-regel { font-size: 1.125rem; margin-bottom: .8rem; }
  .held-a-beeld img, .held-c-beeld .foto-groot img { height: 140px; }
}