/* Lesli Living – gedeelde stijl voor alle pagina's
   Kleuren en typografie volgens het brandbook; diagonalen altijd 15° (tan 15° ≈ 0,268). */

@font-face{font-family:'Politica';src:local('Politica Regular'),local('Politica-Regular'),local('Politica');font-weight:300 500;font-display:swap}
@font-face{font-family:'Politica';src:local('Politica Bold'),local('Politica-Bold');font-weight:600 800;font-display:swap}
@font-face{font-family:'Proxima Nova';src:local('Proxima Nova Regular'),local('ProximaNova-Regular'),local('Proxima Nova');font-weight:300 500;font-display:swap}
@font-face{font-family:'Proxima Nova';src:local('Proxima Nova Bold'),local('ProximaNova-Bold'),local('Proxima Nova Semibold'),local('ProximaNova-Semibold');font-weight:600 800;font-display:swap}

:root{
  --ll-green:#244533;--ll-green-dark:#1A3326;--ll-muted:#4E6B56;
  --ll-tint:#E3E8E4;--ll-panel:#EAEDEB;--ll-line:rgba(36,69,51,0.35);
  --ll-yellow:#E7DB04;--ll-yellow-light:#F3ED82;--ll-white:#ffffff;
  --ll-display:'Politica','Saira Semi Condensed','Arial Narrow',sans-serif;
  --ll-body:'Proxima Nova','proxima-nova','Figtree','Helvetica Neue',Arial,sans-serif;
  --ll-gutter:clamp(16px,4vw,40px);
}

html{scroll-behavior:smooth;scroll-padding-top:110px}
body{margin:0;background:var(--ll-white)}
a{color:var(--ll-green)}a:hover{color:var(--ll-green-dark)}
img{max-width:100%}
.ll-page{width:100%;background:var(--ll-white);color:var(--ll-green);font-family:var(--ll-body);font-size:17px;line-height:1.6;overflow:clip}
.ll-wrap{max-width:1360px;margin:0 auto;padding:0 var(--ll-gutter);box-sizing:border-box;position:relative}
.ll-wrap--narrow{max-width:940px}
.ll-skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--ll-green);color:#fff;padding:12px 18px}
.ll-skip:focus{left:16px;top:16px}

