/* Gegenereerd: hover-stijlen uit style-hover-attributen */
.hv0:hover{opacity:0.85 !important;color:var(--bg) !important;}
.hv1:hover{border-color:var(--acc) !important;color:var(--acc) !important;}
.hv2:hover{color:var(--acc) !important;}
.hv3:hover{opacity:0.85 !important;}
.hv4:hover{box-shadow:0 10px 28px rgba(0,0,0,0.10) !important;transform:translateY(-3px) !important;color:var(--ink) !important;}
.hv7:hover{color:var(--ink) !important;background:var(--bg2) !important;}
.hv8:hover{border-color:#0a66c2 !important;}
.hv9:hover{border-color:#0a66c2 !important;color:#0a66c2 !important;}
.hv10:hover{border-color:#E4405F !important;color:#E4405F !important;}
.hv11:hover{border-color:#1877F2 !important;color:#1877F2 !important;}
.hv12:hover{border-color:#FF0000 !important;color:#FF0000 !important;}
.hv13:hover{border-color:#25D366 !important;}
.hv14:hover{transform:scale(1.06) !important;}
.hv15:hover{opacity:0.85 !important;color:var(--ink) !important;}
.hv16:hover{border-color:#25D366 !important;color:var(--bg) !important;}
.hv17:hover{color:#178a4c !important;}

/* ===== Responsive laag ===== */
/* De export gebruikt inline styles zonder media queries; deze overrides
   stapelen grids en maken de header bruikbaar op tablet/telefoon. */
img, video { max-width: 100%; }

@media (max-width: 1000px) {
  /* vier-fasen-grid: 4 -> 2 kolommen */
  div[style*="repeat(4,1fr)"] { grid-template-columns: 1fr 1fr !important; }
}

@media (max-width: 860px) {
  /* alle meerkoloms-grids stapelen */
  div[style*="grid-template-columns"] { grid-template-columns: 1fr !important; }
  /* header: laat regel wrappen, nav horizontaal scrollbaar */
  header > div { height: auto !important; flex-wrap: wrap; padding-top: 10px !important; padding-bottom: 10px !important; }
  header nav { max-width: 100%; }
  /* sectie-padding compacter */
  section > div, footer > div { padding-left: 20px !important; padding-right: 20px !important; }
  /* achtergrond-watermerk kleiner zodat het niet overloopt */
  img[aria-hidden="true"][style*="position:fixed"] { height: 240px !important; }
}

@media (max-width: 640px) {
  div[style*="repeat(4,1fr)"] { grid-template-columns: 1fr !important; }
}

/* ===== Nav-dropdowns (3 tabs met subtabs) ===== */
.nav-dd { position: relative; }
.nav-dd-menu { display: none; position: absolute; top: 100%; left: -16px; padding: 10px 0;
  background: var(--bg); border: 1px solid var(--line); border-radius: 8px; min-width: 175px;
  flex-direction: column; z-index: 150; box-shadow: 0 10px 26px rgba(0,0,0,0.10); }
.nav-dd:hover .nav-dd-menu, .nav-dd:focus-within .nav-dd-menu { display: flex; }
.nav-dd-menu a { padding: 9px 18px; }
.nav-dd-menu a:hover { background: var(--bg2); }
.nav-dd.open .nav-dd-menu { display: flex; }
@media (max-width: 860px) {
  /* mobiel: dropdown blijft, rechts uitlijnen zodat hij binnen het scherm valt */
  .nav-dd-menu { left: auto; right: -8px; }
}

/* ===== Mobiel: wereldbol uit + hero één kolom ===== */
@media (max-width: 860px) {
  #hero-globe-box { display: none !important; }
}

/* ===== Mobiel: compacte, niet-plakkende header ===== */
@media (max-width: 860px) {
  header { position: static !important; }
  header > div { gap: 8px 14px !important; row-gap: 8px !important; }
  header img { height: 34px !important; }
  header nav { gap: 16px !important; }
  header nav a { font-size: 14px !important; }
}

/* ===== Mobiel: illustratie-kaarten (demo's) niet meer vast 16:9 =====
   Binnenin stapelt de grid; met vaste aspect-ratio loopt de inhoud over
   de kaartrand heen. Op mobiel groeit de kaart gewoon mee. */
@media (max-width: 860px) {
  figure > div[style*="aspect-ratio:16/9"] {
    aspect-ratio: auto !important;
    justify-items: center;
    text-align: center;
    gap: 18px !important;
  }
  figure > div[style*="aspect-ratio:16/9"] > div { align-items: center !important; }
}

/* Mobiel: teamfoto-placeholders niet paginahoog */
@media (max-width: 860px) {
  #team-grid article > div[style*="aspect-ratio"] { aspect-ratio: auto !important; height: 240px !important; }
}