/* Boschalet Nutter · paginasecties */

/* ===== HERO: lucht boven, wit land eronder, zon achter de foto ===== */
.held {
  position: relative; display: grid; gap: var(--s3);
  padding-top: var(--s1); padding-bottom: 0;
  background: linear-gradient(var(--lucht), var(--lucht)) top / 100% var(--lucht-h, 64%) no-repeat;
  --lucht-h: calc(8px + (100vw - 2 * var(--rand)) * .75 * .62);
}
.held::after { /* glooiende horizon zoals de lucht in het logo */
  content: ""; position: absolute; left: 0; right: 0; top: calc(var(--lucht-h) - 40px); height: 42px; z-index: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 42' preserveAspectRatio='none'%3E%3Cpath d='M0 42 L0 21 L32 25 L63 22 L94 31 L132 29 L176 16 L210 31 L252 13 L273 20 L293 15 L313 25 L353 30 L375 26 L412 13 L455 31 L479 31 L508 21 L554 28 L576 19 L608 17 L632 17 L670 10 L704 20 L722 17 L758 21 L777 32 L818 31 L838 16 L858 27 L883 13 L913 30 L954 16 L976 30 L1010 25 L1031 11 L1068 19 L1088 31 L1124 28 L1144 29 L1164 29 L1195 17 L1228 30 L1254 13 L1286 15 L1307 14 L1327 14 L1354 17 L1393 16 L1425 14 L1440 8 L1440 42Z' fill='%23d4d9cb'/%3E%3C/svg%3E") bottom / 100% 100% no-repeat;
}
.held > * { position: relative; z-index: 1; min-width: 0; }
.held__beeld { position: relative; order: -1; }
.held__beeld img { width: 100%; aspect-ratio: 4 / 3; max-height: 62svh; object-fit: cover; object-position: 30% 60%; }
.zon {
  position: absolute; z-index: -1; right: 10%; top: -14px; width: 92px; aspect-ratio: 1; border-radius: 50%; background: var(--zon);
}
@media (prefers-reduced-motion: no-preference) {
  .js .zon { animation: zonOp 1.4s var(--ease) .2s both; }
  @keyframes zonOp { from { transform: translateY(36px); opacity: 0; } }
  .js .held__tekst > * { animation: tekstIn .8s var(--ease) both; }
  .js .held__tekst > :nth-child(2) { animation-delay: .08s; }
  .js .held__tekst > :nth-child(3) { animation-delay: .16s; }
  .js .held__tekst > :nth-child(4) { animation-delay: .22s; }
  @keyframes tekstIn { from { opacity: 0; transform: translateY(12px); } }
}
.held h1 { max-width: 15ch; }
.held__lead { font-size: var(--step-1); line-height: 1.5; margin-top: var(--s2); max-width: 44ch; }
.held__acties { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s1) var(--s3); margin-top: var(--s3); }
.held__noot { font-size: var(--step--1); color: var(--mos); margin-top: var(--s1); }
.held__feiten { display: grid; grid-template-columns: 1fr 1fr; gap: 6px var(--s3); font-size: var(--step--1); color: var(--mos); padding-top: var(--s2); border-top: 1px solid var(--lijn); }
.held__feiten li { display: inline-flex; gap: 4px; align-items: baseline; }
.held__feiten strong { color: var(--bos); font-size: var(--step-1); }

@media (min-width: 900px) {
  .held {
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: center; column-gap: clamp(32px, 5vw, 80px);
    padding-top: var(--s4); padding-bottom: var(--s4); --lucht-h: 78%;
  }
  .held__beeld { order: 0; }
  .held__beeld img { aspect-ratio: 3 / 2; max-height: calc(100svh - 230px); min-height: 360px; }
  .zon { width: 132px; right: auto; left: -46px; top: -40px; }
  .held__feiten { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: var(--s1) var(--s5); }
}

