/* v237 — nieuw navigatiemenu (4 groepen, taalkeuze, winterpil, mobiele fixes) */

/* 1. Nooit tekstschaduw in de menupanelen of het open gsm-menu (was wazig op crème) */
header .drop-panel, header .drop-panel *,
#mainNav.open, #mainNav.open * { text-shadow:none !important }

/* 2. Kolommen in "Voor wie" */
#mainNav .drop-panel.dp-cols { gap:6px }
@media (min-width:821px){
  #mainNav .nav-group.open .drop-panel.dp-cols { flex-direction:row }
}
@media (min-width:821px) and (hover:hover){
  #mainNav .nav-group:hover .drop-panel.dp-cols { flex-direction:row }
}
#mainNav .dp-col { display:flex; flex-direction:column; min-width:180px }
#mainNav .dp-h { margin:8px 13px 4px; font-size:.66rem; letter-spacing:.14em; text-transform:uppercase; color:#7A6F63; font-weight:500 }
#mainNav .dp-sub { font-size:.72rem; color:#7A6F63; margin-left:5px; letter-spacing:.02em }
#mainNav .drop-panel a.dp-key { font-weight:600; color:var(--zellige,#4F7263) }

/* 3. Winter als goudkleurige pil */
#mainNav .nav-winter { border:1px solid rgba(238,154,39,.85); border-radius:999px; padding:8px 15px 7px; color:#F7D19D; white-space:nowrap }
#mainNav .nav-winter::after { display:none }
header.scrolled #mainNav .nav-winter { color:#8A5210; border-color:#EE9A27 }
#mainNav .nav-winter:hover { background:rgba(238,154,39,.16) }

/* 4. Taalkeuze: keuzelijst op computer, rij in het gsm-menu */
#mainNav .nav-lang .drop-panel { left:auto; right:-10px; transform:none; min-width:160px }
#mainNav .nav-lang .drop-panel a[aria-current] { background:var(--sand,#F4EFE6); font-weight:600 }
@media (min-width:821px){
  #mainNav > .langs { display:none }
}
@media (max-width:820px){
  #mainNav .nav-lang { display:none !important }
}

/* 5. Smallere computerschermen: alles op één regel, nooit tegen het logo */
@media (min-width:821px) and (max-width:1180px){
  #mainNav { gap:14px }
  #mainNav .nav-drop { font-size:.72rem; letter-spacing:.06em }
  #mainNav .nav-winter { font-size:.7rem; letter-spacing:.05em; padding:7px 11px 6px }
}
@media (min-width:821px) and (max-width:1080px){
  #mainNav { gap:10px }
  #mainNav .nav-drop { font-size:.66rem; letter-spacing:.03em; gap:4px }
  #mainNav .nav-winter { font-size:.66rem; letter-spacing:.03em; padding:6px 9px 5px }
  header #mainNav .nav-cta { padding:8px 10px 7px; font-size:.7rem; letter-spacing:.03em }
}
@media (min-width:821px) and (max-width:940px){
  header { padding-left:18px; padding-right:18px }
  #mainNav { gap:8px }
  #mainNav .nav-drop { font-size:.62rem; letter-spacing:.02em; gap:3px }
  #mainNav .nav-drop::after { width:5px; height:5px }
  #mainNav .nav-winter { font-size:.62rem; padding:6px 8px 5px }
  header #mainNav .nav-cta { font-size:.64rem; padding:7px 9px 6px }
  header .brand { font-size:1rem }
}

/* 6. Gsm-menu: winterpil, kopjes, vaste boekknop onderaan */
@media (max-width:820px){
  #mainNav.open .dp-col { display:block; min-width:0 }
  #mainNav.open .dp-h { margin:12px 30px 2px; font-size:.68rem }
  #mainNav.open .dp-sub { font-size:.78rem }
  header #mainNav.open .nav-winter { display:block; text-align:center; margin:16px 8px 4px; padding:12px 14px; color:#8A5210; border-color:#EE9A27; font-size:.8rem; letter-spacing:.12em }
  header #mainNav.open .langs { padding:10px 0 4px }
  header #mainNav.open .nav-cta { position:sticky; bottom:-14px; display:block; align-self:stretch; text-align:center;
    margin:12px -14px -14px; padding:17px 16px; border-radius:0 0 18px 18px; border:0;
    font-size:.86rem; letter-spacing:.14em; z-index:2 }
}

/* 7. Cookiebalk wijkt zolang het gsm-menu open staat (bedekte anders "Boek nu"); komt terug bij sluiten */
@media (max-width:820px){
  body:has(#mainNav.open) #vpConsent { visibility:hidden }
}

/* v240: pillen onder "Ga dieper" in zinsopbouw, zodat lange gidstitels leesbaar blijven */
.rel-sec .btn-ghost{text-transform:none;letter-spacing:.01em;font-size:.95rem;line-height:1.35;white-space:normal;text-align:left}