/*
Theme Name: Webwinkel Basis
Author: Hendesign
Description: Algemeen blokthema voor websites en webshops. Kies een branche (Website beheer > Huisstijl en branche) en het thema vult kleuren, teksten, categorieën, veelgestelde vragen, homepage en werkgebied in. Met paginakop met foto op elke pagina, kant-en-klare blokken (Patronen > Webwinkel blokken), uitlijning en ruimte per blok, schakelaar incl./excl. BTW, offerte- en contactformulier, projecten en zoekfunctie. Werkt samen met de plug-in Webshop Basis.
Version: 25.19.0
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: webwinkel
*/

/* =====================================================================
   Ontwerp 25
   Rustig en technisch: grote foto's met een donkere verloop, kleine labels boven koppen, veel witruimte,
   kaarten met zachte schaduw en duidelijke knoppen. Kleuren komen uit Website beheer > Huisstijl en branche.
   ===================================================================== */
:root, body { /* body: in WordPress 6.5 staan de kleurvariabelen op body, vanaf 6.6 op :root */
  --sv-ink: var(--wp--preset--color--inkt);
  --sv-bos: var(--wp--preset--color--bos);
  --sv-mos: var(--wp--preset--color--mos);
  --sv-lime: var(--wp--preset--color--lime);
  --sv-salie: var(--wp--preset--color--salie);
  --sv-papier: var(--wp--preset--color--papier);
  --sv-wit: var(--wp--preset--color--wit);
  --sv-lijn: var(--wp--preset--color--lijn);
  --sv-grijs: var(--wp--preset--color--grijs);
  --ww-licht: var(--ww-accent-licht, #46b969);
  --ww-zacht: var(--ww-accent-zacht, #e8f5ec);
  --sv-r: 16px;
  /* Vorm van knoppen per soort (--ww-r-knop, -winkel, -zoek, -chip, -veld, -ico, -btw, -cookie): Website beheer > Huisstijl en branche */
  --ww-schaduw: 0 1px 2px rgba(16, 18, 20, .04), 0 8px 24px rgba(16, 18, 20, .06);
  --ww-schaduw-hoog: 0 2px 4px rgba(16, 18, 20, .05), 0 18px 44px rgba(16, 18, 20, .12);
  --ww-max: 1200px;
  /* "In winkelwagen"-knop in de winkel: lichtgroen met een groen icoon */
  --kw-winkelknop-bg: var(--ww-accent-zacht, #e6f4ea);
  --kw-winkelknop-kleur: var(--wp--preset--color--mos, #2a984c);
  --kw-winkelknop-rand: color-mix(in srgb, var(--wp--preset--color--mos, #2a984c) 25%, transparent);
}

body { -webkit-font-smoothing: antialiased; }
a { text-underline-offset: .22em; text-decoration-thickness: 1px; text-decoration-color: var(--sv-mos); }
a:hover { color: var(--sv-mos); }
:focus-visible { outline: 3px solid var(--sv-mos); outline-offset: 3px; }
h1, h2, h3 { text-wrap: balance; }
p { text-wrap: pretty; }
img { max-width: 100%; height: auto; }
.wp-site-blocks > header + * { margin-block-start: 0; }
.wp-site-blocks > footer { margin-block-start: 0; }
.wp-block-post-content :is(h1, h2, h3, h4, h5, h6) br { display: none; }
.screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important; }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }

/* Tekst in pagina's in het lettertype van het thema, ook als er tekst uit Word is geplakt. */
.wp-block-post-content :is(p, li, td, th, blockquote):not(.wp-block-button__link, .button, .kw-soldout, .kw-catcount):not(:is(.kw-assortiment, .woocommerce, .wp-block-buttons) *) { font-family: var(--wp--preset--font-family--tekst); }
.wp-block-post-content :is(h2, h3, h4, h5, h6):not(:is(.kw-assortiment, .woocommerce) *) { font-family: var(--wp--preset--font-family--kop); }

/* ---------- Knoppen ---------- */
.wp-block-button__link, .wp-element-button, .sv-form button, .kw-btw-knop, .sv-chip, .sv-nav a, .sv-strip, .sv-zoekbalk { font-family: var(--wp--preset--font-family--menu); }
.wp-block-button__link, .wp-element-button { border-radius: var(--ww-r-knop, 0px) !important; font-weight: 600; padding: .85rem 1.5rem; transition: background-color .15s ease, color .15s ease, border-color .15s ease, transform .15s ease; }
.wp-block-button__link:hover, .wp-element-button:hover { background-color: var(--sv-bos) !important; color: #fff !important; }
.wp-block-button__link:active { transform: translateY(1px); }
.wp-block-button.is-style-outline .wp-block-button__link { background: transparent; color: var(--sv-ink); border: 2px solid currentColor; padding: calc(.85rem - 2px) calc(1.5rem - 2px); }
.wp-block-button.is-style-outline .wp-block-button__link:hover { background: var(--sv-ink) !important; border-color: var(--sv-ink); color: #fff !important; }
.sv-btn-light .wp-block-button__link { color: #fff !important; border-color: rgba(255,255,255,.65) !important; background: transparent; }
.sv-btn-light .wp-block-button__link:hover { background: #fff !important; color: var(--sv-bos) !important; border-color: #fff !important; }
:is(.ww-hero, .ww-cta, .ww-sectie--donker, .sv-donker) .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover { background: #fff !important; color: var(--sv-bos) !important; }
.ww-knop-link { display: inline-flex; align-items: center; gap: .5rem; font-weight: 600; text-decoration: none; color: var(--sv-ink); font-family: var(--wp--preset--font-family--menu); }
.ww-knop-link::after, .ww-meer a::after { content: ""; width: 1.1em; height: 1.1em; background: currentColor; -webkit-mask: var(--ww-pijl) center / contain no-repeat; mask: var(--ww-pijl) center / contain no-repeat; transition: transform .15s; }
.ww-knop-link:hover::after, .ww-meer a:hover::after { transform: translateX(3px); }
:root, body { --ww-pijl: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E"); }

/* ---------- Header (opbouw zoals Portacon): balk in accentkleur, witte balk met logo/zoeken/winkelwagen, lichte menubalk ---------- */
:root, body { --ww-top-h: 36px; }
.wp-site-blocks > header { position: sticky; top: 0; z-index: 50; }
body.admin-bar .wp-site-blocks > header { top: var(--wp-admin--admin-bar--height, 32px); }
@media (max-width: 600px) { body.admin-bar .wp-site-blocks > header { top: 0; } }
.ww-header { background: #fff; color: var(--sv-ink); box-shadow: 0 1px 0 var(--sv-lijn), 0 6px 18px rgba(16,18,20,.05); }
.ww-header > * + * { margin-block-start: 0 !important; }

/* 1. Bovenste balk */
.ww-top { background: #f2f2f2; color: var(--sv-ink); border-bottom: 1px solid #e3e3e3; font-family: var(--wp--preset--font-family--menu); font-size: .82rem; }
.ww-top-in { box-sizing: border-box; max-width: calc(var(--ww-max) + 2.5rem); margin-inline: auto; padding: 0 1.25rem; min-height: var(--ww-top-h); display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.ww-top a { color: var(--sv-ink); text-decoration: none; }
.ww-top a:hover { color: var(--sv-mos); text-decoration: underline; }
.ww-top-l { display: flex; align-items: center; gap: 1.5rem; min-width: 0; white-space: nowrap; overflow: hidden; }
.ww-top-score { display: inline-flex; align-items: center; gap: .45rem; }
.ww-top-sterren { color: #f5a623; letter-spacing: .05em; font-size: .95rem; }
.ww-top-aantal { color: var(--sv-grijs); }
.ww-top-wa svg { color: #25d366; }
.ww-top-usp { display: inline-block; white-space: nowrap; }
.ww-top-usp::before { content: ""; display: inline-block; vertical-align: -1px; margin-right: .4rem; width: .8rem; height: .8rem; background: var(--sv-mos); -webkit-mask: var(--ww-vink) center / contain no-repeat; mask: var(--ww-vink) center / contain no-repeat; }
.ww-top-usp strong { font-weight: 600; }
.ww-top-r { display: flex; align-items: center; gap: 1.25rem; white-space: nowrap; }
.ww-top-tel { font-weight: 600; }
.ww-top-wa { display: inline-flex; align-items: center; gap: .35rem; font-weight: 600; }
@media (min-width: 1101px) { .ww-top-l .ww-top-usp + .ww-top-usp { display: none; } }
@media (max-width: 1100px) { .ww-top-r a:not(.ww-top-tel):not(.ww-top-wa) { display: none; } }
/* Mobiel: bovenaan de beoordeling van klanten (of het belangrijkste voordeel); bellen staat in de balk eronder */
@media (max-width: 781px) { .ww-top-r { display: none; } .ww-top-in { justify-content: center; } .ww-top-l { justify-content: center; } .ww-top-l .ww-top-usp + .ww-top-usp { display: none; } }

/* 2. Witte balk: logo, zoeken, bellen, account, winkelwagen */
.ww-main { padding: .9rem 1.25rem; }
.ww-main-in { gap: 1.5rem !important; align-items: center; }
.sv-brand { display: inline-flex; align-items: center; text-decoration: none; color: var(--sv-ink); flex: none; }
.sv-brand img { width: auto; height: 56px; display: block; }
.sv-brand span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ww-main-in > .wp-block-html:has(.ww-zoek-kop), .ww-main-in > .ww-zoek-kop { flex: 1 1 auto; min-width: 0; display: flex; justify-content: center; }
.ww-zoek-kop { width: 100%; max-width: 560px; margin: 0; gap: 0; }
.sv-zoekbalk.ww-zoek-kop input[type=search] { padding: .7rem 3.2rem .7rem 1.1rem; border: 1.5px solid var(--sv-lijn); border-radius: var(--ww-r-zoek, 0px); background: var(--sv-papier); font-size: .95rem; }
.sv-zoekbalk.ww-zoek-kop input[type=search]:focus { background: #fff; }
.sv-zoekbalk.ww-zoek-kop button { position: absolute; right: 4px; top: 4px; bottom: 4px; padding: 0 .85rem; border-radius: var(--ww-r-zoek, 0px); background: transparent; color: var(--sv-ink); display: flex; align-items: center; }
.sv-zoekbalk.ww-zoek-kop button:hover { background: var(--sv-mos); color: #fff; }
.ww-acties { display: flex; align-items: center; gap: 1.25rem; flex: none; }
.ww-actie { display: inline-flex; align-items: center; gap: .6rem; text-decoration: none; color: var(--sv-ink); line-height: 1.2; }
.ww-actie-ico { width: 40px; height: 40px; border-radius: var(--ww-r-ico, 999px); display: inline-flex; align-items: center; justify-content: center; background: var(--ww-zacht); color: var(--sv-mos); flex: none; transition: background-color .15s, color .15s; }
.ww-actie:hover .ww-actie-ico { background: var(--sv-mos); color: #fff; }
.ww-actie-tekst strong { display: block; font-family: var(--wp--preset--font-family--menu); font-size: .92rem; font-weight: 600; color: var(--sv-mos); white-space: nowrap; }
.ww-actie-tekst small { display: block; font-size: .78rem; color: var(--sv-grijs); white-space: nowrap; }
.ww-main .kw-cart-wrap { flex: none; color: var(--sv-ink); }
.ww-main .kw-cart-toggle { border: 1.5px solid var(--sv-lijn); border-radius: var(--ww-r-winkel, 999px); }
@media (max-width: 1100px) { .ww-actie-tekst { display: none; } .ww-acties { gap: .6rem; } }
@media (max-width: 781px) {
  .ww-main { padding: .7rem 1rem; }
  .ww-main-in { flex-wrap: wrap !important; gap: .7rem 1rem !important; }
  .ww-main-in > .wp-block-html:has(.ww-zoek-kop), .ww-main-in > .ww-zoek-kop { order: 9; flex-basis: 100%; }
  .ww-zoek-kop { max-width: none; }
  .sv-brand img { height: 44px; }
  .ww-main-in > :first-child { margin-right: auto; }
}

/* 3. Lichte menubalk met categorieën en de schakelaar incl./excl. BTW */
.ww-navbar { background: var(--sv-papier); border-top: 1px solid var(--sv-lijn); padding: 0 1.25rem; }
.ww-navbar-in { gap: 1rem !important; align-items: center; min-height: 46px; }
.ww-nav .wp-block-navigation__container { gap: 0 !important; }
.ww-nav .wp-block-navigation-item__content, .ww-nav a { color: var(--sv-ink); font-family: var(--wp--preset--font-family--menu); font-size: .92rem; font-weight: 500; text-decoration: none; padding: .75rem .7rem; display: block; position: relative; white-space: nowrap; }
.ww-nav .wp-block-navigation-item__content::after { content: ""; position: absolute; left: .7rem; right: .7rem; bottom: 0; height: 3px; border-radius: 3px 3px 0 0; background: var(--sv-mos); transform: scaleX(0); transition: transform .15s; }
.ww-nav .wp-block-navigation-item__content:hover { color: var(--sv-mos); }
.ww-nav .wp-block-navigation-item__content:hover::after, .ww-nav .current-menu-item > .wp-block-navigation-item__content::after, .ww-nav [aria-current="page"]::after { transform: scaleX(1); }
.ww-nav :is(.ww-nav-alle, .ww-nav-gids) .wp-block-navigation-item__content { color: var(--sv-mos); font-weight: 600; }
.ww-nav .wp-block-navigation__container { row-gap: 0 !important; }
.ww-navbar .kw-btw-knop { flex: none; margin-left: auto; background: #fff; border-color: var(--sv-lijn); }
.ww-navbar .kw-btw-knop button[aria-pressed="true"] { background: var(--sv-mos); color: #fff; }
@media (max-width: 599px) { .ww-nav .wp-block-navigation__responsive-container-open { display: inline-flex; } }
.ww-nav .wp-block-navigation__responsive-container-open { align-items: center; gap: .4rem; padding: .55rem 0; color: var(--sv-ink); }
.ww-nav .wp-block-navigation__responsive-container-open::after { content: "Menu"; font-family: var(--wp--preset--font-family--menu); font-weight: 600; font-size: .95rem; }
.ww-nav .wp-block-navigation__responsive-container.is-menu-open { background: #fff; color: var(--sv-ink); padding: 1.25rem; }
.ww-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-size: 1.1rem; padding: .7rem 0; }
.ww-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content::after { display: none; }
.ww-navbar-in > .ww-nav { flex: 1 1 auto; min-width: 0; }
@media (min-width: 1101px) { .ww-nav .wp-block-navigation__container { flex-wrap: wrap; } .ww-nav .wp-block-navigation-item__content { padding: .7rem .55rem; font-size: .9rem; } }
@media (min-width: 600px) and (max-width: 1100px) {
  .ww-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__container { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, #000 92%, transparent); mask-image: linear-gradient(90deg, #000 92%, transparent); }
  .ww-nav .wp-block-navigation__container::-webkit-scrollbar { display: none; }
}
@media (min-width: 600px) and (max-width: 1100px) { .ww-nav .wp-block-navigation-item__content { padding-inline: .5rem; font-size: .88rem; } }

/* Donkere uitvoering van de header (antraciet met donkergrijze menubalk) */
:root, body { --ww-nav-bg: var(--ww-donker-2, #1f1e22); }
.ww-header { background: var(--sv-bos); color: #fff; box-shadow: 0 1px 0 rgba(255,255,255,.06), 0 8px 24px rgba(0,0,0,.18); }
.ww-main { background: var(--sv-bos); }
.ww-main .sv-brand { color: #fff; }
.sv-zoekbalk.ww-zoek-kop input[type=search] { background: rgba(255,255,255,.07); border-color: rgba(255,255,255,.18); color: #fff; }
.sv-zoekbalk.ww-zoek-kop input[type=search]::placeholder { color: rgba(255,255,255,.6); opacity: 1; }
.sv-zoekbalk.ww-zoek-kop input[type=search]:focus { background: rgba(255,255,255,.12); border-color: var(--sv-mos); }
.sv-zoekbalk.ww-zoek-kop button { color: #fff; }
.ww-actie { color: #fff; }
.ww-actie-ico { background: rgba(255,255,255,.08); color: var(--ww-licht); }
.ww-actie-tekst strong { color: #fff; }
.ww-actie-tekst small { color: rgba(255,255,255,.6); }
.ww-main .kw-cart-wrap, .ww-main .kw-cart-wrap a, .ww-main .kw-cart-toggle { color: #fff; }
.ww-main .kw-cart-toggle { border-color: rgba(255,255,255,.18); }
.ww-main .kw-cart-toggle:hover { background: var(--sv-mos); color: #fff; }
.ww-navbar { background: var(--ww-nav-bg); border-top: 1px solid rgba(255,255,255,.07); }
.ww-nav .wp-block-navigation-item__content, .ww-nav a { color: rgba(255,255,255,.88); }
.ww-nav .wp-block-navigation-item__content:hover { color: var(--ww-licht); }
.ww-nav :is(.ww-nav-alle, .ww-nav-gids) .wp-block-navigation-item__content { color: var(--ww-licht); }
.ww-navbar .kw-btw-knop { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.2); color: #fff; }
.ww-nav .wp-block-navigation__responsive-container-open { color: #fff; }
/* Mobiel menu (hamburger): donker scherm met witte, grote links. WordPress zet hier standaard wit neer, dus met !important. */
.ww-nav .wp-block-navigation__responsive-container.is-menu-open { background-color: var(--sv-bos) !important; color: #fff !important; padding: 1.25rem 1.5rem 2rem !important; }
.ww-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 3.5rem; align-items: flex-start; }
.ww-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: 0 !important; width: 100%; }
.ww-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { width: 100%; border-bottom: 1px solid rgba(255,255,255,.1); }
.ww-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { color: #fff !important; font-size: 1.1rem !important; padding: .9rem 0 !important; width: 100%; }
.ww-nav .wp-block-navigation__responsive-container.is-menu-open :is(.ww-nav-alle, .ww-nav-gids) .wp-block-navigation-item__content { color: var(--ww-licht) !important; }
.ww-nav .wp-block-navigation__responsive-container-close { color: #fff !important; top: 1.25rem !important; right: 1.25rem !important; }
.ww-nav .wp-block-navigation__responsive-container-close svg { width: 30px; height: 30px; }
.ww-nav .ww-nav-mobiel { display: none; }
.ww-nav .is-menu-open .ww-nav-mobiel { display: block; }
.ww-nav .is-menu-open .ww-nav-mobiel .wp-block-navigation-item__content { font-size: 1rem !important; color: rgba(255,255,255,.75) !important; }
body:has(.ww-nav .is-menu-open) :is(.kw-wa-zwevend, .kw-floating) { display: none !important; }
.sv-cta { display: none !important; }

/* Zoekbalk */
.sv-zoekbalk { position: relative; display: flex; gap: .5rem; max-width: 720px; margin: 0 auto; }
.sv-zoekbalk input[type=search] { flex: 1; min-width: 0; padding: .85rem 1.25rem; border: 2px solid var(--sv-lijn); border-radius: var(--ww-r-zoek, 0px); font: inherit; background: #fff; color: var(--sv-ink); }
.sv-zoekbalk input[type=search]:focus { outline: 3px solid color-mix(in srgb, var(--sv-mos) 35%, transparent); outline-offset: 0; border-color: var(--sv-mos); }
.sv-zoekbalk button { padding: .85rem 1.6rem; border: 0; border-radius: var(--ww-r-zoek, 0px); background: var(--sv-bos); color: #fff; font: inherit; font-weight: 600; cursor: pointer; }
.sv-zoekbalk button:hover { background: var(--sv-mos); }
.sv-zoek-lijst { position: absolute; z-index: 50; top: calc(100% + 6px); left: 0; right: 0; margin: 0; padding: .35rem; list-style: none; background: #fff; border: 1px solid var(--sv-lijn); border-radius: 14px; box-shadow: var(--ww-schaduw-hoog); text-align: left; max-height: 70vh; overflow: auto; }
.sv-zoek-lijst[hidden] { display: none; }
.sv-zoek-lijst a { display: flex; justify-content: space-between; gap: 1rem; padding: .6rem .9rem; border-radius: 10px; text-decoration: none; color: var(--sv-ink); }
.sv-zoek-lijst a:hover, .sv-zoek-lijst a.is-actief { background: var(--sv-papier); }
.sv-zoek-lijst .m { color: var(--sv-grijs); font-size: .9rem; white-space: nowrap; }
.sv-zoek-lijst .n { font-weight: 600; }
.sv-zoek-alle a { justify-content: center; color: var(--sv-mos); font-weight: 600; border-top: 1px solid var(--sv-lijn); border-radius: 0 0 10px 10px; }
.sv-zoek-geen { padding: .7rem .9rem; color: var(--sv-grijs); }
.sv-zoek-band { background: var(--sv-papier); padding: 1.25rem 1.25rem 1.5rem; text-align: center; }
.sv-zoek-band p { margin: 0 0 .6rem; font-weight: 600; }
.sv-zoek-resultaten { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; gap: .8rem; }
.sv-zoek-resultaten li { display: flex; gap: 1rem; align-items: center; background: #fff; border: 1px solid var(--sv-lijn); border-radius: 14px; padding: .8rem 1rem; }
.sv-zoek-plaat img { display: block; width: 72px; height: 72px; object-fit: cover; border-radius: 10px; }
.sv-zoek-titel { font-weight: 700; font-size: 1.1rem; color: var(--sv-ink); }
.sv-zoek-soort { font-size: .8rem; background: var(--sv-papier); border-radius: 999px; padding: .1rem .6rem; margin-left: .4rem; color: var(--sv-grijs); }
.sv-zoek-prijs { color: var(--sv-mos); font-weight: 600; }
.sv-zoek-resultaten p { margin: .2rem 0 0; color: var(--sv-grijs); }
.sv-zoek-aantal { margin-top: 1rem; }
@media (max-width: 520px) { .sv-zoekbalk button { padding-inline: 1rem; } }
.kw-asscat-desc { display: none; }

/* ---------- Paginakop met foto (op elke pagina) ---------- */
.ww-kop { position: relative; isolation: isolate; display: flex; align-items: flex-end; min-height: clamp(280px, 34vw, 440px); background: var(--sv-bos); color: #fff; overflow: hidden; }
.ww-kop-foto { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.ww-kop::before { content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(90deg, color-mix(in srgb, var(--sv-bos) 92%, transparent) 0%, color-mix(in srgb, var(--sv-bos) 72%, transparent) 45%, color-mix(in srgb, var(--sv-bos) 25%, transparent) 100%),
              linear-gradient(0deg, color-mix(in srgb, var(--sv-bos) 60%, transparent) 0%, transparent 55%); }
.ww-kop::after { content: ""; position: absolute; left: 0; bottom: 0; width: min(28%, 340px); height: 5px; background: var(--sv-mos); }
.ww-kop-in { box-sizing: border-box; width: 100%; max-width: calc(var(--ww-max) + 2.5rem); margin-inline: auto; padding: 5.5rem 1.25rem 3rem; }
.ww-kop-titel { color: #fff; margin: .4rem 0 0; font-size: clamp(2rem, 1.3rem + 2.8vw, 3.4rem); line-height: 1.1; max-width: 22ch; }
.ww-kop-intro { margin: 1rem 0 0; max-width: 40rem; font-size: var(--wp--preset--font-size--groot); color: rgba(255,255,255,.88); line-height: 1.5; }
.ww-kruimel ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .2rem .5rem; font-family: var(--wp--preset--font-family--menu); font-size: .85rem; color: rgba(255,255,255,.75); }
.ww-kruimel li { display: inline-flex; align-items: center; gap: .5rem; }
.ww-kruimel li + li::before { content: ""; width: .4rem; height: .4rem; border-top: 1.5px solid currentColor; border-right: 1.5px solid currentColor; transform: rotate(45deg); opacity: .6; }
.ww-kruimel a { color: #fff; text-decoration: none; }
.ww-kruimel a:hover { color: var(--ww-licht); text-decoration: underline; }
.ww-kruimel [aria-current] { color: var(--ww-licht); }
.ww-kop--klein { min-height: 150px; }
.ww-kop--klein .ww-kop-in { padding-top: 3.5rem; padding-bottom: 1.4rem; }
.sv-content .woocommerce-breadcrumb { display: none; }
@media (max-width: 700px) { .ww-kop { min-height: 260px; } .ww-kop-in { padding-top: 4rem; padding-bottom: 2.2rem; } .ww-kop--klein { min-height: 120px; } }

/* Stroken op de homepage en in pagina's sluiten op elkaar aan (zonder witte naad); per blok blijft "Ruimte boven" werken. */
.wp-block-post-content > .alignfull + .alignfull, main > .alignfull + .alignfull, .wp-block-post-content > .alignfull:first-child { margin-block-start: 0; }
.wp-block-post-content > .alignfull:last-child { margin-block-end: 0; }

/* Inhoud van gewone pagina's */
.sv-content { padding: 3.5rem 1.25rem 5rem; background: var(--sv-papier); }
.sv-content .wp-block-columns { max-width: 1100px; }
.sv-content ul { padding-left: 1.2rem; }
.sv-content li { margin-bottom: .35rem; }
.sv-content .wp-block-post-content > .alignfull:first-child { margin-top: -3.5rem !important; }

/* =====================================================================
   Onderdelen van de homepage en de patronen
   ===================================================================== */

/* Label boven een kop */
.ww-eyebrow { display: flex; align-items: center; gap: .6rem; margin-top: 0 !important; margin-bottom: .35rem !important; font-family: var(--wp--preset--font-family--menu); font-size: .8rem !important; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--sv-mos); }
.ww-eyebrow::before { content: ""; width: 1.6rem; height: 2px; background: currentColor; }
.ww-eyebrow--licht { color: var(--ww-licht); }
.has-text-align-center.ww-eyebrow, .ww-u-midden .ww-eyebrow, .ww-u-midden.ww-eyebrow { justify-content: center; }
.ww-eyebrow + :is(h1, h2, h3) { margin-top: .2rem !important; }

/* Lijst met vinkjes */
.ww-vinkjes { list-style: none; padding: 0 !important; margin: 1.25rem 0; display: grid; gap: .55rem; }
.ww-vinkjes li { position: relative; padding-left: 2rem; margin: 0 !important; }
.ww-vinkjes li::before { content: ""; position: absolute; left: 0; top: .15em; width: 1.3rem; height: 1.3rem; border-radius: 50%; background: var(--ww-zacht); }
.ww-vinkjes li::after { content: ""; position: absolute; left: .3rem; top: calc(.15em + .3rem); width: .7rem; height: .7rem; background: var(--sv-mos); -webkit-mask: var(--ww-vink) center / contain no-repeat; mask: var(--ww-vink) center / contain no-repeat; }
.ww-vinkjes--licht li { color: rgba(255,255,255,.92); }
.ww-vinkjes--licht li::before { background: rgba(255,255,255,.14); }
.ww-vinkjes--licht li::after { background: var(--ww-licht); }
:root, body { --ww-vink: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4 12.5 5 5L20 6.5'/%3E%3C/svg%3E"); }

/* Secties: ruimte, koppen en een vaste breedte */
.ww-sectie.ww-sectie > *:not(.ww-leestekst) { max-width: var(--ww-max); }
.ww-sectie { padding-top: clamp(3.5rem, 2.5rem + 4vw, 6rem) !important; padding-bottom: clamp(3.5rem, 2.5rem + 4vw, 6rem) !important; }
.ww-sectiekop { margin-bottom: 2.25rem; }
.ww-sectiekop .ww-sectie-titel, .ww-sectiekop h2 { margin: 0; font-size: clamp(1.75rem, 1.3rem + 1.6vw, 2.6rem); line-height: 1.15; }
.ww-sectiekop .ww-intro { margin: .9rem 0 0; }
.ww-intro, .sv-intro { color: var(--sv-grijs); max-width: 44rem; font-size: 1.075rem; }
.ww-sectiekop--link { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem 2rem; }
.ww-sectiekop--link > .ww-sectiekop-tekst { flex: 1 1 28rem; }
.ww-meer, .sv-meer { margin: 0 !important; font-weight: 600; font-family: var(--wp--preset--font-family--menu); }
.ww-meer a, .sv-meer a { display: inline-flex; align-items: center; gap: .45rem; color: var(--sv-ink); text-decoration: none; border-bottom: 2px solid var(--sv-mos); padding-bottom: .15rem; }
.ww-meer a:hover, .sv-meer a:hover { color: var(--sv-mos); }
.ww-sectie--donker { color: rgba(255,255,255,.86); }
.ww-sectie--donker :is(h2, h3) { color: #fff; }
.ww-leestekst { max-width: 50rem !important; }
.sv-seo h3 { margin-top: 1.8rem; }
.sv-seo .ww-leestekst p { color: var(--sv-grijs); }

/* Grote kop met foto (blok Omslag) */
.ww-hero.wp-block-cover { padding: clamp(5rem, 3rem + 7vw, 9rem) 1.25rem clamp(6rem, 4rem + 7vw, 10rem); align-items: center; }
.ww-hero .wp-block-cover__background, .ww-cta .wp-block-cover__background { opacity: 1 !important; background: linear-gradient(95deg, color-mix(in srgb, var(--sv-bos) 94%, transparent) 0%, color-mix(in srgb, var(--sv-bos) 78%, transparent) 42%, color-mix(in srgb, var(--sv-bos) 20%, transparent) 100%) !important; }
.ww-hero .wp-block-cover__inner-container { width: 100%; max-width: var(--ww-max) !important; margin-inline: auto; }
.ww-hero-in { max-width: 680px; margin-left: 0 !important; }
.ww-hero-in.ww-u-midden { margin-inline: auto !important; }
.ww-hero-in.ww-u-rechts { margin-left: auto !important; margin-right: 0 !important; }
.ww-hero-titel, .ww-hero h1 { font-size: clamp(2.2rem, 1.2rem + 3.6vw, 4.1rem) !important; line-height: 1.06; letter-spacing: -.02em; margin: .3rem 0 1.25rem; overflow-wrap: normal; hyphens: manual; }
.ww-hero-sub { color: rgba(255,255,255,.88) !important; max-width: 36rem; margin: 0 0 2rem; line-height: 1.55; }
.ww-hero .wp-block-buttons { gap: .75rem; }
.ww-hero .ww-vinkjes { margin-top: 2rem; grid-template-columns: repeat(auto-fit, minmax(14rem, max-content)); gap: .6rem 1.75rem; }
@media (max-width: 420px) { .ww-hero-titel, .ww-hero h1 { font-size: 1.95rem !important; } }

/* Voordelenbalk die over de rand van de foto valt */
.ww-usp-strook { padding-top: 0 !important; padding-bottom: 0 !important; position: relative; z-index: 2; display: flow-root; }
.ww-usp.sv-usp-balk { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); align-items: center; }
.sv-usp-balk { gap: .6rem 2rem !important; padding: 1.1rem 1.5rem; }
.ww-usp.sv-usp-balk { margin-top: -3.25rem !important; border-radius: var(--sv-r); box-shadow: var(--ww-schaduw-hoog); padding: 1.35rem 2rem; }
.sv-usp-balk .sv-usp { margin: 0 !important; font-size: .95rem; padding-left: 1.85rem; position: relative; color: var(--sv-ink); }
.sv-usp-balk .sv-usp::before { content: ""; position: absolute; left: 0; top: .1em; width: 1.3rem; height: 1.3rem; border-radius: 50%; background: var(--sv-mos); }
.sv-usp-balk .sv-usp::after { content: ""; position: absolute; left: .32rem; top: calc(.1em + .32rem); width: .66rem; height: .66rem; background: #fff; -webkit-mask: var(--ww-vink) center / contain no-repeat; mask: var(--ww-vink) center / contain no-repeat; }
.sv-usp-balk strong { font-weight: 600; }
@media (max-width: 781px) { .ww-usp.sv-usp-balk { margin-top: -2rem !important; padding: 1.1rem 1.25rem; justify-content: flex-start !important; } }

/* Categorietegels */
.sv-cats { padding-top: 4.5rem !important; }
.sv-tegels { list-style: none; margin: 0; padding: 0 !important; display: grid; gap: 1.5rem; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: stretch; }
.sv-tegels > li { display: flex; margin: 0 !important; min-width: 0; }
@media (max-width: 960px) { .sv-tegels { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 420px) { .sv-tegels { gap: .9rem; } }
.sv-tegel { box-sizing: border-box; flex: 1; position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: .4rem; width: 100%; padding: 1.5rem 1.4rem 1.3rem; background: var(--sv-wit); border: 1px solid var(--sv-lijn); border-radius: var(--sv-r); text-decoration: none; color: var(--sv-ink); transition: border-color .2s, transform .2s, box-shadow .2s; }
.sv-tegel:hover { border-color: transparent; transform: translateY(-3px); box-shadow: var(--ww-schaduw-hoog); color: var(--sv-ink); }
.sv-tegel::after { content: ""; position: absolute; right: 1.2rem; top: 1.5rem; width: 1.1rem; height: 1.1rem; background: var(--sv-lijn); -webkit-mask: var(--ww-pijl) center / contain no-repeat; mask: var(--ww-pijl) center / contain no-repeat; transition: background-color .2s, transform .2s; }
.sv-tegel:hover::after { background: var(--sv-mos); transform: translateX(3px); }
.sv-tegel-foto { display: block; width: 100%; margin-bottom: .5rem; }
.sv-tegel-foto img { display: block; width: 100%; height: 150px; object-fit: contain; }
.sv-tegel-icoon { position: relative; width: 56px; height: 56px; border-radius: 14px; background: var(--ww-zacht); margin-bottom: .6rem; }
.sv-tegel-naam { font-family: var(--wp--preset--font-family--kop); font-weight: 600; font-size: 1.05rem; line-height: 1.25; padding-right: 1.4rem; }
.sv-tegel-aantal { font-size: .85rem; color: var(--sv-grijs); }
@media (max-width: 420px) { .sv-tegel { padding: 1.1rem 1rem; } .sv-tegel-naam { font-size: .95rem; } }

/* Foto naast tekst (blok Media en tekst) */
.ww-split.wp-block-media-text { gap: 0; grid-template-columns: 50% 1fr; }
.ww-split .wp-block-media-text__media img { width: 100%; aspect-ratio: 5 / 4; height: auto; object-fit: cover; border-radius: calc(var(--sv-r) + 4px); box-shadow: var(--ww-schaduw-hoog); }
.ww-split .wp-block-media-text__content { padding: 0 0 0 clamp(1.5rem, 1rem + 4vw, 5rem); }
.ww-split.has-media-on-the-right .wp-block-media-text__content { padding: 0 clamp(1.5rem, 1rem + 4vw, 5rem) 0 0; }
.ww-split .wp-block-media-text__content h2 { font-size: clamp(1.75rem, 1.3rem + 1.6vw, 2.6rem); line-height: 1.15; margin: .2rem 0 1rem; }
.ww-split .wp-block-media-text__content > p:not(.ww-eyebrow) { color: var(--sv-grijs); }
.ww-split .wp-block-media-text__media { position: relative; }
.ww-split .wp-block-media-text__media::after { content: ""; position: absolute; z-index: -1; left: -1.25rem; bottom: -1.25rem; width: 45%; height: 55%; border-radius: var(--sv-r); background: var(--ww-zacht); }
.ww-split.has-media-on-the-right .wp-block-media-text__media::after { left: auto; right: -1.25rem; }
.ww-sectie--split { isolation: isolate; }
@media (max-width: 600px) {
  .ww-split.wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__content, .ww-split.has-media-on-the-right .wp-block-media-text__content { padding: 2.25rem 0 0; }
  .ww-split .wp-block-media-text__media::after { display: none; }
}

/* Kaartjes met icoon */
.ww-kaarten { gap: 1.25rem !important; }
.ww-kaarten > .wp-block-column { display: flex; }
.ww-kaart { position: relative; flex: 1; background: var(--sv-wit); border: 1px solid var(--sv-lijn); border-radius: var(--sv-r); padding: 2rem 1.75rem 1.85rem; transition: transform .2s, box-shadow .2s; }
.ww-kaart:hover { transform: translateY(-3px); box-shadow: var(--ww-schaduw-hoog); }
.ww-kaart h3 { margin: 1.4rem 0 .5rem; font-size: 1.2rem; }
.ww-kaart p { margin: 0; color: var(--sv-grijs); }
.ww-kaart::before { content: ""; display: block; width: 52px; height: 52px; border-radius: 14px; background: var(--ww-zacht); }
.ww-kaart::after { content: ""; position: absolute; left: calc(1.75rem + 13px); top: calc(2rem + 13px); width: 26px; height: 26px; background: var(--sv-mos); -webkit-mask: var(--ww-ico) center / contain no-repeat; mask: var(--ww-ico) center / contain no-repeat; }
.ww-kaarten--donker .ww-kaart { background: rgba(255,255,255,.045); border-color: rgba(255,255,255,.1); }
.ww-kaarten--donker .ww-kaart:hover { background: rgba(255,255,255,.07); box-shadow: none; }
.ww-kaarten--donker .ww-kaart::before { background: color-mix(in srgb, var(--sv-mos) 22%, transparent); }
.ww-kaarten--donker .ww-kaart::after { background: var(--ww-licht); }
.ww-kaarten--donker .ww-kaart h3 { color: #fff; }
.ww-kaarten--donker .ww-kaart p { color: rgba(255,255,255,.72); }
@media (max-width: 781px) { .ww-kaarten { gap: 1rem !important; } }

/* Oudere kaartjes (sv-card2) in dezelfde stijl */
.sv-cards { padding: 5rem 1.25rem 4.5rem; }
.sv-cards .wp-block-columns { align-items: stretch; }
.sv-cards .wp-block-column { display: flex; }
.sv-card2 { flex: 1; position: relative; background: var(--sv-wit); border: 1px solid var(--sv-lijn); padding: 2rem 1.75rem; border-radius: var(--sv-r); }
.sv-card2::before { content: ""; display: block; width: 52px; height: 52px; border-radius: 14px; background: var(--ww-zacht); margin-bottom: 1.2rem; }
.sv-card2::after { content: ""; position: absolute; left: calc(1.75rem + 13px); top: calc(2rem + 13px); width: 26px; height: 26px; background: var(--sv-mos); -webkit-mask: var(--ww-ico) center / contain no-repeat; mask: var(--ww-ico) center / contain no-repeat; }
.sv-card2 h3 { margin: 0 0 .5rem; }
.sv-card2 p { margin: 0; color: var(--sv-grijs); }
.sv-card2 > .wp-block-html { margin: 0; }

/* Keuzekaarten */
.sv-keuzes { margin-top: 0; gap: 1.25rem !important; }
.sv-keuzes > .wp-block-column { display: flex; }
.sv-keuze { position: relative; flex: 1; background: var(--sv-wit); border-radius: var(--sv-r); padding: 2rem 1.75rem 1.75rem; display: flex; flex-direction: column; box-shadow: var(--ww-schaduw); border-top: 4px solid var(--sv-mos); }
.sv-keuze::before { content: ""; display: block; width: 64px; height: 64px; border-radius: 16px; background: var(--ww-zacht); margin-bottom: 1.1rem; }
.sv-keuze::after { content: ""; position: absolute; left: calc(1.75rem + 14px); top: calc(2rem + 14px); width: 36px; height: 36px; background: var(--sv-mos); -webkit-mask: var(--ww-ico) center / contain no-repeat; mask: var(--ww-ico) center / contain no-repeat; }
.sv-keuze h3 { margin: 0 0 .4rem; font-size: 1.3rem; }
.sv-keuze p { color: var(--sv-grijs); flex: 1; }
.sv-keuze .wp-block-buttons { margin-top: auto; }
.sv-onder { margin-top: 1.75rem; color: var(--sv-grijs); }
.sv-onder a { font-weight: 600; }

/* Pictogrammen: één vorm per naam, ingekleurd met de accentkleur (werkt in elke huisstijl) */
.sv-tegel-icoon::after { content: ""; position: absolute; inset: 14px; background: var(--sv-mos); -webkit-mask: var(--ww-ico) center / contain no-repeat; mask: var(--ww-ico) center / contain no-repeat; }
.sv-ci-doos, .sv-icoon-doos { --ww-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 8 12 3 3 8v8l9 5 9-5z'/%3E%3Cpath d='M3 8l9 5 9-5M12 13v8'/%3E%3C/svg%3E"); }
.sv-ci-draai, .sv-icoon-draai { --ww-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21V4M3 6l8 2v11l-8 2'/%3E%3Cpath d='M21 21V4M21 6l-8 2v11l8 2'/%3E%3C/svg%3E"); }
.sv-ci-onder, .sv-icoon-onder { --ww-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 3v12M20 3v12M4 7h16M8 7v8M12 7v8M16 7v8'/%3E%3Crect x='2' y='17' width='20' height='4' rx='1'/%3E%3C/svg%3E"); }
.sv-ci-schuif, .sv-icoon-schuif { --ww-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 20h20M4 6h11v10H4zM7 6v10M10 6v10M13 6v10'/%3E%3Cpath d='M18 11h4M20 9l2 2-2 2'/%3E%3C/svg%3E"); }
.sv-ci-slagboom, .sv-icoon-slagboom { --ww-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='10' width='4' height='10' rx='1'/%3E%3Cpath d='M7 12h14M10 12v2M14 12v2M18 12v2M2 20h7'/%3E%3C/svg%3E"); }
.sv-ci-toetsen, .sv-icoon-toetsen { --ww-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='2' width='14' height='20' rx='2'/%3E%3Cpath d='M9 7h.01M12 7h.01M15 7h.01M9 11h.01M12 11h.01M15 11h.01M9 15h.01M12 15h.01M15 15h.01'/%3E%3C/svg%3E"); }
.sv-ci-oog, .sv-icoon-oog { --ww-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 12s4-7 11-7 11 7 11 7-4 7-11 7S1 12 1 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E"); }
.sv-ci-zender, .sv-icoon-zender { --ww-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='7' y='6' width='10' height='16' rx='3'/%3E%3Ccircle cx='12' cy='13' r='2'/%3E%3Cpath d='M8.5 3.5a5 5 0 0 1 7 0'/%3E%3C/svg%3E"); }
.sv-ci-poort, .sv-icoon-poort { --ww-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21V8M21 21V8M3 12h18M7 12v9M11 12v9M15 12v9M19 12v9'/%3E%3C/svg%3E"); }
.sv-ci-telefoon, .sv-icoon-telefoon { --ww-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1 1 .4 1.9.7 2.8a2 2 0 0 1-.5 2.1L8 9.9a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.8.7a2 2 0 0 1 1.7 2z'/%3E%3C/svg%3E"); }
.sv-ci-truck, .sv-icoon-truck { --ww-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='1' y='3' width='15' height='13'/%3E%3Cpolygon points='16 8 20 8 23 11 23 16 16 16 16 8'/%3E%3Ccircle cx='5.5' cy='18.5' r='2.5'/%3E%3Ccircle cx='18.5' cy='18.5' r='2.5'/%3E%3C/svg%3E"); }
.sv-ci-pin, .sv-icoon-pin { --ww-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 10c0 7-9 13-9 13S3 17 3 10a9 9 0 0 1 18 0z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E"); }
.sv-ci-schild, .sv-icoon-schild { --ww-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E"); }

/* Projecten */
.ww-projecten { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.25rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 960px) { .ww-projecten { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .ww-projecten { grid-template-columns: 1fr; } }
.ww-projecten li { margin: 0 !important; }
.ww-project { position: relative; display: block; overflow: hidden; border-radius: var(--sv-r); aspect-ratio: 4 / 3; background: var(--sv-bos); color: #fff; text-decoration: none; isolation: isolate; }
.ww-project-foto, .ww-project-foto img, .ww-project-leeg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; z-index: -2; transition: transform .5s ease; }
.ww-project-leeg { background: linear-gradient(135deg, var(--sv-bos), color-mix(in srgb, var(--sv-mos) 45%, var(--sv-bos))); }
.ww-project::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, color-mix(in srgb, var(--sv-bos) 92%, transparent) 0%, color-mix(in srgb, var(--sv-bos) 30%, transparent) 55%, transparent 100%); }
.ww-project:hover .ww-project-foto img { transform: scale(1.05); }
.ww-project-tekst { position: absolute; left: 0; right: 0; bottom: 0; padding: 1.4rem 1.5rem; display: flex; flex-direction: column; gap: .2rem; }
.ww-project-plaats { font-family: var(--wp--preset--font-family--menu); font-size: .78rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--ww-licht); }
.ww-project-titel { font-family: var(--wp--preset--font-family--kop); font-weight: 600; font-size: 1.2rem; line-height: 1.25; }
.ww-project-meer { display: inline-flex; align-items: center; gap: .4rem; margin-top: .4rem; font-size: .9rem; color: rgba(255,255,255,.8); }
.ww-project:hover .ww-project-meer { color: #fff; }
.ww-projecten-alle { margin-top: 1.75rem !important; }
.ww-projecten-strook:not(:has(.ww-projecten)) { display: none; }

/* Stappen */
.sv-stappen { margin-top: 0; gap: 1.25rem !important; }
.sv-stap { position: relative; height: 100%; padding: 1.75rem 0 0; border-top: 2px solid var(--sv-lijn); }
.sv-stap::before { content: ""; position: absolute; left: 0; top: -2px; width: 3rem; height: 2px; background: var(--sv-mos); }
.sv-stap-nr { margin: 0 0 .6rem !important; font-family: var(--wp--preset--font-family--menu); font-weight: 600; font-size: 2.4rem !important; line-height: 1; color: var(--sv-mos); }
.sv-stap h3 { margin: 0 0 .4rem; font-size: 1.2rem; }
.sv-stap p:not(.sv-stap-nr) { color: var(--sv-grijs); }

/* Cijfers */
.ww-cijfers { gap: 1.25rem !important; }
.ww-cijfer-blok { border-left: 3px solid var(--sv-mos); padding-left: 1.25rem; }
.ww-cijfer { margin: 0 !important; font-family: var(--wp--preset--font-family--kop); font-weight: 600; font-size: clamp(2.2rem, 1.6rem + 2vw, 3.2rem) !important; line-height: 1; color: var(--sv-ink); }
.ww-cijfer-label { margin: .4rem 0 0 !important; color: var(--sv-grijs); }

/* Merken */
.sv-merken { list-style: none; padding: 0 !important; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 1rem; }
.sv-merken li { margin: 0 !important; display: flex; }
.sv-merken a, .sv-merken li:not(:has(a)) { flex: 1; display: flex; align-items: center; justify-content: center; min-height: 96px; padding: 1rem 1.25rem; border: 1px solid var(--sv-lijn); border-radius: var(--sv-r); text-decoration: none; font-family: var(--wp--preset--font-family--kop); font-weight: 600; font-size: 1.15rem; color: var(--sv-ink); background: var(--sv-wit); text-align: center; transition: box-shadow .2s, color .2s; }
.sv-merken a:hover { box-shadow: var(--ww-schaduw-hoog); color: var(--sv-mos); border-color: transparent; }

/* Reviews en citaat */
.sv-reviews:not(:has(.kw-rev)) { display: none; }
.ww-citaat.wp-block-quote { position: relative; max-width: 52rem; margin-inline: auto; border: 0; padding: 3.5rem 0 0; text-align: center; }
.ww-citaat.wp-block-quote::before { content: "“"; position: absolute; top: -.5rem; left: 50%; transform: translateX(-50%); font-family: Georgia, serif; font-size: 6rem; line-height: 1; color: var(--sv-mos); }
.ww-citaat p { font-family: var(--wp--preset--font-family--kop); font-size: clamp(1.3rem, 1rem + 1.2vw, 1.85rem) !important; line-height: 1.4; color: var(--sv-ink); }
.ww-citaat cite { display: block; margin-top: 1rem; font-style: normal; font-weight: 600; color: var(--sv-grijs); }

/* Veelgestelde vragen naast een inleiding */
.ww-faq-split { gap: clamp(2rem, 1rem + 4vw, 5rem) !important; align-items: flex-start !important; }
.ww-faq-split h2 { font-size: clamp(1.75rem, 1.3rem + 1.6vw, 2.6rem); line-height: 1.15; margin: .2rem 0 1rem; }
.ww-faq-split .wp-block-buttons { gap: .6rem; margin-top: 1.5rem; }
.ww-faq-split .ww-faq { margin: 0; }
@media (min-width: 782px) { .ww-faq-split > .wp-block-column:first-child { position: sticky; top: 8rem; } }

/* Afsluiter met foto */
.ww-cta.wp-block-cover { padding: clamp(4rem, 3rem + 4vw, 7rem) 1.25rem; }
.ww-cta .wp-block-cover__inner-container { width: 100%; max-width: var(--ww-max) !important; margin-inline: auto; }
.ww-cta-in { max-width: 640px; margin-left: 0 !important; }
.ww-cta-in.ww-u-midden { margin-inline: auto !important; }
.ww-cta h2 { font-size: clamp(1.9rem, 1.3rem + 2vw, 2.9rem); line-height: 1.12; margin: .2rem 0 1rem; }
.ww-cta-tekst { color: rgba(255,255,255,.86) !important; margin-bottom: 1.75rem; max-width: 34rem; }
.sv-donker .wp-block-button__link:hover { background: #fff !important; color: var(--sv-bos) !important; }

/* Contact en openingstijden */
.sv-visit { scroll-margin-top: 6rem; }
.ww-info-rij { gap: 1.25rem !important; margin-top: 2rem !important; }
.sv-card { background: var(--sv-wit); color: var(--sv-ink); border-radius: var(--sv-r); padding: 1.85rem; height: 100%; border: 1px solid var(--sv-lijn); }
.sv-card h3 { margin-top: 0; font-size: 1.15rem; }
.sv-hours { width: 100%; border-collapse: collapse; }
.sv-hours td { padding: .5rem 0; border-bottom: 1px solid var(--sv-lijn); }
.sv-hours tr:last-child td { border-bottom: 0; }
.sv-hours td:last-child { text-align: right; font-weight: 600; }
.sv-list { list-style: none; padding: 0; margin: 0; }
.sv-list li { padding: .6rem 0; border-bottom: 1px solid var(--sv-lijn); }
.sv-list li:last-child { border-bottom: 0; }

/* Voordelen (patroon) */
.sv-voordeel { border-left: 3px solid var(--sv-mos); padding-left: 1.1rem; }
.sv-voordelen strong { font-family: var(--wp--preset--font-family--kop); }

/* Producten van WooCommerce op de homepage */
.sv-producten ul.products { margin-top: 0 !important; }
.sv-populair:not(:has(.products)) { display: none; }

/* Oudere onderdelen (pagina's van vóór versie 25 blijven er netjes uitzien) */
.sv-bar-title { display: flex; align-items: center; gap: .9rem; }
.sv-bar-title::before { content: ""; flex: none; width: 5px; height: 1em; border-radius: 3px; background: var(--sv-mos); }
.ww-sectiekop .sv-bar-title::before { display: none; }
.sv-row p { color: var(--sv-grijs); max-width: 30rem; }
.sv-panel { position: relative; overflow: hidden; border-radius: var(--sv-r); min-height: 340px; display: flex; align-items: center; justify-content: center; background: var(--sv-salie); }
.sv-panel img { position: relative; z-index: 1; max-width: 100%; height: auto; }
.sv-panel:has(.sv-photo:not([data-vast])) { min-height: 0; display: block; }
.sv-panel .sv-photo { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; border-radius: inherit; }
.sv-panel .sv-photo:not([data-vast]) { position: static; display: block; width: 100%; height: auto; max-height: 520px; object-fit: cover; }
.sv-panel > p { margin: 0; }
.sv-panel--lime { background: var(--ww-zacht); }
.sv-panel--bos { background: var(--sv-bos); }
.sv-ghost { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; margin: 0; font-family: var(--wp--preset--font-family--kop); font-weight: 600; font-size: clamp(3rem, 2rem + 5vw, 6rem); color: rgba(17,16,19,.1); line-height: 1; pointer-events: none; user-select: none; }
.sv-visit-photo { margin: 0 0 2rem; }
.sv-visit-photo img { display: block; width: 100%; height: auto; aspect-ratio: 21 / 9; object-fit: cover; border-radius: var(--sv-r); }
.sv-foto-rond img { width: 100%; height: auto; border-radius: var(--sv-r); display: block; }
.sv-foto-rond { margin: 0; }
.sv-logo-full { display: block; width: 100%; max-width: 440px; height: auto; margin-inline: auto; }
.sv-hero-cover { position: relative; background: var(--sv-bos); color: #fff; padding: 6rem 1.25rem; }
.sv-hero-inner { width: 100%; max-width: var(--ww-max); margin-inline: auto; }
.sv-bar-text { max-width: 34rem; }
@media (min-width: 782px) {
  .sv-row--rev { flex-direction: row-reverse; }
}

/* Chips en categorielijsten */
.sv-chips { list-style: none; display: flex; flex-wrap: wrap; gap: .55rem; margin: 1.25rem 0 0; padding: 0 !important; }
.sv-chips li { margin: 0 !important; }
.sv-chip { display: inline-block; padding: .6rem 1.1rem; border-radius: var(--ww-r-chip, 0px); background: var(--sv-wit); border: 1px solid var(--sv-lijn); color: var(--sv-ink); text-decoration: none; font-weight: 600; font-size: .95rem; transition: all .15s; }
.sv-chip:hover { background: var(--sv-mos); border-color: var(--sv-mos); color: #fff; }

/* ---------- Veelgestelde vragen als uitklapmenu ---------- */
.ww-faq { margin: 2.5rem 0 1rem; }
.ww-faq > h2 { margin: 0 0 1rem; }
.ww-faq details { border: 1px solid var(--sv-lijn); border-radius: 12px; background: var(--sv-wit); margin: 0 0 .65rem !important; transition: box-shadow .2s, border-color .2s; }
.ww-faq details[open] { border-color: transparent; box-shadow: var(--ww-schaduw-hoog); }
.ww-faq summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.1rem 1.25rem; font-family: var(--wp--preset--font-family--kop); font-weight: 600; font-size: 1.04rem; color: var(--sv-ink); }
.ww-faq summary::-webkit-details-marker { display: none; }
.ww-faq summary::after { content: ""; flex: none; width: 1.8rem; height: 1.8rem; border-radius: 50%; background: var(--ww-zacht); transition: transform .2s ease, background-color .2s; }
.ww-faq summary::before { content: ""; position: absolute; right: calc(1.25rem + .45rem); width: .9rem; height: .9rem; background: var(--sv-mos); -webkit-mask: var(--ww-plus) center / contain no-repeat; mask: var(--ww-plus) center / contain no-repeat; z-index: 1; transition: transform .2s; }
.ww-faq summary { position: relative; }
.ww-faq details[open] > summary::before { transform: rotate(45deg); background: #fff; }
.ww-faq details[open] > summary::after { background: var(--sv-mos); }
.ww-faq summary:hover { color: var(--sv-mos); }
.ww-faq summary:focus-visible { outline: 3px solid var(--sv-mos); outline-offset: -3px; border-radius: 12px; }
:root, body { --ww-plus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M12 4v16M4 12h16'/%3E%3C/svg%3E"); }
.ww-faq-antwoord { padding: 0 1.25rem 1.2rem; color: var(--sv-grijs); }
.ww-faq-antwoord p { margin: 0 0 .6rem; }
.ww-faq-antwoord p:last-child { margin-bottom: 0; }
.ww-faq details.wp-block-details > :not(summary) { margin: 0; padding: 0 1.25rem .6rem; color: var(--sv-grijs); }
.ww-faq details.wp-block-details > :last-child { padding-bottom: 1.2rem; }

/* Tekst onder de producten van een categorie */
.ww-cat-onder { margin-top: 3rem; padding-top: 2rem; border-top: 1px solid var(--sv-lijn); max-width: 860px; }
.ww-cat-onder h2 { font-size: var(--wp--preset--font-size--groot); margin: 1.8rem 0 .6rem; }
.ww-cat-onder p, .ww-cat-onder li { color: var(--sv-grijs); }
.ww-cat-links { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.ww-cat-links a { display: inline-block; padding: .5rem .9rem; border: 1px solid var(--sv-lijn); border-radius: var(--ww-r-chip, 0px); text-decoration: none; background: var(--sv-wit); }
.ww-cat-links a:hover { border-color: var(--sv-mos); color: var(--sv-mos); }

/* ---------- Formulieren ---------- */
.sv-form { display: grid; gap: 1.25rem; max-width: 44rem; }
.sv-form .sv-row2 { display: grid; gap: 1.1rem; grid-template-columns: 1fr 1fr; }
.sv-form .sv-row3 { display: grid; gap: 1.1rem; grid-template-columns: 2fr 1fr 1.4fr; }
@media (max-width: 640px) { .sv-form .sv-row2, .sv-form .sv-row3 { grid-template-columns: 1fr; } }
.sv-form label, .sv-form legend { display: block; font-weight: 600; margin-bottom: .35rem; }
.sv-form fieldset { border: 0; padding: 0; margin: 0; }
.sv-form input[type=text], .sv-form input[type=email], .sv-form input[type=tel], .sv-form input[type=date], .sv-form select, .sv-form textarea { width: 100%; padding: .85rem 1rem; font: inherit; color: var(--sv-ink); background: var(--sv-wit); border: 1.5px solid var(--sv-lijn); border-radius: var(--ww-r-veld, 0px); }
.sv-form input:focus, .sv-form select:focus, .sv-form textarea:focus { border-color: var(--sv-mos); outline: 3px solid color-mix(in srgb, var(--sv-mos) 25%, transparent); outline-offset: 0; }
.sv-form textarea { min-height: 8rem; resize: vertical; }
.sv-checks { display: grid; grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr)); gap: .6rem; }
.sv-checks label, .sv-radios label { display: flex; align-items: center; gap: .6rem; margin: 0; font-weight: 400; cursor: pointer; background: var(--sv-wit); border: 1.5px solid var(--sv-lijn); border-radius: var(--ww-r-veld, 0px); padding: .7rem .9rem; }
.sv-checks label:has(input:checked), .sv-radios label:has(input:checked) { border-color: var(--sv-mos); background: var(--ww-zacht); }
.sv-checks input, .sv-radios input { accent-color: var(--sv-mos); width: 1.1rem; height: 1.1rem; }
.sv-radios { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
@media (max-width: 640px) { .sv-radios { grid-template-columns: 1fr; } }
.sv-hint { font-size: .9rem; color: var(--sv-grijs); margin: .25rem 0 0; }
.sv-form .sv-hp { position: absolute; left: -9999px; height: 0; overflow: hidden; }
.sv-form button { justify-self: start; background: var(--sv-mos); color: #fff; border: 0; border-radius: var(--ww-r-knop, 0px); padding: .95rem 2rem; font: inherit; font-weight: 600; cursor: pointer; }
.sv-form button:hover { background: var(--sv-bos); }
.sv-notice { padding: 1rem 1.2rem; border-radius: 12px; margin-bottom: 1.5rem; max-width: 44rem; background: var(--sv-wit); border: 1.5px solid var(--sv-lijn); }
.sv-notice--ok { border-color: var(--sv-mos); background: var(--ww-zacht); }
.sv-notice--err { border-color: #b4472f; background: #fbefec; }
.sv-melding { background: var(--sv-mos); color: #fff; font-weight: 600; text-align: center; padding: .5rem 1.25rem; font-size: .9rem; }
.sv-melding-inline { background: var(--ww-zacht); color: var(--sv-ink); padding: .75rem 1rem; border-radius: 12px; }

/* ---------- Prijslijsten ---------- */
.sv-content .sv-prices table { width: 100%; border-collapse: collapse; background: var(--sv-wit); border-radius: var(--sv-r); overflow: hidden; }
.sv-content .sv-prices td { padding: .7rem 1rem; border: 0; border-bottom: 1px solid var(--sv-lijn); }
.sv-content .sv-prices tr:last-child td { border-bottom: 0; }
.sv-content .sv-prices td:last-child { text-align: right; font-weight: 600; white-space: nowrap; }
.sv-content .sv-prices { margin: 1rem 0 1.25rem; }
@media (max-width: 560px) { .sv-content .sv-prices td:last-child { white-space: normal; } }

/* ---------- Webshop ---------- */
.woocommerce-products-header { display: none; }
.sv-content .woocommerce-ordering select, .sv-content .woocommerce-result-count { font-size: .95rem; }
.sv-content .woocommerce-ordering select { padding: .5rem .8rem; border: 1px solid var(--sv-lijn); border-radius: var(--ww-r-veld, 0px); background: #fff; }
.sv-content .woocommerce-pagination ul { border: 0; display: flex; gap: .4rem; justify-content: center; }
.sv-content .woocommerce-pagination ul li { border: 0; }
.sv-content .woocommerce-pagination ul li a, .sv-content .woocommerce-pagination ul li span { border-radius: 8px; padding: .5rem .9rem; }
.sv-content .woocommerce-pagination ul li span.current { background: var(--sv-bos); color: #fff; }
.woocommerce ul.products li.product, .wc-block-grid__product { background: var(--sv-wit); border: 1px solid var(--sv-lijn); border-radius: var(--sv-r); padding: 1rem 1rem 1.25rem !important; transition: box-shadow .2s, transform .2s; }
.woocommerce ul.products li.product:hover { box-shadow: var(--ww-schaduw-hoog); transform: translateY(-2px); }
.woocommerce ul.products li.product a img { border-radius: 10px; }
.woocommerce ul.products li.product .button { border-radius: var(--ww-r-winkel, 999px); }

/* ---------- Werkgebied: kaartje en plaatsenlijst ---------- */
.sv-kaart-wrap { margin: 1.5rem 0 2rem; }
.sv-kaart { width: 100%; max-width: 640px; height: auto; display: block; margin: 0 auto; background: var(--sv-wit); border-radius: var(--sv-r); border: 1px solid var(--sv-lijn); }
.sv-kaart-ring { fill: color-mix(in srgb, var(--sv-mos) 5%, transparent); stroke: var(--sv-mos); stroke-dasharray: 4 5; stroke-width: 1.2; }
.sv-kaart-km { font: 600 11px Sora, system-ui, sans-serif; fill: var(--sv-mos); text-anchor: middle; }
.sv-kaart-punt { fill: var(--sv-bos); }
.sv-kaart a:hover .sv-kaart-punt { fill: var(--sv-mos); }
.sv-kaart-naam { font: 10px Poppins, system-ui, sans-serif; fill: var(--sv-grijs); }
.sv-kaart a:hover .sv-kaart-naam { fill: var(--sv-ink); font-weight: 600; }
.sv-kaart-basis { fill: var(--sv-mos); stroke: #fff; stroke-width: 3; }
.sv-kaart-basisnaam { font: 600 13px Poppins, system-ui, sans-serif; fill: var(--sv-ink); }
.sv-kaart-wrap figcaption { text-align: center; color: var(--sv-grijs); font-size: .85rem; margin-top: .5rem; }
.sv-plaatsen { list-style: none; padding: 0 !important; display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: .6rem; }
.sv-plaatsen li { background: var(--sv-wit); border: 1px solid var(--sv-lijn); border-radius: 12px; padding: .75rem .95rem; margin: 0 !important; transition: box-shadow .2s; }
.sv-plaatsen li:hover { box-shadow: var(--ww-schaduw); }
.sv-plaatsen a { font-weight: 600; text-decoration: none; }
.sv-plaatsen small { color: var(--sv-grijs); font-size: .8rem !important; line-height: 1.4; display: block; margin-top: .2rem; }
.sv-km { float: right; font-size: .8rem !important; color: var(--sv-mos); font-weight: 600; }

/* ---------- Footer ---------- */
.sv-footer { position: relative; background: var(--sv-bos); color: rgba(255,255,255,.72); margin-top: 0; }
.sv-footer::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: linear-gradient(90deg, var(--sv-mos) 0 28%, transparent 28%); }
.sv-footer a { color: #fff; text-decoration-color: rgba(255,255,255,.3); }
.sv-footer a:hover { color: var(--ww-licht); }
.sv-footer h2, .sv-footer h3 { color: #fff; font-family: var(--wp--preset--font-family--menu); font-size: .85rem !important; letter-spacing: .12em; text-transform: uppercase; }
.sv-footer-logo { display: block; width: 190px; max-width: 100%; height: auto; margin-bottom: 1rem; }
.sv-footer-cats { list-style: none; margin: 0; padding: 0; }
.sv-footer-cats li { margin: 0 0 .4rem; }
.sv-footer-regio { margin-top: 1.5rem; }
.sv-footer > .has-klein-font-size { border-top: 1px solid rgba(255,255,255,.1); padding-top: 1.5rem; margin-top: 2.5rem; color: rgba(255,255,255,.55); }

/* =====================================================================
   Uitlijning en ruimte per blok (rechts in de editor: "Uitlijning en ruimte")
   ===================================================================== */
.ww-u-links { text-align: left !important; }
.ww-u-midden { text-align: center !important; }
.ww-u-rechts { text-align: right !important; }
:is(.ww-u-links, .ww-u-midden, .ww-u-rechts) :is(h1, h2, h3, h4, h5, h6, p, li):not([class*="has-text-align"]) { text-align: inherit; }
.ww-u-links.is-layout-flex, .ww-u-links.wp-block-buttons, .ww-u-links > .wp-block-buttons { justify-content: flex-start !important; }
.ww-u-midden.is-layout-flex, .ww-u-midden.wp-block-buttons, .ww-u-midden > .wp-block-buttons, .ww-u-midden .ww-sectiekop--link { justify-content: center !important; }
.ww-u-rechts.is-layout-flex, .ww-u-rechts.wp-block-buttons, .ww-u-rechts > .wp-block-buttons { justify-content: flex-end !important; }
.ww-u-midden :is(.ww-intro, .sv-intro, .ww-hero-sub, .ww-cta-tekst) { margin-inline: auto; }
.ww-u-rechts :is(.ww-intro, .sv-intro, .ww-hero-sub, .ww-cta-tekst) { margin-left: auto; }
.ww-u-midden .ww-eyebrow, .ww-u-midden.ww-eyebrow { justify-content: center; }
.ww-u-rechts .ww-eyebrow, .ww-u-rechts.ww-eyebrow { justify-content: flex-end; }
.ww-u-midden .ww-vinkjes, .ww-u-midden.ww-vinkjes { justify-content: center; justify-items: center; }
.ww-u-midden .sv-bar-title, .ww-u-midden.sv-bar-title { justify-content: center; }
.ww-u-rechts .sv-bar-title, .ww-u-rechts.sv-bar-title { flex-direction: row-reverse; justify-content: flex-start; }
.wp-block-image.ww-u-midden, .wp-block-image.ww-u-links, .wp-block-image.ww-u-rechts { display: flex; flex-direction: column; }
.wp-block-image.ww-u-midden { align-items: center; margin-inline: auto; }
.wp-block-image.ww-u-rechts { align-items: flex-end; margin-left: auto; }
.wp-block-image.ww-u-links { align-items: flex-start; margin-right: auto; }
.wp-block-columns.ww-u-midden { justify-content: center; }
.wp-block-column.ww-u-midden, .wp-block-group.ww-u-midden { align-items: center; }
.wp-block-cover.ww-u-midden .wp-block-cover__inner-container > *, .wp-block-group.ww-u-midden > :where(:not(.alignfull)) { margin-inline: auto; }

/* Ruimte boven (rb), onder (ro), binnen (rp) en tussen de onderdelen (rt): geen, klein, normaal, groot, extra groot */
.ww-rb-0 { margin-top: 0 !important; } .ww-rb-s { margin-top: .75rem !important; } .ww-rb-m { margin-top: 1.75rem !important; } .ww-rb-l { margin-top: 3.5rem !important; } .ww-rb-xl { margin-top: 6rem !important; }
.ww-ro-0 { margin-bottom: 0 !important; } .ww-ro-s { margin-bottom: .75rem !important; } .ww-ro-m { margin-bottom: 1.75rem !important; } .ww-ro-l { margin-bottom: 3.5rem !important; } .ww-ro-xl { margin-bottom: 6rem !important; }
.ww-rp-0 { padding: 0 !important; } .ww-rp-s { padding: 1rem !important; } .ww-rp-m { padding: 2rem !important; } .ww-rp-l { padding: 4rem clamp(1rem, 4vw, 3rem) !important; } .ww-rp-xl { padding: 7rem clamp(1rem, 5vw, 4rem) !important; }
.alignfull:is(.ww-rp-s, .ww-rp-m, .ww-rp-l, .ww-rp-xl) { padding-inline: max(1.25rem, var(--wp--style--root--padding-left, 1.25rem)) !important; }
.ww-rt-0 { --ww-tussen: 0; } .ww-rt-s { --ww-tussen: .5rem; } .ww-rt-m { --ww-tussen: 1.25rem; } .ww-rt-l { --ww-tussen: 2.5rem; } .ww-rt-xl { --ww-tussen: 4rem; }
[class*="ww-rt-"] { gap: var(--ww-tussen) !important; }
[class*="ww-rt-"] > * + *, [class*="ww-rt-"] > .wp-block-cover__inner-container > * + *, [class*="ww-rt-"] > .wp-block-media-text__content > * + * { margin-block-start: var(--ww-tussen) !important; }
:is(.is-layout-flex, .is-layout-grid, .wp-block-columns)[class*="ww-rt-"] > * + * { margin-block-start: 0 !important; }
.ww-lh-krap, .ww-lh-krap :is(p, li, h1, h2, h3, h4) { line-height: 1.25 !important; }
.ww-lh-normaal, .ww-lh-normaal :is(p, li) { line-height: 1.55 !important; }
.ww-lh-ruim, .ww-lh-ruim :is(p, li) { line-height: 1.85 !important; }
.ww-lh-xruim, .ww-lh-xruim :is(p, li) { line-height: 2.15 !important; }

/* Koppen in de tekst van gewone pagina's iets rustiger */
.sv-content .wp-block-post-content > h2, .sv-content .wp-block-post-content > .wp-block-group > h2 { font-size: clamp(1.6rem, 1.25rem + 1.3vw, 2.25rem); line-height: 1.2; }
.sv-content .wp-block-post-content > h3 { font-size: clamp(1.2rem, 1.05rem + .6vw, 1.5rem); }
.sv-footer h3 { margin-bottom: 1rem !important; }

/* =====================================================================
   Winkelwagen en afrekenen (opbouw zoals Portacon): geen headerfoto, producten links, samenvatting rechts
   ===================================================================== */
.ww-kop-plat { background: #fff; }
.ww-kop-plat .ww-kop-in { padding: 2rem 1.25rem .5rem; }
.ww-kop-plat .ww-kruimel ol { color: var(--sv-grijs); }
.ww-kop-plat .ww-kruimel a { color: var(--sv-grijs); }
.ww-kop-plat .ww-kruimel [aria-current] { color: var(--sv-ink); }
.ww-kop-plat .ww-kop-titel { color: var(--sv-ink); font-size: clamp(1.8rem, 1.4rem + 1.4vw, 2.4rem); margin-top: .6rem; }
.sv-content.ww-winkel-pagina { background: #fff; padding-top: 1.5rem; margin-block-start: 0 !important; }
.ww-winkel-pagina .wp-block-post-content > .woocommerce, .ww-winkel-pagina > .wp-block-post-content, .ww-winkel-pagina .ww-dienst { max-width: var(--ww-max) !important; margin-inline: auto; }
.ww-kop-plat + * { margin-block-start: 0 !important; }

/* ---------- Stappenbalk ---------- */
.ww-stappenbalk { list-style: none; margin: 0 0 1.75rem; padding: 0 !important; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--sv-lijn); border-bottom: 1px solid var(--sv-lijn); }
.ww-stap { margin: 0 !important; padding: .8rem .5rem; text-align: center; font-size: .92rem; color: var(--sv-grijs); position: relative; }
.ww-stap.is-actief { color: var(--sv-ink); font-weight: 600; }
.ww-stap.is-actief::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; background: var(--sv-mos); }
.ww-stap.is-klaar { color: var(--sv-mos); }
@media (max-width: 600px) { .ww-stap { font-size: .75rem; padding: .7rem .2rem; } }

/* Meldingen (bijvoorbeeld "... is toegevoegd aan je winkelwagen") */
.ww-winkel-pagina .woocommerce-message, .ww-winkel-pagina .woocommerce-info, .ww-winkel-pagina .woocommerce-error { margin: 0 0 1.5rem; padding: .9rem 1.1rem; border: 1px solid; border-radius: 0; list-style: none; font-size: .95rem; }
.ww-winkel-pagina .woocommerce-message { background: var(--ww-zacht); border-color: color-mix(in srgb, var(--sv-mos) 45%, transparent); color: var(--sv-ink); }
.ww-winkel-pagina .woocommerce-info { background: var(--sv-papier); border-color: var(--sv-lijn); }
.ww-winkel-pagina .woocommerce-error { background: #fbefec; border-color: #e4b4a8; }
.ww-winkel-pagina :is(.woocommerce-message, .woocommerce-info, .woocommerce-error)::before { display: none; }
.ww-winkel-pagina .woocommerce-message .button { float: right; margin-left: 1rem; }

/* ---------- Winkelwagen: tabel ---------- */
.ww-cart-tabel { width: 100%; border-collapse: collapse !important; border: 0 !important; background: transparent !important; margin: 0 !important; }
.ww-cart-tabel th, .ww-cart-tabel td { border: 0 !important; background: none !important; padding: 1rem .5rem !important; vertical-align: middle; }
.ww-cart-tabel thead th { font-weight: 700; color: var(--sv-ink); font-size: 1rem; padding-top: .5rem !important; padding-bottom: .6rem !important; border-bottom: 1px solid var(--sv-lijn) !important; }
.ww-cart-tabel tbody tr { border-bottom: 1px solid var(--sv-lijn); }
.ww-cart-tabel .product-thumbnail { width: 64px; padding-left: 0 !important; }
.ww-cart-tabel .product-thumbnail img { width: 52px !important; height: 52px !important; object-fit: contain; border: 1px solid var(--sv-lijn); border-radius: 0 !important; background: #fff; display: block; }
.ww-cart-tabel th.product-name { padding-left: 0 !important; }
.ww-cart-tabel td.product-name strong { font-weight: 600; }
.ww-cart-tabel td.product-name a { color: var(--sv-ink); text-decoration: none; }
.ww-cart-tabel td.product-name a:hover { color: var(--sv-mos); }
.ww-cart-tabel .product-quantity { width: 130px; text-align: center !important; }
.ww-cart-tabel :is(.product-price, .product-subtotal) { width: 140px; text-align: right !important; white-space: nowrap; }
.ww-cart-tabel .product-subtotal { padding-right: 0 !important; }
.ww-excl { display: block; margin-top: .15rem; font-size: .78rem; color: var(--sv-grijs); }
.ww-aantal { display: inline-flex; align-items: center; gap: .6rem; }
.ww-aantal .quantity input.qty { width: 3.8rem; height: 2.3rem; padding: 0 .3rem; text-align: center; border: 1px solid var(--sv-lijn); border-radius: var(--ww-r-veld, 0px); }
.ww-aantal .product-remove a.remove { display: inline-flex !important; align-items: center; justify-content: center; width: 22px !important; height: 22px !important; border-radius: 50% !important; background: #c9c9c9 !important; color: #fff !important; font-size: 15px !important; line-height: 1 !important; font-weight: 700; text-decoration: none; }
.ww-aantal .product-remove a.remove:hover { background: #c0392b !important; }
.ww-cart-tabel .ww-cart-labels { margin-top: .35rem; }
.ww-cart-tabel .ww-cart-label { font-size: .72rem; }

.ww-cart-acties { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.25rem 0 0; flex-wrap: wrap; }
.ww-verder { color: var(--sv-mos); text-decoration: none; font-size: .95rem; }
.ww-verder:hover { text-decoration: underline; }
.ww-cart-acties .ww-bijwerken { min-width: 300px; padding: .8rem 1.5rem; background: #fff !important; color: var(--sv-ink) !important; border: 1.5px solid var(--sv-lijn) !important; border-radius: var(--ww-r-knop, 0px) !important; font-weight: 600; cursor: pointer; }
.ww-cart-acties .ww-bijwerken:not(:disabled):hover { border-color: var(--sv-ink) !important; }
.ww-cart-acties .ww-bijwerken:disabled { opacity: .55; cursor: default; }

/* ---------- Winkelwagen: kortingscode links, totalen rechts ---------- */
.ww-cart-onder { display: grid; grid-template-columns: minmax(0, 420px) minmax(0, 1fr) !important; gap: 2rem 4rem; align-items: start; margin: 3rem 0 0 !important; max-width: none !important; float: none !important; width: auto !important; }
.ww-cart-onder::before, .ww-cart-onder::after { display: none !important; }
.ww-cart-onder > .cart_totals { grid-column: 2; width: auto !important; float: none !important; }
.ww-cart-onder > .cross-sells { grid-column: 1 / -1; width: auto !important; float: none !important; }
.ww-kortingscode { border: 1px solid var(--sv-lijn); background: #fff; }
.ww-kc-kop { margin: 0 !important; padding: .8rem 1rem; border-bottom: 1px solid var(--sv-lijn); font-weight: 600; }
.ww-kc-in { display: flex; gap: .6rem; padding: 1rem; }
.ww-kc-in input { flex: 1; min-width: 0; padding: .7rem .8rem; border: 1px solid var(--sv-lijn); border-radius: var(--ww-r-veld, 0px); font: inherit; }
.ww-kc-in .button { padding: .7rem 1rem; background: #fff !important; color: var(--sv-ink) !important; border: 1.5px solid var(--sv-lijn) !important; border-radius: var(--ww-r-knop, 0px) !important; font-weight: 600; cursor: pointer; }
.ww-kc-in .button:hover { border-color: var(--sv-ink) !important; }
.ww-ko-rechts .ww-kc-in { padding: 0; }

.ww-totalen { width: 100%; border: 0 !important; border-collapse: collapse; margin: 0 !important; background: transparent !important; }
.ww-totalen th, .ww-totalen td { border: 0 !important; padding: .3rem 0 !important; background: none !important; font-size: .98rem; vertical-align: baseline; }
.ww-totalen th { text-align: right !important; font-weight: 600; padding-right: 2.5rem !important; }
.ww-totalen td { text-align: right !important; width: 1%; white-space: nowrap; }
.ww-totalen tr.cart-subtotal td { font-weight: 700; }
.ww-totalen tr.ww-btw th, .ww-totalen tr.ww-btw td, .ww-totalen tr.shipping th { font-weight: 400; }
.ww-totalen tr.order-total th, .ww-totalen tr.order-total td { font-size: 1.3rem !important; font-weight: 700; padding-top: 1.1rem !important; border-top: 1px solid var(--sv-lijn) !important; }
.ww-totalen tr.order-total th { position: relative; }
.ww-totalen .ww-later { color: var(--sv-grijs); font-size: .9rem; }
.ww-totalen .woocommerce-remove-coupon { font-size: .8rem; margin-left: .3rem; }
.ww-cart-onder .wc-proceed-to-checkout { display: flex; flex-direction: column; align-items: flex-end; gap: .6rem; padding: 1.4rem 0 0 !important; }
.ww-cart-onder .wc-proceed-to-checkout a.checkout-button { display: inline-flex !important; width: auto !important; margin: 0 !important; padding: 1rem 1.6rem !important; font-size: 1rem !important; font-weight: 600; background: var(--sv-mos) !important; color: #fff !important; border-radius: var(--ww-r-winkel, 6px) !important; text-decoration: none; }
.ww-cart-onder .wc-proceed-to-checkout a.checkout-button:hover { background: var(--sv-bos) !important; }
.ww-cart-onder .wc-proceed-to-checkout a.ww-cart-offerte { display: inline-block; padding: 0; background: none; color: var(--sv-grijs); font-size: .9rem; font-weight: 400; text-decoration: underline; }

@media (max-width: 781px) {
  .ww-cart-tabel thead { display: none; }
  .ww-cart-tabel, .ww-cart-tabel tbody { display: block; }
  .ww-cart-tabel tbody tr.cart_item { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; grid-template-areas: "foto naam naam" "foto aantal sub"; gap: .5rem .75rem; padding: 1rem 0; }
  .ww-cart-tabel td { display: block; padding: 0 !important; text-align: left !important; width: auto !important; }
  .ww-cart-tabel td::before { display: none !important; }
  .ww-cart-tabel .product-thumbnail { grid-area: foto; }
  .ww-cart-tabel .product-thumbnail img { width: 52px !important; height: 52px !important; }
  .ww-cart-tabel .product-name { grid-area: naam; }
  .ww-cart-tabel .product-quantity { grid-area: aantal; }
  .ww-cart-tabel .product-price { display: none !important; }
  .ww-cart-tabel .product-subtotal { grid-area: sub; text-align: right !important; }
  .ww-cart-acties .ww-bijwerken { min-width: 0; width: 100%; }
  .ww-cart-onder { grid-template-columns: minmax(0, 1fr) !important; }
  .ww-cart-onder > .cart_totals { grid-column: 1; grid-row: 1; }
  .ww-totalen th { padding-right: 1rem !important; }
  .ww-cart-onder .wc-proceed-to-checkout { align-items: stretch; }
  .ww-cart-onder .wc-proceed-to-checkout a.checkout-button { justify-content: center; }
}

/* ---------- Afrekenen ---------- */
.woocommerce-checkout .ww-winkel-pagina .woocommerce { max-width: var(--ww-max) !important; }
.ww-ko-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 2.5rem 3.5rem; align-items: start; }
.ww-ko-links, .ww-ko-rechts { min-width: 0; }
.ww-ko-rechts { position: sticky; top: 13rem; }
@media (max-width: 900px) { .ww-ko-grid { grid-template-columns: minmax(0, 1fr); } .ww-ko-rechts { position: static; } }
.ww-ko-blok { margin: 0 0 2rem; }
.ww-ko-kop, .ww-afrekenen .woocommerce-billing-fields > h3 { font-size: 1.1rem !important; font-weight: 700; margin: 0 0 .8rem !important; font-family: var(--wp--preset--font-family--kop); }
.ww-afrekenen #customer_details { width: auto; float: none; }
.ww-afrekenen #customer_details::before, .ww-afrekenen #customer_details::after { display: none; }
.ww-afrekenen .form-row { margin: 0 0 .85rem !important; padding: 0 !important; }
.ww-afrekenen .form-row label { font-size: .9rem; font-weight: 600; margin-bottom: .25rem; display: block; }
.ww-afrekenen .form-row :is(input.input-text, select, textarea) { width: 100%; box-sizing: border-box; padding: .7rem .85rem; border: 1px solid var(--sv-lijn); border-radius: var(--ww-r-veld, 0px); background: #fff; font: inherit; }
.ww-afrekenen .form-row :is(input.input-text, select, textarea):focus { border-color: var(--sv-mos); outline: 2px solid color-mix(in srgb, var(--sv-mos) 25%, transparent); }
.ww-afrekenen .form-row-first, .ww-afrekenen .form-row-last { width: calc(50% - .5rem) !important; }
.ww-afrekenen .form-row-first { float: left; margin-right: 1rem !important; }
.ww-afrekenen .form-row-last { float: left; }
.ww-afrekenen .form-row-wide { clear: both; }
.ww-afrekenen .woocommerce-billing-fields__field-wrapper::after, .ww-afrekenen .woocommerce-shipping-fields__field-wrapper::after { content: ""; display: table; clear: both; }
.ww-afrekenen #ship-to-different-address { font-size: 1rem !important; margin: .5rem 0 .8rem !important; }
.ww-afrekenen #ship-to-different-address label { display: flex; align-items: center; gap: .5rem; font-weight: 600; cursor: pointer; }
.ww-afrekenen .select2-container .select2-selection--single { height: auto; padding: .45rem .5rem; border: 1px solid var(--sv-lijn); border-radius: var(--ww-r-veld, 0px); }

/* Keuzes: verzendmethode en betaalmethode als rijen met een rand */
.ww-keuzelijst, .ww-afrekenen ul.wc_payment_methods { list-style: none; margin: 0 !important; padding: 0 !important; border: 0 !important; display: grid; gap: .5rem; }
.ww-keuzelijst li, .ww-afrekenen ul.wc_payment_methods > li { margin: 0 !important; padding: 0 !important; border: 1px solid var(--sv-lijn); border-radius: var(--ww-r-veld, 0px); background: #fff; }
.ww-keuzelijst label { display: flex; align-items: center; gap: .75rem; padding: .85rem 1rem; cursor: pointer; margin: 0; }
.ww-keuzelijst input[type=radio], .ww-afrekenen ul.wc_payment_methods input[type=radio] { width: 1.05rem; height: 1.05rem; accent-color: var(--sv-mos); margin: 0 !important; flex: none; }
.ww-keuzelijst .ww-keuze-naam { flex: 1; }
.ww-keuzelijst .ww-keuze-prijs { color: var(--sv-ink); }
.ww-keuzelijst li:has(input:checked), .ww-afrekenen ul.wc_payment_methods > li:has(input:checked) { border-color: var(--sv-mos); background: color-mix(in srgb, var(--ww-zacht) 55%, #fff); }
.ww-radio-vast { width: 1.05rem; height: 1.05rem; border-radius: 50%; border: 5px solid var(--sv-mos); flex: none; }
.ww-afrekenen ul.wc_payment_methods > li { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; padding: .85rem 1rem !important; }
.ww-afrekenen ul.wc_payment_methods > li > label { flex: 1; display: flex !important; align-items: center; gap: .65rem; margin: 0 !important; cursor: pointer; font-weight: 400; }
.ww-afrekenen ul.wc_payment_methods > li > label img { order: -1; max-height: 24px; width: auto; margin: 0 !important; float: none !important; }
.ww-afrekenen ul.wc_payment_methods .payment_box { flex-basis: 100%; margin: .3rem 0 0 !important; padding: .7rem .85rem !important; background: var(--sv-papier) !important; color: var(--sv-grijs); font-size: .88rem; border-radius: 0; }
.ww-afrekenen ul.wc_payment_methods .payment_box::before { display: none !important; }
.ww-afrekenen .payment_box p { margin: 0; }
.ww-afrekenen #payment { background: none !important; border-radius: 0 !important; }
.ww-ko-hint { color: var(--sv-grijs); font-size: .92rem; margin: 0; }

/* Rechts: Controleer uw bestelling */
.ww-ko-overzicht { border: 1px solid var(--sv-lijn); background: #fff; }
.ww-ko-producten { width: 100%; border-collapse: collapse; margin: 0 !important; }
.ww-ko-producten th { background: #fafafa; font-size: .82rem; font-weight: 700; text-align: left; padding: .8rem 1rem !important; border-bottom: 1px solid var(--sv-lijn) !important; }
.ww-ko-producten td { padding: .9rem 1rem !important; font-size: .9rem; font-weight: 600; border-bottom: 1px solid var(--sv-lijn) !important; }
.ww-ko-producten .product-quantity, .ww-ko-producten .product-total { text-align: right; white-space: nowrap; width: 1%; }
.ww-ko-producten td.product-quantity { font-weight: 400; color: var(--sv-grijs); }
.ww-ko-producten td.product-total { font-weight: 400; }
.ww-ko-overzicht .ww-totalen { margin: 0 !important; }
.ww-ko-overzicht .ww-totalen tr:first-child th, .ww-ko-overzicht .ww-totalen tr:first-child td { padding-top: 1rem !important; }
.ww-ko-overzicht .ww-totalen th, .ww-ko-overzicht .ww-totalen td { padding-left: 1rem !important; padding-right: 1rem !important; }
.ww-ko-overzicht .ww-totalen th { padding-right: 2.5rem !important; }
.ww-ko-overzicht .ww-totalen tr:last-child th, .ww-ko-overzicht .ww-totalen tr:last-child td { padding-bottom: 1.1rem !important; }
.ww-ko-overzicht .ww-totalen tr.order-total th, .ww-ko-overzicht .ww-totalen tr.order-total td { font-size: 1.1rem !important; }
.ww-ko-veld { margin-top: 1.25rem; }
.ww-ko-veld > label, .ww-ko-opmerking label { display: block; margin-bottom: .35rem; font-size: .95rem; font-weight: 400; }
.ww-ko-opmerking .form-row { margin: 0 !important; }
.ww-ko-opmerking textarea { min-height: 4.5rem; }
.ww-ko-bestel { margin-top: 1.25rem !important; padding: 0 !important; background: none !important; }
.ww-ko-bestel .woocommerce-terms-and-conditions-wrapper { font-size: .92rem; color: var(--sv-ink); }
.ww-ko-bestel .woocommerce-privacy-policy-text p { margin: 0 0 .6rem; }
.ww-ko-bestel #place_order { float: none !important; display: inline-flex; margin-top: .9rem; padding: .95rem 1.8rem !important; font-size: 1.02rem !important; font-weight: 700; background: var(--sv-mos) !important; color: #fff !important; border: 0 !important; border-radius: var(--ww-r-winkel, 6px) !important; cursor: pointer; }
.ww-ko-bestel #place_order:hover { background: var(--sv-bos) !important; }
.woocommerce-checkout .ww-winkel-pagina .woocommerce-form-login-toggle .woocommerce-info { font-size: .9rem; }


/* Onder de winkelwagen: voordelen en "Neem contact op" */
.ww-dienst { margin-top: 3rem; }
.ww-dienst-balk { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 2rem; padding: 1.1rem 1.5rem; background: var(--ww-zacht); }
.ww-dienst-balk ul { list-style: none; margin: 0; padding: 0 !important; display: flex; flex-wrap: wrap; gap: .5rem 2rem; }
.ww-dienst-balk li { margin: 0 !important; position: relative; padding-left: 1.7rem; font-size: .92rem; }
.ww-dienst-balk li::before { content: ""; position: absolute; left: 0; top: .15em; width: 1.15rem; height: 1.15rem; background: var(--sv-mos); border-radius: 3px; }
.ww-dienst-balk li::after { content: ""; position: absolute; left: .25rem; top: calc(.15em + .25rem); width: .65rem; height: .65rem; background: #fff; -webkit-mask: var(--ww-vink) center / contain no-repeat; mask: var(--ww-vink) center / contain no-repeat; }
.ww-dienst-score { color: var(--sv-ink); text-decoration: none; font-size: .92rem; }
.ww-dienst-score span { color: #f5a623; }
.ww-dienst-contact { background: var(--sv-mos); color: #fff; padding: clamp(1.5rem, 1rem + 2vw, 2.5rem); }
.ww-dienst-kop { margin: 0 0 1.25rem; font-family: var(--wp--preset--font-family--kop); font-size: clamp(1.25rem, 1rem + 1vw, 1.6rem); font-weight: 500; color: #fff; }
.ww-dienst-kop strong { color: var(--sv-bos); font-weight: 700; }
.ww-dienst-kaarten { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
@media (max-width: 700px) { .ww-dienst-kaarten { grid-template-columns: 1fr; } }
.ww-dienst-kaart { display: flex; gap: 1rem; align-items: flex-start; background: #fff; color: var(--sv-ink); padding: 1.25rem; }
.ww-dienst-kaart p { margin: 0; font-size: .9rem; color: var(--sv-grijs); }
.ww-dienst-kaart .ww-dienst-titel { font-weight: 600; color: var(--sv-ink); font-size: 1rem; margin-bottom: .25rem; }
.ww-dienst-kaart a { color: var(--sv-ink); }
.ww-dienst-ico { position: relative; flex: none; width: 52px; height: 52px; background: var(--ww-zacht); }
.ww-dienst-ico::after { content: ""; position: absolute; inset: 13px; background: var(--sv-mos); -webkit-mask: var(--ww-ico) center / contain no-repeat; mask: var(--ww-ico) center / contain no-repeat; }

/* Waar we leveren: rustige lijst met plaatsen in kolommen */
.ww-plaatsen-lijst { list-style: none; padding: 0 !important; columns: 4 160px; column-gap: 2rem; margin-top: 1rem; }
.ww-plaatsen-lijst li { margin: 0 0 .35rem !important; break-inside: avoid; }
.ww-plaatsen-lijst a { color: var(--sv-ink); text-decoration: none; font-size: .95rem; }
.ww-plaatsen-lijst a:hover { color: var(--sv-mos); text-decoration: underline; }

/* Keuzehulp op de homepage: donkere strook met foto (de standaard headerfoto uit Huisstijl) en witte kaarten */
.sv-keuzehulp.sv-keuzehulp { position: relative; isolation: isolate; background: var(--sv-bos) var(--ww-foto-sectie, none) center / cover no-repeat !important; color: rgba(255,255,255,.82); }
.sv-keuzehulp::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, color-mix(in srgb, var(--sv-bos) 92%, transparent) 0%, color-mix(in srgb, var(--sv-bos) 78%, transparent) 55%, color-mix(in srgb, var(--sv-bos) 92%, transparent) 100%); }
@media (min-width: 1024px) and (hover: hover) { .sv-keuzehulp.sv-keuzehulp { background-attachment: fixed !important; } }
.sv-keuzehulp :is(h2, .ww-sectie-titel) { color: #fff; }
.sv-keuzehulp .ww-intro, .sv-keuzehulp .sv-intro { color: rgba(255,255,255,.75); }
.sv-keuzehulp .ww-eyebrow { color: var(--ww-licht); }
.sv-keuzehulp .ww-meer a { color: #fff; }
.sv-keuzehulp .ww-meer a:hover { color: var(--ww-licht); }
.sv-keuzehulp .sv-onder { color: rgba(255,255,255,.75); }
.sv-keuzehulp .sv-onder a { color: #fff; }
.sv-keuzehulp .sv-keuze { box-shadow: 0 18px 40px rgba(0,0,0,.25); transition: transform .2s, box-shadow .2s; }
.sv-keuzehulp .sv-keuze:hover { transform: translateY(-4px); box-shadow: 0 24px 50px rgba(0,0,0,.35); }
.sv-keuzehulp .sv-keuze .wp-block-button.is-style-outline .wp-block-button__link { border-color: var(--sv-mos); color: var(--sv-mos); }
.sv-keuzehulp .sv-keuze .wp-block-button.is-style-outline .wp-block-button__link:hover { background: var(--sv-mos) !important; color: #fff !important; }
.sv-keuzehulp .sv-keuze { color: var(--sv-ink); }
.sv-keuzehulp .sv-keuze h3 { color: var(--sv-ink); }

/* Homepage, eerste blok: rustiger. Geen vinkjes in de grote kop; de voordelen staan één keer, in de witte balk,
   als vier rustige kolommen met een dun lijntje ertussen (zonder vinkjes). */
.ww-hero .ww-vinkjes { display: none; }
.ww-hero .wp-block-buttons { margin-bottom: 0; }
.ww-usp.sv-usp-balk { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 0 !important; padding: 1.25rem .5rem !important; }
.ww-usp.sv-usp-balk .sv-usp { padding: .15rem 1.5rem !important; text-align: center; color: var(--sv-grijs); font-size: .92rem; line-height: 1.45; }
.ww-usp.sv-usp-balk .sv-usp + .sv-usp { border-left: 1px solid var(--sv-lijn); }
.ww-usp.sv-usp-balk .sv-usp strong { color: var(--sv-ink); font-weight: 600; }
.ww-usp.sv-usp-balk .sv-usp::before, .ww-usp.sv-usp-balk .sv-usp::after { display: none; }
.ww-usp.sv-usp-balk .sv-usp:nth-child(n+5) { display: none; }
@media (max-width: 781px) {
  .ww-usp.sv-usp-balk { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; padding: .75rem .25rem !important; }
  .ww-usp.sv-usp-balk .sv-usp { padding: .6rem .75rem !important; font-size: .85rem; }
  .ww-usp.sv-usp-balk .sv-usp:nth-child(3) { border-left: 0; }
  .ww-usp.sv-usp-balk .sv-usp:nth-child(n+3) { border-top: 1px solid var(--sv-lijn); }
}

/* Donkerte van de headerfoto (in te stellen per pagina, per categorie en voor de standaardfoto) */
.ww-kop--licht::before { opacity: .55; }
.ww-kop--donker .ww-kop-foto { filter: brightness(.7); }

/* =====================================================================
   Gewone pagina's (zoals Veelgestelde vragen, Over ons, Contact) in de opbouw van Portacon:
   kruimelpad onder de headerfoto, tekst links op één lijn met de header, rechts een vak "Neem contact op"
   ===================================================================== */
main > .sv-content, main > .ww-pagina, .ww-kruimelbalk + * { margin-block-start: 0 !important; }
.ww-kruimelbalk { background: #fff; border-bottom: 1px solid var(--sv-lijn); margin: 0 !important; }
.ww-kruimelbalk-in { box-sizing: border-box; max-width: calc(var(--ww-max) + 2.5rem); margin-inline: auto; padding: .85rem 1.25rem; }
.ww-kruimelbalk .ww-kruimel ol { color: var(--sv-grijs); }
.ww-kruimelbalk .ww-kruimel a { color: var(--sv-grijs); }
.ww-kruimelbalk .ww-kruimel a:hover { color: var(--sv-mos); }
.ww-kruimelbalk .ww-kruimel [aria-current] { color: var(--sv-ink); }
.ww-kop--zonder-kruimel .ww-kop-titel { margin-top: 0; }

.sv-content.ww-pagina { background: #fff; padding: clamp(2rem, 1.5rem + 2vw, 3.5rem) 1.25rem clamp(3rem, 2rem + 3vw, 5rem); }
.ww-pagina-grid { box-sizing: border-box; max-width: var(--ww-max); margin-inline: auto; display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: clamp(2rem, 1rem + 3vw, 4.5rem); align-items: start; }
.ww-pagina-grid > * { margin: 0 !important; }
.ww-pagina-grid:not(:has(.ww-zijbalk)) { grid-template-columns: minmax(0, 1fr); }
/* Tekst links uitgelijnd op de rand van de header, met een prettige leesbreedte */
.ww-pagina-tekst .wp-block-post-content > * { max-width: 800px; margin-left: 0 !important; margin-right: 0 !important; }
.ww-pagina-grid:not(:has(.ww-zijbalk)) .ww-pagina-tekst .wp-block-post-content > * { max-width: 900px; }
.ww-pagina-tekst .wp-block-post-content > :is(.alignwide, .alignfull, .ww-faq, .wp-block-columns, .wp-block-table, .ww-plaatsen-lijst, .sv-kaart-wrap, form, .sv-form) { max-width: none; }
.ww-pagina-tekst .wp-block-post-content > .alignfull { margin-inline: 0 !important; width: auto; }
.ww-pagina-tekst .wp-block-post-content > :first-child { margin-top: 0 !important; }
.ww-pagina-tekst .ww-faq { margin-top: 1.5rem; }
.ww-pagina-tekst h2 { font-size: clamp(1.4rem, 1.15rem + 1vw, 1.9rem); }

/* Zijbalk */
.ww-zijbalk { position: sticky; top: 13rem; display: grid; gap: 1.25rem; }
.ww-zb-contact { background: var(--sv-mos); color: #fff; padding: 1.75rem 1.5rem; }
.ww-zb-kop { margin: 0 0 .4rem !important; font-family: var(--wp--preset--font-family--kop); font-size: 1.3rem; line-height: 1.25; color: #fff; }
.ww-zb-kop strong { color: var(--sv-bos); }
.ww-zb-tekst { margin: 0 0 1.1rem !important; color: rgba(255,255,255,.88); font-size: .95rem; }
.ww-zb-knop { display: flex; align-items: center; gap: .65rem; margin-top: .55rem; padding: .75rem 1rem; background: #fff; color: var(--sv-ink); text-decoration: none; font-weight: 600; font-size: .95rem; border-radius: var(--ww-r-knop, 0px); overflow-wrap: anywhere; transition: background-color .15s, color .15s; }
.ww-zb-knop::before { content: ""; flex: none; width: 1.1rem; height: 1.1rem; background: var(--sv-mos); -webkit-mask: var(--ww-ico) center / contain no-repeat; mask: var(--ww-ico) center / contain no-repeat; }
.ww-zb-knop:hover { background: var(--sv-bos); color: #fff; }
.ww-zb-knop:hover::before { background: #fff; }
.ww-zb-tel { --ww-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1 1 .4 1.9.7 2.8a2 2 0 0 1-.5 2.1L8 9.9a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.8.7a2 2 0 0 1 1.7 2z'/%3E%3C/svg%3E"); }
.ww-zb-mail { --ww-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='m2 6 10 7 10-7'/%3E%3C/svg%3E"); }
.ww-zb-wa { --ww-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21l1.6-4.7A9 9 0 1 1 8 19.7L3 21z'/%3E%3C/svg%3E"); }
.ww-zb-links { background: var(--sv-papier); padding: 1.4rem 1.5rem; }
.ww-zb-titel { margin: 0 0 .6rem !important; font-weight: 600; font-family: var(--wp--preset--font-family--menu); }
.ww-zb-links ul { list-style: none; margin: 0; padding: 0 !important; }
.ww-zb-links li { margin: 0 !important; border-top: 1px solid var(--sv-lijn); }
.ww-zb-links a { display: flex; justify-content: space-between; align-items: center; padding: .6rem 0; color: var(--sv-ink); text-decoration: none; font-size: .95rem; }
.ww-zb-links a::after { content: ""; width: .9rem; height: .9rem; background: currentColor; -webkit-mask: var(--ww-pijl) center / contain no-repeat; mask: var(--ww-pijl) center / contain no-repeat; opacity: .5; }
.ww-zb-links a:hover { color: var(--sv-mos); }
@media (max-width: 960px) {
  .ww-pagina-grid { grid-template-columns: minmax(0, 1fr); }
  .ww-zijbalk { position: static; }
}

/* Afrekenen: de standaard zwevende kolommen van WooCommerce (en van de plug-in) uitzetten; het thema regelt de kolommen */
.ww-afrekenen #customer_details, .ww-afrekenen #order_review, .ww-afrekenen #order_review_heading, .ww-afrekenen .woocommerce-billing-fields, .ww-afrekenen .woocommerce-shipping-fields, .ww-afrekenen .woocommerce-additional-fields { float: none !important; width: auto !important; clear: none !important; }
.ww-afrekenen .col-1, .ww-afrekenen .col-2 { float: none !important; width: auto !important; }
.woocommerce-checkout form.checkout.ww-afrekenen::after { display: none; }
.ww-cart-labels { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .4rem; }
.ww-cart-label { display: inline-block; padding: .12rem .45rem; font-size: .72rem; background: var(--sv-papier); color: var(--sv-grijs); }
.ww-cart-label--ok { background: var(--ww-zacht); color: var(--sv-mos); font-weight: 600; }
.ww-cart-tabel td.product-name { font-size: .98rem; }
.woocommerce-cart .ww-winkel-pagina .cart-empty { margin: 0 0 1rem; }
@media (max-width: 781px) {
  .ww-cart-tabel td.product-thumbnail { display: block !important; }
  .ww-cart-tabel td.product-thumbnail img { display: block !important; }
}
@media (max-width: 600px) {
  .ww-stap { font-size: .68rem; line-height: 1.25; overflow-wrap: anywhere; hyphens: auto; padding: .6rem .15rem; }
  .ww-stap span { display: block; font-size: .85rem; font-weight: 700; }
}

/* Beeldmerk van de maker, links onderin de footer: wit, oker bij aanwijzen */
.sv-footer > .ww-footer-onder { display: flex; align-items: center; flex-wrap: wrap; gap: .35rem; }
.ww-maker { flex: none; display: inline-block; width: 18px; height: 18px; margin-right: .7rem; background-color: #fff;
  -webkit-mask: url("assets/hendesign-h.png") center / contain no-repeat; mask: url("assets/hendesign-h.png") center / contain no-repeat;
  transition: background-color .2s; text-decoration: none !important; }
.ww-maker:hover, .ww-maker:focus-visible { background-color: #DA9700; }

/* ===== Productpagina (zoals Portacon): foto links, koopvak rechts, daaronder omschrijving en specificaties ===== */
.single-product .sv-content > .woocommerce { padding-top: clamp(1.5rem, 3vw, 2.5rem); }
.single-product div.product { position: relative; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 0 clamp(2rem, 4vw, 3.5rem); align-items: start; }
.single-product div.product > * { grid-column: 1 / -1; min-width: 0; }
.single-product div.product > .woocommerce-product-gallery { grid-column: 1; float: none !important; width: auto !important; margin: 0 !important; }
.single-product div.product > .summary { grid-column: 2; float: none !important; width: auto !important; margin: 0 !important; }
.single-product div.product .woocommerce-product-gallery__wrapper { margin: 0; }
.single-product div.product .woocommerce-product-gallery__image img, .single-product div.product .woocommerce-product-gallery__image--placeholder img { border: 1px solid var(--sv-lijn); border-radius: var(--sv-r); background: #fff; }
.single-product div.product .flex-control-thumbs { display: grid !important; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .6rem; margin-top: .6rem !important; }
.single-product div.product .flex-control-thumbs li { width: auto !important; float: none !important; }
.single-product div.product .flex-control-thumbs img { border: 1px solid var(--sv-lijn); border-radius: 10px; opacity: .7; }
.single-product div.product .flex-control-thumbs img.flex-active, .single-product div.product .flex-control-thumbs img:hover { opacity: 1; border-color: var(--sv-mos); }
.single-product div.product .product_title { font-size: clamp(1.45rem, 1.05rem + 1.25vw, 2.05rem); line-height: 1.2; margin: 0 0 .75rem; letter-spacing: -.01em; overflow-wrap: anywhere; }
.single-product div.product .summary .woocommerce-product-rating { margin: 0 0 .75rem; }
.single-product div.product .summary .price { font-size: clamp(1.6rem, 1.3rem + .8vw, 2rem); color: var(--sv-ink); margin: .25rem 0 .9rem; }
.single-product div.product .summary .price del { font-size: .65em; color: var(--sv-grijs); font-weight: 400; }
.single-product div.product .summary .price ins { text-decoration: none; }
.single-product div.product .summary .ww-kort { margin: 0 0 1.25rem; color: var(--sv-ink); }
.single-product div.product .summary .ww-kort > :last-child { margin-bottom: 0; }
.single-product div.product .summary .stock { display: inline-flex; align-items: center; gap: .45rem; margin: 0 0 1rem; font-size: .9rem; font-weight: 600; color: var(--sv-mos); }
.single-product div.product .summary .stock::before { content: ""; width: .55rem; height: .55rem; border-radius: 50%; background: currentColor; }
.single-product div.product .summary .stock.out-of-stock { color: #b4471f; }
.single-product div.product .summary .stock.available-on-backorder { color: #a36b00; }
.single-product div.product form.cart { display: flex; flex-wrap: wrap; gap: .6rem; align-items: stretch; margin: 0 0 1.25rem !important; padding: 1.1rem; background: var(--sv-papier); border-radius: var(--sv-r); }
.single-product div.product form.cart::before, .single-product div.product form.cart::after { display: none !important; }
.single-product div.product form.cart .quantity { float: none !important; margin: 0 !important; }
.single-product div.product form.cart .quantity .qty { width: 4.5rem; height: 52px; min-height: 52px; box-sizing: border-box; border: 1px solid var(--sv-lijn); border-radius: var(--ww-r-veld, 8px); background: #fff; font-size: 1rem; }
.single-product div.product form.cart .single_add_to_cart_button { float: none !important; flex: 1 1 12rem; min-height: 52px; font-size: 1rem; border-radius: var(--ww-r-knop, 8px); }
.single-product div.product form.cart.variations_form { display: block; }
.single-product div.product form.cart .variations { margin-bottom: .8rem; }
.single-product div.product form.cart .woocommerce-variation-add-to-cart { display: flex; flex-wrap: wrap; gap: .6rem; }
.single-product div.product .summary .product_meta { margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid var(--sv-lijn); font-size: .82rem; color: var(--sv-grijs); display: grid; gap: .2rem; }
.single-product div.product .summary .product_meta a { color: inherit; }
.ww-pd-voordelen { display: grid; gap: .9rem; }
.ww-pd-voordelen .ww-vinklijst { margin: 0; gap: .45rem; font-size: .92rem; }
.ww-pd-hulp { margin: 0; font-size: .9rem; color: var(--sv-grijs); }
.ww-pd-hulp a { font-weight: 700; color: var(--sv-ink); text-decoration: none; }
.ww-pd-hulp a:hover { color: var(--sv-mos); }

/* Informatie onder het product */
.ww-pi { margin-top: clamp(2.5rem, 5vw, 4rem); }
.ww-pi-nav { display: flex; gap: .25rem; overflow-x: auto; scrollbar-width: none; border-bottom: 1px solid var(--sv-lijn); margin-bottom: clamp(1.75rem, 3vw, 2.5rem); }
.ww-pi-nav a { flex: none; padding: .85rem 1.1rem; font-weight: 600; font-size: .95rem; color: var(--sv-grijs); text-decoration: none; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.ww-pi-nav a:hover, .ww-pi-nav a:focus-visible { color: var(--sv-ink); border-bottom-color: var(--sv-mos); }
.ww-pi-nav a:first-child { color: var(--sv-ink); border-bottom-color: var(--sv-mos); }
.ww-pi section { scroll-margin-top: 13rem; }
.ww-pi-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: clamp(2rem, 4vw, 4rem); align-items: start; }
.ww-pi-grid--een { grid-template-columns: minmax(0, 1fr); max-width: 860px; }
.ww-pi h2, .ww-pi .ww-pi-kop, .ww-pi #reviews h2, .ww-pi .woocommerce-Reviews-title { font-size: clamp(1.3rem, 1.1rem + .6vw, 1.6rem); line-height: 1.25; margin: 0 0 1.1rem; }
.ww-pi-specs { position: sticky; top: 13rem; }
.ww-pi-sectie { margin-top: clamp(2.5rem, 5vw, 3.5rem); padding-top: clamp(2rem, 4vw, 3rem); border-top: 1px solid var(--sv-lijn); }

/* De beschrijving zelf: wat je typt of plakt, komt er altijd zo uit */
.ww-beschrijving { font-size: 1rem; line-height: 1.75; color: var(--sv-ink); max-width: 72ch; }
.ww-beschrijving > * { margin: 0 0 1rem; }
.ww-beschrijving > :last-child { margin-bottom: 0; }
.ww-beschrijving h2, .ww-beschrijving h3, .ww-beschrijving h4 { font-size: 1.12rem; line-height: 1.35; margin: 2rem 0 .7rem; color: var(--sv-ink); }
.ww-beschrijving h4 { font-size: 1rem; }
.ww-beschrijving > :first-child { margin-top: 0; }
.ww-beschrijving .ww-ondertitel { font-size: 1.12rem; line-height: 1.5; font-weight: 600; color: var(--sv-bos); }
.ww-beschrijving a { color: var(--sv-mos); }
.ww-beschrijving img { max-width: 100%; height: auto; border-radius: 10px; }
.ww-beschrijving iframe { max-width: 100%; aspect-ratio: 16 / 9; height: auto; width: 100%; border: 0; border-radius: 10px; }
.ww-beschrijving ol { padding-left: 1.3rem; }
.ww-beschrijving ol li { padding-left: .3rem; margin-bottom: .35rem; }
.ww-beschrijving blockquote { margin-left: 0; padding: .2rem 0 .2rem 1.1rem; border-left: 3px solid var(--sv-lijn); color: var(--sv-grijs); }
.ww-vinklijst { list-style: none; padding: 0 !important; display: grid; gap: .5rem; }
.ww-vinklijst li { position: relative; padding-left: 1.85rem; margin: 0 !important; line-height: 1.55; }
.ww-vinklijst li::before { content: ""; position: absolute; left: 0; top: .12em; width: 1.25rem; height: 1.25rem; border-radius: 50%; background: var(--ww-zacht); }
.ww-vinklijst li::after { content: ""; position: absolute; left: .3rem; top: calc(.12em + .3rem); width: .65rem; height: .65rem; background: var(--sv-mos); -webkit-mask: var(--ww-vink) center / contain no-repeat; mask: var(--ww-vink) center / contain no-repeat; }
.ww-vinklijst--kader { padding: 1.1rem 1.25rem !important; background: var(--sv-papier); border-radius: var(--sv-r); }
@media (min-width: 700px) { .ww-vinklijst--kader { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 1.5rem; } }
.ww-vinklijst--kader li::before { background: #fff; }
.ww-let-op { padding: .9rem 1.1rem; background: #fff7e6; border-left: 3px solid #e0a100; border-radius: 0 10px 10px 0; font-size: .92rem; line-height: 1.6; }
.ww-let-op strong:first-child { color: #8a5a00; }

/* Tabellen in de beschrijving en de specificaties */
.ww-specs, .ww-beschrijving .ww-tabel { width: 100%; border-collapse: separate; border-spacing: 0; font-size: .92rem; line-height: 1.45; border: 1px solid var(--sv-lijn); border-radius: 12px; overflow: hidden; background: #fff; margin: 0; }
.ww-specs th, .ww-specs td, .ww-beschrijving .ww-tabel th, .ww-beschrijving .ww-tabel td { padding: .7rem 1rem; text-align: left; vertical-align: top; border: 0; border-bottom: 1px solid var(--sv-lijn); background: transparent; }
.ww-specs tr:last-child > *, .ww-beschrijving .ww-tabel tr:last-child > * { border-bottom: 0; }
.ww-specs tr:nth-child(odd), .ww-beschrijving .ww-tabel tbody tr:nth-child(odd) { background: var(--sv-papier); }
.ww-specs th, .ww-beschrijving .ww-tabel th[scope="row"] { width: 45%; font-weight: 500; color: var(--sv-grijs); }
.ww-specs td { font-weight: 600; color: var(--sv-ink); overflow-wrap: anywhere; }
.ww-beschrijving .ww-tabel thead th { background: var(--sv-bos); color: #fff; font-weight: 600; }
.ww-beschrijving .ww-tabel { margin: 0 0 1.25rem; }

@media (max-width: 900px) {
  .single-product div.product { grid-template-columns: minmax(0, 1fr); }
  .single-product div.product > .woocommerce-product-gallery, .single-product div.product > .summary { grid-column: 1; }
  .single-product div.product > .woocommerce-product-gallery { margin-bottom: 1.5rem !important; }
  .ww-pi-grid { grid-template-columns: minmax(0, 1fr); }
  .ww-pi-specs { position: static; }
}
.ww-kruimelbalk--leeg { border-bottom: 0; }
/* Koopknop op de productpagina in de accentkleur; witte vakken voor bestellen en "Levering" */
.single-product div.product form.cart { background: #fff; border: 1px solid var(--sv-lijn); }
.woocommerce.single-product div.product form.cart .single_add_to_cart_button, .single-product div.product form.cart .single_add_to_cart_button.button.alt { background: var(--sv-mos); border-color: var(--sv-mos); color: #fff; }
.woocommerce.single-product div.product form.cart .single_add_to_cart_button:hover, .single-product div.product form.cart .single_add_to_cart_button.button.alt:hover { background: var(--sv-bos); border-color: var(--sv-bos); }
.ww-vinklijst--kader { background: #fff; border: 1px solid var(--sv-lijn); }
.ww-vinklijst--kader li::before { background: var(--ww-zacht); }
.ww-pi .kw-bijlagen { padding: 0 !important; margin: 0 !important; }
/* Beeldmerk: plek en grootte kies je onder Website beheer > Pagina-opbouw > Beeldmerk in de footer */
.ww-maker { width: var(--ww-maker-maat, 18px); height: var(--ww-maker-maat, 18px); }
body.ww-maker-m-normaal { --ww-maker-maat: 22px; }
body.ww-maker-m-groot { --ww-maker-maat: 28px; }
body.ww-maker-rechts .ww-maker { order: 99; margin: 0 0 0 auto; }
body.ww-maker-uit .ww-maker { display: none; }
@media (min-width: 1340px) {
  body.ww-maker-links .ww-maker { position: absolute; left: clamp(1.5rem, 3vw, 3rem); bottom: calc(var(--wp--preset--spacing--40, 2rem) + .1rem); margin: 0; }
}