/* ============================================================================
   MoveVolt — FUTURISTISCH redesign (25 jun 2026). Laadt ALS LAATSTE (na home-vol).
   Operator: de licht/teal "vol"-look was "standaard en plain, niet mooi" → omslag naar
   DONKER & FUTURISTISCH: near-black canvas + trage aurora-mesh, glassmorphism-kaarten met
   gloeiende hairline, neon volt-accent, zwevende productfoto's op een LICHT media-vlak.
   RIJK/VOL gevuld (niet leeg = vorige dark-fout). Eigen lokale fonts (Clash/Hanken) blijven.
   Tokens worden hier ge-override → alles dat var(--token) gebruikt kleurt mee; harde #fff uit
   redesign/home-vol worden per component overschreven. --media blijft LICHT (productfoto's).
   ============================================================================ */

/* ---- 0. Token-omslag naar donker (namen behouden, waarden donker/neon) -------- */
:root{
  --bg:#080A10; --ink:#ECEEF4; --ink-2:#9AA2B4; --line:rgba(255,255,255,.10); --surface:rgba(255,255,255,.045);
  --night:#0C0F16; --night-2:#0E1219; --surface-2:rgba(255,255,255,.05); --surface-3:#0C0F16;
  --surface-alt:rgba(255,255,255,.028);
  --ink-on-night:#ECEEF4; --muted-on-night:#9AA2B4; --line-on-night:rgba(255,255,255,.10);
  /* neon volt-accent — op donker mag het fel/licht als tekst én als gloed */
  --volt:#00E6B8; --volt-600:#19F0C4; --volt-300:#5FF3D7; --volt-glow:rgba(0,230,184,.30);
  /* koele secundaire (aurora + futuristische glow, concurreert niet met volt) */
  --cool:#6D5BFF; --cool-2:#2D9BFF;
  /* productfoto-vlak blijft LICHT (kernfix: witte foto's niet op donker plakken) */
  --media:#EEF1F6; --media-2:#DFE5EE;
  --surge:#FF6A45; --surge-2:#FF8A66;
  --focus:#5FF3D7;
  /* glas + glow */
  --glass:rgba(255,255,255,.045); --glass-2:rgba(255,255,255,.07); --glass-line:rgba(255,255,255,.10);
  --glow-card:0 0 0 1px rgba(0,230,184,.30), 0 0 38px rgba(0,230,184,.16);
  --sh:0 24px 60px rgba(0,0,0,.5); --sh-cta:0 10px 34px rgba(0,230,184,.34);
  --sh-sm:0 10px 24px rgba(0,0,0,.34); --sh-md:0 18px 44px rgba(0,0,0,.42); --sh-lg:0 30px 70px rgba(0,0,0,.5);
  --sh-card-hover:0 30px 70px rgba(0,0,0,.5), 0 0 0 1px rgba(0,230,184,.3), 0 0 44px rgba(0,230,184,.16);
}

