/* PowerNexx WOW-stijl voor de klantpagina's zonder inlog (offerte, factuur, werkbon, storing,
   onderweg, akkoord ...). Laadt na app.css en basis.css en legt zich over de bestaande klassen
   heen; de opbouw van de pagina's zelf blijft gelijk. 04-10-2026. */

html[data-wow] body.pub-body { background: var(--papier); padding-top: 0; font-size: 16px; line-height: 1.55; color: var(--tekst); }
html[data-wow] .pub-body a { color: var(--tq-d); }
html[data-wow] .pub-body a:hover { color: var(--tq-dd); }
html[data-wow] .pub-body h1, html[data-wow] .pub-body h2, html[data-wow] .pub-body h3 { font-family: var(--wow-letter); color: var(--inkt); letter-spacing: -.02em; }

.wow-naar-inhoud { position: absolute; left: 12px; top: -60px; background: var(--inkt); color: #fff !important; padding: 10px 14px; border-radius: 8px; z-index: 100; font-weight: 700; }
.wow-naar-inhoud:focus { top: 12px; }

/* ---------- kop: donker turquoise met logo en tekening ---------- */
.wow-kop { background: radial-gradient(120% 140% at 85% 0%, #0E3D3B 0%, var(--diep) 45%, var(--diepst) 100%); color: #CFE3E0; position: relative; overflow: hidden; }
.wow-kop::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: linear-gradient(90deg, var(--or) 0 30%, var(--tq) 30% 100%); opacity: .9; }
.wow-kop-binnen, .wow-kop-band { width: 100%; max-width: 1320px; margin: 0 auto; padding-inline: clamp(16px, 4vw, 32px); }
.wow-kop-binnen { display: flex; align-items: center; gap: 16px; min-height: 68px; border-bottom: 1px solid rgba(255,255,255,.08); }
.wow-kop-logo { display: block; flex: none; }
.wow-kop-logo img { display: block; width: 138px; height: auto; }
html[data-wow] .wow-kop-tel { margin-left: auto; color: #fff; font-weight: 700; text-decoration: none; white-space: nowrap; font-size: .95rem; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px; border: 1.5px solid rgba(255,255,255,.22); border-radius: 999px; transition: border-color .2s, background-color .2s; }
html[data-wow] .wow-kop-tel:hover { color: #fff; border-color: var(--tq); background: rgba(18,181,176,.12); }
.wow-kop-tel span { color: #9FC7C3; font-weight: 600; }
.wow-kop-band { display: grid; grid-template-columns: minmax(0, 1fr) 112px; gap: 16px; align-items: end; padding-top: 22px; padding-bottom: 64px; }
.wow-kop-tekst { min-width: 0; padding-bottom: 6px; }
.wow-kop-titel { margin: 10px 0 0; color: #fff; font-weight: 800; font-size: clamp(1.55rem, 4.4vw, 2.6rem); line-height: 1.08; letter-spacing: -.03em; overflow-wrap: anywhere; text-wrap: balance; }
.wow-kop-sub { margin: 8px 0 0; color: #9FC7C3; font-size: .95rem; }
.wow-kop-beeld { width: 112px; justify-self: end; }
.wow-kop-beeld .tk { width: 100%; }

/* ---------- inhoud ---------- */
html[data-wow] .pub-wrap { max-width: 720px; margin: -44px auto 0; padding: 0 clamp(14px, 3vw, 20px) 48px; position: relative; z-index: 2; }
html[data-wow] .pub-wrap:has(.fd) { max-width: 1320px; }
html[data-wow] .pub-wrap:has(.pub-split) { max-width: 1200px; }
html[data-wow] .pub-main { gap: 20px; }

html[data-wow] .pub-kaart, html[data-wow] .pub-form, html[data-wow] .fd-form {
  background: #fff; border: 1px solid var(--lijn); border-radius: 22px;
  box-shadow: 0 1px 2px rgba(20,24,26,.04), 0 30px 60px -40px rgba(20,24,26,.35);
  padding: clamp(20px, 4vw, 36px);
}
html[data-wow] .pub-kaart h1, html[data-wow] .pub-form h1, html[data-wow] .pub-doc-kop h1 { font-size: clamp(1.45rem, 3.2vw, 1.95rem); font-weight: 800; line-height: 1.15; letter-spacing: -.025em; margin: 0 0 6px; }
html[data-wow] .pub-kaart h2 { font-size: 1.3rem; font-weight: 800; }
html[data-wow] .pub-kaart h3, html[data-wow] .pub-form h3 { font-size: 1.08rem; font-weight: 800; }
html[data-wow] .pub-kaart .sub, html[data-wow] .pub-doc-kop .sub { color: var(--zacht); font-size: 1rem; line-height: 1.55; }
html[data-wow] .pub-kaart p { line-height: 1.6; }
html[data-wow] .pub-kaart--rustig { background: var(--papier); border-radius: 16px; box-shadow: none; padding: 18px 20px; }
html[data-wow] .wb-pub-kop { color: var(--tq-dd); font-size: 1rem; font-weight: 800; }

/* ---------- knoppen ---------- */
html[data-wow] .pub-body .ds-c-button {
  min-height: 52px; height: auto; padding: 12px 22px; border-radius: 12px; border: 2px solid transparent;
  font: 700 1rem/1.2 var(--wow-letter); white-space: normal; text-align: center; text-decoration: none;
  transition: transform .25s var(--gemak), background-color .2s, color .2s, border-color .2s, opacity .2s;
}
html[data-wow] .pub-body .ds-c-button:hover { transform: translateY(-2px); text-decoration: none; }
html[data-wow] .pub-body .ds-c-button:active { transform: none; }
html[data-wow] .pub-body .ds-c-button--blue { background: var(--or-d); color: #fff; }
html[data-wow] .pub-body .ds-c-button--blue:hover { background: var(--or-dd); color: #fff; }
html[data-wow] .pub-body .ds-c-button--gray { background: #fff; color: var(--tq-d); border-color: var(--tq-d); }
html[data-wow] .pub-body .ds-c-button--gray:hover { background: var(--tq-l); color: var(--tq-dd); border-color: var(--tq-dd); }
html[data-wow] .pub-body .ds-c-button--red, html[data-wow] .pub-body .ds-c-button--rood { border-color: #E3B4AE; }
html[data-wow] .pub-body .ds-c-button:disabled, html[data-wow] .pub-body .ds-c-button[disabled] { opacity: .45; cursor: not-allowed; transform: none; }
html[data-wow] .pub-body .ds-c-button.sm, html[data-wow] .pub-body .ds-c-button--sm { min-height: 40px; padding: 6px 14px; font-size: .92rem; }
html[data-wow] .pub-body .ds-c-button.block { width: 100%; }
html[data-wow] .pub-betaalknop { background: var(--or-d); color: #fff !important; border-radius: 12px; font-size: 1.1rem; font-weight: 800; padding: 18px; transition: transform .25s var(--gemak), background-color .2s; }
html[data-wow] .pub-betaalknop:hover { background: var(--or-dd); transform: translateY(-2px); }
html[data-wow] .pub-knop { border-radius: 12px; min-height: 48px; font-weight: 700; }

/* ---------- velden ---------- */
html[data-wow] .pub-veld { font-size: .95rem; font-weight: 700; color: var(--inkt); gap: 8px; min-width: 0; }
html[data-wow] .pub-veld-l { font-size: .95rem; font-weight: 700; color: var(--inkt); margin-bottom: 8px; }
html[data-wow] .pub-body .pub-veld input, html[data-wow] .pub-body .pub-veld textarea, html[data-wow] .pub-body .pub-veld select,
html[data-wow] .pub-body .pub-bericht textarea, html[data-wow] .pub-body .fd-opm textarea {
  width: 100%; min-width: 0; border: 1.5px solid var(--lijn-sterk); border-radius: 12px; padding: 14px 16px;
  font: 400 1rem/1.4 var(--wow-letter); color: var(--inkt); background: #fff; transition: border-color .2s, box-shadow .2s;
}
html[data-wow] .pub-body .pub-veld input:focus, html[data-wow] .pub-body .pub-veld textarea:focus, html[data-wow] .pub-body .pub-veld select:focus,
html[data-wow] .pub-body .pub-bericht textarea:focus, html[data-wow] .pub-body .fd-opm textarea:focus {
  outline: none; border-color: var(--tq-d); box-shadow: 0 0 0 4px rgba(8,113,108,.16);
}
html[data-wow] .pub-2col { gap: 14px; }
html[data-wow] .pub-2col > * { min-width: 0; }
html[data-wow] .pub-akkoord { font-size: 1rem; line-height: 1.5; color: var(--inkt); gap: 12px; padding: 14px 16px; border-radius: 14px; background: var(--papier); margin: 14px 0 18px; }
html[data-wow] .pub-akkoord input, html[data-wow] .pub-radio input, html[data-wow] .pub-optie input { width: 22px; height: 22px; accent-color: var(--tq-d); flex: none; }
html[data-wow] .pub-radio { border: 1.5px solid var(--lijn); border-radius: 14px; padding: 14px 16px; min-height: 52px; font-size: 1rem; }
html[data-wow] .pub-radio:has(input:checked) { border-color: var(--tq-d); background: var(--tq-l); }

/* handtekening: wit vlak met een stippellijn om op te tekenen */
html[data-wow] .handtekening {
  height: 190px; border: 1.5px dashed var(--lijn-sterk); border-radius: 14px; cursor: crosshair;
  background: #fff linear-gradient(to top, transparent 44px, var(--lijn) 44px, var(--lijn) 45.5px, transparent 45.5px);
}
html[data-wow] .handtekening:hover { border-color: var(--tq-d); }
html[data-wow] .pub-wissen { border: 1.5px solid var(--lijn-sterk); border-radius: 10px; padding: 9px 16px; min-height: 42px; font: 600 .92rem var(--wow-letter); color: var(--tekst); background: #fff; }
html[data-wow] .pub-wissen:hover { border-color: var(--tq-d); color: var(--tq-d); }

/* ---------- offerte: twee kolommen ---------- */
html[data-wow] .fd { gap: clamp(18px, 2.4vw, 28px); grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); }
html[data-wow] .fd-pdf, html[data-wow] .pub-pdf { border: 1px solid var(--lijn); border-radius: 22px; box-shadow: 0 1px 2px rgba(20,24,26,.04), 0 30px 60px -40px rgba(20,24,26,.35); background: #fff; top: 16px; }
html[data-wow] .fd-pdf-head { padding: 14px 18px; border-bottom: 1px solid var(--lijn); }
html[data-wow] .fd-pdf-head h2 { font-size: 1.05rem; font-weight: 800; }
html[data-wow] .fd-pdf-pages { color: var(--zacht); font-size: .85rem; }
html[data-wow] .fd-pdf-btn { width: 40px; height: 40px; border-radius: 10px; border: 1.5px solid var(--lijn-sterk); color: var(--inkt); font-size: 1rem; }
html[data-wow] .fd-pdf-btn:hover { border-color: var(--tq-d); color: var(--tq-d); background: var(--tq-l); text-decoration: none; }
html[data-wow] .fd-pdf-canvas, html[data-wow] .fd-pdf-frame { background: #EFEBE5; }
html[data-wow] .fd-pdf-page { border-radius: 6px; box-shadow: 0 12px 30px -18px rgba(20,24,26,.45); }
html[data-wow] .fd-pdf-fallback { border-top: 1px solid var(--lijn); padding: 10px; }
html[data-wow] .fd-pdf-fallback a { color: var(--zacht); }
html[data-wow] .fd-pdf-note { background: var(--or-l); border-bottom: 1px solid #F6CDB3; }
html[data-wow] .fd-pdf-note-ico { background: var(--or-d); }
html[data-wow] .fd-pdf-note-kop { color: var(--or-dd); }

html[data-wow] .pub-vanaan { font-size: .92rem; color: var(--zacht); border-bottom: 1px solid var(--lijn); padding-bottom: 14px; margin-bottom: 18px; }
html[data-wow] .pub-vanaan b { color: var(--inkt); }
html[data-wow] .pub-meta { gap: 6px 18px; font-size: .95rem; margin: 14px 0 18px; padding: 14px 16px; background: var(--papier); border-radius: 14px; }
html[data-wow] .pub-meta dt { color: var(--zacht); }
html[data-wow] .pub-meta dd { color: var(--inkt); font-weight: 700; }

/* de vier stappen */
.wow-stappen { list-style: none; margin: 4px 0 22px; padding: 0; display: grid; gap: 0; counter-reset: none; }
.wow-stappen li { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 12px; position: relative; padding-bottom: 14px; }
.wow-stappen li:last-child { padding-bottom: 0; }
.wow-stappen li:not(:last-child)::before { content: ""; position: absolute; left: 16px; top: 34px; bottom: 2px; width: 2px; background: linear-gradient(var(--lijn-sterk), var(--lijn)); }
.wow-stap-nr { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; font-weight: 800; font-size: .95rem; color: var(--tq-d); background: var(--tq-l); border: 2px solid #fff; box-shadow: 0 0 0 1.5px var(--tq-d); }
.wow-stappen li.nu .wow-stap-nr { background: var(--or-d); color: #fff; box-shadow: 0 0 0 1.5px var(--or-d); }
.wow-stap-tekst { display: grid; gap: 2px; padding-top: 5px; font-size: .93rem; color: var(--zacht); line-height: 1.45; }
.wow-stap-tekst b { color: var(--inkt); font-size: 1rem; }

/* bedragen */
html[data-wow] .fd-bedragen { font-size: 1rem; margin: 6px 0 18px; }
html[data-wow] .fd-bedragen td { padding: 9px 2px; border-bottom: 1px solid var(--lijn); }
html[data-wow] .fd-bedragen tr.fd-tot td { font-size: 1.2rem; font-weight: 800; color: var(--inkt); border-top: 2px solid var(--inkt); padding-top: 12px; }
html[data-wow] .fd-bedragen tr.fd-korting td { color: var(--tq-d); font-weight: 700; }
html[data-wow] .fd-bedragen tr.fd-aanbet td { background: var(--or-l); color: var(--or-dd); border-top: 0; padding-inline: 12px; }
html[data-wow] .fd-bedragen tr.fd-aanbet td:first-child { border-radius: 10px 0 0 10px; }
html[data-wow] .fd-bedragen tr.fd-aanbet td:last-child { border-radius: 0 10px 10px 0; }
html[data-wow] .fd-aanbet-waarom, html[data-wow] .pub-aanbet-waarom { color: var(--zacht); font-size: .92rem; }
html[data-wow] .fd-feest { background: linear-gradient(135deg, var(--tq-d) 0%, var(--diep) 100%); border-radius: 18px; padding: 18px 20px; box-shadow: 0 20px 40px -24px rgba(8,113,108,.6); }
html[data-wow] .fd-feest-toast { background: var(--tq-d); font-family: var(--wow-letter); }

/* stappen in het formulier */
html[data-wow] .teken-stap { border: 1px solid var(--lijn); border-radius: 18px; padding: clamp(16px, 3vw, 22px); margin: 0 0 16px; background: #fff; transition: opacity .3s, filter .3s; }
html[data-wow] .teken-stapkop { gap: 12px; margin: 0 0 14px; }
html[data-wow] .teken-stapkop h3 { font-size: 1.15rem; font-weight: 800; line-height: 1.25; }
html[data-wow] .teken-nr { width: auto; min-width: 34px; height: 34px; padding: 0 8px; border-radius: 999px; background: var(--tq-d); font-size: .9rem; font-weight: 800; letter-spacing: -.01em; }
html[data-wow] .teken-versie { color: var(--zacht); font-size: .8rem; font-weight: 600; }
html[data-wow] .teken-stap.vergrendeld { opacity: .55; filter: grayscale(.4); }
html[data-wow] .teken-stap.vergrendeld .teken-nr { background: var(--zacht); }
html[data-wow] .teken-stap.vergrendeld::after { content: "Rond eerst de stap hierboven af, dan gaat deze open."; color: var(--or-dd); font-size: .9rem; margin-top: 12px; padding: 10px 12px; border-radius: 10px; background: var(--or-l); }
html[lang="en"][data-wow] .teken-stap.vergrendeld::after { content: "Finish the step above first, then this one opens."; }
html[data-wow] .vw-scroll { max-height: 260px; border: 1px solid var(--lijn); border-radius: 14px; padding: 14px 16px; font-size: .92rem; line-height: 1.6; background: var(--papier); color: var(--tekst); }
html[data-wow] .teken-stap--keuze { border-color: #F3C4A6; background: #FFFBF8; }
html[data-wow] .teken-stap--keuze .teken-nr { background: var(--or-d); }
html[data-wow] .teken-stap--betaal { border-color: #A9DDD9; background: #F6FCFB; }
html[data-wow] .keuze-uitleg { color: var(--zacht); font-size: .95rem; line-height: 1.55; margin: 0 0 14px; }
html[data-wow] .keuze-banner { border: 0; border-left: 4px solid var(--or); background: var(--or-l); border-radius: 14px; padding: 14px 18px; margin: 0 0 16px; }
html[data-wow] .keuze-banner b { color: var(--or-dd); font-size: 1rem; }
html[data-wow] .keuze-banner span { color: #6B3A1C; font-size: .93rem; }
html[data-wow] .keuze-banner a { color: var(--or-dd); font-weight: 800; font-size: .95rem; }
html[data-wow] .keuze-status { font-size: .92rem; }
html[data-wow] .keuze-status--ok { color: var(--tq-dd); }
html[data-wow] .keuze-status--todo { color: var(--or-dd); }
html[data-wow] .pub-body .keuze-knop--wacht { background: var(--or-d); border-color: var(--or-d); color: #fff; }
html[data-wow] .pub-opties { background: #fff; border: 1px solid var(--lijn); border-radius: 14px; padding: 6px 16px; }
html[data-wow] .pub-optie { gap: 12px; padding: 12px 0; min-height: 52px; font-size: 1rem; border-bottom: 1px solid var(--lijn); }
html[data-wow] .pub-optie b { color: var(--inkt); white-space: nowrap; }
html[data-wow] .teken-stap--keuze .pub-optie input { accent-color: var(--or-d); width: 22px; height: 22px; }
html[data-wow] .pub-optie-tot { border-top: 0; margin-top: 0; padding: 14px 0 10px; font-size: 1.08rem; color: var(--inkt); }
html[data-wow] .fd-opm-toggle { color: var(--tq-d); font-size: .9rem; text-decoration: underline; text-underline-offset: 3px; }
html[data-wow] .pub-let-op { background: var(--or-l); border: 0; border-radius: 14px; color: #6B3A1C; font-size: .93rem; padding: 14px 16px; }
html[data-wow] .pub-melding { background: var(--or-l); border: 0; border-left: 4px solid var(--or); color: #6B3A1C; border-radius: 12px; font-size: .95rem; padding: 14px 16px; }
html[data-wow] .pub-afwijzen { color: var(--zacht); font-size: .95rem; margin-top: 18px; }
html[data-wow] .pub-afwijzen a { color: var(--tq-d); font-weight: 700; }
html[data-wow] .pub-afwijzen-sub { color: #7A8286; font-size: .85rem; }
html[data-wow] .pub-bericht { border-top: 1px solid var(--lijn); padding-top: 18px; margin-top: 20px; }
html[data-wow] .pub-bericht h3 { font-size: 1.08rem; margin: 0 0 10px; }
html[data-wow] .pub-bericht textarea { margin: 0 0 10px; }
html[data-wow] .pub-kaart + .pub-bericht, html[data-wow] .pub-main > .pub-bericht { background: #fff; border: 1px solid var(--lijn); border-radius: 22px; padding: clamp(20px, 4vw, 30px); margin-top: 0; }
html[data-wow] .fd-contact { gap: 10px; border-top: 1px solid var(--lijn); padding-top: 18px; margin-top: 20px; }
html[data-wow] .fd-contact a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px; border: 1.5px solid var(--lijn); border-radius: 999px; color: var(--inkt); font-size: .95rem; }
html[data-wow] .fd-contact a:hover { border-color: var(--tq-d); color: var(--tq-d); text-decoration: none; }
html[data-wow] .fd-ico { color: var(--tq-d); }

/* gesprek */
html[data-wow] .pub-gesprek { border: 1px solid var(--lijn); border-radius: 18px; background: var(--papier); padding: 16px; }
html[data-wow] .pg-bubble { border-radius: 14px; font-size: .95rem; padding: 10px 14px; }
html[data-wow] .pg-klant { background: var(--tq-l); border-bottom-right-radius: 4px; }
html[data-wow] .pg-pnx { background: #fff; border: 1px solid var(--lijn); border-bottom-left-radius: 4px; }
html[data-wow] .pg-meta { color: var(--zacht); font-size: .78rem; font-weight: 600; }

/* ---------- bevestigd, factuur, werkbon ---------- */
html[data-wow] .pub-ok { text-align: center; }
html[data-wow] .pub-vink { width: 76px; height: 76px; background: var(--tq-l); color: var(--tq-d); font-size: 38px; font-weight: 800; box-shadow: 0 0 0 8px rgba(221,244,242,.5); margin: 4px auto 18px; }
html[data-wow] .pub-ok .sub { max-width: 52ch; margin: 8px auto 20px; }
html[data-wow] .pub-tebetalen { margin: 18px 0; padding: 20px; border-radius: 18px; background: var(--papier); }
html[data-wow] .pub-tebetalen span { color: var(--zacht); font-weight: 600; }
html[data-wow] .pub-tebetalen .bedrag { font-size: clamp(2.3rem, 7vw, 3.1rem); font-weight: 800; color: var(--inkt); letter-spacing: -.03em; }
html[data-wow] .pub-tebetalen .verval { color: var(--zacht); font-size: .92rem; }
html[data-wow] .pub-aanbetaling, html[data-wow] .pub-aanbet { background: var(--papier); border-radius: 16px; padding: 16px 18px; margin: 16px 0; font-size: 1rem; text-align: left; }
html[data-wow] .pub-aanbet h3 { margin: 0 0 6px; }
html[data-wow] .pub-aanbet .fd-bedragen { margin-bottom: 10px; }
html[data-wow] .pub-overmaken { border-top: 1px solid var(--lijn); padding-top: 16px; margin-top: 18px; text-align: left; }
html[data-wow] .pub-overmaken h3 { font-size: 1rem; }
html[data-wow] .pub-overmaken dl { font-size: .98rem; gap: 6px 18px; }
html[data-wow] .pub-overmaken dt { color: var(--zacht); }
html[data-wow] .pub-overmaken .mono, html[data-wow] .pub-body .mono { font-family: var(--wow-letter); font-variant-numeric: tabular-nums; font-weight: 700; letter-spacing: .02em; }
html[data-wow] .pub-bijlagen a { color: var(--tq-d); font-weight: 700; font-size: 1rem; }
html[data-wow] .pub-bijlagen a::before { content: ""; display: inline-block; width: 10px; height: 14px; margin-right: 8px; clip-path: polygon(0 0, 45% 0, 100% 50%, 45% 100%, 0 100%, 55% 50%); background: var(--or); vertical-align: -1px; }
html[data-wow] .pub-bv { border: 1.5px solid var(--lijn); border-radius: 14px; min-height: 56px; }
html[data-wow] .pub-bv:hover { border-color: var(--tq-d); }
html[data-wow] .pub-bv-btn { color: var(--tq-d); font-weight: 700; }
html[data-wow] .pub-vooruit { background: var(--tq-l) !important; border: 0 !important; border-radius: 16px !important; }
html[data-wow] .pub-tekst { font-size: 1rem; color: var(--tekst); }
html[data-wow] .pub-tabel td { border-bottom-color: var(--lijn); }
html[data-wow] .pub-regels td { border-bottom-color: var(--lijn); }
html[data-wow] .pub-tot tr.eind td { border-top-color: var(--inkt); }

/* mijn documenten */
html[data-wow] .portaal-rij { border: 1.5px solid var(--lijn); border-radius: 14px; min-height: 56px; padding: 14px 16px; }
html[data-wow] .portaal-rij:hover { border-color: var(--tq-d); background: var(--tq-l); text-decoration: none; }
html[data-wow] .portaal-rij .pr-nr { font-family: var(--wow-letter); font-weight: 800; }

/* ---------- voet ---------- */
html[data-wow] .pub-foot.wow-voet { margin-top: 0; text-align: left; font-size: .93rem; line-height: 1.6; color: #B9D3D0; background: var(--diep); padding: 40px 0 calc(96px + env(safe-area-inset-bottom, 0px)); border-top: 3px solid var(--tq-d); }
.wow-voet-binnen { width: 100%; max-width: 1320px; margin: 0 auto; padding-inline: clamp(16px, 4vw, 32px); display: grid; gap: 26px; grid-template-columns: 1fr; }
.wow-voet-merk img { width: 130px; height: auto; display: block; margin-bottom: 10px; }
.wow-voet-merk p { max-width: 34ch; margin: 0; }
.wow-voet-kol { display: grid; gap: 2px; align-content: start; }
.wow-voet-kol b { color: #fff; font-size: .82rem; text-transform: uppercase; letter-spacing: .08em; margin-bottom: 6px; }
html[data-wow] .wow-voet a { color: #fff; text-decoration: none; width: fit-content; }
html[data-wow] .wow-voet a:hover { color: #7FE0DB; text-decoration: underline; }

/* ---------- mobiel en groter ---------- */
@media (max-width: 1024px) {
  html[data-wow] .pub-wrap:has(.fd) { max-width: 720px; }
  html[data-wow] .fd { grid-template-columns: minmax(0, 1fr); }
  html[data-wow] .fd-pdf-canvas, html[data-wow] .fd-pdf-frame { height: 70vh; min-height: 460px; }
  html[data-wow] .fd-mobilebar { background: rgba(255,255,255,.97); backdrop-filter: blur(8px); border-top: 1px solid var(--lijn); margin: 18px calc(-1 * clamp(14px, 3vw, 20px)) 0; padding: 10px clamp(14px, 3vw, 20px) calc(10px + env(safe-area-inset-bottom, 0px)); box-shadow: 0 -10px 30px -18px rgba(20,24,26,.35); }
  html[data-wow] .fd-mobilebar .ds-c-button { flex: 1; }
  html[data-wow] .fd-mob-link { color: var(--tq-d); font-weight: 700; min-height: 44px; display: inline-flex; align-items: center; }
}
@media (max-width: 520px) {
  .wow-kop-logo img { width: 116px; }
  .wow-kop-tel span { display: none; }
  html[data-wow] .wow-kop-tel { padding: 0 12px; font-size: .9rem; }
  .wow-kop-band { grid-template-columns: minmax(0, 1fr) 84px; padding-top: 16px; padding-bottom: 58px; }
  .wow-kop-beeld { width: 84px; }
  html[data-wow] .pub-kaart, html[data-wow] .pub-form { border-radius: 18px; }
  html[data-wow] .pub-meta { grid-template-columns: auto minmax(0, 1fr); }
}
@media (min-width: 700px) {
  .wow-voet-binnen { grid-template-columns: 1.4fr 1fr 1fr 1fr; }
  html[data-wow] .pub-foot.wow-voet { padding-bottom: 40px; }
}
@media (min-width: 900px) {
  .wow-kop-band { grid-template-columns: minmax(0, 1fr) 150px; }
  .wow-kop-beeld { width: 150px; }
}
@media print {
  .wow-kop, .wow-voet, .fd-mobilebar { display: none !important; }
  html[data-wow] .pub-wrap { margin-top: 0; }
}

/* kop-links wit houden (de algemene linkkleur is turquoise) */
html[data-wow] .wow-kop a.wow-kop-tel, html[data-wow] .wow-kop a.wow-kop-tel:hover { color: #fff; }
html[data-wow] .fd-pdf-head h2 { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html[data-wow] .fd-pdf-tools { flex: none; }
@media (max-width: 520px) { html[data-wow] .fd-pdf-pages { display: none; } }

/* Eigen pagina-opmaak (storing melden, onderweg ...) zet soms een eigen letter; overal Jakarta. */
html[data-wow] .pub-main :where(div, form, section, article, p, label, input, textarea, select, button, h1, h2, h3, h4, li, dt, dd, td, th, legend, fieldset) { font-family: var(--wow-letter); }
html[data-wow] .wow-los > form, html[data-wow] .wow-los > div { max-width: none; }
html[data-wow] .pub-main ::placeholder { font-weight: 400; color: #8A9195; }
html[data-wow] .pub-main input[type="radio"], html[data-wow] .pub-main input[type="checkbox"] { width: 22px; height: 22px; accent-color: var(--tq-d); flex: none; }
html[data-wow] #datum h2 { font-size: 1.2rem !important; font-weight: 800; }
html[data-wow] #datum form .ds-c-button { flex: 1 1 150px; }
/* Lange omschrijving van een optie mag de prijs niet uit het vak duwen (mobiel). */
html[data-wow] .pub-optie span { min-width: 0; overflow-wrap: anywhere; hyphens: auto; }
@media (max-width: 480px) { html[data-wow] .pub-opties { padding: 4px 12px; } html[data-wow] .pub-optie { gap: 10px; } }