/* ===== DE PLEK ===== */
.plek { display: grid; gap: var(--s3); padding-block: var(--s6) var(--sectie); }
.plek__vertaling { color: var(--mos); font-size: var(--step-1); margin-top: var(--s1); }
.plek__tekst h2 + p { margin-top: var(--s1); }
.plek__tekst p:not(.plek__vertaling) { margin-top: var(--s2); }
.plek__groot img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.plek__klein { width: 62%; justify-self: end; margin-top: calc(var(--s5) * -1); border: 6px solid var(--wit); border-radius: var(--knip); }
.plek__klein img { aspect-ratio: 1; object-fit: cover; }
@media (min-width: 900px) {
  .plek { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--s3); align-items: start; }
  .plek__tekst { grid-column: 1 / 6; grid-row: 1; padding-top: var(--s4); }
  .plek__groot { grid-column: 6 / 13; grid-row: 1 / 3; }
  .plek__groot img { aspect-ratio: 5 / 4; }
  .plek__klein { grid-column: 2 / 6; grid-row: 2; width: 100%; justify-self: stretch; margin-top: var(--s4); border: 0; }
  .plek__klein img { aspect-ratio: 4 / 3; }
}

/* ===== BINNEN ===== */
.binnen { padding-bottom: var(--sectie); }
.binnen__kop { display: grid; gap: var(--s2); margin-bottom: var(--s4); }
.binnen__grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s2); }
.binnen__grid img { width: 100%; height: 100%; object-fit: cover; }
.b1 { grid-column: 1 / -1; } .b1 img { aspect-ratio: 16 / 10; }
.b2 img, .b3 img { aspect-ratio: 4 / 5; }
.b4 { grid-column: 1 / -1; margin-top: var(--s1); }
.kamers li { display: grid; gap: 2px; padding: 12px 0; border-bottom: 1px solid var(--lijn); }
.kamers li:first-child { border-top: 1px solid var(--lijn); }
.binnen > .tekstlink { margin-top: var(--s3); }
@media (min-width: 900px) {
  .binnen__kop { grid-template-columns: 5fr 7fr; align-items: end; column-gap: var(--s5); }
  .binnen__grid { grid-template-columns: 7fr 2.6fr 2.4fr; grid-template-rows: auto auto; gap: var(--s3); }
  .b1 { grid-column: 1; grid-row: 1 / 3; } .b1 img { aspect-ratio: auto; min-height: 100%; }
  .b2 { grid-column: 2; grid-row: 1; } .b3 { grid-column: 3; grid-row: 1; }
  .b4 { grid-column: 2 / 4; grid-row: 2; margin: 0; }
  .kamers li { grid-template-columns: 9.5em 1fr; gap: var(--s2); padding: 10px 0; }
}

/* ===== WIE GAAT ER MEE ===== */
.wie { position: relative; background: var(--lucht); padding-block: calc(var(--sectie) + 24px) var(--sectie); }
.wie::before {
  content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 42px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 42' preserveAspectRatio='none'%3E%3Cpath d='M0 0 L0 14 L18 24 L52 12 L83 29 L104 26 L134 19 L176 17 L208 23 L253 16 L295 24 L330 17 L358 9 L380 10 L419 14 L441 10 L483 27 L519 14 L544 14 L575 11 L606 14 L650 29 L684 13 L729 15 L757 8 L786 18 L818 12 L850 8 L875 10 L904 9 L923 15 L947 21 L980 25 L1017 24 L1059 17 L1086 30 L1109 24 L1145 9 L1186 28 L1222 24 L1262 11 L1295 19 L1336 26 L1377 21 L1420 23 L1440 13 L1440 0Z' fill='%23d4d9cb'/%3E%3C/svg%3E") top / 100% 100% no-repeat;
}
.wie__in { display: grid; gap: var(--s4); }
.wie__kop p { margin-top: var(--s2); }
.wie__uitkomst { background: var(--wit); border-radius: var(--knip); padding: var(--s3); display: grid; gap: var(--s1); align-content: start; }
.wie__uitkomst h3 { font-size: var(--step-0); margin-top: var(--s2); color: var(--mos); font-weight: 600; }
.wie__uitkomst ul { display: grid; gap: 6px; }
.wie__slapen li, .wie__zelf li { position: relative; padding-left: 30px; }
.wie__slapen li::before, .wie__zelf li::before { content: ""; position: absolute; left: 5px; top: .62em; width: 8px; height: 8px; border-radius: 50%; background: var(--bos); }
.wie__oordeel { font-size: var(--step-2); font-weight: 650; line-height: 1.2; margin: 0; padding-bottom: var(--s1); border-bottom: 2px solid var(--zon); }
.wie__oordeel.nee { color: var(--roest); border-color: var(--roest); }
.wie__acties { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s1) var(--s3); margin-top: var(--s3); }
.wie__uitkomst.nee .wie__acties .knop { display: none; }
@media (prefers-reduced-motion: no-preference) {
  .wie__uitkomst.flits .wie__oordeel { animation: flits .45s var(--ease); }
  @keyframes flits { from { opacity: .3; transform: translateY(4px); } }
}
@media (min-width: 900px) {
  .wie__in { grid-template-columns: 5fr 6fr; grid-template-rows: auto 1fr; column-gap: var(--s6); align-items: start; }
  .wie__kop { grid-column: 1; }
  .wie__keuze { grid-column: 1; }
  .wie__uitkomst { grid-column: 2; grid-row: 1 / 3; padding: var(--s5); }
}

