/* duron-fixes.css - eigen correcties bovenop de Webflow-CSS (2026-08-27).
   Geladen na duron-staging.webflow.shared.*.css op elke pagina (zie localize.mjs).
   Bewust een eigen bestand: de Webflow-CSS wordt een jaar gecachet (.htaccess),
   HTML niet, dus een nieuwe link in de head bereikt iedereen direct. */

/* Fix 1: dubbele menubalk. Op 16 pagina's (partners, onze-producten en alle
   projectdetails) staat in het Webflow-origineel een tweede complete nav in de
   pagina: binnen <header> (partners, onze-producten) of binnen een <section>
   (projectdetails). De echte nav staat op alle 41 pagina's direct onder
   .page-wrapper, nooit in een header of section (geverifieerd 2026-08-27). */
header .nav.w-nav,
section .nav.w-nav {
  display: none;
}

/* Fix 2: leeg gat boven de hero op mobiel/tablet. Webflow zet .header-detail
   6.5rem omlaag zodat de hero op desktop precies onder de overlappende nav
   begint. Onder 992px staat de nav IN de flow (erboven), dus daar wordt die
   verschuiving een leeg creme vlak. top 0 heft dat op; de margin-bottom gaat
   van 7rem naar .5rem zodat de ruimte ONDER de hero gelijk blijft (7rem werd
   op mobiel op 104px na visueel opgegeten door de verschuiving). */
@media screen and (max-width: 991px) {
  .header-detail,
  .header-detail-1 {
    top: 0;
    margin-bottom: 0.5rem;
  }
}

/* Fix 3: scroll-fade-in uit op mobiel/tablet. Webflow-interactie zet elk
   .fade-in blok op opacity 0 tot het in beeld scrolt. Op telefoons zijn de
   blokken enorm (formulier 2000px+) en oogt dat als lege vlakken bij het
   scrollen; bij haperende JS blijft de pagina zelfs leeg. !important wint
   van de inline style die de Webflow-runtime zet. Desktop houdt de animatie. */
@media screen and (max-width: 991px) {
  .fade-in {
    opacity: 1 !important;
    transform: none !important;
  }
}