/* ---- 1. Canvas + aurora-mesh + filmische grain ------------------------------ */
html{ background:var(--bg); }
body{ background:var(--bg); color:var(--ink); position:relative; }
/* geanimeerde aurora: 2 trage radiale gloeden (volt + koel) + diepte */
.vw-aurora{ position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.vw-aurora::before,.vw-aurora::after{ content:""; position:absolute; width:58vw; height:58vw; border-radius:50%; filter:blur(130px); opacity:.18; will-change:transform; }
.vw-aurora::before{ background:radial-gradient(circle, var(--volt) 0%, transparent 70%); top:-14%; left:-8%; animation:vwDrift1 24s ease-in-out infinite alternate; }
.vw-aurora::after{ background:radial-gradient(circle, var(--cool) 0%, transparent 70%); bottom:-18%; right:-12%; animation:vwDrift2 30s ease-in-out infinite alternate; }
.vw-aurora__c{ position:absolute; top:40%; left:46%; width:36vw; height:36vw; border-radius:50%; filter:blur(140px); opacity:.10; background:radial-gradient(circle, var(--cool-2) 0%, transparent 70%); animation:vwDrift1 36s ease-in-out infinite alternate; }
@keyframes vwDrift1{ to{ transform:translate(9vw,7vh) scale(1.18); } }
@keyframes vwDrift2{ to{ transform:translate(-7vw,-5vh) scale(1.22); } }
/* subtiele grain breekt gradient-banding */
body::after{ content:""; position:fixed; inset:0; z-index:1; pointer-events:none; opacity:.04; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
/* content boven de aurora */
.vw-header,main,.vw-footer{ position:relative; z-index:2; }

/* ---- 2. Secties: transparant zodat de aurora doorschijnt; subtiele afwisseling - */
.vw-section{ background:transparent; }
.vw-section--alt{ background:rgba(255,255,255,.022); border-block:1px solid var(--line); }
.vw-catsec,.vw-stats-sec{ background:transparent; }
.vw-sectionhead h2{ color:var(--ink); }
.vw-sectionhead p{ color:var(--ink-2); }
.vw-kicker{ color:var(--volt-300); }
.vw-kicker::before{ background:var(--volt); box-shadow:0 0 10px var(--volt-glow); }
h1,h2,h3,h4{ color:var(--ink); }
p{ color:var(--ink-2); }

/* ---- 3. Header — donker glas met blur ---------------------------------------- */
.vw-header{ background:rgba(10,13,20,.72); -webkit-backdrop-filter:blur(16px) saturate(140%); backdrop-filter:blur(16px) saturate(140%); border-bottom:1px solid var(--line); box-shadow:none; }
.vw-header.is-scrolled,.vw-header[data-scrolled]{ background:rgba(9,11,18,.86); box-shadow:0 10px 30px rgba(0,0,0,.4); }
.vw-logo__txt{ color:var(--ink); }
.vw-nav__link{ color:var(--ink); }
.vw-nav__link:hover,.vw-nav__link[aria-current="page"]{ color:var(--volt-300); }
.vw-iconbtn{ color:var(--ink); }
.vw-iconbtn:hover{ color:var(--volt-300); background:rgba(255,255,255,.06); }
.vw-mobilemenu{ background:#0E1219; border-top:1px solid var(--line); }
.vw-mobilemenu .vw-nav__link{ color:var(--ink); border-color:var(--line); }
.vw-search{ background:rgba(10,13,20,.92); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); border-bottom:1px solid var(--line); }
.vw-search__input{ background:rgba(255,255,255,.06); color:var(--ink); border:1px solid var(--line); }
.vw-search__input::placeholder{ color:var(--ink-2); }
.vw-utilbar{ background:rgba(0,0,0,.4); border-bottom:1px solid var(--line); }
.vw-utilbar__i{ color:var(--ink-2); } .vw-utilbar__i strong{ color:var(--ink); }
.vw-utilbar__i .vw-ico{ color:var(--volt-300); }
.vw-utilbar__rating{ color:var(--ink); }
.vw-langswitch .vw-lang{ color:var(--ink-2); }
.vw-langswitch .vw-lang.is-active{ background:var(--volt); color:#04231C; box-shadow:0 0 18px var(--volt-glow); }
.vw-cart__drawer{ background:rgba(12,15,22,.96); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); border-left:1px solid var(--line); color:var(--ink); }
.vw-cart__count{ background:var(--volt); color:#04231C; box-shadow:0 0 14px var(--volt-glow); }

/* ---- 4. HERO — donkere filmische overlay + glow-headline --------------------- */
.vw-hero{ background:var(--bg); }
.vw-hero__overlay{ background:linear-gradient(100deg, #080A10 0%, rgba(8,10,16,.92) 32%, rgba(8,10,16,.62) 56%, rgba(8,10,16,.18) 78%, rgba(8,10,16,0) 100%) !important; }
.vw-hero__overlay::after{ content:"" !important; display:block !important; position:absolute; inset:0; background:radial-gradient(60% 80% at 14% 50%, rgba(0,230,184,.16), transparent 70%); }
.vw-hero__content h1,.vw-hero__title{ color:var(--ink) !important; text-shadow:0 0 50px rgba(0,230,184,.22) !important; }
.vw-hero__lead,.vw-hero__content>p{ color:#C7CDDA !important; }
.vw-hero__eyebrow{ color:var(--volt-300); background:rgba(0,230,184,.12); border:1px solid rgba(0,230,184,.32); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); box-shadow:0 0 24px rgba(0,230,184,.16); }
.vw-hero__eyebrow::before,.vw-hero__eyebrow::after{ background:var(--volt); }
.vw-hero__trust{ color:var(--ink) !important; } .vw-hero__trust strong{ color:var(--ink) !important; }
.vw-hero__usps{ background:rgba(255,255,255,.04); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); border:1px solid var(--line); border-radius:14px; padding:12px 16px; }
.vw-hero__usps li{ color:#C7CDDA; }
.vw-hero__usps li::before{ color:var(--volt-300); }
.vw-hero__dot{ background:rgba(255,255,255,.3); } .vw-hero__dot.is-active{ background:var(--volt); box-shadow:0 0 12px var(--volt-glow); }

/* ---- 4b. MEERDELIGE HERO (grote-winkel): hoofdblok + deal-tegel + trust/payment ---- */
.vw-hero.vw-hero2{ min-height:auto; background:transparent; padding-block:clamp(16px,2.4vw,30px); }
.vw-hero2__grid{ display:grid; grid-template-columns:1.7fr 1fr; gap:18px; align-items:stretch; }
@media(max-width:980px){ .vw-hero2__grid{ grid-template-columns:1fr; } }
.vw-hero2__main{ position:relative; overflow:hidden; border-radius:20px; min-height:clamp(420px,52vh,540px); border:1px solid var(--line); display:flex; flex-direction:column; justify-content:flex-end; }
.vw-hero2__main .vw-hero__slides{ position:absolute; inset:0; z-index:0; }
.vw-hero2__main .vw-hero__slide{ position:absolute; inset:0; opacity:0; transition:opacity .8s ease; }
.vw-hero2__main .vw-hero__slide.is-active{ opacity:1; }
.vw-hero2__main .vw-hero__slide img{ width:100%; height:100%; object-fit:cover; }
.vw-hero2__shade{ position:absolute; inset:0; z-index:1; background:linear-gradient(95deg, rgba(6,8,14,.95) 0%, rgba(6,8,14,.82) 32%, rgba(6,8,14,.5) 56%, rgba(6,8,14,.12) 80%, transparent 100%), linear-gradient(0deg, rgba(6,8,14,.7), transparent 45%); }
.vw-hero2__content{ position:relative; z-index:2; padding:clamp(22px,3vw,40px); max-width:560px; }
.vw-hero2__content h1{ margin:.4rem 0 .5rem; }
.vw-hero2__content .vw-hero__lead{ margin-bottom:1.1rem; }
.vw-hero2__main .vw-hero__controls{ position:absolute; left:clamp(22px,3vw,40px); bottom:14px; z-index:3; display:flex; gap:8px; align-items:center; }

.vw-hero2__side{ display:flex; flex-direction:column; gap:14px; }
.vw-herodeal{ position:relative; display:flex; flex-direction:column; background:var(--glass); border:1px solid var(--glass-line); border-radius:18px; overflow:hidden; box-shadow:var(--sh-sm); transition:transform .16s var(--ease-out), box-shadow .16s, border-color .16s; }
.vw-herodeal:hover{ transform:translateY(-3px); border-color:rgba(0,230,184,.45); box-shadow:var(--sh-card-hover); }
.vw-herodeal__badge{ position:absolute; top:12px; left:12px; z-index:2; background:var(--surge); color:#2A1000; font-size:.68rem; font-weight:800; padding:5px 10px; border-radius:20px; box-shadow:0 0 18px rgba(255,106,69,.4); }
.vw-herodeal__media{ display:block; background:linear-gradient(180deg,#FBFCFE,var(--media) 70%,var(--media-2)); aspect-ratio:16/10; }
.vw-herodeal__media img{ width:100%; height:100%; object-fit:contain; padding:12px 16px; }
.vw-herodeal__info{ display:flex; flex-direction:column; gap:2px; padding:12px 16px 16px; }
.vw-herodeal__brand{ color:var(--ink-2); text-transform:uppercase; letter-spacing:.06em; font-size:.64rem; font-weight:700; }
.vw-herodeal__name{ color:var(--ink); font-family:var(--font-display); font-size:1.02rem; font-weight:700; line-height:1.2; }
.vw-herodeal__price{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:6px; color:var(--ink-2); font-size:.8rem; }
.vw-herodeal__price>strong{ color:var(--ink); font-family:var(--font-display); font-size:1.2rem; font-weight:800; }
.vw-herodeal__cta{ display:inline-flex; align-items:center; gap:.3rem; color:var(--volt-300); font-weight:700; font-size:.82rem; white-space:nowrap; }
.vw-herodeal__cta .vw-ico--arr{ width:15px; height:15px; }

.vw-herotrust{ display:flex; flex-direction:column; gap:11px; background:var(--glass); border:1px solid var(--glass-line); border-radius:18px; padding:16px 18px; box-shadow:var(--sh-sm); }
.vw-herotrust__i{ display:flex; align-items:center; gap:11px; color:var(--ink); font-size:.86rem; font-weight:600; }
.vw-herotrust__ico{ flex:0 0 auto; width:34px; height:34px; border-radius:10px; display:grid; place-items:center; background:rgba(0,230,184,.12); }
.vw-herotrust__ico .vw-ico{ width:18px; height:18px; color:var(--volt-300); }
.vw-herotrust__pay{ margin-top:3px; padding-top:12px; border-top:1px solid var(--line); display:flex; flex-direction:column; gap:8px; }
.vw-herotrust__payt{ color:var(--ink-2); font-size:.78rem; font-weight:600; }
.vw-herotrust__payrow{ display:flex; flex-wrap:wrap; gap:6px; }
.vw-herotrust__payl{ display:inline-grid; place-items:center; height:27px; min-width:42px; padding:3px 7px; background:#fff; border-radius:6px; }
.vw-paylogo{ height:18px; width:auto; max-width:50px; display:block; }
@media(max-width:980px){ .vw-hero2__side{ flex-direction:row; } .vw-hero2__side>*{ flex:1; } }
@media(max-width:620px){ .vw-hero2__side{ flex-direction:column; } }
/* Mobiel: hero compacter (was ~1.7 schermen). Trust/betaal-blok staat dubbel (USP-band + payband eronder) → daar weg; lead korter; media lager. */
@media(max-width:780px){
  .vw-hero2__side .vw-herotrust{ display:none; }
  .vw-hero2__main{ min-height:clamp(300px,46vh,380px); }
  .vw-hero2__content{ padding:18px 18px 20px; }
  .vw-hero2__content .vw-hero__lead{ display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; margin-bottom:.85rem; }
  .vw-hero2__content .vw-btn{ padding-block:11px; }
}

/* ---- 5. Glas-kaarten (overschrijven harde #fff van redesign/home-vol) -------- *
   Performance: GEEN backdrop-blur op kaart-grids (kan 130× zwaar zijn) — alleen
   semi-transparant glas + hairline; blur reserveren voor header/hero/overlays.      */
.vw-card,
.vw-stat,
.vw-review,
.vw-guidecard,
.vw-step,
.vw-segrow--rich .vw-segcard,
.vw-filters,
.vw-merkband .vw-marquee__item{
  background:var(--glass); border:1px solid var(--glass-line); box-shadow:var(--sh-sm);
}
.vw-card:hover,
.vw-review:hover,
.vw-guidecard:hover,
.vw-segrow--rich .vw-segcard:hover{ border-color:rgba(0,230,184,.45); box-shadow:var(--sh-card-hover); }

/* productfoto's: LICHT media-vlak BINNEN de donkere kaart (mix-blend werkt niet op donker) */
.vw-card__media,
.vw-segcard__media,
.vw-gal__stage,.vw-gal__main{ background:linear-gradient(180deg,#FBFCFE 0%,var(--media) 70%,var(--media-2) 100%) !important; border-bottom:1px solid var(--line); }
.vw-segcard__media{ border-bottom:1px solid var(--line); }
.vw-segcard__media .vw-segcard__ico{ background:rgba(10,13,20,.85); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); box-shadow:0 0 0 1px rgba(255,255,255,.08); }
.vw-segcard__count{ background:rgba(8,10,16,.78); }

/* kaart-tekst op donker leesbaar */
.vw-card__brand{ color:var(--ink-2); }
.vw-card__title a{ color:var(--ink); } .vw-card__title a:hover{ color:var(--volt-300); }
.vw-card__specs{ color:var(--ink-2); }
.vw-card__price strong,.vw-segcard__from strong{ color:var(--ink); }
.vw-card__from,.vw-segcard__from{ color:var(--ink-2); }
.vw-segrow--rich .vw-segcard__name{ color:var(--ink); }
.vw-segcard__tag{ color:var(--ink-2); }
.vw-segcard__foot{ border-top:1px solid var(--line); }
.vw-segcard__cta,.vw-textlink{ color:var(--volt-300); }
.vw-stat__n{ color:var(--ink); } .vw-stat__l{ color:var(--ink-2); }
.vw-step h3,.vw-guidecard h3{ color:var(--ink); }
.vw-step p,.vw-guidecard p{ color:var(--ink-2); }
.vw-step__n{ background:var(--volt); color:#04231C !important; box-shadow:0 0 16px var(--volt-glow); }
.vw-review__q{ color:#D4D9E4; } .vw-review__who strong{ color:var(--ink); } .vw-review__meta{ color:var(--ink-2); }
.vw-review__avatar{ border-color:rgba(255,255,255,.12); }
.vw-reviews__score,.vw-reviews__score strong{ color:var(--ink); }

/* icoon-tegels (USP-band, stappen, gidsen): gloeiende glas-cirkels op donker */
.vw-usp__ico,.vw-step__ico,.vw-guidecard__ico{ background:rgba(0,230,184,.12) !important; box-shadow:inset 0 0 0 1px rgba(255,255,255,.06), 0 0 22px rgba(0,230,184,.12); }
.vw-usp__ico .vw-ico,.vw-step__ico .vw-ico,.vw-guidecard__ico .vw-ico{ color:var(--volt-300); }
.vw-usp__t{ color:var(--ink); }
.vw-uspband{ background:rgba(255,255,255,.025); border-block:1px solid var(--line); }

/* chips */
.vw-chip{ background:rgba(255,255,255,.05); border-color:var(--line); color:var(--ink-2); }
.vw-chip--is-legal,.vw-chip.is-legal{ color:#43F0C8; background:rgba(0,230,184,.12); border-color:rgba(0,230,184,.34); }
.vw-chip--is-private{ color:#FFC98A; background:rgba(255,160,40,.14); border-color:rgba(255,160,40,.34); }
.vw-card__stock{ color:#43F0C8; } .vw-card__stock::before{ background:#00E6B8; box-shadow:0 0 8px rgba(0,230,184,.6); }
/* badges op de lichte productfoto: donkere tekst op het felle neon (wit was onleesbaar) */
.vw-badge--tip,.vw-card__media>.vw-badge--tip{ background:var(--volt); color:#03231B; }
.vw-badge--hot,.vw-card__media>.vw-badge--hot{ color:#2A1A00; }

/* ---- 6. Gloeiende CTA's + knoppen ------------------------------------------- */
.vw-btn--cta{ background:linear-gradient(135deg,var(--volt),var(--volt-600)); color:#03231B; border:0; box-shadow:0 8px 30px rgba(0,230,184,.34); }
.vw-btn--cta:hover{ box-shadow:0 12px 46px rgba(0,230,184,.55); color:#03231B; transform:translateY(-1px); }
.vw-btn--ghost{ background:rgba(255,255,255,.05); border:1px solid var(--line); color:var(--ink); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); }
.vw-btn--ghost:hover{ border-color:var(--volt-300); color:var(--volt-300); }
.vw-btn--dark{ background:rgba(255,255,255,.07); border:1px solid var(--line); color:var(--ink); }
.vw-btn--dark:hover{ background:rgba(255,255,255,.12); color:var(--ink); }
.vw-btn--sm{ }
.vw-card__foot .vw-btn--cta{ box-shadow:0 6px 20px rgba(0,230,184,.28); }

/* ---- 7. DEALS-sectie — warme glow i.p.v. perzik op licht -------------------- */
.vw-deals{ background:radial-gradient(120% 100% at 50% 0%, rgba(255,106,69,.10), transparent 60%); border-top:1px solid var(--line); }
.vw-deals .vw-kicker{ color:var(--surge-2); } .vw-deals .vw-kicker::before{ background:var(--surge); box-shadow:0 0 10px rgba(255,106,69,.4); }

/* ---- 8. Merkenband + slider-nav + filters ---------------------------------- */
.vw-merkband{ background:rgba(255,255,255,.022); border-block:1px solid var(--line); }
.vw-merkband .vw-marquee__item{ box-shadow:none; }
.vw-brandlogo{ filter:brightness(0) invert(1); opacity:.7; } .vw-merkband .vw-marquee__item:hover .vw-brandlogo{ opacity:1; }
.vw-brandlogo--txt{ color:var(--ink-2); filter:none; }
.vw-slider__btn{ background:rgba(255,255,255,.06); border:1px solid var(--line); color:var(--ink); }
.vw-slider__btn:hover{ border-color:var(--volt-300); color:var(--volt-300); }
.vw-slider__dots span.is-active,.vw-slider__dot.is-active{ background:var(--volt); }
.vw-filter{ background:rgba(255,255,255,.05); border:1px solid var(--line); color:var(--ink-2); }
.vw-filter:hover{ color:var(--ink); border-color:var(--volt-300); }
.vw-filter.is-active,.vw-filter[aria-pressed="true"]{ background:var(--volt); color:#03231B; border-color:transparent; box-shadow:0 0 16px var(--volt-glow); }
.vw-filtergroup h4{ color:var(--ink); }

/* ---- 9. LEGAAL-CTA, payband, SEO-tekst, footer, crumbs, pagehead ------------ */
.vw-legalcta__inner{ background:linear-gradient(115deg, rgba(0,230,184,.10), rgba(109,91,255,.10)); border:1px solid var(--line); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); box-shadow:inset 0 0 0 1px rgba(255,255,255,.04), 0 30px 70px rgba(0,0,0,.4); }
.vw-legalcta h2{ color:var(--ink); } .vw-legalcta p{ color:#C7CDDA; }
.vw-legalcta .vw-kicker{ color:var(--volt-300); }
.vw-legalcta__inner::after{ background:var(--volt-300); opacity:.16; }
.vw-payband{ background:transparent; } .vw-payband__t{ color:var(--ink-2); }
.vw-pay__logo{ background:rgba(255,255,255,.92); border-radius:8px; padding:6px 10px; }
.vw-seoblock{ background:rgba(255,255,255,.025); border-top:1px solid var(--line); }
.vw-seoblock .vw-prose,.vw-seoblock .vw-prose p,.vw-seoblock .vw-prose li{ color:var(--ink-2); }
.vw-seoblock .vw-prose>.vw-lead{ color:var(--ink); }
.vw-seoblock .vw-prose>h2{ color:var(--ink); border-top-color:var(--line); }
.vw-seoblock .vw-prose strong{ color:var(--ink); }
.vw-seoblock .vw-prose a{ color:var(--volt-300); }
.vw-prose a{ color:var(--volt-300); }
.vw-pagehead{ background:rgba(255,255,255,.022); border-bottom:1px solid var(--line); }
.vw-crumbs,.vw-crumbs a{ color:var(--ink-2); } .vw-crumbs a:hover{ color:var(--volt-300); }
.vw-catalog__bar{ color:var(--ink); }
.vw-footer{ background:rgba(0,0,0,.34); border-top:1px solid var(--line); }
.vw-footer__col h4{ color:var(--ink); }
.vw-footer__col a,.vw-footer__about{ color:var(--ink-2); } .vw-footer__col a:hover{ color:var(--volt-300); }
.vw-footer__bar{ color:var(--ink-2); border-top:1px solid var(--line); }
.vw-logo--footer .vw-logo__txt{ color:var(--ink); }

/* ---- 10. PDP-vlakken op donker --------------------------------------------- */
.vw-pdptrust__i{ background:var(--glass); border:1px solid var(--glass-line); box-shadow:none; }
.vw-pdptrust__i strong{ color:var(--ink); } .vw-pdptrust__i span{ color:var(--ink-2); }
.vw-pdptrust__i img{ filter:brightness(0) invert(1); opacity:.85; }
.vw-spectable th{ color:var(--ink-2); } .vw-spectable td{ color:var(--ink); border-color:var(--line); }
.vw-faq__item{ border-color:var(--line); background:var(--glass); } .vw-faq summary{ color:var(--ink); }
.vw-faq__a p{ color:var(--ink-2); }
.vw-pdp__desc{ color:var(--ink-2); } .vw-pdp__price,.vw-pdp__info h1{ color:var(--ink); }
.vw-newsletter{ background:var(--glass); border:1px solid var(--glass-line); }
.vw-newsletter h2,.vw-newsletter p,.vw-newsletter label{ color:var(--ink); }
.vw-newsletter__input{ background:rgba(255,255,255,.06); color:var(--ink); border:1px solid var(--line); }

/* ---- 11. Scroll-reveal (app.js zet is-visible; reduced-motion = direct zichtbaar) */
@media (prefers-reduced-motion:no-preference){
  [data-reveal]{ opacity:0; transform:translateY(22px); transition:opacity .7s var(--ease-out), transform .7s var(--ease-out); }
  [data-reveal].is-visible{ opacity:1; transform:none; }
}

/* ---- 12. Focus + a11y op donker -------------------------------------------- */
a:focus-visible,button:focus-visible,.vw-btn:focus-visible,input:focus-visible{ outline:2px solid var(--volt-300); outline-offset:3px; }
::selection{ background:rgba(0,230,184,.28); color:#fff; }

/* ============================================================================
   13. FEATURE-STRIP — vette, gloeiende cijfers uit de echte catalogus
   ============================================================================ */
.vw-feats{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
@media(max-width:860px){ .vw-feats{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:460px){ .vw-feats{ grid-template-columns:1fr; } }
.vw-feat{ position:relative; overflow:hidden; display:flex; flex-direction:column; gap:7px; padding:22px 20px; border-radius:16px; background:linear-gradient(160deg, rgba(0,230,184,.10), rgba(255,255,255,.03)); border:1px solid var(--glass-line); box-shadow:var(--sh-sm); }
.vw-feat::after{ content:""; position:absolute; top:-45%; right:-30%; width:170px; height:170px; border-radius:50%; background:radial-gradient(circle,var(--volt),transparent 70%); opacity:.16; filter:blur(22px); pointer-events:none; }
.vw-feat__ico{ width:46px; height:46px; border-radius:12px; display:grid; place-items:center; background:rgba(0,230,184,.14); box-shadow:0 0 24px rgba(0,230,184,.18); }
.vw-feat__ico .vw-ico{ width:24px; height:24px; color:var(--volt-300); }
.vw-feat__big{ font-family:var(--font-display); font-weight:800; font-size:clamp(1.45rem,2.5vw,2rem); letter-spacing:-.02em; color:#fff; line-height:1.05; text-shadow:0 0 30px rgba(0,230,184,.25); }
.vw-feat__l{ color:var(--ink-2); font-size:.84rem; font-weight:600; }

/* ============================================================================
   14. SPEC-VERGELIJKER — toppers naast elkaar (grote-winkel feature)
   ============================================================================ */
.vw-compare{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.vw-compare__grid{ display:grid; grid-template-columns:1.1fr repeat(var(--cmpn,4),minmax(132px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:16px; overflow:hidden; min-width:600px; }
.vw-compare__grid>*{ background:var(--night); padding:12px 14px; display:flex; align-items:center; }
.vw-compare__corner{ background:transparent; }
.vw-compare__prod{ flex-direction:column; align-items:center; text-align:center; gap:3px; background:rgba(255,255,255,.03); transition:background .16s; }
.vw-compare__prod:hover{ background:rgba(0,230,184,.06); }
.vw-compare__media{ width:100%; background:linear-gradient(180deg,#FBFCFE,var(--media)); border-radius:10px; padding:8px; margin-bottom:4px; }
.vw-compare__media img{ width:100%; height:auto; max-height:88px; object-fit:contain; }
.vw-compare__brand{ color:var(--ink-2); text-transform:uppercase; letter-spacing:.05em; font-size:.6rem; font-weight:700; }
.vw-compare__name{ color:var(--ink); font-size:.84rem; line-height:1.2; font-family:var(--font-body); font-weight:600; }
.vw-compare__price{ color:var(--volt-300); font-family:var(--font-display); font-weight:800; font-size:1.05rem; }
.vw-compare__prod .vw-btn{ margin-top:6px; }
.vw-compare__label{ color:var(--ink-2); font-size:.8rem; font-weight:700; }
.vw-compare__val{ justify-content:center; color:var(--ink); font-size:.88rem; font-weight:600; }
.vw-compare__val.is-legal{ color:#43F0C8; }

/* ============================================================================
   15. MERK-MUUR — echte merk-logo's in glas-tegels (i.p.v. scrollende marquee)
   ============================================================================ */
.vw-brandgrid{ display:grid; grid-template-columns:repeat(7,1fr); gap:12px; }
@media(max-width:900px){ .vw-brandgrid{ grid-template-columns:repeat(4,1fr); } }
@media(max-width:520px){ .vw-brandgrid{ grid-template-columns:repeat(3,1fr); } }
/* Witte chip-tegels zodat de ECHTE officiële merkkleuren leesbaar zijn (geen invert-filter). */
.vw-brandtile{ display:grid; place-items:center; height:74px; padding:14px 18px; background:#fff; border:1px solid var(--glass-line); border-radius:14px; box-shadow:var(--sh-sm); transition:transform .16s var(--ease-out), box-shadow .16s; }
.vw-brandtile:hover{ transform:translateY(-3px); box-shadow:0 10px 28px rgba(0,0,0,.28); }
.vw-brandtile .vw-brandlogo{ max-height:34px; max-width:100%; width:auto; object-fit:contain; filter:none; opacity:1; }
/* Logo's die zelf wit/licht zijn → onzichtbaar op witte chip: donkere chip (build zet --dark). */
.vw-brandtile--dark{ background:#11151d; border-color:rgba(255,255,255,.10); }
.vw-brandtile .vw-brandlogo--txt{ filter:none; color:var(--ink); opacity:.85; font-weight:700; font-size:.92rem; text-align:center; }