/* Stroomsmid – gedeelde stijl. De meeste opmaak staat inline in de HTML (zo kwam hij uit het ontwerp). */

@font-face{font-family:"Schibsted Grotesk";font-style:normal;font-weight:400;font-display:swap;src:url("/fonts/schibsted-grotesk-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Schibsted Grotesk";font-style:normal;font-weight:500;font-display:swap;src:url("/fonts/schibsted-grotesk-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Schibsted Grotesk";font-style:normal;font-weight:600;font-display:swap;src:url("/fonts/schibsted-grotesk-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Schibsted Grotesk";font-style:normal;font-weight:800;font-display:swap;src:url("/fonts/schibsted-grotesk-latin-800-normal.woff2") format("woff2")}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:16px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:#F4F5F3;color:#16202A;font:400 17px/1.6 "Schibsted Grotesk",system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}
a{color:#16202A}a:hover{color:#55606A}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible{outline:2px solid #16202A;outline-offset:3px}
img,svg{max-width:100%}

/* logo */
.logo-link{display:flex;padding:8px 0;text-decoration:none}
.logo-link img{display:block;height:35px;width:auto}

/* vragen */
summary{list-style:none;cursor:pointer}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-weight:400;font-size:24px;line-height:1;color:#55606A}
details[open] summary::after{content:"–"}

.onderdeel:hover,.kaart:hover{border-color:#16202A !important}
.uitgelicht:hover{color:#FFFFFF}

/* tonen en verbergen van standen (vervangt de sc-if uit het ontwerp) */
[data-toon]{display:contents}
[data-toon][hidden],[hidden]{display:none !important}

/* foutmelding bij formulieren */
.fout{color:#9B2C1F;font-size:15px;margin:10px 0 0}

/* check: animaties */
@keyframes puls{0%,100%{opacity:.3;transform:scale(.75)}50%{opacity:1;transform:scale(1)}}
.puls{animation:puls 1.1s ease-in-out infinite}
@keyframes teken{0%{stroke-dashoffset:100}55%{stroke-dashoffset:0}80%{stroke-dashoffset:0}100%{stroke-dashoffset:-100}}
.teken{stroke-dasharray:100;animation:teken 2.4s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.puls,.teken{animation:none}.teken{stroke-dasharray:none}}
.sleep-actief{border-color:#16202A !important;background:#ECEEEB !important}

/* knoppen die bezig zijn */
button[disabled]{opacity:.6;cursor:wait !important}

@media (max-width:760px){.navlink{display:none !important}}
@media (max-width:480px){
  .logo-link img{height:29px}
  .nav-rechts{gap:8px 14px !important}
  .navknop{padding:12px 14px !important;font-size:15px !important}
  .ruim{padding-top:56px !important;padding-bottom:56px !important}
}