/* Gidsen (zoals vakantieverhuur in Zandvoort) in het ontwerp "Twee handen" (zie twee.css), 23-10-2026.
   Lange lees-pagina's: oranje kopvlak met de twee handen, daarna rustige tekst op wit. Classes met "g-" binnen .gids. */
.gids{padding:0 0 clamp(72px,9vw,120px)}
.gids .g-wrap{max-width:860px;margin:0 auto;padding-inline:clamp(16px,4vw,24px)}
.g-kop{position:relative;overflow:hidden;background:var(--oranje);padding:clamp(120px,13vw,170px) 0 clamp(48px,6vw,80px);margin-bottom:clamp(40px,5vw,64px)}
.g-kop .g-wrap{position:relative;z-index:1}
.g-kop .t-hand.h1{width:180px;height:140%;background:var(--inkt);right:max(4vw,calc(50% - 640px));top:-20%;transform:rotate(-14deg)}
.g-kop .t-hand.h2{width:180px;height:140%;background:var(--wit);right:max(-8vw,calc(50% - 820px));top:-34%;transform:rotate(14deg)}
.gids h1{font-size:clamp(30px,4.4vw,64px);max-width:18ch;hyphens:auto;-webkit-hyphens:auto}
.gids h1 em{font-style:normal;color:var(--wit)}
.gids h2{font-size:clamp(28px,3.8vw,48px);max-width:22ch;margin:72px 0 20px}
.gids h3{font-size:22px;font-weight:800;font-stretch:112%;margin:28px 0 8px}
.gids p{margin-bottom:14px;max-width:68ch}
.gids strong,.gids b{font-weight:700}
.gids a{text-underline-offset:3px;text-decoration-color:var(--oranje);text-decoration-thickness:2px}
.gids ul,.gids ol{padding-left:22px;margin:0 0 16px;max-width:68ch}
.gids li{margin-bottom:8px}
.g-intro{font-size:clamp(18px,1.8vw,21px);line-height:1.5;margin-top:24px;font-weight:500}
.g-datum{font-size:14px;font-weight:700;margin-top:18px}
.g-datum::before{content:"";display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--inkt);margin-right:10px;vertical-align:1px}
.g-kort{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin:0 0 8px}
.g-kort div{background:var(--zand);border-radius:var(--rond);padding:22px}
.g-kort div:first-child{background:var(--inkt);color:var(--wit)}
.g-kort b{display:block;font-weight:900;font-stretch:112%;font-size:clamp(26px,2.6vw,30px);line-height:1;letter-spacing:-.02em;margin-bottom:10px}
.g-kort div:first-child b{color:var(--oranje)}
.g-kort span{font-size:15px;line-height:1.45;display:block}
.g-tabel{overflow-x:auto;margin:8px 0 18px;border:2px solid var(--inkt);border-radius:var(--rond)}
.g-tabel table{width:100%;border-collapse:collapse;font-size:16px;min-width:560px}
.g-tabel th,.g-tabel td{text-align:left;padding:14px 16px;border-bottom:1px solid var(--lijn-licht);vertical-align:top}
.g-tabel tr:last-child td{border-bottom:0}
.g-tabel th{font-size:15px;font-weight:800;background:var(--inkt);color:var(--wit)}
.g-tabel td:first-child{font-weight:700}
.g-tabel .g-getal{font-variant-numeric:tabular-nums;white-space:nowrap}
.g-let{background:var(--oranje);border-radius:var(--rond);padding:22px 24px;margin:24px 0}
.g-let p:last-child{margin:0}
.g-stappen{list-style:none;padding:0!important;counter-reset:g;display:grid;gap:12px}
.g-stappen li{background:var(--zand);border-radius:var(--rond);padding:20px 20px 20px 72px;position:relative;margin:0}
.g-stappen li::before{counter-increment:g;content:counter(g);position:absolute;left:22px;top:16px;font-weight:900;font-stretch:125%;font-size:32px;line-height:1;color:var(--oranje)}
.g-som{background:var(--zand);border-radius:var(--rond);padding:22px;margin:18px 0;display:grid;gap:8px;max-width:520px}
.g-som div{display:flex;justify-content:space-between;gap:16px;font-variant-numeric:tabular-nums}
.g-som div:last-child{border-top:2px solid var(--inkt);padding-top:10px;font-weight:800}
.g-vragen details{border-bottom:2px solid var(--inkt);padding:18px 0}
.g-vragen summary{cursor:pointer;font-weight:800;font-stretch:110%;font-size:20px;line-height:1.3;list-style:none;display:flex;justify-content:space-between;gap:16px}
.g-vragen summary::-webkit-details-marker{display:none}
.g-vragen summary::after{content:"+";color:var(--oranje);font-size:28px;line-height:1}
.g-vragen details[open] summary::after{content:"–"}
.g-vragen details p{margin:12px 0 0}
.g-slot{background:var(--inkt);color:var(--wit);border-radius:var(--rond);padding:clamp(24px,4vw,40px);margin-top:72px}
.g-slot h2{margin:0 0 14px}
.g-slot .t-knop{margin-top:8px;background:var(--oranje);color:var(--inkt)}
.g-bronnen{font-size:15px}
.g-bronnen li{margin-bottom:6px}
@media (max-width:680px){
  .g-kop .t-hand{display:none}
  .g-stappen li{padding-left:60px}
  .g-stappen li::before{left:18px}
}