/* ===== BUITEN (donker bosvlak) ===== */
.buiten { background: var(--bos); color: var(--wit); padding-block: var(--sectie); display: grid; gap: var(--s4); }
.buiten__beeld img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.buiten__tekst p { margin-top: var(--s2); }
.buiten__lijst { display: grid; gap: var(--s2); margin: var(--s3) 0 var(--s2); }
.buiten__lijst div { padding-top: var(--s2); border-top: 1px solid rgba(255, 255, 255, .22); }
.buiten__lijst dt { font-weight: 650; }
.buiten__lijst dd { color: #dfe6da; }
@media (min-width: 900px) {
  .buiten { grid-template-columns: 1fr 1fr; column-gap: var(--s6); align-items: center; }
  .buiten__beeld img { aspect-ratio: 4 / 5; max-height: 640px; }
}

/* ===== HOSTS + REVIEWS ===== */
.hosts { display: grid; gap: var(--s4); padding-block: var(--sectie) 0; }
.hosts__foto { width: min(76%, 340px); }
.hosts__foto img { aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 40%; }
.hosts blockquote p { font-size: var(--step-2); line-height: 1.3; font-weight: 500; letter-spacing: -0.01em; margin: var(--s2) 0; max-width: 30ch; }
.hosts__reviews { display: grid; gap: var(--s3); align-content: start; }
.review { border-left: 3px solid var(--zon); padding-left: var(--s2); }
.review figcaption { font-size: var(--step--1); color: var(--mos); margin-top: 6px; }
.review figcaption strong { color: var(--bos); }
@media (min-width: 900px) {
  .hosts { grid-template-columns: 4fr 4fr 4fr; column-gap: var(--s5); align-items: start; }
  .hosts__foto { width: 100%; }
  .hosts__tekst { padding-top: var(--s4); }
  .hosts__reviews { padding-top: var(--s4); }
}

/* ===== SLOT / CTA ===== */
.slot { padding-block: var(--sectie) 0; }
.slot > * { max-width: 60ch; }
.slot p { margin-top: var(--s2); }
.slot__acties { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s1) var(--s3); margin-top: var(--s3); }
.p-home .slot { text-align: left; }

/* ===== SUBPAGINA'S ===== */
.pkop { padding-block: var(--s5) var(--s4); background: var(--lucht-licht); }
.pkop h1 { max-width: 18ch; }
.pkop__lead { font-size: var(--step-1); margin-top: var(--s2); max-width: 46ch; }
.pkop--smal { padding-bottom: var(--s6); }
.pkop--smal .slot__acties { margin-top: var(--s4); }
.springlijst { display: flex; flex-wrap: wrap; gap: 0 var(--s3); margin-top: var(--s3); }
.springlijst a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 500; }

