/* fzv-tv v0.5.5 — showroom-kiosk. Schaalt met élk schermformaat: vw/vh met clamp() én
   kale vw-fallbacks ervoor (oudere tv-browsers zonder clamp/min/aspect-ratio pakken dan
   de vw-regel). Layout kan structureel niet meer uitlopen: minmax(0)-kolommen,
   min-width:0 en overflow:hidden op de tekstkolom. */
.fzv-tv{position:fixed;top:0;right:0;bottom:0;left:0;z-index:99999;background:#0F1115;color:#fff;font-family:Inter,system-ui,sans-serif;overflow:hidden}
.fzv-tv .tvkop{position:absolute;top:0;left:0;right:0;z-index:3;display:flex;align-items:center;gap:1vw;padding:1.4vw 2.2vw;background:linear-gradient(180deg,rgba(15,17,21,.85),transparent)}
.fzv-tv .tvlogo{width:3vw;height:3vw;width:clamp(38px,3vw,60px);height:clamp(38px,3vw,60px);border-radius:22%;background:#C8102E;display:grid;place-items:center;font:800 1.35vw Sora,sans-serif;font-size:clamp(16px,1.35vw,26px);flex:0 0 auto}
.fzv-tv .tvnaam{font:600 1.25vw Sora,sans-serif;font-size:clamp(15px,1.25vw,24px);letter-spacing:.01em;white-space:nowrap}
.fzv-tv .tvklok{margin-left:auto;font:600 1.8vw Sora,sans-serif;font-size:clamp(20px,1.8vw,34px);font-variant-numeric:tabular-nums;opacity:.9}
.fzv-tv .tvslide{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;transition:opacity 1.1s ease;pointer-events:none}
.fzv-tv .tvslide.actief{opacity:1}
/* ---- auto-slide: spotlight ---- */
.fzv-tv .tvblur{position:absolute;top:-6%;right:-6%;bottom:-6%;left:-6%;background-size:cover;background-position:center;filter:blur(30px) brightness(.32) saturate(1.15)}
.fzv-tv .auto{display:grid;grid-template-columns:57% 43%;grid-template-columns:minmax(0,57fr) minmax(0,43fr);align-items:center;padding:6.5vh 3vw 9vh}
.fzv-tv .auto>*{min-width:0}
.fzv-tv .tvkader{position:relative;justify-self:center;width:100%;max-width:126vh;height:58vh;border-radius:1.4vw;overflow:hidden;background:#14161B;box-shadow:0 3vh 8vh rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.08)}
@supports (aspect-ratio:3/2){.fzv-tv .tvkader{height:auto;aspect-ratio:3/2}}
/* vullaag ín het kader: zelfde foto wazig als cover — vult de zijkanten bij 4:3-foto's
   (na het wegsnijden van de witte Autotelex-randen); alleen geladen op 3 actieve slides */
.fzv-tv .tvfotovul{position:absolute;top:-8%;right:-8%;bottom:-8%;left:-8%;background-size:cover;background-position:center;filter:blur(22px) brightness(.5)}
/* de foto: contain — de auto wordt nooit afgesneden */
.fzv-tv .tvfoto{position:absolute;top:0;right:0;bottom:0;left:0;background-size:contain;background-repeat:no-repeat;background-position:center}
.fzv-tv .tvbadge{position:absolute;top:1.4vw;left:1.4vw;background:#C8102E;color:#fff;font:700 1.1vw Sora,sans-serif;font-size:clamp(13px,1.1vw,21px);padding:.55em 1.1em;border-radius:.6em;letter-spacing:.02em}
.fzv-tv .tvinfo{position:relative;padding:0 3vw 0 3.4vw;min-width:0;overflow:hidden}
.fzv-tv .tveyebrow{font:700 1.15vw Inter,sans-serif;font-size:clamp(13px,1.15vw,22px);letter-spacing:.18em;text-transform:uppercase;color:#FF9FAE}
.fzv-tv .tvinfo h2{margin:.35em 0 .3em;font:700 4.6vw/1.05 Sora,sans-serif;font-size:clamp(34px,4.6vw,88px);letter-spacing:-.02em;text-wrap:balance;overflow-wrap:break-word}
/* lange modelnamen: kleinere kopmaat zodat prijs + QR altijd in beeld blijven */
.fzv-tv .tvinfo h2.k2{font-size:3.7vw;font-size:clamp(30px,3.7vw,70px)}
.fzv-tv .tvinfo h2.k3{font-size:3vw;font-size:clamp(25px,3vw,56px)}
/* krimp-vangnet (JS zet .compact als de infokolom tóch niet past) */
.fzv-tv .tvslide.compact .tvinfo h2{font-size:2.7vw;font-size:clamp(22px,2.7vw,50px)}
.fzv-tv .tvslide.compact .tvprijs{font-size:3.1vw;font-size:clamp(26px,3.1vw,56px)}
.fzv-tv .tvslide.compact .tvqr img{width:6.5vw;width:clamp(76px,6.5vw,126px)}
.fzv-tv .tvspecs{font:500 1.55vw Inter,sans-serif;font-size:clamp(15px,1.55vw,30px);color:#C7CBD4;display:flex;align-items:center;gap:.8em;flex-wrap:wrap}
.fzv-tv .tvspecs .dot{width:.32em;height:.32em;border-radius:50%;background:#C8102E;display:inline-block;flex:0 0 auto}
.fzv-tv .tvprijs{margin:.5em 0 .35em;font:800 4vw Sora,sans-serif;font-size:clamp(34px,4vw,76px)}
.fzv-tv .tvprijs::before{content:"";display:inline-block;width:.22em;height:.78em;background:#C8102E;border-radius:.08em;margin-right:.28em;vertical-align:-8%}
.fzv-tv .tvvoet{font:500 1.15vw Inter,sans-serif;font-size:clamp(13px,1.15vw,22px);color:#9AA0AB}
/* QR-kaartje — groot genoeg om vanaf de bank te scannen; inline-flex = krimpt altijd passend */
.fzv-tv .tvqr{display:inline-flex;align-items:center;gap:1.1vw;background:#fff;color:#1b2026;border-radius:1vw;padding:.9vw 1.2vw;max-width:100%;margin:1vw 0 .9vw;box-shadow:0 1.5vh 4vh rgba(0,0,0,.4)}
.fzv-tv .tvqr img{width:8.5vw;width:clamp(90px,8.5vw,170px);height:auto;display:block;border-radius:.4vw;flex:0 0 auto}
.fzv-tv .tvqr span{font:600 1.15vw/1.35 Inter,sans-serif;font-size:clamp(13px,1.15vw,22px)}
/* ---- promo-slide: fullscreen, gecentreerd, meeschalend ---- */
.fzv-tv .promo{display:grid;place-items:center;background:radial-gradient(80% 90% at 50% 10%,#1c2027,#0F1115)}
.fzv-tv .tvpromo{text-align:center;max-width:82vw;display:flex;flex-direction:column;align-items:center}
.fzv-tv .promo h2{margin:.3em 0 .25em;font:700 6.8vw/1.04 Sora,sans-serif;font-size:clamp(46px,6.8vw,150px);letter-spacing:-.02em;text-wrap:balance;overflow-wrap:break-word}
.fzv-tv .promo h2::after{content:"";display:block;width:2.2em;height:.09em;border-radius:.05em;background:#C8102E;margin:.32em auto 0}
.fzv-tv .tvsub{font:500 1.9vw/1.5 Inter,sans-serif;font-size:clamp(17px,1.9vw,36px);color:#C7CBD4;margin:0 0 .8em;max-width:60ch;text-wrap:balance}
.fzv-tv .promo .tvqr{margin:.4vw 0 1vw}
/* ---- voortgangsbalk ---- */
.fzv-tv .tvbalk{position:absolute;left:0;right:0;bottom:0;height:.6vh;background:rgba(255,255,255,.08);z-index:3}
.fzv-tv .tvvul{height:100%;width:0;background:#C8102E}
.fzv-tv .tvvul.loopt{animation:fzvtv-vul linear forwards}
@keyframes fzvtv-vul{from{width:0}to{width:100%}}