/*
Theme Name: Lunchee
Theme URI: https://lunchee.be
Author: Online2Business
Description: Eigen licht thema voor Lunchee: lunchmenu's van deze week per gemeente.
Version: 1.5.9
Requires PHP: 8.0
Text Domain: lunch-vlaanderen
*/

:root {
  --bg: #FBFBF8;
  --surface: #FFFFFF;
  --ink: #18211C;
  --ink-2: #2E3831;
  --muted: #4A554D;
  --line: #E3E6E1;
  --line-2: #CED4CC;
  --green: #1E5E3F;
  --green-dark: #123D29;
  --green-tint: #EAF2EC;
  --yellow: #F3C547;
  --yellow-tint: #FBF1CF;
  --font-display: 'Bricolage Grotesque', 'Figtree', system-ui, sans-serif;
  --font-body: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --radius: 14px;
  --wrap: 1240px;
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: var(--font-body); font-size: 16px; line-height: 1.5; }
:where(h1, h2, h3, p, dl, dd, ul) { margin: 0; }
a { color: var(--green); }
a:hover { color: var(--green-dark); }
img { max-width: 100%; height: auto; }
.wrap { max-width: var(--wrap); margin: 0 auto; padding-left: 24px; padding-right: 24px; }
.nowrap { white-space: nowrap; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: -9999px; }
.skip:focus { left: 16px; top: 16px; z-index: 10; background: var(--ink); color: #fff; padding: 10px 14px; border-radius: 8px; }
.display { font-family: var(--font-display); letter-spacing: -0.02em; }
.dish::first-letter { text-transform: uppercase; }
.dish, .card__dish, .zaak__row dd, .menu__dish, .buurt a { overflow-wrap: anywhere; word-break: normal; hyphens: auto; }
button { font: inherit; }
:focus-visible { outline: 3px solid var(--yellow); outline-offset: 2px; }

/* Header */
.site-header { background: var(--green); color: #fff; }
.site-header .wrap { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 16px; padding-top: 14px; padding-bottom: 14px; }
.logo { display: flex; align-items: center; gap: 10px; text-decoration: none; color: #fff; }
.logo:hover { color: #fff; }
.logo span { font-family: var(--font-display); font-weight: 800; font-size: 22px; letter-spacing: -0.02em; }
.logo b { color: var(--yellow); font-weight: 800; }
.hdr-right { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px 24px; }
.hdr-badge { display: inline-flex; align-items: center; gap: 8px; padding: 7px 14px; border-radius: 999px; background: rgba(255, 255, 255, 0.12); border: 1px solid rgba(255, 255, 255, 0.22); color: #E4EFE7; font-size: 14px; white-space: nowrap; }
.hdr-badge strong { color: var(--yellow); font-weight: 700; }
.hdr-badge__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--yellow); box-shadow: 0 0 0 3px rgba(243, 197, 71, 0.25); }
.nav { display: flex; flex-wrap: wrap; gap: 4px 20px; font-weight: 600; font-size: 15px; }
.nav a { color: #fff; text-decoration: none; padding: 10px 0; }
.nav a:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.nav a.accent { color: var(--yellow); }
.nav a.accent:hover { color: var(--yellow); }

/* Hero */
.hero { background: var(--green); color: #fff; }
.hero .wrap { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 32px; padding-top: 32px; padding-bottom: 48px; }
.hero__text { flex: 1 1 520px; min-width: 0; }
.eyebrow { margin-bottom: 12px; font-weight: 600; font-size: 15px; letter-spacing: 0.04em; text-transform: uppercase; color: var(--yellow); }
.hero h1 { font-family: var(--font-display); font-weight: 800; font-size: clamp(1.875rem, 3.4vw, 2.75rem); line-height: 1.02; letter-spacing: -0.03em; }
.hero__lead { margin-top: 18px; font-size: 19px; line-height: 1.5; max-width: 560px; color: #E4EFE7; }
.where { flex: 0 1 360px; background: var(--surface); color: var(--ink); border-radius: 16px; padding: 20px; display: flex; flex-direction: column; gap: 10px; }
.where__title { font-weight: 700; font-size: 16px; }
.btn-loc { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 16px; border-radius: 10px; border: 0; background: var(--yellow); color: var(--ink); font-weight: 800; font-size: 16px; cursor: pointer; }
.where label { font-size: 14px; color: var(--muted); }
.where select { font: inherit; font-size: 17px; padding: 12px 14px; border: 1.5px solid var(--line-2); border-radius: 10px; background: var(--surface); color: var(--ink); min-height: 48px; width: 100%; }
.where__note { font-size: 13px; color: #8A3B12; min-height: 0; }

/* Filters */
.filters { background: var(--surface); border-bottom: 1px solid var(--line); }
.filters .wrap { display: flex; flex-direction: column; gap: 16px; padding-top: 20px; padding-bottom: 20px; }
.days { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.day { width: 100%; text-align: center; padding: 10px 6px; min-height: 64px; border-radius: 12px; border: 1.5px solid var(--line-2); background: var(--surface); color: var(--ink); cursor: pointer; }
.day[aria-pressed="true"] { border-color: var(--ink); background: var(--ink); color: #fff; }
.day__long { display: block; font-weight: 700; font-size: 17px; }
.day__short { display: none; font-weight: 700; font-size: 16px; }
.day__sub { display: block; font-size: 13px; opacity: 0.8; }
.chips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.chip { padding: 10px 16px; min-height: 44px; border-radius: 999px; border: 1.5px solid var(--line-2); background: var(--surface); color: var(--ink); font-weight: 600; font-size: 15px; cursor: pointer; }
.chip[aria-pressed="true"] { border-color: var(--ink); background: var(--ink); color: #fff; font-weight: 700; }
.chip .n { opacity: 0.65; font-weight: 500; }
.filters__more { display: flex; flex-direction: column; gap: 16px; }
.btn-filter { display: none; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 48px; padding: 0 16px; border-radius: 12px; border: 1.5px solid var(--ink); background: var(--surface); color: var(--ink); font-weight: 700; font-size: 16px; cursor: pointer; }
.btn-filter.is-active { background: var(--ink); color: #fff; }
.btn-filter[aria-expanded="true"] .btn-filter__chev { transform: rotate(180deg); }
.origin { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; font-size: 15px; }

/* Results */
.results { padding-top: 32px; padding-bottom: 64px; }
.results__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 20px; }
.h2 { font-family: var(--font-display); font-weight: 700; font-size: 30px; letter-spacing: -0.02em; line-height: 1.15; }
.count { font-size: 15px; color: var(--muted); }
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }
.card { display: flex; flex-direction: column; gap: 14px; background: var(--surface); border: 1.5px solid var(--line); border-radius: var(--radius); padding: 20px; text-decoration: none; color: var(--ink); transition: border-color .15s, box-shadow .15s; }
.card:hover { border-color: var(--green); box-shadow: 0 6px 20px rgba(24, 33, 28, .08); color: var(--ink); }
.tags { display: flex; flex-wrap: wrap; gap: 6px; }
.tag { font-size: 12px; font-weight: 700; letter-spacing: 0.03em; text-transform: uppercase; padding: 4px 8px; border-radius: 6px; background: var(--green-tint); color: var(--green); }
.tag--week { background: var(--yellow-tint); color: #6B5310; }
.card__dish { font-family: var(--font-display); font-weight: 700; font-size: 20px; line-height: 1.25; letter-spacing: -0.01em; flex-grow: 1; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; line-clamp: 4; overflow: hidden; }
.card__dish--m { font-size: 17px; line-height: 1.3; }
.card__dish--l { font-size: 15px; line-height: 1.35; font-family: var(--font-body); font-weight: 700; letter-spacing: 0; -webkit-line-clamp: 5; line-clamp: 5; }
.mc { display: flex; flex-direction: column; gap: 12px; flex-grow: 1; }
.mc__label { font-size: 12px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--muted); margin-bottom: 4px; }
.mc__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.mc__item { font-size: 15px; line-height: 1.35; color: var(--ink-2); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden; }
.mc__grp--main .mc__item { font-family: var(--font-display); font-weight: 700; font-size: 17px; line-height: 1.3; color: var(--ink); letter-spacing: -0.01em; }
.mc__of { font-family: var(--font-body); font-weight: 500; font-size: 13px; color: var(--muted); letter-spacing: 0; }
.mc__item.is-match { color: var(--green); }
.mc__extras { font-size: 13px; font-weight: 700; letter-spacing: 0.03em; color: var(--muted); white-space: pre-wrap; }
.mc__more { margin-top: 4px; font-size: 13px; font-weight: 600; color: var(--green); }
.mc__big { font-family: var(--font-display); font-weight: 700; font-size: 18px; line-height: 1.3; }
.mc__sub { font-size: 14px; color: var(--muted); margin-top: -8px; }
.mc__cta { font-weight: 700; font-size: 15px; color: var(--green); text-decoration: underline; text-underline-offset: 3px; }
.tag--on { background: var(--green); color: #fff; }
.card__foot { border-top: 1px dashed var(--line-2); padding-top: 14px; display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; }
.card__resto { font-weight: 700; font-size: 15px; }
.card__meta { margin-top: 2px; font-size: 14px; color: var(--muted); }
.card__formule { margin-top: 6px; font-size: 13px; color: var(--muted); }
.card__km { font-family: var(--font-display); font-weight: 800; font-size: 18px; white-space: nowrap; color: var(--green); }
.more { display: flex; justify-content: center; margin-top: 28px; }
.btn-outline { padding: 14px 28px; min-height: 52px; border-radius: 999px; border: 1.5px solid var(--green); background: var(--surface); color: var(--green); font-weight: 700; font-size: 16px; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; }
.btn-primary { display: inline-flex; justify-content: center; align-items: center; min-height: 48px; padding: 0 22px; border-radius: 999px; background: var(--green); color: #fff; font-weight: 700; text-decoration: none; }
.btn-primary:hover { color: #fff; background: var(--green-dark); }
.empty { background: var(--surface); border: 1.5px dashed var(--line-2); border-radius: var(--radius); padding: 40px; text-align: center; }

/* Sections */
.section { margin-top: 64px; }
.lead { font-size: 18px; line-height: 1.6; color: var(--ink-2); max-width: 720px; }
.pill-list { display: flex; flex-wrap: wrap; gap: 8px; }
.pill { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; min-height: 44px; border-radius: 999px; background: var(--surface); border: 1.5px solid var(--line-2); color: var(--ink); text-decoration: none; font-weight: 600; }
.pill .n { color: var(--muted); font-weight: 500; }
.cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 24px; }
.cols h3, .faq h3 { font-family: var(--font-display); font-size: 20px; margin-bottom: 8px; }
.cols p, .faq p { line-height: 1.6; color: var(--ink-2); }
.faq { display: flex; flex-direction: column; gap: 22px; max-width: 860px; }
.faq h3 { font-family: var(--font-body); font-size: 18px; margin-bottom: 6px; }
.crumbs { font-size: 14px; color: var(--muted); display: flex; flex-wrap: wrap; gap: 6px; padding-top: 24px; }
.crumbs a { color: var(--muted); }
.crumbs span[aria-current] { color: var(--ink); font-weight: 600; }

/* Gemeentepagina */
.page-head { margin-top: 24px; display: flex; flex-wrap: wrap; gap: 32px; align-items: flex-end; justify-content: space-between; }
.page-head__text { flex: 1 1 560px; min-width: 0; }
.page-head h1 { font-family: var(--font-display); font-weight: 800; font-size: clamp(1.75rem, 3vw, 2.5rem); line-height: 1.04; letter-spacing: -0.03em; }
.page-head .lead { margin-top: 16px; }
.page-head__side { flex: 0 1 320px; display: flex; flex-direction: column; gap: 10px; }
.updated { font-size: 14px; color: var(--muted); }
.zaken { margin-top: 32px; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 520px), 1fr)); gap: 20px; }
.zaak { background: var(--surface); border: 1.5px solid var(--line); border-radius: 16px; overflow: hidden; display: flex; flex-direction: column; }
.zaak__head { padding: 20px 22px 16px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; align-items: flex-start; }
.zaak__head h2 { font-family: var(--font-display); font-weight: 700; font-size: 22px; letter-spacing: -0.01em; }
.zaak__head h2 a { color: var(--ink); text-decoration: none; }
.zaak__meta { margin-top: 4px; font-size: 14px; color: var(--muted); }
.zaak__badge { padding: 6px 10px; border-radius: 8px; background: var(--yellow-tint); color: #4D3B08; font-size: 14px; font-weight: 700; }
.zaak__days { border-top: 1px solid var(--line); }
.zaak__row { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 12px; padding: 10px 22px; border-bottom: 1px solid #F0F2EE; align-items: baseline; }
.zaak__row dt { font-weight: 700; font-size: 14px; color: var(--green); }
.zaak__row dd { font-size: 15px; line-height: 1.45; }
.zaak__row dd.closed { font-size: 14px; color: #6B746D; font-style: italic; }
.zaak__row dd p + p { margin-top: 4px; }
.zaak__row .g-item { font-size: 15px; line-height: 1.45; }
.zaak__row .g-label { font-size: 12px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--muted); }
.zaak__row .g-label:not(:first-child) { margin-top: 10px; }
.zaak__row .g-of, .menu__dish .g-of { font-size: 13px; color: var(--muted); }
.zaak__foot { padding: 12px 22px 16px; display: flex; flex-wrap: wrap; gap: 8px 16px; font-size: 14px; margin-top: auto; }
.zaak__foot span { color: var(--muted); }
.zaak__nomenu { padding: 16px 22px; border-top: 1px solid var(--line); font-size: 15px; color: var(--muted); }
.buurt { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 12px; }
.buurt a { display: flex; flex-direction: column; gap: 8px; background: var(--surface); border: 1.5px solid var(--line); border-radius: var(--radius); padding: 16px 18px; text-decoration: none; color: var(--ink); }
.buurt a:hover { border-color: var(--green); color: var(--ink); }
.buurt__top { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; font-weight: 700; }
.buurt__km { color: var(--green); font-weight: 800; white-space: nowrap; }
.buurt__g { font-size: 14px; color: var(--muted); }

/* Restaurantpagina */
.resto { margin-top: 24px; display: flex; flex-wrap: wrap; gap: 40px; align-items: flex-start; }
.resto__main { flex: 999 1 600px; min-width: 0; display: flex; flex-direction: column; gap: 28px; }
.resto__aside { flex: 1 1 320px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.resto h1 { font-family: var(--font-display); font-weight: 800; font-size: clamp(1.75rem, 3.1vw, 2.5rem); line-height: 1.02; letter-spacing: -0.03em; }
.kicker { margin-bottom: 10px; font-size: 14px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--green); }
.tiles { display: flex; flex-wrap: wrap; gap: 12px; }
.tile { background: var(--surface); border: 1.5px solid var(--line); border-radius: var(--radius); padding: 16px 20px; min-width: 180px; }
.tile--green { background: var(--green); border-color: var(--green); color: #fff; }
.tile__k { font-size: 13px; font-weight: 600; color: var(--muted); }
.tile--green .tile__k { color: #CFE3D5; }
.tile__v { margin-top: 4px; font-weight: 700; font-size: 18px; }
.tile--green .tile__v { font-family: var(--font-display); font-weight: 800; font-size: 22px; }
.menu { background: var(--surface); border: 1.5px solid var(--line); border-radius: 16px; overflow: hidden; }
.menu__head { padding: 18px 22px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; align-items: baseline; border-bottom: 1px solid var(--line); }
.menu__head h2 { font-family: var(--font-display); font-weight: 700; font-size: 24px; }
.menu__head p { font-size: 14px; color: var(--muted); }
.menu__row { padding: 14px 22px; border-bottom: 1px solid #F0F2EE; }
.menu__row--closed { background: #FAFAF7; }
.menu__day { font-weight: 700; font-size: 14px; color: var(--green); }
.menu__dish { margin-top: 4px; font-size: 17px; line-height: 1.4; }
.menu__dish small { display: inline-block; margin-right: 6px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em; color: var(--muted); }
.menu__groups .g-label { margin-top: 12px; font-size: 12px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--muted); }
.menu__groups .g-item { margin-top: 4px; font-size: 17px; line-height: 1.4; overflow-wrap: anywhere; }
.menu__groups .g-of { font-size: 14px; color: var(--muted); }
.menu__closed { margin-top: 4px; font-size: 15px; color: #6B746D; font-style: italic; }
.menu__src { padding: 14px 22px; font-size: 14px; color: var(--muted); background: #F3F5F1; }
.info { background: var(--surface); border: 1.5px solid var(--line); border-radius: 16px; padding: 22px; display: flex; flex-direction: column; gap: 16px; }
.call__label { font-weight: 700; font-size: 15px; margin-bottom: 8px; }
.btn-call { display: flex; justify-content: center; align-items: center; gap: 10px; min-height: 52px; border-radius: 999px; background: var(--yellow); color: var(--ink); font-weight: 800; font-size: 19px; letter-spacing: 0.01em; text-decoration: none; font-variant-numeric: tabular-nums; }
.btn-call:hover { color: var(--ink); filter: brightness(0.97); }
.info dl { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 12px; font-size: 15px; }
.info dt { font-weight: 700; }
.info dd { overflow-wrap: anywhere; }
.map { border: 0; width: 100%; height: 240px; border-radius: 16px; background: #E6ECE5; }
.owner { background: var(--green-tint); border-radius: 16px; padding: 20px; font-size: 14px; line-height: 1.55; color: var(--ink-2); }
.owner strong { display: block; margin-bottom: 6px; font-size: 16px; color: var(--ink); }

/* Zoekpagina restaurants */
.search { margin-top: 24px; display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px 16px; background: var(--surface); border: 1.5px solid var(--line); border-radius: 16px; padding: 18px; }
.search__field { display: flex; flex-direction: column; gap: 6px; flex: 1 1 260px; min-width: 0; }
.search__field:first-child { flex: 2 1 340px; }
.search label { font-size: 14px; font-weight: 700; }
.search__input { display: flex; align-items: center; gap: 8px; border: 1.5px solid var(--line-2); border-radius: 10px; padding: 0 12px; background: var(--surface); min-height: 48px; }
.search__input:focus-within { border-color: var(--green); }
.search input[type=search] { flex: 1; min-width: 0; border: 0; outline: 0; font: inherit; font-size: 17px; background: transparent; color: var(--ink); min-height: 44px; }
.search select { font: inherit; font-size: 16px; padding: 12px 14px; border: 1.5px solid var(--line-2); border-radius: 10px; background: var(--surface); color: var(--ink); min-height: 48px; }
.search__check { display: inline-flex; align-items: center; gap: 8px; min-height: 48px; font-weight: 600 !important; cursor: pointer; }
.search__check input { width: 20px; height: 20px; accent-color: var(--green); }
#rs-count { margin: 18px 0 12px; }
.rs-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 12px; }
.rs-item { display: flex; flex-direction: column; gap: 6px; height: 100%; background: var(--surface); border: 1.5px solid var(--line); border-radius: var(--radius); padding: 16px 18px; text-decoration: none; color: var(--ink); }
.rs-item:hover { border-color: var(--green); color: var(--ink); }
.rs-item__top { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.rs-item__name { font-family: var(--font-display); font-weight: 700; font-size: 19px; line-height: 1.25; }
.rs-pill { flex: none; font-size: 12px; font-weight: 700; padding: 4px 8px; border-radius: 6px; background: #F0F2EE; color: var(--muted); white-space: nowrap; }
.rs-pill--on { background: var(--green-tint); color: var(--green); }
.rs-item__addr { font-size: 14px; color: var(--muted); }
.rs-item__dish { font-size: 15px; line-height: 1.4; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; }
.rs-item__meta { font-size: 13px; color: var(--muted); margin-top: auto; }

/* Footer */
.site-footer { background: var(--ink); color: #C9D2CB; margin-top: 64px; }
.site-footer .wrap { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; padding-top: 32px; padding-bottom: 32px; font-size: 14px; }
.site-footer b { font-family: var(--font-display); font-weight: 800; color: #fff; }
.site-footer a { color: var(--yellow); }

@media (max-width: 640px) {
  .wrap { padding-left: 16px; padding-right: 16px; }
  .day__long { display: none; }
  .day__short { display: block; }
  .day__sub { font-size: 12px; }
  .day__today { display: none; }
  .hdr-right { justify-content: flex-start; width: 100%; }
  .hdr-badge { font-size: 13px; padding: 6px 12px; }
  .nav { gap: 2px 14px; font-size: 14px; }
  .nav a { padding: 8px 0; }
  .filters .wrap { gap: 12px; padding-top: 14px; padding-bottom: 14px; }
  .btn-filter { display: flex; }
  .filters__more { display: none; }
  .filters__more.is-open { display: flex; }
  .hero .wrap { padding-top: 36px; padding-bottom: 32px; }
  .zaak__row { grid-template-columns: 48px minmax(0, 1fr); padding: 10px 16px; }
  .zaak__head, .zaak__foot { padding-left: 16px; padding-right: 16px; }
}
@media (prefers-reduced-motion: reduce) { .card { transition: none; } }

/* Beta-banner */
.beta-bar { background: var(--yellow); color: var(--ink); font-size: 14px; line-height: 1.4; }
.beta-bar .wrap { padding-top: 8px; padding-bottom: 8px; }
.beta-bar p { margin: 0; text-align: center; }
.beta-bar__tag { display: inline-block; background: var(--ink); color: #fff; font-weight: 700; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; padding: 2px 8px; border-radius: 999px; margin-right: 8px; vertical-align: 1px; }
@media (max-width: 640px) { .beta-bar { font-size: 13px; } .beta-bar p { text-align: left; } }

/* Gemeente-info naast "Afstand vanaf" (home, v1.2.12) */
.origin { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 22px; }
.origin__item { display: inline-flex; align-items: center; gap: 8px; color: var(--ink); white-space: nowrap; }
.origin__item svg { flex: none; }
.origin__gem { flex: 1 1 auto; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 22px; }
.origin__link { margin-left: auto; color: var(--green); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.origin__link:hover { text-decoration-thickness: 2px; }
@media (max-width: 640px) {
  .origin, .origin__gem { gap: 6px 18px; }
  .origin__gem { flex-basis: 100%; }
}

/* Soortfilters: volle rij rekt uit tot de volle breedte (class gezet door app.js) */
.chip.grow { flex: 1 1 auto; }

/* Weeklabel onder de intro (home) */
.eyebrow--below { margin: 18px 0 0; }

/* Zoekveld (deel)gemeente met suggesties (home + /gemeenten/) */
.ac { position: relative; width: 100%; }
.ac__icon { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); pointer-events: none; }
.ac__input { width: 100%; font: inherit; font-size: 17px; padding: 12px 14px 12px 42px; min-height: 48px; border: 1.5px solid var(--line-2); border-radius: 10px; background: var(--surface); color: var(--ink); }
.ac__input:focus { outline: none; border-color: var(--green); box-shadow: 0 0 0 3px rgba(30, 94, 63, .15); }
.ac__input::placeholder { color: #8A948E; }
.ac__list { position: absolute; z-index: 30; left: 0; right: 0; top: calc(100% + 6px); margin: 0; padding: 6px; list-style: none; background: var(--surface); border: 1.5px solid var(--line); border-radius: 12px; box-shadow: 0 12px 32px rgba(24, 33, 28, .16); max-height: 340px; overflow-y: auto; }
.ac__opt { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 10px; border-radius: 8px; cursor: pointer; color: var(--ink); }
.ac__opt:hover, .ac__opt[aria-selected="true"] { background: var(--green-tint); }
.ac__txt { display: flex; flex-direction: column; min-width: 0; }
.ac__name { font-weight: 700; font-size: 16px; }
.ac__name mark { background: var(--yellow-tint); color: inherit; border-radius: 3px; padding: 0 1px; }
.ac__sub { font-size: 13px; color: var(--muted); }
.ac__badge { flex: none; font-size: 12px; font-weight: 600; padding: 3px 9px; border-radius: 999px; background: #F1F3F1; color: var(--muted); white-space: nowrap; }
.ac__badge--on { background: var(--green-tint); color: var(--green); }
.ac__badge--off { background: #FBEEE6; color: #8A3B12; }
.ac__empty { padding: 10px; font-size: 14px; color: var(--muted); }
.where__note a { color: var(--green); font-weight: 600; }

/* Gemeentepagina: datum onder de knop, rechts uitgelijnd */
.page-head__side .updated { text-align: right; }

/* Gemeentepagina: groene hero zoals de homepage (v1.3.3) */
.page-hero { background: var(--green); color: #fff; }
.page-hero .wrap { padding-bottom: 44px; }
.page-hero .crumbs, .page-hero .crumbs a { color: #CFE1D5; }
.page-hero .crumbs span[aria-current] { color: #fff; }
.page-hero .crumbs a:hover { color: #fff; }
.page-hero h1 { color: #fff; }
.page-hero .lead { color: #E4EFE7; }
.page-hero .btn-primary { background: var(--yellow); color: var(--ink); }
.page-hero .btn-primary:hover { background: #E8B832; color: var(--ink); }
.page-hero + .wrap > :first-child { margin-top: 32px; }
@media (max-width: 640px) { .page-hero .wrap { padding-bottom: 32px; } .page-hero + .wrap > :first-child { margin-top: 24px; } }

/* Zoekbalk half op groen, half op grijs (zoals booking.com) — /restaurants/ en /gemeenten/ (v1.3.4) */
.page-hero--search .wrap { padding-bottom: 28px; }
.search-band { background: linear-gradient(to bottom, var(--green) 50%, var(--bg) 50%); }
.search-band .search { margin-top: 0; border-color: var(--line); box-shadow: 0 10px 30px rgba(24, 33, 28, .14); }
.search-band + .wrap > :first-child { margin-top: 24px; }
@media (max-width: 640px) { .page-hero--search .wrap { padding-bottom: 20px; } }

/* Uitbater-blok restaurantpagina: mailto-link */
.owner a { color: var(--green); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }

/* Voorbije dagen op de homepage (v1.3.13) */
.day.day--past { background: #F3F4F1; border-color: #E3E6E1; color: #9AA19C; }
.day.day--past[aria-pressed="true"] { background: #9AA19C; border-color: #9AA19C; color: #fff; }
.grid.is-past .card { opacity: .55; filter: grayscale(1); }
.grid.is-past .card:hover { opacity: .8; }
.past-note { margin: 0 0 14px; font-size: 14px; color: #6B746E; background: #F3F4F1; border-radius: 10px; padding: 10px 14px; }

/* Restaurantpagina: voorbije dagen in het weekmenu (v1.3.15) */
.menu__row--past, .menu__row--past * { color: #9AA19C !important; font-style: italic; }
.menu__row--past .menu__day::after { content: " · voorbij"; font-weight: 400; }

/* Gemeentepagina: voorbije dagen (v1.3.16) */
.zaak__row--past, .zaak__row--past * { color: #9AA19C !important; font-style: italic; }

/* Footer in blokken (v1.3.23) */
.site-footer { margin-top: 4rem; }
.site-footer .wrap.ftr { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.4fr); gap: 2.5rem 2rem; padding-top: 4rem; padding-bottom: 3.5rem; font-size: 0.9375rem; }
.site-footer .logo b { color: var(--yellow); }
.ftr__tagline { margin-top: 1rem; max-width: 20rem; line-height: 1.6; color: #C9D2CB; }
.ftr__count { margin-top: 1.25rem; display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.375rem 0.875rem; border: 1px solid rgba(255,255,255,.18); border-radius: 999px; font-size: 0.875rem; color: #E4EFE7; }
.ftr__title { font-family: var(--font-display); font-weight: 800; font-size: 1rem; color: #fff; margin: 0 0 1rem; letter-spacing: -0.01em; }
.ftr__col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0.625rem; }
.site-footer .ftr__col ul a { color: #C9D2CB; text-decoration: none; }
.site-footer .ftr__col ul a:hover { color: var(--yellow); }
.ftr__note { margin-top: 1.25rem; padding: 1rem; border-radius: 0.875rem; background: rgba(255,255,255,.06); line-height: 1.55; font-size: 0.875rem; }
.ftr__bottom { border-top: 1px solid rgba(255,255,255,.1); }
.ftr__bottom .wrap { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.5rem 1.5rem; padding-top: 1.25rem; padding-bottom: 1.5rem; font-size: 0.8125rem; color: #8E9A91; }
@media (max-width: 960px) {
  .site-footer .wrap.ftr { grid-template-columns: repeat(2, minmax(0, 1fr)); padding-top: 3rem; padding-bottom: 2.5rem; }
  .ftr__brand, .ftr__col--owner { grid-column: 1 / -1; }
}
.site-footer .logo, .site-footer .logo:hover { color: #fff; text-decoration: none; }

/* Soortfilters met iconen */
.chip { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; }
.chip__ic { flex: none; width: 1.25rem; height: 1.25rem; color: var(--green); }
.chip[aria-pressed="true"] .chip__ic { color: var(--yellow); }

/* Homepage: meer verticale ruimte */
.home .hero .wrap { padding-top: 3rem; padding-bottom: 4rem; }
.home .filters .wrap { gap: 1.5rem; padding-top: 1.75rem; padding-bottom: 1.75rem; }
.home .filters__more { gap: 1.25rem; }
.home .chips { gap: 0.625rem; }
.home .results { padding-top: 3.5rem; padding-bottom: 5rem; }
.home .results__head { margin-bottom: 1.75rem; }
.home .grid { gap: 1.5rem; }
.home .more { margin-top: 2.5rem; }
.home .section { margin-top: 5rem; }
.home .section .lead { margin-bottom: 1.75rem; }
@media (max-width: 640px) {
  .home .hero .wrap { padding-top: 2.5rem; padding-bottom: 2.5rem; }
  .home .filters .wrap { gap: 1rem; padding-top: 1.25rem; padding-bottom: 1.25rem; }
  .home .results { padding-top: 2.5rem; }
  .home .results__head { margin-bottom: 1.5rem; }
  .home .grid { gap: 1.25rem; }
  .home .section { margin-top: 4rem; }
}

/* Feestdagen */
.day.day--feest { border-color: var(--yellow); box-shadow: inset 0 0 0 1px var(--yellow); }
.day__fd { font-weight: 700; color: #6B5310; }
.day[aria-pressed="true"] .day__fd { color: var(--yellow); }
.feest-note { margin: 0 0 1.5rem; font-size: 0.9375rem; line-height: 1.45; color: var(--ink); background: var(--yellow-tint); border: 1px solid var(--yellow); border-radius: 0.75rem; padding: 0.875rem 1rem; }
.card__feest { margin-top: 0.375rem; font-size: 0.8125rem; font-weight: 700; color: #6B5310; }
@media (max-width: 640px) { .day__fd { display: none; } }
.feest-note--top { margin-top: 1.5rem; }
.zaak__feest { margin-top: 0.25rem; font-size: 0.875rem; font-weight: 700; color: #6B5310; }
.grid.is-loading { min-height: 20rem; opacity: .4; transition: opacity .2s; }

/* Provinciekaart (v1.3.38) */
.kaart { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.25rem; }
.kaart__tabs { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 0.75rem; }
.kaart__tab { display: inline-flex; align-items: center; gap: 0.5rem; min-height: 44px; padding: 0.625rem 1rem; border-radius: 999px; border: 1.5px solid var(--line-2); background: var(--surface); color: var(--ink); font: 600 15px/1.2 var(--font-body); cursor: pointer; }
.kaart__tab:hover { border-color: var(--green); }
.kaart__tab[aria-selected="true"] { background: var(--green); border-color: var(--green); color: #fff; }
.kaart__tabn { font-weight: 500; opacity: .8; }
.kaart__tab:focus-visible, .kaart__g:focus-visible { outline: 3px solid var(--yellow); outline-offset: 2px; }
.kaart__sum { margin: 0 0 0.5rem; color: var(--muted); font-size: 15px; }
.kaart__map { position: relative; max-width: 760px; margin: 0 auto; }
.kaart__map svg { display: block; width: 100%; height: auto; }
.kaart__rand { fill: none; stroke: var(--ink-2); stroke-width: 3; stroke-linejoin: round; }
.kaart__g path, path.kaart__g { stroke: #fff; stroke-width: 1.6; stroke-linejoin: round; transition: fill .15s; }
a.kaart__g { cursor: pointer; outline: none; }
a.kaart__g:hover path, a.kaart__g:focus-visible path { fill: var(--yellow); }
.kaart__g--0, path.kaart__g--0 { fill: #EEF0EC; }
.kaart__g--1 path, .kaart__sw.kaart__g--1 { fill: #CFE3D5; background: #CFE3D5; }
.kaart__g--2 path, .kaart__sw.kaart__g--2 { fill: #A3CBAF; background: #A3CBAF; }
.kaart__g--3 path, .kaart__sw.kaart__g--3 { fill: #6FA884; background: #6FA884; }
.kaart__g--4 path, .kaart__sw.kaart__g--4 { fill: #3D8159; background: #3D8159; }
.kaart__g--5 path, .kaart__sw.kaart__g--5 { fill: #1E5E3F; background: #1E5E3F; }
.kaart__sw.kaart__g--0 { background: #EEF0EC; border: 1px solid var(--line-2); }
.kaart__lbl { pointer-events: none; }
.kaart__lbl circle { fill: #fff; stroke: var(--ink-2); stroke-width: 1.5; }
.kaart__lbl text { font: 700 18px var(--font-body); fill: var(--ink); text-anchor: middle; }
.kaart__tip { position: absolute; z-index: 5; pointer-events: none; background: var(--ink); color: #fff; border-radius: 10px; padding: 0.5rem 0.75rem; font-size: 14px; line-height: 1.35; white-space: nowrap; box-shadow: 0 6px 18px rgba(0,0,0,.18); }
.kaart__tip strong, .kaart__tip span { display: block; }
.kaart__tip strong { font-size: 15px; }
.kaart__legend { list-style: none; margin: 0.875rem 0 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 0.375rem 1rem; font-size: 13px; color: var(--muted); }
.kaart__legend li { display: inline-flex; align-items: center; gap: 0.375rem; }
.kaart__sw { display: inline-block; width: 14px; height: 14px; border-radius: 4px; }
.kaart-lijst { margin-top: 1rem; }
.kaart-lijst summary { cursor: pointer; font-weight: 600; color: var(--green); min-height: 44px; display: flex; align-items: center; }
.kaart-lijst .pill-list { margin-top: 0.5rem; }
@media (max-width: 600px) {
  .kaart { padding: 0.875rem 0.625rem; }
  .kaart__lbl { transform: scale(1.35); }
}

/* /restaurants/: dichtst bij (v1.3.43) */
.search__loc { flex: 0 1 15rem; }
.rs-item__km { font-size: 13px; font-weight: 700; color: var(--green); }

/* 1.3.56: Lunchee-logo (gele pil) in de header */
.site-header .logo__pil { display: block; height: 2.25rem; width: auto; }
/* 1.3.57: Lunchee-logo in trattoria-script (vervangt de gele pil) */
.site-header .logo__script { display: block; height: 4.5rem; width: auto; } /* 1.3.58: 1,5x groter, scherpere vector */

/* 1.3.61 – restaurants zonder menu online tussen de menukaartjes */
.card--nomenu { background: var(--bg); border-style: dashed; }
.tag--nomenu { background: #EEF0EC; color: var(--muted); }
.card--nomenu .mc { flex-grow: 1; display: flex; flex-direction: column; justify-content: space-between; gap: 0.75rem; }
.card__nomenu { margin: 0; font-family: var(--font-display); font-weight: 700; font-size: 1.0625rem; line-height: 1.35; color: var(--muted); }

/* Provinciekaart: keuzemenu op gsm (v1.3.63) */
.kaart__pick { display: none; margin-bottom: 0.75rem; }
.kaart__pickl strong { font-weight: 700; }
@media (max-width: 640px) {
  .kaart__pick { display: flex; }
  .kaart__tabs { display: none; }
  .kaart__tabs.is-open { display: flex; }
}

/* 1.3.65 – voorbije dagen in dezelfde stijl als de kaartjes 'menu niet online' */
.day.day--past { background: var(--bg); border-style: dashed; border-color: var(--line); color: var(--muted); }
.day.day--past[aria-pressed="true"] { background: var(--muted); border-style: dashed; border-color: var(--muted); color: #fff; }

/* 1.3.66 – schuifknop 'toon ook restaurants zonder menu' */
.results__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1.25rem; }
.switch { display: inline-flex; align-items: center; gap: 0.625rem; cursor: pointer; font-size: 0.9375rem; color: var(--ink); user-select: none; }
.switch input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.switch__track { position: relative; flex: none; width: 2.5rem; height: 1.5rem; border-radius: 999px; background: var(--line-2); transition: background .15s; }
.switch__track::after { content: ''; position: absolute; top: 0.1875rem; left: 0.1875rem; width: 1.125rem; height: 1.125rem; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.2); transition: transform .15s; }
.switch input:checked + .switch__track { background: var(--green); }
.switch input:checked + .switch__track::after { transform: translateX(1rem); }
.switch input:focus-visible + .switch__track { outline: 2px solid var(--green); outline-offset: 2px; }

/* 1.3.76 – teller + schuifknop altijd onder de titel */
.results__head { flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 0.5rem; }

/* 1.3.83 – badge in de plaatssuggesties: restaurants + menu's op een regel */
.ac__badge { white-space: nowrap; }

/* 1.3.84 – kader 'Waar ben je?' breder op desktop */
@media (min-width: 64rem) { .hero .where { flex: 0 1 30rem; } }
.ac__txt { flex: 1 1 auto; }

/* 1.3.86 – wissel Lijst / Kaart op de homepage (Leaflet + OpenStreetMap) */
.results__meta { width: 100%; }
.viewtoggle { margin-left: auto; display: inline-flex; gap: 0.125rem; border: 1.5px solid var(--line-2); border-radius: 999px; padding: 0.1875rem; background: var(--surface); }
.viewtoggle__btn { font: inherit; font-size: 0.875rem; font-weight: 600; border: 0; background: none; color: var(--muted); padding: 0.375rem 1rem; border-radius: 999px; cursor: pointer; }
.viewtoggle__btn[aria-pressed="true"] { background: var(--ink); color: #fff; }
.map { height: 34rem; border-radius: var(--radius); border: 1.5px solid var(--line); overflow: hidden; isolation: isolate; background: #E8ECE7; }
@media (max-width: 40rem) { .map { height: 26rem; } }
.mappop__naam { margin: 0 0 0.25rem; font-weight: 700; font-size: 0.9375rem; color: var(--ink); }
.mappop__gerecht { margin: 0 0 0.125rem; font-size: 0.875rem; color: var(--ink); }
.mappop__sub { margin: 0.25rem 0; font-size: 0.8125rem; color: var(--muted); }
.mappop__link { font-size: 0.8125rem; font-weight: 600; color: var(--green) !important; }

/* 1.3.89 – kaartondergrond rustig grijs-groen in de huisstijl (enkel de tegels, niet de markeringen) */
.map .leaflet-tile-pane { filter: grayscale(1) sepia(0.35) hue-rotate(55deg) saturate(0.55) brightness(1.06) contrast(0.9); }
.map .leaflet-control-attribution { background: rgba(251, 251, 248, 0.85); color: var(--muted); }
.map .leaflet-control-attribution a { color: var(--green); }
.map .leaflet-bar a { color: var(--ink); }

/* 1.3.90 – popup op de kaart in de stijl van de kaartjes */
.map.leaflet-container, .map .leaflet-container { font-family: inherit; }
.map .leaflet-popup-content-wrapper { border-radius: var(--radius); padding: 0; box-shadow: 0 0.75rem 2rem rgba(24, 33, 28, 0.18); border: 1.5px solid var(--line); }
.map .leaflet-popup-content { margin: 0; padding: 0.875rem 1rem 0.75rem; font-size: 0.875rem; line-height: 1.4; }
.map .leaflet-popup-tip { box-shadow: none; }
.map a.leaflet-popup-close-button { top: 0.375rem; right: 0.375rem; color: var(--muted); font-size: 1.125rem; }
.mappop__naam { margin: 0 1.25rem 0.5rem 0; font-family: var(--font-display); font-weight: 700; font-size: 1.0625rem; line-height: 1.25; color: var(--ink); }
.mappop__label { margin: 0 0 0.25rem; font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.mappop__gerecht { margin: 0 0 0.25rem; font-weight: 600; font-size: 0.9375rem; line-height: 1.35; color: var(--ink); }
.mappop__tag { display: inline-block; margin: 0 0 0.25rem; padding: 0.1875rem 0.5rem; border-radius: 0.375rem; background: #EEF0EC; color: var(--muted); font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; }
.mappop__foot { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; margin-top: 0.625rem; padding-top: 0.625rem; border-top: 1px solid var(--line); }
.mappop__km { font-weight: 700; color: var(--green); }
.mappop__link { font-weight: 600; color: var(--green) !important; text-decoration: none; }
.mappop__link:hover { text-decoration: underline; }

/* 1.3.91 – Leaflet zet 17px marge op p in popups: overschrijven */
.map .leaflet-popup-content p { margin: 0 0 0.25rem; }
.map .leaflet-popup-content p.mappop__naam { margin: 0 1.25rem 0.5rem 0; }

/* 1.3.92 – kaart altijd onder de lijst */
.map--onder { margin-top: 2.5rem; }

/* 1.3.93 – labels in de kaartpopup */
.mappop__tags { display: flex; flex-wrap: wrap; gap: 0.25rem; margin: 0 1.25rem 0.5rem 0; }

/* 1.3.94 – teller + schuifknop ook boven de kaart */
.results__meta--map { margin-top: 2.5rem; margin-bottom: 0.75rem; }
.results__meta--map + .map--onder { margin-top: 0; }

/* 1.3.99: Lunchee-logo ook in de footer */
.logo__script--ftr { display: block; height: 3.5rem; width: auto; }

/* 1.4.3: icoon in de labels (soort) op kaartjes en kaartpopup */
.tag--ic { display: inline-flex; align-items: center; gap: 0.3rem; }
.tag__ic { flex: none; width: 0.875rem; height: 0.875rem; }

/* 1.4.6: gerechten op de kaartjes in krijtletter (Kalam, SIL OFL, lokaal) */
.card .card__dish, .card .card__dish--m, .card .card__dish--l, .card .mc__grp--main .mc__item, .card .mc__big, .card .card__nomenu { font-family: 'Kalam', 'Figtree', cursive; font-weight: 700; letter-spacing: 0; line-height: 1.38; }

/* 1.4.9: titels van gerechten op de kaartjes altijd groen; bij een keuzemenu de regel eronder zwart en klein (zoals de adressen) */
.card .card__dish, .card .card__dish--m, .card .card__dish--l, .card .mc__grp--main .mc__item, .card .mc__big { color: var(--green); }
.card .mc > .mc__item, .card .mc > .mc__item.is-match { font-family: var(--font-body); font-weight: 400; font-size: 0.875rem; line-height: 1.35; letter-spacing: 0; color: var(--ink); }

/* 1.4.10: meer ruimte tussen 'Hoofdgerecht'/'Dagschotel' en de titel op de kaartjes */
.card .mc__label { margin-bottom: 0.625rem; }
.card .mc { gap: 0.625rem; } /* 1.4.11: zelfde ruimte tussen titel en '+ Voorgerecht' als tussen label en titel */

/* 1.4.13: geen verspringende lay-out bij het laden (PageSpeed CLS) */
#lv-soorten:empty { min-height: 2.75rem; }
.home #lv-count:empty { min-height: 1.3rem; }
.home #lv-grid:empty { min-height: 100vh; }
/* 1.4.13: contrast teller rechtsboven */
.hdr-badge { background: rgba(0, 0, 0, 0.22); border-color: rgba(255, 255, 255, 0.18); }
/* 1.4.14: op gsm lopen de filterknoppen over meerdere regels: daar meer plaats vrijhouden */
@media (max-width: 40rem) { #lv-soorten:empty { min-height: 7.8rem; } }
@media (min-width: 40.0625rem) and (max-width: 64rem) { #lv-soorten:empty { min-height: 5.5rem; } }

/* 1.4.16 – titel + keuze Met menu / Zonder menu online op één regel */
.viewtoggle[hidden] { display: none; }
.home .results__head { flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.75rem 1.5rem; }
.home .results__head .h2 { flex: 1 1 22rem; margin: 0; }
.home .results__head .viewtoggle { margin-left: auto; flex: none; }
.results__meta--map .viewtoggle { margin-left: auto; }
@media (max-width: 40rem) { .home .results__head .viewtoggle { margin-left: 0; } .viewtoggle__btn { padding: 0.375rem 0.875rem; } }

/* 1.4.21 – mobiele header: teller bovenaan gecentreerd, daaronder logo links en menu rechts onder elkaar */
@media (max-width: 40rem) {
  .site-header .wrap { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 0.75rem 1rem; padding-top: 0.75rem; padding-bottom: 0.875rem; }
  .site-header .hdr-right { display: contents; }
  .site-header .hdr-badge { grid-column: 1 / -1; grid-row: 1; justify-self: center; margin: 0; }
  .site-header .logo { grid-column: 1; grid-row: 2; }
  .site-header .logo__script { height: 3.75rem; }
  .site-header .nav { grid-column: 2; grid-row: 2; flex-direction: column; align-items: flex-end; gap: 0; text-align: right; }
  .site-header .nav a { padding: 0.375rem 0; }
}

/* 1.4.22 – teller + keuze onder de kaart i.p.v. erboven */
.results__meta--map + .map--onder { margin-top: 2.5rem; }
.map--onder + .results__meta--map { margin-top: 0.875rem; margin-bottom: 0; }

/* 1.4.23 – mobiel: zin + knop onder de kaart gecentreerd */
@media (max-width: 40rem) {
  .results__meta--map { flex-direction: column; align-items: center; text-align: center; gap: 0.625rem; }
  .results__meta--map .viewtoggle { margin-left: 0; margin-right: 0; }
}

/* 1.4.24 – mobiel: titel, intro en week gecentreerd */
@media (max-width: 40rem) {
  .home .hero__text { text-align: center; margin-left: auto; margin-right: auto; }
  .home .hero__text .hero__lead { margin-left: auto; margin-right: auto; }
  .home .hero__text .eyebrow { justify-content: center; }
}

/* 1.4.26 – mobiel: 'Waar ben je?' en de afstandsregel gecentreerd */
@media (max-width: 40rem) {
  .home .where { text-align: center; }
  .home .where label { display: block; text-align: center; }
  .home .where .btn-loc { width: 100%; justify-content: center; }
  .home .where .ac__input { text-align: left; }
  .home .origin, .home .origin__gem { justify-content: center; text-align: center; }
  .home .origin__link { margin-left: 0; flex-basis: 100%; text-align: center; }
}

/* 1.4.28 – mobiel: titel boven de kaartjes + keuzeknop gecentreerd */
@media (max-width: 40rem) {
  .home .results__head { flex-direction: column; align-items: center; text-align: center; }
  .home .results__head .h2 { flex: none; width: 100%; }
  .home .results__head .viewtoggle { margin-left: 0; margin-right: 0; }
}

/* 1.4.29 – mobiel: geen menu in de header, logo gecentreerd */
@media (max-width: 40rem) {
  .site-header .wrap { grid-template-columns: 1fr; }
  .site-header .nav { display: none; }
  .site-header .logo { grid-column: 1; justify-self: center; }
}

/* 1.4.30 – mobiel: menu-icoon rechtsboven, logo gecentreerd, menu klapt open onder de header */
.nav-toggle { display: none; }
@media (max-width: 40rem) {
  .site-header .wrap { grid-template-columns: 2.75rem 1fr 2.75rem; }
  .site-header .hdr-badge { grid-column: 1 / -1; }
  .site-header .logo { grid-column: 2; grid-row: 2; justify-self: center; }
  .nav-toggle { display: inline-flex; grid-column: 3; grid-row: 2; justify-self: end; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; padding: 0; border: 1.5px solid rgba(255, 255, 255, 0.28); border-radius: 0.75rem; background: transparent; color: #fff; cursor: pointer; }
  .nav-toggle:focus-visible { outline: 2px solid var(--yellow); outline-offset: 2px; }
  .nav-toggle .nav-toggle__close { display: none; }
  .nav-toggle[aria-expanded="true"] .nav-toggle__open { display: none; }
  .nav-toggle[aria-expanded="true"] .nav-toggle__close { display: inline; }
  .site-header .nav { display: none; grid-column: 1 / -1; grid-row: 3; flex-direction: column; align-items: stretch; gap: 0; text-align: center; border-top: 1px solid rgba(255, 255, 255, 0.18); }
  .site-header .nav.is-open { display: flex; }
  .site-header .nav a { padding: 0.875rem 0; font-size: 1.0625rem; }
  .site-header .nav a + a { border-top: 1px solid rgba(255, 255, 255, 0.12); }
}

/* 1.4.31 – mobiel: gelijke afstand teller → logo en logo → titel */
@media (max-width: 40rem) {
  .site-header .wrap { row-gap: 1rem; }
  .home .hero > .wrap { padding-top: 0; }
}

/* 1.4.32 – mobiel: intro onder de titel even groot als de afstandsregel (15px) */
@media (max-width: 40rem) {
  .home .hero__lead { font-size: 0.9375rem; line-height: 1.5; }
}

/* 1.4.33 – teller in de header: pulserende stip + gewone woordafstand */
.hdr-badge { gap: 0; }
.hdr-badge .hdr-badge__dot { margin-right: 0.5rem; flex: none; animation: lv-puls 2s ease-out infinite; }
.hdr-badge strong { margin-right: 0.28em; }
@keyframes lv-puls {
  0% { box-shadow: 0 0 0 0 rgba(243, 197, 71, 0.65); }
  70% { box-shadow: 0 0 0 0.5rem rgba(243, 197, 71, 0); }
  100% { box-shadow: 0 0 0 0 rgba(243, 197, 71, 0); }
}
@media (prefers-reduced-motion: reduce) { .hdr-badge .hdr-badge__dot { animation: none; } }

/* 1.4.34 – mobiel: hoofdtitel op één regel, dichter bij de intro */
@media (max-width: 40rem) {
  .home .hero h1 { font-size: clamp(1.25rem, 6.1vw, 1.5rem); white-space: nowrap; }
  .home .hero h1 br { display: none; }
  .home .hero__lead { margin-top: 0.5rem; }
}
@media (max-width: 40rem) { .home .hero > .wrap { padding-top: 0.5rem; } }
/* 1.4.36 – mobiel: meer ruimte logo → titel, 'Waar ben je?' weg */
@media (max-width: 40rem) {
  .home .hero > .wrap { padding-top: 1.25rem; }
  .home .where__title { display: none; }
}
/* 1.4.37 – mobiel: 'zoek je gemeente' als placeholder in het zoekveld */
@media (max-width: 40rem) {
  .home .where > label[for="lv-plaats"] { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .home .where .ac { margin-top: 0.75rem; }
  .home #lv-plaats:focus::placeholder { color: transparent; }
}
@media (max-width: 40rem) { .home #lv-plaats::placeholder { font-size: 0.875rem; } }
/* 1.4.39 – mobiel: suggesties in de gemeente-dropdown links uitgelijnd */
@media (max-width: 40rem) { .home .where .ac, .home .where .ac__list, .home .where .ac__list * { text-align: left; } }
/* 1.4.40 – mobiel: geen menu-icoon meer, logo gecentreerd zonder navigatie */
@media (max-width: 40rem) {
  .site-header .wrap { grid-template-columns: 1fr; }
  .site-header .logo { grid-column: 1; justify-self: center; }
  .site-header .nav, .site-header .nav.is-open, .nav-toggle { display: none; }
}
/* 1.4.41 – ook desktop: 'Waar ben je?' en het label in het zoekveld (placeholder) */
.home .where__title { display: none; }
.home .where > label[for="lv-plaats"] { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.home .where .ac { margin-top: 0.75rem; }
.home #lv-plaats:focus::placeholder { color: transparent; }
/* 1.4.42 – desktop: intro onder de titel even groot als de afstandsregel (15px) */
.home .hero__lead { font-size: 0.9375rem; line-height: 1.5; }
/* 1.4.43 – desktop: titel op één regel (2rem), tweede zin intro op een eigen regel */
@media (min-width: 40.0625rem) {
  .home .hero h1 { font-size: 2rem; white-space: nowrap; }
  .home .hero h1 br { display: none; }
  .home .hero__lead2 { display: block; }
}

/* 1.5.0 – taalkeuze NL | FR */
.lang { display: inline-flex; align-items: center; gap: 0.125rem; padding: 0.125rem; border: 1.5px solid rgba(255, 255, 255, 0.28); border-radius: 62.5rem; font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.02em; }
.lang a { display: inline-flex; align-items: center; justify-content: center; min-width: 2.25rem; padding: 0.3125rem 0.5rem; border-radius: 62.5rem; color: #fff; text-decoration: none; line-height: 1; }
.lang a:hover { background: rgba(255, 255, 255, 0.12); color: #fff; }
.lang a[aria-current="true"] { background: var(--yellow); color: var(--green); }
.lang a:focus-visible { outline: 2px solid var(--yellow); outline-offset: 2px; }
@media (max-width: 40rem) {
  .site-header .lang { grid-column: 1; grid-row: 2; justify-self: end; z-index: 1; align-self: center; flex-direction: column; gap: 0.125rem; border-radius: 0.75rem; font-size: 0.75rem; }
  .site-header .lang a { min-width: 2.25rem; padding: 0.375rem 0.25rem; border-radius: 0.5rem; }
}


/* 1.5.3: afstand + aantallen onder de menukaartjes, boven 'Toon meer' */
.home .origin--onder { margin-top: 2.5rem; padding-bottom: 1.25rem; border-bottom: 1px solid rgba(24,33,28,.1); }
.home .origin--onder + .more { margin-top: 1.5rem; }

/* 1.5.5: op desktop staat de regel onder de titel "Vanmiddag op het menu" (verplaatst via script in front-page.php); op gsm onder de kaartjes */
.home .origin--onder.origin--boven { margin: -0.75rem 0 1.75rem; padding-bottom: 0; border-bottom: 0; }


/* 1.5.9 – titel en intro op alle andere pagina's even groot als op de homepage (titel 2rem, mobiel 1.5rem; intro 15px) */
body .page-head h1, body .resto h1, body .vr-hero h1, body main > article > h1.h2 { font-size: 2rem; line-height: 1.1; }
body .page-head__text > .lead, body .resto h1 + .lead, body .vr-hero .vr-lead { font-size: 0.9375rem; line-height: 1.5; }
@media (max-width: 40rem) {
  body .page-head h1, body .resto h1, body .vr-hero h1, body main > article > h1.h2 { font-size: 1.5rem; }
}