/* VIDEOKLAAR-SEO-UITVOER-20261103: menu, ingangen op home, toolpagina's zonder account. Laadt na rust.css. */
.nav-links{align-items:center}
.nav-links details{position:relative}
.nav-links summary{list-style:none;display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:10px;font-size:.96875rem;font-weight:500;cursor:pointer;transition:background .2s}
.nav-links summary::-webkit-details-marker{display:none}
.nav-links summary::after{content:"";width:7px;height:7px;margin-top:-3px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;rotate:45deg;opacity:.7;transition:rotate .15s,margin .15s}
.nav-links details[open] summary::after{rotate:225deg;margin-top:3px}
.nav-links summary:hover,.nav-links details[open] summary{background:#232833}
.nav-links ul{position:absolute;top:calc(100% + 8px);left:0;min-width:250px;padding:8px;border-radius:12px;background:#191D26;box-shadow:0 0 0 1px rgba(255,255,255,.1),0 20px 40px -18px rgba(0,0,0,.8)}
.nav-links ul a{display:block;padding:10px 12px;white-space:nowrap}
.nav-links .nav-alles{margin-top:4px;padding-top:4px;border-top:1px solid rgba(255,255,255,.1)}
.nav-mob,.nav-menu{display:none}
@media (max-width:1180px){
  .nav-menu{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:10px;flex:none}
  .nav-menu:hover{background:#232833}
  .nav-menu svg{width:22px;height:22px}
  .nav-menu .dicht,.nav[data-menu-open] .nav-menu .open{display:none}
  .nav[data-menu-open] .nav-menu .dicht{display:block}
  .nav[data-menu-open] .nav-links{display:block;position:absolute;left:0;right:0;top:calc(100% + 8px);max-height:calc(100dvh - 96px);overflow:auto;overscroll-behavior:contain;padding:10px;border-radius:14px;background:#0F1218;box-shadow:0 0 0 1px rgba(255,255,255,.12),0 24px 48px -20px rgba(0,0,0,.9)}
  .nav-links>a,.nav-links summary,.nav-links ul a{display:flex;align-items:center;min-height:46px;padding:10px 12px;font-size:1rem}
  .nav-links summary{justify-content:space-between}
  .nav-links ul{position:static;min-width:0;padding:0 0 6px 10px;background:none;box-shadow:none;border-radius:0}
  .nav-links ul a{white-space:normal;color:var(--op-inkt-2)}
  .nav-links .nav-alles{border-top:0;margin:0;padding:0}
  .nav-mob{display:flex}
}
@media (max-width:420px){
  .nav-acties>.nav-in{display:none}
  .nav .knop-klein{white-space:nowrap}
}

/* ingangen op home */
.ingangen{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:clamp(20px,2.5vw,32px)}
.ingang{display:flex;flex-direction:column;gap:8px;padding:22px;border-radius:14px;box-shadow:inset 0 0 0 1px rgba(15,18,24,.13);background:#fff}
.ingang h3{font-size:1.25rem}
.ingang h3 a{text-decoration:none}
.ingang h3 a:hover{text-decoration:underline}
.ingang p{font-size:.9375rem;line-height:1.45;color:var(--op-papier-2)}
.ingang .ingang-links{margin-top:auto;padding-top:10px;display:flex;flex-wrap:wrap;gap:6px 16px;font-weight:600;font-size:.9375rem}
.ingang .ingang-links a{display:inline-flex;align-items:center;min-height:32px}
@media (max-width:1100px){.ingangen{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.ingangen{grid-template-columns:minmax(0,1fr)}}
.tools-alles{margin-top:18px;font-weight:600}

/* overzicht /tools/ */
.vt-groep+.vt-groep{margin-top:clamp(36px,4vw,56px)}
.vt-groep h2{max-width:none;font-size:clamp(1.4rem,2.2vw,1.9rem)}
.vt-groep>p{margin-top:8px;max-width:64ch;color:var(--op-papier-2)}

/* tools in de browser */
.vt-held{padding-bottom:64px}
.vt-binnen{max-width:1312px;margin:0 auto}
.vt-binnen h1{max-width:22ch}
.vt{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(20px,3vw,40px);margin-top:clamp(20px,3vw,36px);align-items:start}
.vt [hidden]{display:none!important}
.vt-nb{white-space:nowrap}
.vt-werk{display:grid;gap:16px}
.vt fieldset{border:0;padding:0;margin:0;min-width:0}
.vt-velden{display:grid;gap:16px;padding:clamp(16px,2vw,24px);border-radius:16px;background:#191D26;box-shadow:0 0 0 1px rgba(255,255,255,.08);min-width:0}
.vt-lab,.vt legend{display:block;margin-bottom:6px;padding:0;font-size:.9375rem;font-weight:600}
.vt input[type=text],.vt input[type=url],.vt input[type=tel],.vt input[type=email],.vt input[type=password],.vt textarea,.vt select{width:100%;min-height:48px;padding:10px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.28);background:#0F1218;color:var(--op-inkt);font:inherit;font-size:1rem}
.vt textarea{min-height:96px;resize:vertical}
.vt input::placeholder,.vt textarea::placeholder{color:#8D93A1}
.vt input:disabled{opacity:.5}
.vt-twee{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.vt-rij{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.vt-seg{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;padding:4px;border-radius:12px;background:#0F1218}
.vt-seg label{position:relative;display:flex;align-items:center;justify-content:center;min-height:44px;padding:4px 6px;border-radius:9px;font-size:.9375rem;font-weight:500;text-align:center;cursor:pointer}
.vt-seg input{position:absolute;inset:0;opacity:0;cursor:pointer}
.vt-seg label:has(input:checked){background:var(--lime);color:var(--inkt);font-weight:600}
.vt-seg label:has(input:focus-visible){outline:3px solid var(--lime);outline-offset:2px}
.vt-kleur{display:flex;align-items:center;gap:10px;min-height:48px;padding:4px 12px 4px 4px;border-radius:10px;border:1px solid rgba(255,255,255,.28);background:#0F1218;cursor:pointer}
.vt-kleur input{width:40px;height:40px;padding:0;border:0;background:none;cursor:pointer;flex:none}
.vt-vink{display:flex;align-items:center;gap:10px;min-height:32px;font-size:.9375rem}
.vt-vink input{width:20px;height:20px;accent-color:var(--lime);flex:none}
.vt-bestand input[type=file]{display:block;width:100%;max-width:100%;font-size:.9375rem;color:var(--op-inkt-2)}
.vt-bestand input[type=file]::file-selector-button{min-height:44px;margin-right:12px;padding:0 14px;border-radius:10px;border:1px solid rgba(255,255,255,.28);background:#232833;color:var(--op-inkt);font:inherit;font-weight:600;cursor:pointer}
.vt-klein{font-size:.875rem;line-height:1.4;color:var(--op-inkt-2)}
.vt-logoregel{display:flex;align-items:center;gap:10px;margin-top:6px;font-size:.875rem;overflow-wrap:anywhere}
.vt-logoregel button{min-height:36px;padding:0 10px;border-radius:8px;text-decoration:underline}
.vt-uitkomst{display:grid;gap:14px;min-width:0;position:sticky;top:90px}
.vt-voorbeeld{width:min(100%,420px);margin-inline:auto;aspect-ratio:1;border-radius:14px;overflow:hidden;background:#fff}
.vt-voorbeeld svg{display:block;width:100%;height:100%}
.vt-leeg .vt-voorbeeld{opacity:.32}
.vt-inhoud{min-height:1.4em;text-align:center;overflow-wrap:anywhere}
.vt-melding{padding:10px 14px;border-radius:10px;font-size:.9375rem;line-height:1.4;background:#2A2F3A}
.vt-melding[data-ernst=let]{background:#3C3214;color:#FFE9A8}
.vt-melding[data-ernst=fout]{background:#46201A;color:#FFD3C9}
.vt-knoppen{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.vt-knoppen .knop{width:100%;justify-content:center;padding-inline:12px}
.vt .knop:disabled{opacity:.4;cursor:not-allowed}
.vt-knop{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 16px;border-radius:10px;background:var(--lime);color:var(--inkt);font-weight:600;flex:none}
.vt-knop:hover{background:#DFFF66}
.vt-knop-klein{min-height:40px;padding:0 12px;font-size:.9375rem}
.vt-tweede{background:#232833;color:var(--op-inkt)}
.vt-tweede:hover{background:#2F3542}
.vt .zekerheid{margin-top:0}
.vt-resultaten{display:grid;gap:10px}
.vt-resultaten li{display:grid;grid-template-columns:72px minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px;border-radius:12px;background:#191D26}
.vt-resultaten img{width:72px;height:72px;object-fit:contain;border-radius:8px;background:#0F1218}
.vt-resultaten b{display:block;font-size:.9375rem;overflow-wrap:anywhere}
.vt-resultaten span{display:block;font-size:.875rem;line-height:1.35;color:var(--op-inkt-2)}
.vt-vinkjes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 12px}
.vt-bronvak{position:relative;width:fit-content;max-width:100%;margin-inline:auto;cursor:crosshair;line-height:0}
.vt-bronvak img{max-height:320px;width:auto;max-width:100%;border-radius:10px}
.vt-punt{position:absolute;width:26px;height:26px;margin:-13px 0 0 -13px;border-radius:50%;border:3px solid var(--lime);box-shadow:0 0 0 2px rgba(0,0,0,.6);pointer-events:none}
.vt-forms{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.vt-forms li{display:flex;flex-direction:column;gap:8px;padding:10px;border-radius:12px;background:#191D26;min-width:0}
.vt-forms canvas{display:block;max-width:100%;max-height:170px;width:auto;height:auto;margin-inline:auto;border-radius:6px}
.vt-forms b{display:block;font-size:.875rem;line-height:1.25}
.vt-forms span{display:block;font-size:.8125rem;color:var(--op-inkt-2)}
.vt-forms .vt-knop{margin-top:auto}
.vt-breed{grid-template-columns:minmax(0,1fr)}
.vt-volg{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(20px,3vw,48px);align-items:center}
.vt-volg h2{max-width:22ch}
.vt-volg p{margin-top:12px;max-width:56ch;color:var(--op-papier-2)}
.vt-volg-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.vt-volg-links a{display:inline-flex;align-items:center;min-height:46px;padding:0 16px;border-radius:10px;box-shadow:inset 0 0 0 1px rgba(15,18,24,.25);font-weight:600;text-decoration:none}
.vt-volg-links a:hover{box-shadow:inset 0 0 0 1.5px var(--inkt)}
@media (max-width:960px){
  .vt,.vt-volg{grid-template-columns:minmax(0,1fr)}
  .vt-uitkomst{position:static}
}
@media (max-width:520px){
  .vt-seg{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vt-resultaten li{grid-template-columns:56px minmax(0,1fr)}
  .vt-resultaten img{width:56px;height:56px}
  .vt-resultaten .vt-knop{grid-column:1/-1}
}

/* domeinnaamveld op /website-video/ */
.wv-veld{display:flex;gap:10px;margin-top:28px;max-width:560px}
.wv-veld input{flex:1;min-width:0;min-height:60px;padding:0 16px;border-radius:12px;border:1px solid rgba(255,255,255,.28);background:#191D26;color:var(--op-inkt);font:inherit;font-size:1.0625rem}
.wv-veld input::placeholder{color:#8D93A1}
.wv-veld .knop{flex:none}
@media (max-width:520px){.wv-veld{flex-direction:column}.wv-veld .knop{width:100%;justify-content:center}}

/* aanbodpagina's: het standaard-figure gaf op tablet 20 pixels horizontale scroll */
figure.a-schema-w{margin-inline:0;max-width:100%}

/* het menu heeft nu Voorbeelden, dus de losse kop-link is niet meer nodig en de merknaam past weer */
.nav .nav-acties .bw2-nav-tel{display:none!important}
.nav .merk span{display:inline!important}
/* werkwijze op home: de niet-actieve stappen moeten leesbaar blijven (contrast) */
.stap-lijst li{opacity:.8}
.stap-lijst li.actief{opacity:1}
@media (max-width:520px){.vt-twee:has(.vt-bestand){grid-template-columns:minmax(0,1fr)}}