.ruimte { display: grid; gap: var(--s3); padding-block: var(--s6) 0; }
.ruimte__tekst p { margin-top: var(--s2); }
.ruimte__fotos { display: grid; gap: var(--s2); grid-template-columns: 1fr 1fr; }
.ruimte__fotos img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 4 / 5; }
.ruimte__fotos--1 { grid-template-columns: 1fr; }
.ruimte__fotos--1 img { aspect-ratio: 3 / 2; }
.ruimte__fotos--4 figure:first-child, .ruimte__fotos--4 figure:last-child { grid-column: 1 / -1; }
.ruimte__fotos--4 figure:first-child img, .ruimte__fotos--4 figure:last-child img { aspect-ratio: 3 / 2; }
@media (min-width: 900px) {
  .ruimte { grid-template-columns: 4fr 8fr; column-gap: var(--s6); align-items: start; padding-top: var(--s7); }
  .ruimte__tekst { position: sticky; top: var(--s4); padding-top: var(--s2); }
  .ruimte--om { grid-template-columns: 8fr 4fr; }
  .ruimte--om .ruimte__tekst { grid-column: 2; grid-row: 1; }
  .ruimte--om .ruimte__fotos { grid-column: 1; grid-row: 1; }
  .ruimte__fotos { gap: var(--s3); }
  .ruimte__fotos--4 { grid-template-columns: 1fr 1fr 1fr; }
  .ruimte__fotos--4 figure:last-child { grid-column: auto; }
  .ruimte__fotos--4 figure:first-child img { aspect-ratio: 21 / 9; }
  .ruimte__fotos--4 figure:not(:first-child) img { aspect-ratio: 1; }
}

.voorz { padding-block: var(--sectie) 0; }
.voorz__grid { display: grid; gap: var(--s3) var(--s4); margin-top: var(--s4); grid-template-columns: 1fr 1fr; }
.voorz__grid h3 { font-size: var(--step-0); padding-bottom: 6px; border-bottom: 2px solid var(--zon); margin-bottom: var(--s1); }
.voorz__grid li { padding: 3px 0; font-size: var(--step--1); line-height: 1.45; }
.voorz__actie { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s1) var(--s3); margin-top: var(--s5); }
@media (min-width: 900px) { .voorz__grid { grid-template-columns: repeat(3, 1fr); } .voorz__grid li { font-size: var(--step-0); } }
@media (max-width: 379px) { .voorz__grid { grid-template-columns: 1fr; } }

.grens { padding-block: var(--sectie) 0; }
.grens p { margin-top: var(--s2); }
.bronnoot { max-width: none; margin: var(--s5) 0 0; padding-inline: max(var(--rand), calc((100% - var(--max)) / 2)); font-size: var(--step--1); color: var(--mos); }
.grens .slot__acties { margin-top: var(--s4); }

.stappen { padding-block: var(--s6) 0; }
.stappen ol { list-style: none; counter-reset: stap; display: grid; gap: var(--s3); margin: var(--s4) 0; }
.stappen li { counter-increment: stap; display: grid; align-content: start; grid-template-columns: 44px 1fr; gap: var(--s2); max-width: 64ch; }
.stappen li::before { content: counter(stap); font-size: var(--step-3); font-weight: 650; line-height: 1; color: var(--zon-diep); }
.stappen li strong { display: block; }
@media (min-width: 900px) { .stappen ol { grid-template-columns: repeat(3, 1fr); column-gap: var(--s5); } .stappen li { grid-template-columns: 1fr; } }

.info { display: grid; gap: var(--s5); padding-block: var(--sectie) 0; }
.info__blok h3 { margin-bottom: var(--s2); padding-bottom: 6px; border-bottom: 2px solid var(--zon); }
.info__blok ul li { padding: 4px 0 4px 20px; position: relative; }
.info__blok ul li::before { content: ""; position: absolute; left: 2px; top: .95em; width: 7px; height: 7px; border-radius: 50%; background: var(--bos); }
.info__blok p { margin-bottom: var(--s1); }
.info__blok .tekstlink { margin-top: var(--s1); }
.info__blok h4 { margin: var(--s3) 0 4px; font-size: var(--step-0); }
.info__blok--breed { grid-column: 1 / -1; max-width: 72ch; }
.info__blok--breed h4 + p { margin-bottom: 0; }