/* ---------- Topbalk ---------- */
.ll-topbarwrap{background:var(--ll-green);color:#fff;font-size:13px;letter-spacing:.02em}
.ll-topbar{max-width:1360px;margin:0 auto;padding:10px var(--ll-gutter);box-sizing:border-box;display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;align-items:center}
.ll-topbar a{color:#fff;text-decoration:none;display:inline-flex;gap:8px;align-items:center}
.ll-topbar-links{display:flex;flex-wrap:wrap;gap:8px 24px;align-items:center}
.ll-topbarwrap{position:relative;z-index:110}
/* Taalkeuze (WPML) */
.ll-langsw{position:relative}
.ll-langbtn{display:inline-flex;align-items:center;gap:8px;min-height:32px;padding:0 4px;background:none;border:0;color:#fff;font:inherit;font-weight:600;letter-spacing:.04em;cursor:pointer}
.ll-langbtn svg:last-child{transition:transform .2s}
.ll-langsw.is-open .ll-langbtn svg:last-child{transform:rotate(180deg)}
.ll-langbtn:hover span{text-decoration:underline}
.ll-langbtn:focus-visible{outline:2px solid var(--ll-yellow);outline-offset:2px}
.ll-langlist{display:none;position:absolute;right:0;top:calc(100% + 6px);min-width:200px;margin:0;padding:8px;list-style:none;background:#fff;border-top:3px solid var(--ll-yellow);box-shadow:0 18px 40px -12px rgba(36,69,51,.45);font-size:15px;letter-spacing:0}
.ll-langsw.is-open .ll-langlist{display:block}
.ll-topbar .ll-langlist a{display:flex;align-items:center;gap:12px;padding:10px 12px;color:var(--ll-green);text-decoration:none}
.ll-topbar .ll-langlist a:hover,.ll-topbar .ll-langlist a:focus-visible{background:var(--ll-tint);outline:none}
.ll-topbar .ll-langlist a[aria-current]{font-weight:700}
.ll-langlist svg{margin-left:auto}
.ll-langcode{display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:22px;background:var(--ll-tint);font-family:var(--ll-display);font-size:13px;font-weight:700;letter-spacing:.06em}
.ll-langlist a[aria-current] .ll-langcode{background:var(--ll-yellow)}
.ll-mlang{display:grid;grid-template-columns:repeat(3,1fr);margin-top:20px;border:1.5px solid var(--ll-green)}
.ll-mnav .ll-mlang a{display:flex;align-items:center;justify-content:center;min-height:48px;font-family:var(--ll-body);font-size:15px;font-weight:600;text-transform:none;letter-spacing:0;text-decoration:none;color:var(--ll-green);border:0}
.ll-mlang a+a{border-left:1.5px solid var(--ll-green) !important}
.ll-mlang a[aria-current]{background:var(--ll-green);color:#fff !important}

/* ---------- Header & navigatie ---------- */
.ll-header{position:sticky;top:0;z-index:100;background:#fff;border-bottom:1px solid var(--ll-line);transition:box-shadow .25s}
.ll-header.is-stuck{box-shadow:0 6px 20px rgba(36,69,51,0.12)}
.ll-headrow{max-width:1360px;margin:0 auto;padding:18px var(--ll-gutter);box-sizing:border-box;display:flex;flex-wrap:wrap;gap:16px 32px;align-items:center;justify-content:space-between}
.ll-logolink{display:block;line-height:0}
.ll-logo{height:60px;width:auto;display:block}
.ll-menu{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 30px;align-items:center;font-family:var(--ll-display);font-size:17px;font-weight:600;letter-spacing:.05em;text-transform:uppercase}
.ll-menu>li{position:relative}
.ll-menulink,.ll-ddbtn{display:inline-flex;gap:6px;align-items:center;padding:10px 0;text-decoration:none;color:var(--ll-green);font:inherit;letter-spacing:inherit;text-transform:inherit;background:none;border:0;cursor:pointer;position:relative}
.ll-menulink::after,.ll-ddbtn::after{content:"";position:absolute;left:0;right:0;bottom:4px;height:2px;background:var(--ll-yellow);transform:scaleX(0);transform-origin:left;transition:transform .25s}
.ll-menulink:hover::after,.ll-ddbtn:hover::after,.ll-menulink[aria-current]::after,.ll-ddbtn.is-current::after{transform:none}
.ll-ddbtn svg{transition:transform .2s}
.ll-dd.is-open .ll-ddbtn svg{transform:rotate(180deg)}
.ll-ddpanel{position:absolute;top:100%;left:-24px;min-width:320px;padding:10px;background:#fff;border-top:3px solid var(--ll-yellow);box-shadow:0 18px 40px -12px rgba(36,69,51,0.35);display:none;z-index:5;text-transform:none;letter-spacing:0}
.ll-dd.is-open .ll-ddpanel{display:block}
@media (hover:hover) and (pointer:fine){.ll-dd:hover .ll-ddpanel{display:block}.ll-dd:hover .ll-ddbtn svg{transform:rotate(180deg)}}
.ll-ddpanel ul{list-style:none;margin:0;padding:0}
.ll-ddpanel a{display:block;padding:12px 16px;text-decoration:none;color:var(--ll-green);transition:background .15s}
.ll-ddpanel a:hover,.ll-ddpanel a:focus-visible,.ll-ddpanel a[aria-current]{background:var(--ll-tint)}
.ll-ddpanel strong{display:block;font-family:var(--ll-display);font-size:18px;font-weight:600;letter-spacing:.03em;text-transform:uppercase}
.ll-ddpanel span{display:block;font-family:var(--ll-body);font-size:14px;font-weight:400;color:var(--ll-muted);line-height:1.45;margin-top:2px}
.ll-headactions{display:flex;gap:12px;align-items:center}
.ll-headcta{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 24px;background:var(--ll-green);color:#fff;text-decoration:none;font-family:var(--ll-display);font-size:17px;font-weight:600;letter-spacing:.05em;text-transform:uppercase}
.ll-headcta:hover{background:var(--ll-green-dark);color:#fff}
.ll-burger{display:none !important;align-items:center;justify-content:center;gap:8px;min-width:48px;height:48px;padding:0 14px;border:1.5px solid var(--ll-green);background:#fff;color:var(--ll-green);cursor:pointer;font-family:var(--ll-display);font-size:16px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.ll-mobilemenu{display:none;border-top:1px solid var(--ll-line);background:#fff;max-height:calc(100vh - 90px);max-height:calc(100dvh - 90px);overflow-y:auto}
.ll-mobilemenu[hidden],.ll-burger svg[hidden]{display:none !important}
.ll-mnav{max-width:1360px;margin:0 auto;padding:8px var(--ll-gutter) 28px;box-sizing:border-box;display:flex;flex-direction:column;font-family:var(--ll-display);font-size:22px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.ll-mnav>a,.ll-mnav summary{display:flex;justify-content:space-between;align-items:center;min-height:56px;border-bottom:1px solid var(--ll-tint);text-decoration:none;color:var(--ll-green);cursor:pointer;list-style:none}
.ll-mnav summary::-webkit-details-marker{display:none}
.ll-mnav details[open] summary svg{transform:rotate(180deg)}
.ll-mnav details ul{list-style:none;margin:0;padding:6px 0 12px 16px;border-bottom:1px solid var(--ll-tint)}
.ll-mnav details a{display:block;padding:9px 0;font-family:var(--ll-body);font-size:17px;font-weight:500;text-transform:none;letter-spacing:0;text-decoration:none;color:var(--ll-green)}
.ll-mnav details a[aria-current]{font-weight:700;box-shadow:inset 3px 0 0 var(--ll-yellow);padding-left:12px}
.ll-mnav .ll-mcta{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;margin-top:20px;padding:0 24px;background:var(--ll-green);color:#fff;text-decoration:none;font-size:18px;letter-spacing:.05em;border:0}

/* ---------- Typografie & knoppen ---------- */
.ll-eyebrow{margin:0 0 12px;font-family:var(--ll-display);font-size:16px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ll-muted)}
.ll-eyebrow--mark{display:flex;align-items:center;gap:12px;font-family:var(--ll-body);font-size:14px;letter-spacing:.16em}
.ll-eyebrow--mark::before{content:"";flex:none;width:18px;height:16px;background:var(--ll-yellow);clip-path:polygon(0 0,14px 0,18px 100%,4px 100%)}
.ll-h1{margin:0;font-family:var(--ll-display);font-weight:400;font-size:clamp(36px,4.8vw,76px);line-height:.98;letter-spacing:.005em;text-transform:uppercase;color:var(--ll-green);overflow-wrap:break-word}
.ll-h2{margin:0;font-family:var(--ll-display);font-weight:400;font-size:clamp(34px,4.2vw,56px);line-height:1;text-transform:uppercase;overflow-wrap:break-word}
.ll-h1 strong,.ll-h2 strong{font-weight:700}
.ll-h3{margin:0;font-family:var(--ll-display);font-weight:600;font-size:26px;line-height:1.12}
.ll-lead{font-size:19px;line-height:1.7;color:var(--ll-muted)}
.ll-muted{color:var(--ll-muted)}
.ll-ph{background:var(--ll-yellow-light);padding:0 4px;font-weight:600;color:var(--ll-green)}
.ll-btnrow{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px;align-items:center}
.ll-btn{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 26px;background:var(--ll-green);color:#fff;text-decoration:none;font-family:var(--ll-display);font-size:18px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;border:1.5px solid var(--ll-green);box-sizing:border-box;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.ll-btn svg{flex:none;transition:transform .25s}
.ll-btn:hover{background:var(--ll-green-dark);border-color:var(--ll-green-dark);color:#fff}
.ll-btn:hover svg{transform:translateX(3px)}
.ll-btn--yellow{background:var(--ll-yellow);border-color:var(--ll-yellow);color:var(--ll-green)}
.ll-btn--yellow:hover{background:#EFE53A;border-color:#EFE53A;color:var(--ll-green)}
.ll-btn--outline{background:transparent;color:var(--ll-green)}
.ll-btn--outline:hover{background:rgba(36,69,51,0.07);border-color:var(--ll-green);color:var(--ll-green)}
.ll-btn--light{background:transparent;border-color:#fff;color:#fff}
.ll-btn--light:hover{background:rgba(255,255,255,0.1);border-color:#fff;color:#fff}
.ll-btn--slant{clip-path:polygon(0 0,calc(100% - 15px) 0,100% 100%,0 100%);padding-right:44px}
.ll-link{display:inline-flex;align-items:center;gap:10px;font-family:var(--ll-display);font-size:18px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;text-decoration:none;border-bottom:2px solid var(--ll-yellow);padding-bottom:4px}
.ll-link svg{transition:transform .25s}.ll-link:hover svg{transform:translateX(3px)}
.ll-btn:focus-visible,.ll-link:focus-visible,.ll-card:focus-visible,.ll-tcard:focus-visible,.ll-menulink:focus-visible,.ll-ddbtn:focus-visible,.ll-headcta:focus-visible{outline:3px solid var(--ll-green);outline-offset:3px}
.ll-sec--green .ll-btn:focus-visible,.ll-sec--green .ll-link:focus-visible{outline-color:var(--ll-yellow)}

/* ---------- Pagina-hero (15° diagonaal) ---------- */
.ll-phero{position:relative;display:flex;flex-direction:column;min-height:500px;overflow:hidden;background:#fff}
.ll-phero-media{position:absolute;top:48px;bottom:48px;left:44%;right:0;overflow:hidden;z-index:1}
.ll-phero-media img{display:block;width:100%;height:100%;object-fit:cover}
.ll-phero-line{position:absolute;top:30px;left:48%;right:0;height:1px;background:rgba(36,69,51,0.6);z-index:1}
.ll-phero-panel{position:absolute;top:0;bottom:0;left:0;width:calc(48% + 134px);background:var(--ll-panel);clip-path:polygon(0 0,calc(100% - 134px) 0,100% 100%,0 100%);z-index:2}
.ll-phero-bar{position:absolute;z-index:3;background:var(--ll-yellow)}
.ll-phero-bar--a{top:0;left:calc(48% + 60px);width:96px;height:96px;clip-path:polygon(0 0,70px 0,96px 100%,26px 100%)}
.ll-phero-bar--b{bottom:0;left:calc(48% + 6px);width:104px;height:150px;background:var(--ll-yellow-light);clip-path:polygon(0 0,64px 0,104px 100%,40px 100%)}
.ll-phero-content{position:relative;z-index:4;flex:1 1 auto;width:100%;display:flex;align-items:center;padding-top:56px;padding-bottom:56px}
.ll-phero-text{width:min(620px,calc(46vw - 56px))}
.ll-phero-text .ll-lead{margin:22px 0 0;max-width:540px}
.ll-crumbs{margin:0 0 22px;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:4px 10px;font-size:14px;color:var(--ll-muted)}
.ll-crumbs li{display:inline-flex;align-items:center;gap:10px}
.ll-crumbs li+li::before{content:"";width:6px;height:10px;background:var(--ll-yellow);clip-path:polygon(0 0,40% 0,100% 100%,60% 100%)}
.ll-crumbs a{color:var(--ll-muted);text-decoration:none}.ll-crumbs a:hover{color:var(--ll-green);text-decoration:underline}
.ll-crumbs [aria-current]{color:var(--ll-green);font-weight:600}
.ll-phero-badge{position:absolute;right:clamp(16px,1.5vw,24px);bottom:20px;z-index:5;max-width:280px;padding:20px 24px 22px;background:var(--ll-green);color:#fff;box-sizing:border-box}
.ll-phero-badge p{margin:0}
.ll-phero-badge p:first-child{font-family:var(--ll-display);font-weight:600;font-size:24px;line-height:1.05;letter-spacing:.02em;text-transform:uppercase;color:var(--ll-yellow)}
.ll-phero-badge p+p{margin-top:6px;font-size:14px;line-height:1.5}

/* ---------- Secties ---------- */
.ll-sec{padding:96px 0;position:relative}
.ll-sec--tint{background:var(--ll-tint)}
.ll-sec--green{background:var(--ll-green);color:#fff}
.ll-sec--green .ll-eyebrow{color:var(--ll-yellow)}
.ll-sec--green .ll-muted,.ll-sec--green .ll-lead{color:rgba(255,255,255,0.85)}
.ll-sec--green a:not(.ll-btn){color:#fff}
.ll-sec--tight{padding:64px 0}
.ll-sechead{display:flex;flex-wrap:wrap;gap:20px 40px;align-items:flex-end;justify-content:space-between;margin-bottom:44px}
.ll-sechead>div{flex:1 1 460px;min-width:0}
.ll-sechead p:not(.ll-eyebrow){margin:18px 0 0;max-width:600px}
.ll-prose>*{margin:0}
.ll-prose>*+*{margin-top:18px}
.ll-prose h2{margin-top:48px}.ll-prose h3{margin-top:36px}
.ll-prose ul:not(.ll-bullets),.ll-prose ol:not(.ll-steps){padding-left:22px}
.ll-prose li+li{margin-top:6px}

.ll-split{display:flex;flex-wrap:wrap;gap:56px;align-items:center}
.ll-split--rev{flex-direction:row-reverse}
.ll-split-media{flex:1 1 520px;min-width:0;position:relative;padding-bottom:64px}
.ll-split-media>img:first-child{display:block;width:100%;height:520px;object-fit:cover;clip-path:polygon(0 0,100% 0,100% 100%,139px 100%)}
.ll-split--rev .ll-split-media>img:first-child{clip-path:polygon(0 0,100% 0,calc(100% - 139px) 100%,0 100%)}
.ll-split-inset{position:absolute;right:-16px;bottom:0;width:46%;height:220px;object-fit:cover;border:8px solid #fff;box-sizing:border-box}
.ll-split--rev .ll-split-inset{right:auto;left:-16px}
.ll-split-bar{position:absolute;left:34%;bottom:24px;width:90px;height:180px;background:var(--ll-yellow);clip-path:polygon(0 0,42px 0,90px 100%,48px 100%)}
.ll-split-text{flex:1 1 440px;min-width:0}
.ll-split-text>.ll-h2+p{margin-top:24px}
.ll-split-text>p{margin:16px 0 0}

.ll-bullets{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-direction:column;gap:12px}
.ll-bullets li{display:flex;gap:14px;align-items:baseline}
.ll-bullets li::before{content:"";flex:none;width:12px;height:12px;background:var(--ll-yellow);transform:translateY(1px)}
.ll-bullets--bold{font-weight:600}
.ll-bullets--no li::before{background:none;border:1.5px solid var(--ll-green);box-sizing:border-box;width:12px;height:12px;clip-path:none}

/* Kerncijfers */
.ll-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:32px}
.ll-fact{border-left:1px solid var(--ll-green);padding:4px 0 4px 24px}
.ll-fact p{margin:8px 0 0;color:var(--ll-muted)}
.ll-fact .ll-factnum{margin:0;font-family:var(--ll-display);font-weight:700;font-size:56px;line-height:1;color:var(--ll-green)}
.ll-sec--green .ll-fact{border-color:rgba(255,255,255,.5)}.ll-sec--green .ll-fact .ll-factnum{color:var(--ll-yellow)}.ll-sec--green .ll-fact p{color:rgba(255,255,255,.85)}

/* Kaarten */
.ll-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,330px),1fr));gap:24px}
.ll-grid--2{grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr))}
.ll-grid--4{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.ll-card{display:flex;flex-direction:column;gap:12px;padding:32px;background:#fff;text-decoration:none;color:var(--ll-green);border-top:4px solid var(--ll-green);box-sizing:border-box}
.ll-sec:not(.ll-sec--tint):not(.ll-sec--green) .ll-card{background:var(--ll-tint)}
.ll-card p{margin:0;color:var(--ll-muted);font-size:16px}
.ll-card .ll-cardcta{display:inline-flex;gap:8px;align-items:center;margin-top:auto;padding-top:8px;font-weight:600;color:var(--ll-green)}
.ll-card .ll-cardcta svg{transition:transform .3s}
a.ll-card:hover .ll-cardcta svg{transform:translateX(4px)}
a.ll-card{transition:border-color .2s,transform .2s}
a.ll-card:hover{border-top-color:var(--ll-yellow)}
.ll-card--yellow{border-top-color:var(--ll-yellow)}

.ll-tcard{display:flex;flex-direction:column;background:#fff;text-decoration:none;color:var(--ll-green)}
.ll-sec:not(.ll-sec--tint) .ll-tcard{background:var(--ll-tint)}
.ll-tcard-media{position:relative;overflow:hidden;height:360px}
.ll-tcard-media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.ll-tcard:hover .ll-tcard-media img{transform:scale(1.05)}
.ll-tcard-num{position:absolute;top:16px;right:16px;min-width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;background:#fff;font-family:var(--ll-display);font-weight:700;font-size:16px}
.ll-tag{position:absolute;left:0;bottom:0;background:var(--ll-green);color:#fff;font-family:var(--ll-display);font-weight:700;font-size:15px;letter-spacing:.12em;text-transform:uppercase;padding:0 34px 0 20px;line-height:44px;height:44px;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 100%,0 100%)}
.ll-tag--yellow{background:var(--ll-yellow);color:var(--ll-green)}
.ll-tcard-body{padding:22px 24px 26px;display:flex;flex-direction:column;gap:8px;flex:1 1 auto}
.ll-tcard-body h3{margin:0;font-family:var(--ll-display);font-weight:700;font-size:28px;line-height:1.1}
.ll-tcard-body p{margin:0;color:var(--ll-muted);font-size:16px}
.ll-tcard-body .ll-cardcta{display:inline-flex;gap:8px;align-items:center;margin-top:auto;padding-top:10px;font-weight:600}
.ll-tcard-body .ll-cardcta svg{transition:transform .3s}
.ll-tcard:hover .ll-cardcta svg{transform:translateX(4px)}

/* Genummerde stappen */
.ll-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:0 40px}
.ll-steps li{border-top:1px solid var(--ll-green);padding:22px 0 30px}
.ll-steps .ll-stepnum{display:block;font-family:var(--ll-display);font-weight:700;font-size:18px}
.ll-steps .ll-stepnum span{background:var(--ll-yellow);color:var(--ll-green);padding:2px 8px}
.ll-steps h3{margin:14px 0 6px;font-family:var(--ll-display);font-weight:600;font-size:24px;line-height:1.15}
.ll-steps p{margin:0;color:var(--ll-muted);font-size:16px}
.ll-sec--green .ll-steps li{border-color:rgba(255,255,255,.5)}

/* CTA-band */
.ll-cta{position:relative;overflow:hidden;background:var(--ll-green);color:#fff;padding:72px 0}
.ll-cta::before{content:"";position:absolute;right:10%;top:0;bottom:0;aspect-ratio:268/1000;background:var(--ll-yellow);clip-path:polygon(0 0,38% 0,100% 100%,62% 100%)}
.ll-cta::after{content:"";position:absolute;right:calc(10% + 90px);top:0;bottom:0;aspect-ratio:268/1000;background:rgba(255,255,255,.08);clip-path:polygon(0 0,38% 0,100% 100%,62% 100%)}
.ll-cta .ll-wrap{display:flex;flex-wrap:wrap;gap:28px 56px;align-items:center;justify-content:space-between;z-index:1}
.ll-cta .ll-eyebrow{color:var(--ll-yellow)}
.ll-cta .ll-h2{max-width:720px}
.ll-cta p:not(.ll-eyebrow){margin:16px 0 0;max-width:620px;color:rgba(255,255,255,.88)}
.ll-cta .ll-btnrow{margin-top:0;position:relative}

/* FAQ / accordeon */
.ll-faq{border-top:1px solid var(--ll-green)}
.ll-faq details{border-bottom:1px solid var(--ll-green)}
.ll-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:22px 0;font-family:var(--ll-display);font-weight:600;font-size:22px;line-height:1.2}
.ll-faq summary::-webkit-details-marker{display:none}
.ll-faq summary::after{content:"";flex:none;width:28px;height:28px;background:var(--ll-yellow) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23244533' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M12 6v12M6 12h12'/%3E%3C/svg%3E") center/16px no-repeat;transition:transform .25s}
.ll-faq details[open] summary::after{transform:rotate(45deg)}
.ll-faq summary:focus-visible{outline:3px solid var(--ll-green);outline-offset:2px}
.ll-faq .ll-faqbody{padding:0 56px 26px 0;color:var(--ll-muted)}
.ll-faq .ll-faqbody>*{margin:0}.ll-faq .ll-faqbody>*+*{margin-top:12px}

/* Tijdlijn */
.ll-timeline{list-style:none;margin:0;padding:0;position:relative}
.ll-timeline::before{content:"";position:absolute;left:119px;top:8px;bottom:8px;width:1px;background:var(--ll-green)}
.ll-timeline li{display:grid;grid-template-columns:120px 1fr;gap:0 48px;padding:0 0 48px;position:relative}
.ll-timeline li::before{content:"";position:absolute;left:112px;top:10px;width:16px;height:16px;background:var(--ll-yellow);clip-path:polygon(0 0,70% 0,100% 100%,30% 100%)}
.ll-timeline .ll-year{font-family:var(--ll-display);font-weight:700;font-size:30px;line-height:1.1}
.ll-timeline h3{margin:0 0 8px;font-family:var(--ll-display);font-weight:600;font-size:26px;line-height:1.15}
.ll-timeline p{margin:0;color:var(--ll-muted)}

/* Team */
.ll-team{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:32px 24px}
.ll-person{margin:0}
.ll-person-photo{position:relative;aspect-ratio:4/5;background:var(--ll-tint);overflow:hidden;display:flex;align-items:center;justify-content:center}
.ll-person-photo::after{content:"";position:absolute;right:-20px;top:0;bottom:0;aspect-ratio:268/1000;background:var(--ll-panel);clip-path:polygon(0 0,38% 0,100% 100%,62% 100%)}
.ll-person-photo span{position:relative;z-index:1;font-family:var(--ll-display);font-size:56px;font-weight:700;color:var(--ll-green);opacity:.35}
.ll-person figcaption{padding-top:14px}
.ll-person h3{margin:0;font-family:var(--ll-display);font-weight:600;font-size:22px}
.ll-person p{margin:2px 0 0;font-size:15px;color:var(--ll-muted)}

/* Formulieren */
.ll-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 24px}
.ll-field{display:flex;flex-direction:column;gap:8px;min-width:0}
.ll-field--full{grid-column:1/-1}
.ll-field label,.ll-field legend{font-weight:600;font-size:15px}
.ll-field .ll-opt{font-weight:400;color:var(--ll-muted)}
.ll-field input,.ll-field select,.ll-field textarea{font:inherit;font-size:16px;color:var(--ll-green);background:#fff;border:1.5px solid rgba(36,69,51,.45);border-radius:0;padding:13px 14px;min-height:52px;box-sizing:border-box;width:100%}
.ll-field textarea{min-height:140px;resize:vertical}
.ll-field input:focus,.ll-field select:focus,.ll-field textarea:focus{outline:none;border-color:var(--ll-green);box-shadow:0 0 0 3px var(--ll-yellow)}
.ll-field fieldset{border:0;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px 24px}
.ll-field fieldset legend{width:100%;margin-bottom:8px}
.ll-check{display:inline-flex;gap:10px;align-items:center;font-weight:400 !important}
.ll-check input{width:20px;height:20px;min-height:0;accent-color:var(--ll-green)}
.ll-form .ll-btnrow{grid-column:1/-1;margin-top:8px}
.ll-form-note{grid-column:1/-1;margin:0;font-size:14px;color:var(--ll-muted)}
.ll-form-ok{grid-column:1/-1;margin:0;padding:18px 22px;background:var(--ll-tint);border-left:4px solid var(--ll-yellow);font-weight:600}
.ll-formcard{background:#fff;padding:clamp(24px,4vw,48px);border-top:4px solid var(--ll-yellow)}
.ll-sec:not(.ll-sec--tint) .ll-formcard{background:var(--ll-tint)}
.ll-sec:not(.ll-sec--tint) .ll-formcard .ll-field input,.ll-sec:not(.ll-sec--tint) .ll-formcard .ll-field select,.ll-sec:not(.ll-sec--tint) .ll-formcard .ll-field textarea{background:#fff}

/* Info-blokken */
.ll-infolist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.ll-infolist li{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid var(--ll-line)}
.ll-infolist li span:first-child{font-weight:600}
.ll-sec--green .ll-infolist li{border-color:rgba(255,255,255,.3)}
.ll-map{position:relative;min-height:380px;background:var(--ll-panel);overflow:hidden;display:flex;align-items:center;justify-content:center;text-align:center}
.ll-map::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(105deg,transparent 0 46px,rgba(36,69,51,.07) 46px 47px),repeating-linear-gradient(15deg,transparent 0 70px,rgba(36,69,51,.06) 70px 71px)}
.ll-map div{position:relative;background:#fff;padding:22px 28px;border-top:4px solid var(--ll-yellow);max-width:280px}
.ll-map strong{display:block;font-family:var(--ll-display);font-size:22px;text-transform:uppercase}
.ll-chips{display:flex;flex-wrap:wrap;gap:10px}
.ll-chips a{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border:1.5px solid var(--ll-green);text-decoration:none;font-weight:600;font-size:15px;background:#fff}
.ll-chips a:hover{background:var(--ll-tint);color:var(--ll-green)}
.ll-quote{margin:0;position:relative;padding-left:40px;border-left:4px solid var(--ll-yellow)}
.ll-quote p{margin:0;font-family:var(--ll-display);font-size:clamp(26px,3vw,38px);line-height:1.15;text-transform:uppercase}
.ll-quote footer{margin-top:16px;font-size:15px;color:var(--ll-muted)}
.ll-sec--green .ll-quote footer{color:rgba(255,255,255,.8)}
.ll-meta{display:flex;flex-wrap:wrap;gap:10px 28px;margin:22px 0 0;padding:0;list-style:none;font-size:15px}
.ll-meta li{display:inline-flex;align-items:center;gap:8px}
.ll-meta li::before{content:"";width:8px;height:8px;background:var(--ll-yellow)}
.ll-aside{background:var(--ll-tint);padding:32px;border-top:4px solid var(--ll-green);position:sticky;top:130px}
.ll-cols{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(280px,1fr);gap:56px;align-items:start}
.ll-material{scroll-margin-top:140px}
.ll-material+.ll-material{margin-top:64px;padding-top:64px;border-top:1px solid var(--ll-line)}
.ll-dodont{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px;margin-top:24px}
.ll-dodont>div{background:#fff;padding:24px 26px}
.ll-sec:not(.ll-sec--tint) .ll-dodont>div{background:var(--ll-tint)}
.ll-dodont h4{margin:0 0 4px;font-family:var(--ll-display);font-size:18px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}

/* Moodboard */
.ll-mood{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:90px;gap:16px}
.ll-mood figure{margin:0;position:relative;overflow:hidden;background:var(--ll-tint)}
.ll-mood img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.ll-mood figure:hover img{transform:scale(1.04)}
.ll-mood figcaption{position:absolute;left:0;bottom:0;background:#fff;padding:8px 26px 8px 14px;font-size:14px;font-weight:600;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 100%,0 100%)}
.ll-mood .m1{grid-column:span 7;grid-row:span 5}.ll-mood .m2{grid-column:span 5;grid-row:span 3}.ll-mood .m3{grid-column:span 5;grid-row:span 2;background:var(--ll-green);color:#fff;padding:24px;display:flex;flex-direction:column;justify-content:flex-end}
.ll-mood .m4{grid-column:span 4;grid-row:span 4}.ll-mood .m5{grid-column:span 4;grid-row:span 4}.ll-mood .m6{grid-column:span 4;grid-row:span 4}
.ll-mood .m3 p{margin:0;font-family:var(--ll-display);font-size:28px;line-height:1.05;text-transform:uppercase}

/* Product */
.ll-product{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:56px;align-items:start}
.ll-gallery-main{position:relative;aspect-ratio:1/1;background:var(--ll-tint);overflow:hidden}
.ll-gallery-main img{width:100%;height:100%;object-fit:cover;display:block}
.ll-gallery-thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:12px}
.ll-gallery-thumbs button{padding:0;border:2px solid transparent;background:var(--ll-tint);aspect-ratio:1/1;cursor:pointer;overflow:hidden}
.ll-gallery-thumbs button[aria-pressed="true"]{border-color:var(--ll-green)}
.ll-gallery-thumbs img{width:100%;height:100%;object-fit:cover;display:block}
.ll-badges{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px;padding:0;list-style:none}
.ll-badges li{font-family:var(--ll-display);font-size:14px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:4px 12px;background:var(--ll-tint)}
.ll-badges li:first-child{background:var(--ll-yellow)}
.ll-swatches{display:flex;flex-wrap:wrap;gap:12px;margin:10px 0 0;padding:0;list-style:none}
.ll-swatches li{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:13px;color:var(--ll-muted)}
.ll-swatches span{width:40px;height:40px;border:1px solid var(--ll-line)}
.ll-specs{width:100%;border-collapse:collapse;font-size:16px}
.ll-specs th,.ll-specs td{text-align:left;padding:14px 0;border-bottom:1px solid var(--ll-line);vertical-align:top}
.ll-specs th{font-weight:600;width:45%;padding-right:16px}
.ll-usp{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin:28px 0 0;padding:0;list-style:none}
.ll-usp li{display:flex;gap:12px;align-items:flex-start;font-weight:600;font-size:15px;line-height:1.35}
.ll-usp svg{flex:none}

/* ---------- Footer ---------- */
.ll-footer{position:relative;background:var(--ll-green);color:#fff;padding:80px 0 32px;font-size:16px}
.ll-footer::before{content:"";position:absolute;right:12%;top:0;width:90px;height:120px;background:var(--ll-yellow);clip-path:polygon(0 0,58px 0,90px 100%,32px 100%)}
.ll-footgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:40px}
.ll-footer address{font-style:normal;margin-top:24px;line-height:1.8}
.ll-footer a{color:#fff;text-decoration:none}
.ll-footer a:hover{text-decoration:underline;color:#fff}
.ll-foothead{margin:0 0 14px;font-family:var(--ll-display);font-weight:600;font-size:18px;letter-spacing:.08em;text-transform:uppercase;color:var(--ll-yellow)}
.ll-footer ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.ll-footbottom{display:flex;flex-wrap:wrap;gap:12px 28px;justify-content:space-between;margin-top:64px;padding-top:22px;border-top:1px solid rgba(255,255,255,.3);font-size:14px}
.ll-footbottom span:last-child{display:flex;flex-wrap:wrap;gap:20px}
.ll-footbottom a{text-decoration:underline}

/* ---------- Responsief ---------- */
@media (max-width:1100px){
  .ll-nav{display:none !important}
  .ll-burger{display:inline-flex !important}
  .ll-mobilemenu{display:block}
  .ll-sec{padding-top:72px;padding-bottom:72px}
  .ll-cols,.ll-product{grid-template-columns:minmax(0,1fr)}
  .ll-aside{position:static}
}
@media (max-width:900px){
  .ll-phero{min-height:0}
  .ll-phero-panel,.ll-phero-line,.ll-phero-bar{display:none}
  .ll-phero-content{order:1;background:var(--ll-panel);padding-top:44px;padding-bottom:44px}
  .ll-phero-text{width:100%;max-width:640px}
  .ll-phero-media{position:relative;inset:auto;order:2;height:320px}
  .ll-phero-badge{right:16px;bottom:16px;width:min(280px,calc(100% - 32px))}
  .ll-mood{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:auto}
  .ll-mood figure,.ll-mood .m1,.ll-mood .m2,.ll-mood .m3,.ll-mood .m4,.ll-mood .m5,.ll-mood .m6{grid-column:span 1;grid-row:auto;aspect-ratio:1/1}
  .ll-mood .m1{grid-column:span 2;aspect-ratio:16/10}
  .ll-mood .m3{aspect-ratio:auto}
  .ll-cta::after{display:none}
}
@media (max-width:720px){
  body{font-size:16px}
  .ll-tagline{display:none !important}
  .ll-topbar{justify-content:center !important}
  .ll-headcta{display:none !important}
  .ll-logo{height:46px !important}
  .ll-sec{padding-top:56px;padding-bottom:56px}
  .ll-split{gap:32px}
  .ll-split-media{padding-bottom:48px}
  .ll-split-media>img:first-child{height:340px;clip-path:polygon(0 0,100% 0,100% 100%,91px 100%)}
  .ll-split--rev .ll-split-media>img:first-child{clip-path:polygon(0 0,100% 0,calc(100% - 91px) 100%,0 100%)}
  .ll-split-inset{height:150px;width:55%;right:0}
  .ll-split--rev .ll-split-inset{left:0}
  .ll-fact .ll-factnum{font-size:40px}
  .ll-facts{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 16px}
  .ll-fact{padding-left:14px}
  .ll-card{padding:24px}
  .ll-tcard-media{height:300px}
  .ll-form{grid-template-columns:minmax(0,1fr)}
  .ll-btnrow>.ll-btn{width:100%;justify-content:center}
  .ll-timeline::before{left:7px}
  .ll-timeline li{grid-template-columns:1fr;padding-left:36px;gap:4px}
  .ll-timeline li::before{left:0}
  .ll-faq summary{font-size:19px}
  .ll-faq .ll-faqbody{padding-right:0}
  .ll-cta::before{right:-30px;opacity:.6}
  .ll-footer{padding-top:56px}
  .ll-quote{padding-left:22px}
}

/* ---------- Animaties ---------- */
@keyframes ll-up{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes ll-zoom{from{transform:scale(1.07)}to{transform:scale(1)}}
@keyframes ll-slant{from{opacity:0;transform:translate(-14px,-52px)}to{opacity:1;transform:none}}
@keyframes ll-wipe{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@media (prefers-reduced-motion:no-preference){
  .ll-phero-text>*{animation:ll-up .9s cubic-bezier(.2,.7,.2,1) both}
  .ll-phero-text>:nth-child(2){animation-delay:.08s}
  .ll-phero-text>:nth-child(3){animation-delay:.16s}
  .ll-phero-text>:nth-child(4){animation-delay:.24s}
  .ll-phero-text>:nth-child(5){animation-delay:.32s}
  .ll-phero-media img{animation:ll-zoom 1.8s cubic-bezier(.2,.7,.2,1) both}
  .ll-phero-line{animation:ll-wipe 1.2s .3s cubic-bezier(.6,0,.2,1) both}
  .ll-phero-bar{animation:ll-slant 1s .45s cubic-bezier(.2,.7,.2,1) both}
  .ll-phero-badge{animation:ll-up .9s .6s cubic-bezier(.2,.7,.2,1) both}
}

/* ---------- Social media ---------- */
.ll-social,.ll-footer .ll-social{list-style:none;margin:24px 0 0;padding:0;display:flex;flex-direction:row;gap:10px}
.ll-social a{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border:1.5px solid rgba(255,255,255,.5);color:#fff;transition:background .2s,color .2s,border-color .2s}
.ll-social a:hover{background:var(--ll-yellow);border-color:var(--ll-yellow);color:var(--ll-green);text-decoration:none}
.ll-social a:focus-visible{outline:3px solid var(--ll-yellow);outline-offset:2px}
.ll-social--dark{margin:0}
.ll-social--dark a{border-color:var(--ll-green);color:var(--ll-green)}
.ll-social--dark a:hover{background:var(--ll-green);border-color:var(--ll-green);color:#fff}
.ll-social--dark a:focus-visible{outline-color:var(--ll-green)}

/* ---------- Hover-effect voor alle knoppen ----------
   Alleen een kleurwissel en een pijltje dat meeschuift; de knop blijft op zijn plek. Geldt ook voor de knoppen op de homepage. */
.ll-btn,.ll-headcta,.ll-mcta,.ll-burger,.ll-chips a,.ll-navbtn,.ll-social a,
.ll-btnrow>a,.ll-h2text a[style*="clip-path"],.ll-slide span[style*="#E7DB04"],
a[href="dealer-worden.html"][style*="display: flex"],a[href="werken-bij.html"][style*="display: flex"]{transition:background-color .2s,border-color .2s,color .2s}
.ll-btn svg,.ll-headcta svg,.ll-mcta svg,.ll-btnrow>a svg,.ll-h2text a svg,
a[href="dealer-worden.html"][style*="display: flex"] svg,a[href="werken-bij.html"][style*="display: flex"] svg,.ll-slide span[style*="#E7DB04"] svg{transition:transform .25s cubic-bezier(.2,.7,.2,1)}
.ll-btn:hover svg,.ll-headcta:hover svg,.ll-mcta:hover svg,.ll-btnrow>a:hover svg,.ll-h2text a:hover svg,
a[href="dealer-worden.html"][style*="display: flex"]:hover svg,a[href="werken-bij.html"][style*="display: flex"]:hover svg,.ll-slide:hover span[style*="#E7DB04"] svg{transform:translateX(4px)}
/* Knoppen met eigen opmaak op de homepage: groen wordt donkerder, geel lichter, omlijnd krijgt een tint */
.ll-btnrow>a[style*="background: #244533"]:hover,.ll-h2text a[style*="background: #244533"]:hover,
a[href="dealer-worden.html"][style*="display: flex"]:hover,a[href="werken-bij.html"][style*="display: flex"]:hover{background:var(--ll-green-dark) !important;color:#fff !important}
.ll-btnrow>a[style*="background: #E7DB04"]:hover,.ll-slide:hover span[style*="#E7DB04"]{background:#EFE53A !important}
.ll-btnrow>a[style*="border: 1.5px solid #244533"]:hover{background:rgba(36,69,51,0.07)}
.ll-btnrow>a[style*="border: 1.5px solid #ffffff"]:hover{background:rgba(255,255,255,0.1)}
.ll-mnav .ll-mcta:hover{background:var(--ll-green-dark);color:#fff}
.ll-burger:hover{background:var(--ll-tint)}

/* ---------- Contact-widget (rechtsonder) ---------- */
.ll-chat{position:fixed;right:24px;bottom:24px;z-index:150;display:flex;flex-direction:column;align-items:flex-end;gap:14px;font-family:var(--ll-body);color:var(--ll-green);
  opacity:0;transform:translateY(24px);pointer-events:none;transition:opacity .5s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
.ll-chat[hidden]{display:none}
.ll-chat.is-visible{opacity:1;transform:none;pointer-events:auto}
.ll-chat-photo{position:relative;display:block;width:56px;height:56px;flex:none}
.ll-chat-photo img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
.ll-chat-online{position:absolute;right:1px;bottom:1px;width:14px;height:14px;border-radius:50%;background:#25D366;border:2.5px solid #fff;box-sizing:border-box}
.ll-chat-launcher{position:relative;padding:0;border:0;background:none;cursor:pointer;border-radius:50%;box-shadow:0 10px 28px -8px rgba(36,69,51,.55)}
.ll-chat-launcher .ll-chat-photo{width:64px;height:64px}
.ll-chat-launcher .ll-chat-photo img{border:3px solid #fff;box-sizing:border-box}
.ll-chat-badge{position:absolute;left:-6px;top:-6px;width:28px;height:28px;border-radius:50%;background:#25D366;color:#fff;display:flex;align-items:center;justify-content:center;border:2.5px solid #fff;box-sizing:border-box}
.ll-chat-badge svg{width:15px;height:15px}
.ll-chat-launcher:focus-visible{outline:3px solid var(--ll-yellow);outline-offset:3px}
.ll-chat-launcher[aria-expanded="true"] .ll-chat-badge{background:var(--ll-green)}
.ll-chat-teaser{position:relative;display:flex;align-items:stretch;background:#fff;box-shadow:0 14px 34px -14px rgba(36,69,51,.55);border-left:4px solid var(--ll-yellow);max-width:260px}
.ll-chat-teaser[hidden]{display:none}
.ll-chat-teaser-open{padding:12px 6px 12px 16px;border:0;background:none;text-align:left;font:inherit;font-size:15px;line-height:1.35;color:var(--ll-green);cursor:pointer}
.ll-chat-teaser-open strong{display:block}
.ll-chat-teaser-close{align-self:flex-start;width:32px;height:32px;margin:4px;border:0;background:none;color:var(--ll-muted);cursor:pointer;display:flex;align-items:center;justify-content:center}
.ll-chat-teaser-close:hover{color:var(--ll-green)}
.ll-chat-teaser::after{content:"";position:absolute;right:26px;bottom:-8px;width:16px;height:8px;background:#fff;clip-path:polygon(0 0,100% 0,73% 100%)}
.ll-chat-panel{width:340px;max-width:calc(100vw - 32px);background:#fff;box-shadow:0 24px 60px -18px rgba(36,69,51,.6);border-top:4px solid var(--ll-yellow);transform-origin:bottom right}
.ll-chat-panel[hidden]{display:none}
.ll-chat-head{position:relative;display:flex;align-items:center;gap:14px;padding:18px 52px 18px 18px;background:var(--ll-green);color:#fff;overflow:hidden}
.ll-chat-head::before{content:"";position:absolute;right:46px;top:0;bottom:0;aspect-ratio:268/1000;background:rgba(255,255,255,.07);clip-path:polygon(0 0,38% 0,100% 100%,62% 100%)}
.ll-chat-head .ll-chat-photo img{border:2px solid #fff;box-sizing:border-box}
.ll-chat-head .ll-chat-online{border-color:var(--ll-green)}
.ll-chat-name{margin:0;font-family:var(--ll-display);font-size:20px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;line-height:1.1}
.ll-chat-role{margin:2px 0 0;font-size:13px;color:rgba(255,255,255,.8)}
.ll-chat-close{position:absolute;right:10px;top:10px;width:36px;height:36px;border:0;background:none;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:color .2s}
.ll-chat-close:hover{color:var(--ll-yellow)}
.ll-chat-close:focus-visible,.ll-chat-teaser-open:focus-visible,.ll-chat-teaser-close:focus-visible{outline:2px solid var(--ll-yellow);outline-offset:-2px}
.ll-chat-body{padding:20px 18px 6px;background:var(--ll-tint)}
.ll-chat-bubble{position:relative;margin:0;padding:14px 16px;background:#fff;font-size:15px;line-height:1.5}
.ll-chat-bubble::before{content:"";position:absolute;left:-8px;top:14px;width:8px;height:14px;background:#fff;clip-path:polygon(100% 0,100% 100%,0 0)}
.ll-chat-meta{margin:10px 0 0;font-size:12px;color:var(--ll-muted);padding-bottom:12px}
.ll-chat-actions{padding:16px 18px 18px;display:flex;flex-direction:column;gap:10px}
.ll-chat-wa{display:flex;align-items:center;justify-content:center;gap:10px;min-height:50px;background:#25D366;color:#fff !important;text-decoration:none;font-weight:700;font-size:16px;transition:background .2s}
.ll-chat-wa:hover{background:#1EBE5A}
.ll-chat-wa svg{transition:transform .25s cubic-bezier(.2,.7,.2,1)}
.ll-chat-wa:hover svg{transform:rotate(-8deg) scale(1.08)}
.ll-chat-alt{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ll-chat-alt a{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;border:1.5px solid var(--ll-green);color:var(--ll-green);text-decoration:none;font-weight:600;font-size:14px;transition:background .2s}
.ll-chat-alt a:hover{background:rgba(36,69,51,.07)}
.ll-chat-wa:focus-visible,.ll-chat-alt a:focus-visible{outline:3px solid var(--ll-green);outline-offset:2px}
@media (prefers-reduced-motion:no-preference){
  .ll-chat-panel:not([hidden]){animation:ll-chat-in .35s cubic-bezier(.2,.7,.2,1)}
  .ll-chat.is-visible .ll-chat-teaser:not([hidden]){animation:ll-chat-in .5s .5s cubic-bezier(.2,.7,.2,1) both}
  .ll-chat.is-visible .ll-chat-online{animation:ll-chat-pulse 2.4s 1s ease-out 3}
}
@keyframes ll-chat-in{from{opacity:0;transform:translateY(12px) scale(.96)}to{opacity:1;transform:none}}
@keyframes ll-chat-pulse{0%{box-shadow:0 0 0 0 rgba(37,211,102,.6)}70%{box-shadow:0 0 0 10px rgba(37,211,102,0)}100%{box-shadow:0 0 0 0 rgba(37,211,102,0)}}
@media (max-width:720px){
  .ll-chat{right:16px;bottom:16px}
  .ll-chat-launcher .ll-chat-photo{width:58px;height:58px}
  .ll-chat-panel{width:calc(100vw - 32px)}
}
@media print{.ll-chat{display:none !important}}

/* ---------- Scroll-reveal ----------
   lesli.js zet .ll-rv op elementen onder de vouw en .is-in zodra ze in beeld komen.
   Zonder JavaScript of met 'minder beweging' gebeurt er niets en is alles direct zichtbaar. */
.ll-rv{opacity:0;transform:translateY(24px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1);transition-delay:var(--rv-d,0ms)}
.ll-rv--bar{transform:translate(-10px,-38px)}
.ll-rv.is-in{opacity:1;transform:none}

/* =====================================================================
   Homepage-componenten (WordPress-thema)
   Omgezet van de inline styles in het HTML-prototype naar classes.
   ===================================================================== */

/* ---------- Home-hero met slider ---------- */
.ll-hero2{position:relative;display:flex;flex-direction:column;height:680px;overflow:hidden;background:#fff}
.ll-h2media{position:absolute;top:64px;bottom:64px;left:36%;right:0;overflow:hidden;z-index:1}
.ll-h2line{position:absolute;top:44px;left:40%;right:0;height:1px;background:rgba(36,69,51,.6);z-index:1}
.ll-h2panel{position:absolute;top:0;bottom:0;left:0;width:calc(40% + 182px);background:var(--ll-panel);clip-path:polygon(0 0,calc(100% - 182px) 0,100% 100%,0 100%);z-index:2}
.ll-h2bar{position:absolute;z-index:3;background:var(--ll-yellow)}
.ll-h2bar--a{top:28px;left:47%;width:92px;height:148px;background:var(--ll-yellow-light);clip-path:polygon(0 0,52px 0,92px 100%,40px 100%)}
.ll-h2bar--b{top:0;left:55%;width:112px;height:82px;clip-path:polygon(0 0,90px 0,112px 100%,22px 100%)}
.ll-h2bar--c{bottom:0;left:calc(40% + 26px);width:116px;height:200px;clip-path:polygon(0 0,62px 0,116px 100%,54px 100%)}
.ll-h2content{position:relative;z-index:4;flex:1 1 auto;width:100%;max-width:1360px;margin:0 auto;padding:0 var(--ll-gutter);box-sizing:border-box;display:flex;align-items:center}
.ll-h2text{width:min(560px,calc(40vw - 48px));container-type:inline-size}
.ll-h2text .ll-eyebrow--mark{margin-bottom:22px}
.ll-h1--hero{font-size:clamp(48px,6vw,96px);font-size:clamp(40px,17cqi,100px);line-height:.95}
.ll-h2text .ll-lead{margin:26px 0 0;max-width:500px;font-size:18px}
.ll-h2text .ll-btnrow{margin-top:36px;gap:16px 32px}
.ll-h2text .ll-btn--slant{padding-left:28px}
.ll-h2text .ll-link{font-family:var(--ll-body);font-size:16px;letter-spacing:0;text-transform:none;border-bottom:1.5px solid var(--ll-green);min-height:44px;padding-bottom:0}
.ll-h2feat{margin:34px 0 0;display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px;font-size:14px;color:var(--ll-muted)}
.ll-h2feat span{display:inline-flex;align-items:center;gap:8px}
.ll-h2feat span::before{content:"";width:8px;height:8px;background:var(--ll-yellow)}
.ll-h2feat strong{color:var(--ll-green)}
.ll-h2badge{position:absolute;right:clamp(16px,1.5vw,24px);bottom:20px;z-index:5;width:260px;padding:22px 24px 24px;background:var(--ll-green);color:#fff;box-sizing:border-box}
.ll-h2badge p{margin:0}
.ll-h2badge p:first-child{font-family:var(--ll-display);font-weight:600;font-size:26px;line-height:1.05;letter-spacing:.02em;text-transform:uppercase;color:var(--ll-yellow)}
.ll-h2badge p+p{margin-top:8px;font-size:14px;line-height:1.55}
.ll-h2media>img{display:block;width:100%;height:100%;object-fit:cover}

/* Hero-slider */
.ll-hs{position:absolute;inset:0}
.ll-hs-slide{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.2s ease}
.ll-hs-slide.is-active{opacity:1}
.ll-hs-ctrl{position:absolute;top:16px;right:16px;z-index:2;display:flex;align-items:center;gap:2px;padding:4px 4px 4px 10px;background:rgba(36,69,51,.72)}
.ll-hs-dot{appearance:none;border:0;background:none;padding:12px 4px;cursor:pointer;display:block}
.ll-hs-dot>span{display:block;position:relative;width:28px;height:3px;background:rgba(255,255,255,.4);overflow:hidden}
.ll-hs-dot>span::after{content:"";position:absolute;inset:0;background:var(--ll-yellow);transform:scaleX(0);transform-origin:left}
.ll-hs-dot.is-done>span::after{transform:none;background:#fff}
.ll-hs-dot.is-active>span::after{animation:ll-hs-prog 6s linear forwards}
.ll-hs-ctrl.is-paused .ll-hs-dot.is-active>span::after{animation-play-state:paused}
@keyframes ll-hs-prog{from{transform:scaleX(0)}to{transform:none}}
.ll-hs-pause{appearance:none;border:0;background:none;color:#fff;width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;margin-left:4px}
.ll-hs-pause:hover{color:var(--ll-yellow)}
.ll-hs-dot:focus-visible,.ll-hs-pause:focus-visible{outline:2px solid var(--ll-yellow);outline-offset:-2px}
.ll-hs-ctrl svg[hidden]{display:none}
@media (prefers-reduced-motion:no-preference){
  .ll-hs-slide{transform:scale(1.07);transition:opacity 1.2s ease,transform 0s 1.2s}
  .ll-hs-slide.is-active{transform:none;transition:opacity 1.2s ease,transform 7.5s cubic-bezier(.2,.4,.4,1)}
  .ll-h2text>*{animation:ll-up .9s cubic-bezier(.2,.7,.2,1) both}
  .ll-h2text>:nth-child(2){animation-delay:.08s}
  .ll-h2text>:nth-child(3){animation-delay:.18s}
  .ll-h2text>:nth-child(4){animation-delay:.28s}
  .ll-h2text>:nth-child(5){animation-delay:.38s}
  .ll-hs,.ll-h2media>img{animation:ll-zoom 1.8s cubic-bezier(.2,.7,.2,1) both}
  .ll-h2line{animation:ll-wipe 1.2s .3s cubic-bezier(.6,0,.2,1) both}
  .ll-h2bar{animation:ll-slant 1s .45s cubic-bezier(.2,.7,.2,1) both}
  .ll-h2bar+.ll-h2bar{animation-delay:.55s}
  .ll-h2badge{animation:ll-up .9s .7s cubic-bezier(.2,.7,.2,1) both}
}

/* ---------- Kerncijfers met CTA-kaart ---------- */
.ll-factcta{display:flex;flex-direction:column;justify-content:space-between;gap:12px;padding:20px 24px;background:var(--ll-green);color:#fff !important;text-decoration:none;transition:background-color .2s}
.ll-factcta:hover{background:var(--ll-green-dark)}
.ll-factcta strong{font-family:var(--ll-display);font-weight:600;font-size:22px;line-height:1.15;text-transform:uppercase;letter-spacing:.03em}
.ll-factcta span{display:inline-flex;gap:8px;align-items:center;color:var(--ll-yellow);font-weight:600}
.ll-factcta svg{transition:transform .25s cubic-bezier(.2,.7,.2,1)}
.ll-factcta:hover svg{transform:translateX(4px)}

/* ---------- Thema-slider ---------- */
.ll-sliderhead{display:flex;flex-wrap:wrap;gap:24px 40px;align-items:flex-end;justify-content:space-between}
.ll-sliderhead>div:first-child{flex:1 1 420px;min-width:0}
.ll-sliderhead p:not(.ll-eyebrow){margin:18px 0 0;max-width:520px}
.ll-sliderctrl{display:flex;align-items:center;gap:20px}
.ll-slidercount{margin:0;font-family:var(--ll-display);font-size:20px;letter-spacing:.06em;white-space:nowrap}
.ll-slidercount span:last-child{color:var(--ll-muted)}
.ll-navbtns{display:flex;gap:8px}
.ll-navbtn{width:52px;height:52px;display:inline-flex;align-items:center;justify-content:center;border:1.5px solid var(--ll-green);background:transparent;color:var(--ll-green);cursor:pointer;padding:0;transition:background-color .2s,color .2s}
.ll-navbtn:not(:disabled):hover{background:var(--ll-green);color:#fff}
.ll-navbtn:disabled{opacity:.3;cursor:default}
.ll-navbtn:focus-visible,.ll-slide:focus-visible{outline:3px solid var(--ll-green);outline-offset:3px}
.ll-slider{display:flex;gap:24px;align-items:stretch;margin-top:44px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;cursor:grab;
  padding:0 max(var(--ll-gutter),calc((100vw - 1360px) / 2 + 40px));scroll-padding-inline:max(var(--ll-gutter),calc((100vw - 1360px) / 2 + 40px));box-sizing:border-box;overscroll-behavior-x:contain;
  scrollbar-width:none;-webkit-overflow-scrolling:touch;user-select:none;-webkit-user-select:none}
.ll-slider::-webkit-scrollbar{display:none}
.ll-slider img,.ll-slider a{-webkit-user-drag:none}
.ll-slider.is-dragging{scroll-snap-type:none;scroll-behavior:auto;cursor:grabbing}
.ll-slide{flex:0 0 auto;width:clamp(280px,28vw,410px);scroll-snap-align:start;display:flex;flex-direction:column;background:#fff;text-decoration:none;color:var(--ll-green)}
.ll-slidemedia{position:relative;overflow:hidden;height:440px}
.ll-slidemedia img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.ll-slide:hover .ll-slidemedia img{transform:scale(1.05)}
.ll-slidebody{padding:22px 24px 26px;display:flex;flex-direction:column;gap:8px;flex:1 1 auto}
.ll-slidebody h3{margin:0;font-family:var(--ll-display);font-weight:700;font-size:28px;line-height:1.1}
.ll-slidebody p{margin:0;color:var(--ll-muted);font-size:16px}
.ll-slidecta{display:inline-flex;gap:8px;align-items:center;margin-top:auto;padding-top:10px;font-weight:600}
.ll-slidecta svg{transition:transform .3s}
.ll-slide:hover .ll-slidecta svg{transform:translateX(4px)}
.ll-slide--promo{position:relative;justify-content:space-between;gap:32px;padding:36px 32px;box-sizing:border-box;background:var(--ll-green);color:#fff;overflow:hidden}
.ll-slide--promo::before{content:"";position:absolute;right:-60px;top:0;bottom:0;aspect-ratio:468/1000;background:var(--ll-yellow);clip-path:polygon(0 0,42.7% 0,100% 100%,57.3% 100%)}
.ll-slide--promo .ll-eyebrow{position:relative;margin:0;color:var(--ll-yellow);font-weight:700}
.ll-slide--promo>div{position:relative;max-width:250px}
.ll-slide--promo h3{margin:0;font-family:var(--ll-display);font-weight:400;font-size:42px;line-height:1;text-transform:uppercase}
.ll-slide--promo h3 strong{font-weight:700}
.ll-slide--promo p{margin:14px 0 0;font-size:16px}
.ll-slide--promo .ll-promobtn{display:inline-flex;gap:10px;align-items:center;margin-top:22px;min-height:48px;padding:0 22px;background:var(--ll-yellow);color:var(--ll-green);font-weight:600;font-size:16px;transition:background-color .2s}
.ll-slide--promo:hover .ll-promobtn{background:#EFE53A}
.ll-sliderbar{max-width:1360px;margin:36px auto 0;padding:0 var(--ll-gutter);box-sizing:border-box}
.ll-sliderbar>div{position:relative;height:2px;background:rgba(36,69,51,.2)}
.ll-sliderthumb{position:absolute;top:-1px;height:4px;left:0;width:30%;background:var(--ll-green);transition:left .35s cubic-bezier(.2,.7,.2,1)}

/* ---------- Beeld + tekst, groen schermbreed (showroom) ---------- */
.ll-gsplit{position:relative;background:var(--ll-green);color:#fff}
.ll-gsplit>div{display:flex;flex-wrap:wrap;align-items:stretch}
.ll-gsplit-img{flex:1 1 560px;min-width:0;position:relative;min-height:620px;overflow:hidden}
.ll-gsplit-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ll-gsplit-img::after{content:"";position:absolute;top:0;bottom:0;right:-1px;aspect-ratio:268/1000;background:var(--ll-green);clip-path:polygon(0 0,100% 0,100% 100%)}
.ll-gsplit-tag{position:absolute;left:0;bottom:48px;z-index:1;background:var(--ll-yellow);color:var(--ll-green);font-family:var(--ll-display);font-weight:600;font-size:22px;letter-spacing:.06em;text-transform:uppercase;padding:0 44px 0 var(--ll-gutter);height:60px;line-height:60px;clip-path:polygon(0 0,calc(100% - 16px) 0,100% 100%,0 100%)}
.ll-gsplit-text{flex:1 1 460px;min-width:0;padding:88px clamp(16px,5vw,80px) 88px clamp(16px,3vw,48px);box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;position:relative}
.ll-gsplit-bar{position:absolute;right:8%;top:0;width:120px;height:140px;background:var(--ll-yellow);clip-path:polygon(0 0,82px 0,120px 100%,38px 100%)}
.ll-gsplit-text .ll-eyebrow{color:var(--ll-yellow);margin-bottom:14px}
.ll-gsplit-text .ll-h2{line-height:1.02}
.ll-gsplit-text>p:not(.ll-eyebrow){margin:26px 0 0;max-width:540px}
.ll-gsplit-meta{display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:36px;padding-top:22px;border-top:1px solid rgba(255,255,255,.3);font-size:15px}

/* ---------- Stappen naast intro (dealer) ---------- */
.ll-stepsplit{position:relative}
.ll-stepsplit::before{content:"";position:absolute;left:0;top:0;width:36%;height:100%;background:var(--ll-tint)}
.ll-stepsplit::after{content:"";position:absolute;left:36%;top:0;bottom:0;aspect-ratio:268/1000;background:var(--ll-tint);clip-path:polygon(0 0,0 100%,100% 100%)}
.ll-stepsplit .ll-wrap{display:flex;flex-wrap:wrap;gap:56px 80px;z-index:1}
.ll-stepsplit-intro{flex:1 1 380px;min-width:0}
.ll-stepsplit-intro p:not(.ll-eyebrow){margin:24px 0 0;max-width:460px}
.ll-stepsplit .ll-steps{flex:1.3 1 520px;min-width:0}

/* ---------- Catalogus-teaser ---------- */
.ll-catalog{display:flex;flex-wrap:wrap;align-items:center;gap:48px 72px;border-top:1px solid var(--ll-green);padding-top:64px}
.ll-catalog-text{flex:1 1 420px;min-width:0}
.ll-catalog-text p:not(.ll-eyebrow){margin:22px 0 0;max-width:560px}
.ll-cover{flex:0 0 auto;position:relative;width:300px;height:424px;background:#fff;box-shadow:0 1px 0 rgba(36,69,51,.15),0 24px 48px -24px rgba(36,69,51,.45);overflow:hidden;margin:0 auto}
.ll-cover-line{position:absolute;left:22px;right:22px;top:30px;height:1px;background:var(--ll-green)}
.ll-cover-flag{position:absolute;left:66px;top:16px;width:50px;height:34px;background:var(--ll-yellow);clip-path:polygon(0 0,41px 0,50px 100%,9px 100%);z-index:2}
.ll-cover-img{position:absolute;left:22px;right:22px;top:40px;width:calc(100% - 44px);height:210px;object-fit:cover;clip-path:polygon(0 0,calc(100% - 56px) 0,100% 100%,0 100%)}
.ll-cover-block{position:absolute;left:0;bottom:44px;width:170px;height:150px;background:var(--ll-tint)}
.ll-cover-bar{position:absolute;left:150px;bottom:30px;width:80px;height:180px;background:var(--ll-yellow);clip-path:polygon(0 0,32px 0,80px 100%,48px 100%)}
.ll-cover-title{position:absolute;left:22px;bottom:60px;margin:0;font-family:var(--ll-display);font-weight:400;font-size:34px;line-height:.92;text-transform:uppercase;color:var(--ll-green)}
.ll-cover-title strong{font-weight:700}
.ll-cover-logo{position:absolute;right:20px;bottom:56px;width:76px;height:auto}
.ll-cover-base{position:absolute;left:0;right:80px;bottom:26px;height:1px;background:var(--ll-green)}

/* ---------- Kaarten met banner (service + werken bij) ---------- */
.ll-cardbanner{display:flex;flex-wrap:wrap;gap:12px 32px;align-items:center;justify-content:space-between;margin-top:24px;padding:24px 32px;background:var(--ll-green);color:#fff !important;text-decoration:none;transition:background-color .2s}
.ll-cardbanner:hover{background:var(--ll-green-dark)}
.ll-cardbanner>span:first-child{font-family:var(--ll-display);font-size:24px;text-transform:uppercase}
.ll-cardbanner>span:first-child strong{font-weight:700}
.ll-cardbanner small{font-family:var(--ll-body);font-size:16px;text-transform:none;margin-left:12px}
.ll-cardbanner>span:last-child{display:inline-flex;gap:8px;align-items:center;font-weight:600;color:var(--ll-yellow)}
.ll-cardbanner svg{transition:transform .25s cubic-bezier(.2,.7,.2,1)}
.ll-cardbanner:hover svg{transform:translateX(4px)}
.ll-sec--tint .ll-card{background:#fff}

/* ---------- Responsief (homepage-componenten) ---------- */
@media (max-width:1100px){
  .ll-gsplit-img{min-height:460px}
  .ll-stepsplit::before,.ll-stepsplit::after{display:none}
}
@media (max-width:900px){
  .ll-hero2{height:auto}
  .ll-h2panel,.ll-h2line,.ll-h2bar{display:none}
  .ll-h2content{order:1;background:var(--ll-panel);padding-top:56px;padding-bottom:56px}
  .ll-h2text{width:100%;max-width:600px}
  .ll-h2media{position:relative;inset:auto;order:2;height:380px}
  .ll-h2badge{right:16px;bottom:16px;width:min(260px,calc(100% - 32px))}
}
@media (max-width:720px){
  .ll-slide{width:82vw}
  .ll-slidemedia{height:320px}
  .ll-gsplit-img{min-height:300px}
  .ll-gsplit-text{padding:56px 16px}
  .ll-catalog{padding-top:48px}
  .ll-cardbanner small{display:block;margin:6px 0 0}
}

/* ---------- WordPress & Contact Form 7 ---------- */
.ll-formcard .wpcf7-form{margin:0}
.ll-formcard .wpcf7 .ll-form{margin:0}
.wpcf7-form-control-wrap{display:block}
.ll-field .wpcf7-form-control-wrap input,.ll-field .wpcf7-form-control-wrap select,.ll-field .wpcf7-form-control-wrap textarea{width:100%}
.ll-field .wpcf7-checkbox,.ll-field .wpcf7-acceptance{display:flex;flex-wrap:wrap;gap:10px 24px}
.ll-field .wpcf7-list-item{margin:0}
.ll-field .wpcf7-list-item label{display:inline-flex;gap:10px;align-items:center;font-weight:400}
.wpcf7-not-valid-tip{margin-top:6px;font-size:14px;color:#A4262C}
.ll-field .wpcf7-not-valid{border-color:#A4262C !important}
.wpcf7 form .wpcf7-response-output{margin:20px 0 0;padding:18px 22px;border:0;border-left:4px solid var(--ll-yellow);background:var(--ll-tint);font-weight:600}
.wpcf7 form.invalid .wpcf7-response-output,.wpcf7 form.failed .wpcf7-response-output{border-left-color:#A4262C}
.wpcf7-spinner{margin:0 0 0 12px}
.ll-btnrow .wpcf7-spinner{align-self:center}
.screen-reader-text{position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.ll-prose img{height:auto}
.ll-prose a{text-decoration:underline}
.ll-page-plain{padding:72px 0}
.ll-404{text-align:left}
