/* Paginaschil Van Yild Tegels. Maten en kleuren van de header zijn nagemeten in de
   Elementor-export (kit-4 en header-sjabloon 2758); de footer is een nieuw ontwerp. */

@font-face{font-family:Poppins;font-style:normal;font-weight:300;font-display:swap;src:url(/assets/vy/fonts/poppins-300.woff2) format("woff2")}
@font-face{font-family:Poppins;font-style:normal;font-weight:400;font-display:swap;src:url(/assets/vy/fonts/poppins-400.woff2) format("woff2")}
@font-face{font-family:Poppins;font-style:normal;font-weight:500;font-display:swap;src:url(/assets/vy/fonts/poppins-500.woff2) format("woff2")}
@font-face{font-family:Poppins;font-style:normal;font-weight:600;font-display:swap;src:url(/assets/vy/fonts/poppins-600.woff2) format("woff2")}
@font-face{font-family:Poppins;font-style:normal;font-weight:700;font-display:swap;src:url(/assets/vy/fonts/poppins-700.woff2) format("woff2")}

:root{
  /* Globale kleuren uit elementor-kit-4 */
  --vy-navy:#010F39;        /* accentbackground: donkere balken */
  --vy-blauw:#105CDA;       /* accent: knoppen */
  --vy-blauw-donker:#213276;/* darkeraccent: hover */
  --vy-tekst:#7A7A7A;
  --vy-ink:#14171a;
  --vy-lijn:#e6e8eb;
  --vy-goud:#ffd23f;        /* alleen als actie-accent (badge van de sitekorting) */
  --vy-font:Poppins,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  /* Actiebalk (snippet 8237): --vy-balk-min is de ondergrens uit het ontwerp,
     --vy-balk-h de ruimte die eronder wordt vrijgehouden. Zonder balk is die 0. */
  --vy-balk-min:40px;
  --vy-balk-h:0px;
}
.vy-heeft-balk{--vy-balk-h:var(--vy-balk-min)}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}/* Ankers en velden landen onder de sticky kop. Eerst stond dit als scroll-padding op html, maar dan vond de browser het zoekveld IN die kop "bedekt" en scrolde bij focus en bij elke letter naar boven. */[id]:not(.vy-kop *):not(.vy-kop){scroll-margin-top:calc(var(--vy-balk-h) + 180px)}
body.vy-schil{margin:0;font-family:var(--vy-font);font-size:16px;font-weight:300;line-height:1.6;color:var(--vy-ink);background:#fff;padding-top:var(--vy-balk-h)}
body.vy-slot{overflow:hidden}
.vy-schil img{max-width:100%;height:auto}
.vy-schil main{display:block;min-height:40vh}
.vy-schil main:focus{outline:0}
.vy-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.vy-ico{width:1em;height:1em;fill:currentColor;flex:none}

/* Focus: overal dezelfde zichtbare ring */
.vy-schil a:focus-visible,.vy-schil button:focus-visible,.vy-schil input:focus-visible,
.vy-schil select:focus-visible,.vy-schil textarea:focus-visible,.vy-schil summary:focus-visible{outline:3px solid #7fb0ff;outline-offset:2px;border-radius:4px}

.vy-skip{position:fixed;left:12px;top:-80px;z-index:2147483600;background:#fff;color:var(--vy-navy);padding:10px 16px;border-radius:8px;font-weight:600;text-decoration:none;box-shadow:0 6px 24px rgba(1,15,57,.25)}
.vy-skip:focus{top:calc(var(--vy-balk-h) + 10px)}

/* Knoppen */
.vy-knop{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:8px;background:var(--vy-blauw);color:#fff;font:300 16px/1 var(--vy-font);padding:15px 25px;text-align:center;text-decoration:none;cursor:pointer;transition:background-color .3s}
.vy-knop:hover,.vy-knop:focus{background:var(--vy-blauw-donker);color:#fff}
.vy-knop--goud{background:var(--vy-goud);color:var(--vy-navy);font-weight:600}
.vy-knop--goud:hover,.vy-knop--goud:focus{background:#ffdf6e;color:var(--vy-navy)}
.vy-knop--rand{background:transparent;box-shadow:inset 0 0 0 1px rgba(255,255,255,.55);font-weight:400}
.vy-knop--rand:hover,.vy-knop--rand:focus{background:rgba(255,255,255,.12)}
.vy-knop[disabled]{opacity:.6;cursor:default}

/* ---------------- Actiebalk sitekorting (1-op-1 uit snippet 8237) ---------------- */
.vy-korting-balk{position:fixed;top:0;left:0;right:0;z-index:999999;min-height:var(--vy-balk-min);display:flex;align-items:center;justify-content:center;flex-wrap:wrap;row-gap:1px;padding:6px 16px;background:var(--vy-balk-bg,#0a3c8f);color:#fff;font:500 14px/1.35 var(--vy-font);letter-spacing:.01em;text-align:center;transition:opacity .2s ease}
.vy-korting-balk[hidden]{display:none}
.vy-korting-balk__hl{display:inline-block;background:var(--vy-balk-hl,var(--vy-goud));color:var(--vy-balk-hl-tekst,#14171a);padding:2px 10px;margin-right:3px;border-radius:999px;font-weight:700;letter-spacing:.01em;white-space:nowrap}
.vy-korting-balk__sub{font-weight:400;font-size:13px;opacity:.8}
.vy-korting-balk__sub::before{content:"\2022";margin:0 12px;opacity:.55}
@media (max-width:767px){
  :root{--vy-balk-min:50px}
  .vy-korting-balk{font-size:12.5px;flex-wrap:nowrap;padding:0 12px;overflow:hidden}
  .vy-korting-balk__hl{padding:1px 8px;margin-right:2px}
  .vy-korting-balk__sub{font-size:12px;opacity:1}
  .vy-korting-balk__sub::before{display:none}
  .vy-korting-balk.is-wissel .vy-korting-balk__slide{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:0 12px;text-align:center;line-height:1.25;white-space:normal;overflow:hidden;animation:vy-korting-wissel 12s infinite}
  .vy-korting-balk.is-wissel .vy-korting-balk__sub{opacity:0;animation-delay:6s}
}
@keyframes vy-korting-wissel{0%,42%{opacity:1}50%,92%{opacity:0}100%{opacity:1}}

/* ---------------- Header ---------------- */
.vy-kop{position:sticky;top:var(--vy-balk-h);z-index:1000;background:#fff;font-family:var(--vy-font)}
body:has(.vy-nav__schakel:checked) .vy-kop,body.vy-menu-open .vy-kop{z-index:2147483000}
body:has(.vy-nav__schakel:checked) .vy-korting-balk,body:has(.vy-nav__schakel:checked) .vy-zweef,body:has(.vy-nav__schakel:checked) .vy-lade{opacity:0;pointer-events:none}

/* Hoofdrij: kolommen 25 / 50 / 15 / 10 procent, 2px lucht boven en onder */
.vy-kop__hoofd{display:grid;grid-template-columns:25% 50% 15% 10%;align-items:center;padding:2px 0;background:#fff;color:var(--vy-ink)}
.vy-kop__logo{display:block;max-width:334px;margin:1em 0 1em 1em;line-height:0}
.vy-kop__logo img{display:block;width:100%;height:auto}
.vy-kop__nav{display:flex;justify-content:center;align-items:center;min-width:0;padding:0 10px}
.vy-kop__actie{display:flex;align-items:center;padding:10px}
.vy-kop__showroom{width:100%;padding:15px 25px;box-shadow:0 0 75px -16px rgba(0,0,0,.5);line-height:1}
.vy-kop__wagenvak{position:relative;display:flex;align-items:center;padding:10px}
.vy-kop__wagen{display:inline-flex;align-items:center;gap:11px;padding:4px;color:var(--vy-ink);font-size:14px;font-weight:500;line-height:1;text-decoration:none;white-space:nowrap}
.vy-kop__som:empty{display:none}
.vy-kop__wagenico{position:relative;display:inline-flex}
.vy-kop__wagenico svg{width:24px;height:24px;display:block;transition:opacity .14s ease}
.vy-kop__wagen:hover svg{opacity:.65}
.vy-kop__teller{position:absolute;top:-6px;right:-9px;display:inline-flex;align-items:center;justify-content:center;min-width:17px;height:17px;padding:0 4px;border-radius:999px;background:var(--vy-blauw);color:#fff;font-size:10.5px;font-weight:700;line-height:1;border:2px solid #fff;box-sizing:content-box}
.vy-kop__teller[hidden]{display:none}
#vy-wagen-popover[hidden]{display:none}

/* Tweede rij: navy, kolommen 15 / 50,5 / 20,5 / 14 procent */
.vy-kop__onder{display:grid;grid-template-columns:15% 50.504% 20.496% 14%;align-items:center;background:var(--vy-navy);color:#fff}
.vy-kop__social{display:flex;justify-content:flex-end;padding:10px 20px 10px 10px}
.vy-kop__social a,.vy-voet__social a{display:inline-flex;align-items:center;justify-content:center;width:44.8px;height:42px;color:#fff;font-size:14px;border-radius:3px;transition:background-color .3s,color .3s}
.vy-kop__social a:hover{background:rgba(255,255,255,.1);color:var(--vy-blauw)}
.vy-kop__usps{display:flex;justify-content:center;flex-wrap:wrap;gap:0 16px;list-style:none;margin:0;padding:10px;font-size:16px;font-weight:400;line-height:1.5}
.vy-kop__usps li{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.vy-kop__usps .vy-ico{font-size:14px}
.vy-kop__rotator{display:none}
.vy-kop__zoek{padding:10px 0;min-width:0}
.vy-kop__account{display:inline-flex;align-items:center;gap:5px;padding:10px;color:#fff;font-size:16px;font-weight:400;text-decoration:none}
.vy-kop__account .vy-ico{font-size:14px}
.vy-kop__account:hover span{text-decoration:underline}

/* Terugval-onderdelen (alleen zichtbaar zolang vy_onderdelen ontbreekt) */
.vy-menu__knop{display:none}
.vy-menu__lijst{display:flex;align-items:center;justify-content:center;gap:28px;list-style:none;margin:0;padding:0}
.vy-menu__lijst a{display:inline-flex;padding:10px 0;color:inherit;font-size:16px;font-weight:400;text-decoration:none}
.vy-menu__lijst a:hover,.vy-menu__lijst a[aria-current]{color:var(--vy-blauw-donker)}
.vy-menu__alleen-mobiel{display:none}
.vy-zoekje{display:flex;align-items:center;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.25);border-radius:999px;padding:0 6px 0 4px}
.vy-zoekje button{display:inline-flex;background:none;border:0;color:#fff;padding:8px;cursor:pointer}
.vy-zoekje svg{width:18px;height:18px}
.vy-zoekje input{flex:1;min-width:0;background:none;border:0;color:#fff;font:400 14px var(--vy-font);padding:9px 8px 9px 0;outline:0}
.vy-zoekje input::placeholder{color:rgba(255,255,255,.7)}
.vy-uspwissel{display:grid;justify-items:center;color:#fff;font-size:14px;font-weight:400;line-height:1.5}
.vy-uspwissel__item{grid-area:1/1;display:flex;align-items:center;gap:8px;opacity:0;animation:vy-uspwissel 9s ease-in-out infinite both}
.vy-uspwissel__item:nth-child(2){animation-delay:3s}
.vy-uspwissel__item:nth-child(3){animation-delay:6s}
.vy-uspwissel .vy-ico{font-size:14px}
@keyframes vy-uspwissel{0%{opacity:0}4%,30%{opacity:1}34%,100%{opacity:0}}

/* Tablet: logo 35 / (menu) / knop 38 / wagen; tweede rij wordt de USP-rotator */
@media (max-width:1024px){
  .vy-kop__hoofd{grid-template-columns:35% minmax(0,1fr) auto auto;padding:10px 0}
  .vy-kop__logo{max-width:239px}
  .vy-kop__nav{order:4;justify-content:flex-end;padding:0 12px 0 0}
  .vy-kop__actie{order:2;justify-content:center}
  .vy-kop__showroom{width:auto;box-shadow:0 0 36px -16px rgba(0,0,0,.5)}
  .vy-kop__wagenvak{order:3}
  .vy-kop__onder{display:block;padding:10px 15px}
  .vy-kop__social,.vy-kop__usps,.vy-kop__zoek,.vy-kop__account{display:none}
  .vy-kop__rotator{display:block}
  .vy-menu{position:relative}
  .vy-menu__knop{display:flex;flex-direction:column;justify-content:center;gap:5px;width:36px;height:36px;padding:8px;background:none;border:0;color:var(--vy-ink);cursor:pointer}
  .vy-menu__knop span{display:block;height:2px;background:currentColor;border-radius:2px}
  .vy-menu__lijst{display:none;position:absolute;right:0;top:calc(100% + 12px);flex-direction:column;align-items:stretch;gap:0;min-width:240px;background:#fff;border:1px solid var(--vy-lijn);border-radius:12px;box-shadow:0 18px 50px rgba(15,23,42,.16);padding:8px 18px}
  .vy-menu.is-open .vy-menu__lijst{display:flex}
  .vy-menu__lijst a{display:flex;padding:13px 0;border-bottom:1px solid #f0f0f0}
  .vy-menu__lijst li:last-child a{border-bottom:0}
  .vy-menu__alleen-mobiel{display:block}
}
/* Mobiel: logo 144px, knop compact, wagen en hamburger */
@media (max-width:767px){
  .vy-kop__hoofd{grid-template-columns:minmax(0,38%) minmax(0,1fr) auto auto}
  .vy-kop__logo{max-width:144px;margin:0;padding-left:5px}
  .vy-kop__actie{padding:0 6px}
  .vy-kop__showroom{font-size:14px;line-height:1.2;border-radius:5px;padding:10px;max-width:158px}
  .vy-kop__wagenvak{padding:0 4px}
  .vy-kop__som{display:none}
  .vy-kop__nav{padding:0 6px 0 0}
  .vy-kop__onder{padding:9px 0}
}

/* ---------------- Zwevende knoppen en de offertelade ---------------- */
.vy-zweef{position:fixed;right:20px;bottom:20px;z-index:900;display:flex;flex-direction:column;gap:14px;transition:opacity .2s ease}
.vy-zweef__knop{display:flex;align-items:center;justify-content:center;width:62px;height:62px;border-radius:50%;background:var(--vy-blauw);color:#fff;font-size:30px;box-shadow:0 0 69px -15px rgba(0,0,0,.5);transition:background-color .3s,transform .3s}
.vy-zweef__knop:hover{background:var(--vy-blauw-donker);transform:scale(1.1)}
.vy-lade{position:fixed;right:0;top:48%;z-index:900;transform:rotate(-90deg);transform-origin:right bottom;border:0;border-radius:8px 8px 0 0;background:var(--vy-blauw);color:#fff;font:400 14px/1 var(--vy-font);padding:14px 24px 16px;cursor:pointer;transition:background-color .3s,opacity .2s ease}
.vy-lade:hover,.vy-lade:focus{background:var(--vy-blauw-donker)}
@media (max-height:640px){.vy-lade{display:none}}
@media (max-width:767px){
  .vy-lade{display:none}
  .vy-zweef{right:14px;bottom:14px;gap:10px}
  .vy-zweef__knop{width:58px;height:58px;font-size:29px}
}

/* ---------------- Vensters ---------------- */
.vy-venster{position:fixed;inset:0;z-index:2147483100;display:flex;align-items:center;justify-content:center;padding:16px}
.vy-venster[hidden]{display:none}
.vy-venster__waas{position:absolute;inset:0;background:rgba(1,15,57,.62);opacity:0;transition:opacity .22s ease}
.vy-venster__paneel{position:relative;width:min(680px,100%);max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);overflow-y:auto;overscroll-behavior:contain;background:#fff;border-radius:16px;padding:34px 36px 32px;box-shadow:0 30px 80px rgba(1,15,57,.35);opacity:0;transform:translateY(14px);transition:opacity .22s ease,transform .22s ease}
.vy-venster__paneel:focus{outline:0}
.vy-venster.is-in .vy-venster__waas{opacity:1}
.vy-venster.is-in .vy-venster__paneel{opacity:1;transform:none}
.vy-venster__sluit{position:absolute;top:14px;right:14px;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:0;border-radius:50%;background:#f2f4f8;color:var(--vy-navy);cursor:pointer}
.vy-venster__sluit:hover{background:#e3e8f1}
.vy-venster__sluit svg{width:20px;height:20px}
.vy-venster__titel{margin:0 44px 10px 0;font-size:26px;font-weight:600;line-height:1.25;color:var(--vy-navy)}
.vy-venster__tekst{margin:0 0 16px;color:#3c4350}
.vy-venster__feiten{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 0 22px}
.vy-venster__feiten>div{background:#f4f7fc;border-radius:10px;padding:12px 14px}
.vy-venster__feiten dt{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--vy-blauw-donker);margin:0 0 3px}
.vy-venster__feiten dd{margin:0;font-size:14.5px;font-weight:400;line-height:1.5}
.vy-venster__feiten a{color:inherit}

.vy-form__raster{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px 16px}
.vy-form__veld--breed{grid-column:1/-1}
.vy-form label{display:block;margin:0 0 5px;font-size:14px;font-weight:500;color:var(--vy-navy)}
.vy-form__opt{font-weight:300;color:var(--vy-tekst)}
.vy-form input,.vy-form select,.vy-form textarea{display:block;width:100%;min-height:47px;border:1px solid #cfd5df;border-radius:8px;background:#fff;color:var(--vy-ink);font:400 16px/1.4 var(--vy-font);padding:11px 13px}
.vy-form textarea{resize:vertical;min-height:96px}
.vy-form input::placeholder,.vy-form textarea::placeholder{color:#9aa1ad}
.vy-form [aria-invalid="true"]{border-color:#b42318}
.vy-form__hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.vy-form__melding{margin:14px 0 0;padding:10px 14px;border-radius:8px;background:#fdecea;color:#8a1c12;font-size:14.5px;font-weight:400}
.vy-form__melding[hidden]{display:none}
.vy-form__knop{margin-top:18px;width:100%;font-weight:500}
@media (max-width:600px){
  .vy-venster{padding:0;align-items:flex-end}
  .vy-venster__paneel{border-radius:18px 18px 0 0;padding:26px 18px 22px;max-height:92vh;max-height:92dvh;transform:translateY(40px)}
  .vy-venster__titel{font-size:22px}
  .vy-venster__feiten,.vy-form__raster{grid-template-columns:minmax(0,1fr)}
}

/* ---------------- Footer (nieuw ontwerp) ---------------- */
.vy-voet{background:var(--vy-navy);color:#fff;font-family:var(--vy-font);font-weight:300;margin-top:72px}
.vy-voet a{color:#fff;text-decoration:none}
.vy-voet a:hover{text-decoration:underline;text-underline-offset:3px}
.vy-voet__cta{display:flex;align-items:center;justify-content:space-between;gap:24px 40px;flex-wrap:wrap;width:calc(100% - 64px);max-width:1256px;margin:0 auto;padding:30px 38px;position:relative;top:-44px;background:linear-gradient(120deg,var(--vy-blauw-donker),var(--vy-blauw));border-radius:18px;box-shadow:0 24px 60px -24px rgba(1,15,57,.7)}
.vy-voet__cta h2{margin:0 0 4px;font-size:26px;font-weight:600;line-height:1.25}
.vy-voet__cta p{margin:0;max-width:56ch;color:rgba(255,255,255,.88)}
.vy-voet__ctaknoppen{display:flex;flex-wrap:wrap;gap:12px}
.vy-voet__hoofd{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:40px 48px;max-width:1320px;margin:0 auto;padding:0 32px 48px}
.vy-voet__logo{display:block;width:170px;margin:0 0 18px -8px;line-height:0}
.vy-voet__logo img{display:block;width:100%;height:auto}
.vy-voet__naw{display:flex;flex-direction:column;gap:5px;font-style:normal;font-size:15px;line-height:1.5}
.vy-voet__naw strong{font-weight:600;font-size:16px;margin-bottom:2px}
.vy-voet__reg{margin:16px 0 8px;font-size:13.5px;color:rgba(255,255,255,.72);line-height:1.6}
.vy-voet__social{display:flex;gap:4px;margin-left:-14px}
.vy-voet__social a:hover{background:rgba(255,255,255,.1)}
.vy-voet__kolom h2{margin:6px 0 14px;font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#9CC1FF}
.vy-voet__kolom ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;font-size:15px}
.vy-voet__onder{display:flex;align-items:center;justify-content:space-between;gap:14px 28px;flex-wrap:wrap;max-width:1320px;margin:0 auto;padding:20px 112px 26px 32px;border-top:1px solid rgba(255,255,255,.14);font-size:13.5px;color:rgba(255,255,255,.78)}
.vy-voet__copy{margin:0}.vy-voet__maker{color:inherit;text-decoration:underline;text-underline-offset:2px}.vy-voet__maker:hover{color:#fff}
.vy-voet__juridisch{display:flex;flex-wrap:wrap;gap:6px 20px;list-style:none;margin:0;padding:0}
.vy-voet__juridisch a{color:rgba(255,255,255,.85)}
.vy-voet__betaal{display:flex;gap:8px}
.vy-betaal{display:grid;place-items:center;width:58px;height:36px;border-radius:6px;background:#fff}
.vy-betaal img{display:block;width:auto;max-width:48px;height:28px}
@media (max-width:1024px){
  .vy-voet__hoofd{grid-template-columns:repeat(3,minmax(0,1fr))}
  .vy-voet__merk{grid-column:1/-1}
}
@media (max-width:767px){
  .vy-voet{margin-top:56px;padding-bottom:84px}
  .vy-voet__cta{width:calc(100% - 32px);padding:24px 22px;top:-36px}
  .vy-voet__cta h2{font-size:21px}
  .vy-voet__ctaknoppen,.vy-voet__ctaknoppen .vy-knop{width:100%}
  .vy-voet__hoofd{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 20px;padding:0 20px 36px}
  .vy-voet__onder{flex-direction:column;align-items:flex-start;padding:20px}
}

@media (prefers-reduced-motion:reduce){
  .vy-schil *,.vy-schil *::before,.vy-schil *::after{transition-duration:.01ms!important;scroll-behavior:auto!important}
  .vy-korting-balk.is-wissel .vy-korting-balk__slide{animation:none}
  .vy-korting-balk.is-wissel .vy-korting-balk__sub{display:none}
  .vy-uspwissel__item{animation:none;opacity:0}
  .vy-uspwissel__item:first-child{opacity:1}
  .vy-zweef__knop:hover{transform:none}
}
.vy-voet--kaal{padding-top:48px}

/* Logo op de lijn van de inhoud (klant, 21-09-2026). De infopagina's staan in een kolom van
   1320 px met een goot van clamp(20px,4.2vw,56px); de hoofdrij van de header krijgt op desktop
   dezelfde zijmarges, zodat het logo links gelijk staat met de titel in de hero en de
   winkelwagen rechts met de rand van de inhoud. Procenten in padding rekenen tegen de breedte
   ZONDER schuifbalk, dus geen 100vw (dat zit er een schuifbalk naast). */
@media (min-width:1025px){
  .vy-kop__hoofd{padding-left:max(clamp(20px,4.2vw,56px),calc((100% - 1320px) / 2));
    padding-right:max(clamp(20px,4.2vw,56px),calc((100% - 1320px) / 2))}
  .vy-kop__logo{margin-left:0;margin-right:0}
}
/* De navy rij volgt dezelfde kolom (klant, 04-10-2026): LinkedIn/Instagram links op de lijn van
   het logo, "Mijn account" rechts op de lijn van de winkelwagen. De -14px compenseert het
   tikvlak van 44,8 px rond het icoon, zoals in de footer. */
@media (min-width:1025px){
  .vy-kop__onder{grid-template-columns:auto minmax(0,1fr) minmax(240px,21%) auto;column-gap:clamp(12px,1.6vw,24px);
    padding-left:max(clamp(20px,4.2vw,56px),calc((100% - 1320px) / 2));
    padding-right:max(clamp(20px,4.2vw,56px),calc((100% - 1320px) / 2))}
  .vy-kop__social{justify-content:flex-start;padding:10px 0;margin-left:-14px}
  .vy-kop__account{padding-right:0}
}
@media (min-width:1025px) and (max-width:1319px){
  .vy-kop__usps{font-size:14.5px;gap:0 12px;padding:10px 0}
}
/* Onder 1200 px passen drie USP's niet meer op een regel naast zoeken en account. */
@media (min-width:1025px) and (max-width:1199px){
  .vy-kop__usps li:nth-child(n+3){display:none}
}
/* Pas vanaf 1320 px is er ruimte voor een vrij geplaatst logo naast het volledige menu; daaronder
   blijft de oorspronkelijke kolomverdeling, anders schuift het menu onder de showroomknop. */
@media (min-width:1320px){
  .vy-kop__hoofd{grid-template-columns:auto minmax(0,1fr) auto auto;column-gap:24px}
  .vy-kop__logo{width:clamp(250px,21vw,334px);max-width:none}
}
/* Tussen 1025 en 1319 px is de rij krap: het menu schuift dan iets in, zodat het niet onder het
   logo of de showroomknop komt. Het staat in schil.css en niet in onderdelen.css, omdat die
   laatste letterlijk uit de snippet komt. */
@media (min-width:1025px) and (max-width:1319px){
  .vy-kop__hoofd{grid-template-columns:auto minmax(0,1fr) auto auto;column-gap:16px}
  .vy-kop__logo{width:clamp(172px,17vw,250px);max-width:none}
  .vy-kop .vy-nav__rij{gap:clamp(10px,1.5vw,24px)}
  .vy-kop .vy-nav__top{font-size:14.5px}
  .vy-kop__showroom{padding:10px 14px;font-size:13.5px}
}
@media (min-width:1025px) and (max-width:1099px){
  .vy-kop .vy-nav__top{font-size:13.5px}
  .vy-kop .vy-nav__rij{gap:9px}
  .vy-kop__showroom{padding:9px 11px;font-size:13px}
}
/* responsive-check 04-10-2026 */
.vy-kop .vy-nav__top{white-space:nowrap}                 /* "Over ons" brak op 1100 en 1366px */
@media (max-width:767px){
  .vy-kop__wagen{min-width:44px;min-height:44px;justify-content:center}   /* tikvlak was 32px */
}