.tijden div { display: flex; justify-content: space-between; gap: var(--s2); padding: 8px 0; border-bottom: 1px solid var(--lijn); }
.tijden dt { font-weight: 500; }
.tijden dd { font-weight: 650; text-align: right; font-variant-numeric: tabular-nums; }
@media (min-width: 760px) { .info { grid-template-columns: 1fr 1fr; column-gap: var(--s6); } }
@media (min-width: 1100px) { .info { grid-template-columns: repeat(3, 1fr); } }

.contact { display: grid; gap: var(--s5); padding-block: var(--s5) 0; }
.contact .kanalen { order: -1; }
.formulier { max-width: 640px; }
.formulier__let { background: var(--lucht-licht); border-radius: var(--r); padding: 12px 16px; margin-bottom: var(--s3); font-size: var(--step--1); }
.formulier .knop { margin-top: var(--s1); width: 100%; }
.formulier .klein { margin-top: var(--s2); }
.kanalen h2 { font-size: var(--step-2); margin-bottom: var(--s2); }
.kanalen dl { display: grid; gap: var(--s3); }
.kanalen dt { font-weight: 650; }
.kanalen dd a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 600; }
@media (min-width: 900px) {
  .contact { grid-template-columns: 7fr 4fr; column-gap: var(--s7); align-items: start; }
  .contact .kanalen { order: 0; }
  .formulier .knop { width: auto; }
  .kanalen { background: var(--lucht-licht); border-radius: var(--knip); padding: var(--s4); }
}
@media (max-width: 379px) { .veld-rij { grid-template-columns: 1fr; } }

.tekstblok { max-width: 64ch; margin-top: var(--s4); }
.tekstblok h2 { font-size: var(--step-1); margin: var(--s4) 0 var(--s1); }

/* ===== RESERVEREN ===== */
.res { display: grid; gap: var(--s4); padding-block: var(--s4) 0; }
.res__test { background: var(--zon); color: var(--bos-diep); border-radius: var(--r); padding: 10px 14px; font-weight: 600; font-size: var(--step--1); margin-bottom: var(--s2); }
.kal { background: var(--wit); border: 1px solid var(--lijn); border-radius: var(--knip); padding: var(--s1); }
.kal__kop { display: flex; align-items: center; justify-content: space-between; gap: var(--s1); margin-bottom: var(--s1); }
.kal__titel { margin: 0; font-weight: 650; text-align: center; flex: 1; }
.kal__nav { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; border: 1.5px solid var(--bos); background: var(--wit); color: var(--bos); cursor: pointer; }
.kal__nav svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.kal__nav:disabled { opacity: .3; cursor: not-allowed; }
.kal__maanden { display: grid; gap: var(--s4); }
.kal__mnaam { display: none; margin: 0 0 var(--s1); font-weight: 650; text-transform: capitalize; }
.kal__week, .kal__grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 2px; }
@media (min-width: 900px) { .kal__week, .kal__grid { gap: 4px; } }
.kal__week span { text-align: center; font-size: .75rem; color: var(--mos); padding: 4px 0; }
.kal__dag {
  position: relative; display: grid; align-content: center; justify-items: center; gap: 0; min-height: 48px; padding: 4px 0;
  border: 0; border-radius: 10px; background: var(--lucht-licht); color: var(--bos); font: inherit; cursor: pointer; line-height: 1.1;
}
.kal__n { font-weight: 600; font-size: .95rem; }
.kal__p { font-size: .7rem; color: var(--mos); font-variant-numeric: tabular-nums; }
.kal__dag:hover:not([aria-disabled]) { background: var(--lucht); }
.kal__dag:focus-visible { outline: 3px solid var(--bos); outline-offset: 1px; z-index: 1; }
.kal__dag.is-verleden, .kal__dag.is-geenprijs { background: transparent; color: #a3ab9c; cursor: default; }
.kal__dag.is-bezet { background: transparent; color: #a3ab9c; text-decoration: line-through; cursor: default; }
.kal__dag.is-optie { background: repeating-linear-gradient(135deg, #f3e6c4 0 4px, #fff 4px 8px); color: var(--mos); cursor: default; }
.kal__dag.is-kanvertrek { box-shadow: inset 0 0 0 1.5px var(--zon-diep); cursor: pointer; }
.kal__dag.is-binnen { background: #f3e2b5; }
.kal__dag.is-start, .kal__dag.is-eind { background: var(--zon); color: var(--bos-diep); }
.kal__dag.is-start .kal__p, .kal__dag.is-eind .kal__p, .kal__dag.is-binnen .kal__p { color: var(--bos); }
.kal__dag.is-korting .kal__p { color: var(--bos); font-weight: 700; box-shadow: inset 0 -3px 0 var(--zon); }
.lg--korting { background: #fff; box-shadow: inset 0 -4px 0 var(--zon); }
.kal__uitleg { font-size: var(--step--1); color: var(--mos); margin-top: var(--s2); }
.kal__legenda { display: flex; flex-wrap: wrap; gap: 6px var(--s3); font-size: var(--step--1); margin-top: var(--s1); }
.kal__legenda li { display: inline-flex; align-items: center; gap: 6px; }
.lg { width: 16px; height: 16px; border-radius: 5px; display: inline-block; }
.lg--vrij { background: var(--lucht-licht); border: 1px solid var(--lijn); } .lg--gekozen { background: var(--zon); }
.lg--optie { background: repeating-linear-gradient(135deg, #f3e6c4 0 3px, #fff 3px 6px); border: 1px solid var(--lijn); }
.lg--bezet { background: #fff; border: 1px solid var(--lijn); background-image: linear-gradient(to top right, transparent 46%, #a3ab9c 47% 53%, transparent 54%); }
.kal__status { min-height: 1.6em; font-weight: 500; margin-top: var(--s1); }

.som { background: var(--lucht-licht); border-radius: var(--knip); padding: var(--s3); margin-bottom: var(--s3); }
.som__titel { font-size: var(--step-1); margin-bottom: var(--s1); }
.som__leeg { margin: 0; color: var(--mos); }
.som__data { margin-bottom: var(--s2); }
.som__regels div { display: flex; justify-content: space-between; gap: var(--s2); padding: 6px 0; border-bottom: 1px solid var(--lijn); font-size: var(--step--1); }
.som__regels dd { font-variant-numeric: tabular-nums; white-space: nowrap; }
.som__totaal { border-bottom: 0 !important; font-size: var(--step-1) !important; font-weight: 650; padding-top: 10px !important; }
.som .klein { margin-top: var(--s1); }
.som__wis { background: none; border: 0; padding: 0; font: inherit; cursor: pointer; color: var(--bos); margin-top: var(--s1); }
.res__form { max-width: none; }
.res__form .knop { width: 100%; }
.res__klaar { background: var(--lucht-licht); border-radius: var(--knip); padding: var(--s4); }
.res__klaar h2 { font-size: var(--step-2); margin-bottom: var(--s2); }
.res__klaar:focus { outline: none; }
@media (min-width: 900px) {
  .kal { padding: var(--s3); }
  .kal__maanden { grid-template-columns: 1fr 1fr; }
  .kal__mnaam { display: block; }
  .kal__titel { visibility: hidden; }
}
@media (min-width: 1100px) {
  .res { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); column-gap: var(--s5); align-items: start; }
  .res__zij { position: sticky; top: calc(var(--kop-h, 72px) + 16px); }
  .kal__dag { min-height: 56px; }
}
@media (max-width: 379px) { .veld-rij--3 { grid-template-columns: 1fr 1fr; } }

/* ===== HUISSTIJL RONDE 3: welkomstboekje-gevoel ===== */
.held { background-color: transparent; }
.held__groet { font-size: var(--step-3); color: var(--hout); margin: 0 0 4px; line-height: 1; transform: rotate(-3deg); transform-origin: left; display: inline-block; }
.held__beeld img { border: 7px solid var(--wit); box-shadow: 0 8px 24px rgba(43, 54, 39, .2); }
.held__feiten strong { font-family: var(--hand); font-weight: 400; }
.plek__vertaling { font-family: var(--hand); color: var(--hout); }
.plek, .slot { position: relative; }
.plek::after, .slot::after {
  content: ""; position: absolute; width: 120px; aspect-ratio: 276 / 420; background: url("../assets/bloem.png") center / contain no-repeat;
  pointer-events: none; opacity: .9;
}
.plek::after { right: max(8px, calc((100% - var(--max)) / 2 - 40px)); bottom: 16px; width: 90px; }
.slot::after { right: max(var(--rand), calc((100% - var(--max)) / 2)); bottom: -40px; }
@media (max-width: 899px) { .plek::after { display: none; } .slot::after { width: 80px; bottom: -30px; } }
.binnen__grid img, .ruimte__fotos img { border: 5px solid var(--wit); border-radius: 14px; }
.hosts__tekst blockquote p { font-family: var(--hand); font-size: var(--step-1); line-height: 1.45; }
.review blockquote p { font-family: var(--f); font-size: var(--step-1); }
.held { padding-top: 34px !important; }
@media (min-width: 900px) { .held { padding-top: 56px !important; } }
.handtekening { font-size: var(--step-2); color: var(--hout); margin-top: var(--s2); }
.slot h2, .wie__kop h2 { color: var(--bos); }
.review { border-left-color: var(--hout); }
.pkop { background: var(--lucht); }
.wie { background: var(--lucht); }
.buiten { position: relative; }

.favo { padding-block: var(--sectie) 0; }
.favo__intro { margin-top: var(--s1); color: var(--mos); }
.favo__grid { display: grid; gap: var(--s4) var(--s5); margin-top: var(--s4); }
.favo__groep { background: var(--lucht-licht); border-radius: 18px; padding: var(--s3); }
.favo__groep h3 { font-family: var(--hand); font-weight: 400; font-size: var(--step-2); margin-bottom: var(--s2); }
.favo__groep dl div { padding: 10px 0; border-top: 1px solid var(--lijn); }
.favo__groep dt { font-weight: 700; }
.favo__groep dd { font-size: var(--step--1); line-height: 1.5; }
.favo__citaat { max-width: 52ch; margin: var(--s5) auto 0; text-align: center; font-size: var(--step-1); line-height: 1.5; transform: rotate(-1deg); }
@media (min-width: 900px) { .favo__grid { grid-template-columns: 1fr 1fr; } }

.voet__kanalen { display: grid; justify-items: start; }

/* Home · het park en het welkomsttasje */
.park { display: grid; gap: var(--s4); padding-block: 0 var(--sectie); }
.park__kop { max-width: 62ch; }
.park__kop p { margin-top: var(--s2); }
.park__lijst { display: grid; gap: var(--s3); }
.park__lijst li { border-top: 2px solid var(--zon); padding-top: var(--s2); }
.park__lijst h3 { font-size: var(--step-1); }
.park__lijst p { margin-top: var(--s1); }
.welkom { background: var(--lucht-licht); border-radius: var(--knip); padding: var(--s3); max-width: 62ch; }
.welkom p { margin-top: var(--s1); }
@media (min-width: 900px) {
  .park__lijst { grid-template-columns: repeat(3, 1fr); gap: var(--s4); }
}

/* Veelgestelde vragen */
.faq { display: grid; gap: var(--s1) var(--s5); padding-block: var(--s6) 0; align-items: start; }
.faq__item { border-bottom: 2px solid var(--lucht-licht); }
.faq__item summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: var(--s2); padding: var(--s2) 0; font-size: var(--step-1); font-weight: 600; color: var(--mos); }
.faq__item summary::-webkit-details-marker { display: none; }
.faq__item summary::after { content: "+"; flex: none; font-size: 1.4em; line-height: .9; color: var(--zon-diep); }
.faq__item[open] summary::after { content: "−"; }
.faq__item summary:focus-visible { outline: 2px solid var(--mos); outline-offset: 4px; }
.faq__item p { padding-bottom: var(--s3); }
/* Reason: over de volle breedte worden regels te lang; twee kolommen vullen de breedte en blijven leesbaar. */
@media (min-width: 900px) { .faq { grid-template-columns: 1fr 1fr; } }
.tekstblok ul { padding-left: 1.2em; margin: var(--s1) 0; }
