/* WeLoveWebStudio site-engine — "looks": variatie per site bovenop de 3 thema's.
 * Klassen staan op <html> (lk-…), gezet door W.applyStyle uit site.style.look (zie looks.js). */

/* ---------- algemeen ---------- */
html.lk body{background-color:var(--bg)}
html.lk .h1,html.lk .h2,html.lk .h3,html.lk h1,html.lk h2{text-transform:var(--h-tt,none)}
html.lk-caps .h1{letter-spacing:.005em}
.hdr-top{display:none}

/* ---------- header-indelingen ---------- */
@media (min-width:961px){
  html.lk-hd-center .hdr-in{flex-wrap:wrap;justify-content:center;height:auto;padding:18px 0 0;row-gap:12px;position:relative}
  html.lk-hd-center .hdr .logo{width:100%;justify-content:center;font-size:1.75rem}
  html.lk-hd-center .hdr-nav{margin:0;padding:10px 0 14px;gap:38px}
  html.lk-hd-center .hdr-act{position:absolute;right:0;top:18px}

  html.lk-hd-split .hdr-in{display:grid;grid-template-columns:1fr auto 1fr;gap:24px}
  html.lk-hd-split .hdr-nav{grid-column:1;grid-row:1;margin:0;justify-self:start;gap:26px}
  html.lk-hd-split .hdr .logo{grid-column:2;grid-row:1;justify-self:center;font-size:1.6rem}
  html.lk-hd-split .hdr-act{grid-column:3;grid-row:1;justify-self:end}

  html.lk-hd-float .hdr{background:transparent!important;border:0!important;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;padding:14px 0 0}
  html.lk-hd-float .hdr-in{background:var(--surface);border-radius:999px;padding:0 10px 0 28px;height:70px;box-shadow:0 10px 40px rgba(0,0,0,.09);border:1px solid var(--line)}
  html.lk-hd-float .hdr .logo,html.lk-hd-float .hdr-nav a{color:var(--ink)}
  html.lk-hd-float .hdr-nav a:not(.on){color:var(--muted)}

  html.lk-hd-line .hdr-top{display:block;background:var(--dark);color:var(--dark-ink,#fff);font-size:.84rem}
  html.lk-hd-line .hdr-top .wrap{display:flex;gap:28px;padding:9px 0;justify-content:flex-end}
  html.lk-hd-line .hdr-top a,html.lk-hd-line .hdr-top span{color:inherit;text-decoration:none;display:inline-flex;gap:7px;align-items:center;opacity:.88}
  html.lk-hd-line .hdr-top .ic{width:15px;height:15px}
  html.lk-hd-line .hdr-nav a{text-transform:uppercase;letter-spacing:.12em;font-size:.8rem;font-weight:600}
  html.lk-hd-line .hdr{border-bottom:1px solid var(--line)}
}
/* header-kleuren */
html.lk-hdc-dark .hdr{background:var(--dark)!important;border-bottom-color:transparent}
html.lk-hdc-dark .hdr .logo,html.lk-hdc-dark .hdr-nav a.on,html.lk-hdc-dark .hdr-nav a:hover{color:#fff}
html.lk-hdc-dark .hdr-nav a{color:rgba(255,255,255,.72)}
html.lk-hdc-dark .hdr-burger{background:transparent;border-color:rgba(255,255,255,.3)}html.lk-hdc-dark .hdr-burger span{background:#fff}
html.lk-hdc-dark .hdr-cart{color:#fff;border-color:rgba(255,255,255,.3)}
html.lk-hdc-accent .hdr{background:var(--accent)!important;border-bottom:3px solid var(--ink)}
html.lk-hdc-accent .hdr .logo,html.lk-hdc-accent .hdr-nav a{color:var(--accent-ink)!important}
html.lk-hdc-accent .hdr-nav a.on::after{background:var(--accent-ink)}
html.lk-hdc-accent .hdr .hdr-cta{background:var(--ink);color:#fff;border-color:var(--ink)}
html.lk-hdc-accent .hdr-burger span{background:var(--accent-ink)}
html.lk-hd-float.lk-hdc-dark .hdr-in{background:var(--dark);border-color:transparent}
html.lk-hd-float.lk-hdc-dark .hdr .logo,html.lk-hd-float.lk-hdc-dark .hdr-nav a{color:#fff}
@media (max-width:960px){html.lk-hdc-dark .hdr-nav,html.lk-hdc-accent .hdr-nav{background:var(--dark)}html.lk-hdc-accent .hdr-nav a{color:#fff!important}}

/* ---------- hero-indelingen ---------- */
.hero-rev .hero-grid{grid-template-columns:.95fr 1.05fr}
.hero-rev .hero-media{order:-1}
.hero-rev .hero-badge{left:auto;right:-24px}

.hero-stack{padding:clamp(48px,7vw,96px) 0 clamp(48px,6vw,80px)}
.hs-top{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(28px,5vw,70px);align-items:end}
.hs-top .lead{margin:0 0 26px}
.hero-stack .hero-media{position:relative;margin-top:clamp(36px,5vw,60px)}
.hero-stack .hero-img{width:100%;aspect-ratio:21/8;object-fit:cover;border-radius:var(--r-lg);display:block}
.hero-stack .hero-badge{left:auto;right:32px;bottom:-22px}
.hs-widget{margin-top:30px}.hs-widget .hero-widget{margin-top:0}
.hero-stack .hero-usps{margin-top:34px}

.hero-panel{display:grid;grid-template-columns:1fr 1fr;min-height:min(84vh,780px)}
.hp-txt{background:var(--dark);color:#fff;display:flex;align-items:center;padding:clamp(56px,7vw,100px) clamp(24px,5vw,72px)}
.hp-in{max-width:600px;margin-left:auto;width:100%}
.hp-txt .lead,.hp-txt .hero-usps{color:rgba(255,255,255,.8)}
.hp-txt .eyebrow{color:var(--accent2)}
html.lk-eb-pill .hp-txt .eyebrow,html.lk-eb-bar .hp-txt .eyebrow{color:var(--accent-ink)}
.hp-txt .h1 em{color:color-mix(in srgb,var(--accent) 60%,#fff)}
.hp-txt .btn-ghost{color:#fff;border-color:rgba(255,255,255,.7)}
.hp-txt .hero-usp .ic{color:var(--accent2)}
.hp-media{position:relative;min-height:340px}
.hp-media .hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hp-media .hero-badge{left:28px;bottom:28px}

.hero-collage .hero-media{min-height:520px}
.hc-main{width:76%;margin-left:auto;aspect-ratio:4/5;overflow:hidden;border-radius:var(--r-lg);box-shadow:var(--shadow-lg)}
.hc-main img{width:100%;height:100%;object-fit:cover}
.hc-1,.hc-2{position:absolute;object-fit:cover;border:6px solid var(--bg);box-shadow:var(--shadow-lg);border-radius:var(--r)}
.hc-1{left:0;bottom:6%;width:46%;aspect-ratio:1}
.hc-2{left:6%;top:4%;width:34%;aspect-ratio:4/3}
.hero-collage .hero-badge{left:auto;right:-14px;bottom:-14px}

.hero-boxed{min-height:min(86vh,800px);display:flex;align-items:center;background-size:cover;background-position:center;padding:clamp(60px,8vw,110px) 0}
.hero-boxed .hero-shade{background:linear-gradient(90deg,rgba(0,0,0,.35),rgba(0,0,0,.05))}
.hero-boxed .wrap{position:relative;display:flex;align-items:flex-end;justify-content:space-between;gap:30px;flex-wrap:wrap}
.hb-card{background:var(--surface);color:var(--ink);padding:clamp(30px,4vw,52px);max-width:640px;border-radius:var(--r-lg);box-shadow:var(--shadow-lg)}
.hb-card .lead{margin:18px 0 0}
.hero-boxed .hero-badge{position:relative;left:auto;bottom:auto}

@media (max-width:900px){
  .hs-top,.hero-panel{grid-template-columns:1fr}
  .hero-stack .hero-img{aspect-ratio:4/3}
  .hp-in{margin:0}
  .hero-collage .hero-media{min-height:0}
  .hc-main{width:100%}.hc-1,.hc-2{display:none}
  .hero-rev .hero-media{order:0}
}

/* ---------- fotovormen ---------- */
html.lk-img-arch :is(.arch,.hc-main){border-radius:999px 999px var(--r-lg) var(--r-lg)}
html.lk-img-arch .ti-img{border-radius:240px 240px var(--r-lg) var(--r-lg)}
html.lk-img-round :is(.arch,.hc-main,.ti-img,.m-img,.hero-center .hero-img,.hero-stack .hero-img){border-radius:44px}
html.lk-img-square :is(.arch,.hc-main,.ti-img,.ti-img2,.m-img,.hero-center .hero-img,.hero-stack .hero-img,.hc-1,.hc-2,.card,.card-media){border-radius:0}
html.lk-img-circle :is(.arch,.hc-main){border-radius:50%;aspect-ratio:1}
html.lk-img-circle .ti-img{border-radius:50%;aspect-ratio:1}
html.lk-img-circle .m-img{border-radius:50%;aspect-ratio:1}
html.lk-img-circle :is(.hero-center .hero-img,.hero-stack .hero-img){border-radius:300px}
html.lk-img-blob :is(.arch,.hc-main){border-radius:58% 42% 52% 48% / 46% 54% 46% 54%}
html.lk-img-blob .ti-img{border-radius:42% 58% 46% 54% / 54% 44% 56% 46%}
html.lk-img-blob .m-img{border-radius:50% 50% 46% 54% / 55% 48% 52% 45%}
html.lk-img-blob :is(.hero-center .hero-img,.hero-stack .hero-img){border-radius:220px 40px 220px 40px}
html.lk-img-frame :is(.arch,.hc-main,.ti-img,.m-img,.hero-center .hero-img,.hero-stack .hero-img){border-radius:0;box-shadow:18px 18px 0 0 var(--accent2)}
html.lk-img-tilt :is(.arch,.hc-main){border-radius:var(--r);transform:rotate(-2.5deg);box-shadow:var(--shadow-lg)}
html.lk-img-tilt .ti-img{border-radius:var(--r);transform:rotate(2deg);box-shadow:var(--shadow-lg)}
html.lk-img-tilt .ti.rev .ti-img{transform:rotate(-2deg)}
html.lk-img-soft :is(.arch,.hc-main,.ti-img){border-radius:var(--r-lg)}
html.lk-img-soft .ti.rev .ti-img,html.lk-img-round .ti.rev .ti-img,html.lk-img-square .ti.rev .ti-img,html.lk-img-frame .ti.rev .ti-img{border-radius:inherit}
html.lk-img-round .ti.rev .ti-img{border-radius:44px}html.lk-img-soft .ti.rev .ti-img{border-radius:var(--r-lg)}html.lk-img-square .ti.rev .ti-img,html.lk-img-frame .ti.rev .ti-img{border-radius:0}

/* ---------- eyebrows ---------- */
html.lk .eyebrow::before,html.lk .eyebrow::after,html.lk .sec-head.center .eyebrow::after{content:none}
html.lk .eyebrow{background:none;padding:0;color:var(--accent);display:inline-flex;align-items:center;gap:10px;transform:none}
html.lk-eb-line .eyebrow::before{content:"";width:30px;height:1.5px;background:currentColor}
html.lk-eb-pill .eyebrow{background:color-mix(in srgb,var(--accent) 13%,transparent);padding:7px 14px;border-radius:999px;letter-spacing:.1em}
html.lk-eb-dot .eyebrow::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--accent2)}
html.lk-eb-plain .eyebrow{letter-spacing:.3em;color:var(--muted)}
html.lk-eb-num main{counter-reset:eb}
html.lk-eb-num .eyebrow::before{counter-increment:eb;content:counter(eb,decimal-leading-zero);font-family:var(--font-h);font-size:1.05rem;color:var(--ink);border-right:1px solid var(--line);padding-right:10px;letter-spacing:0}
html.lk-eb-bar .eyebrow{background:var(--accent);color:var(--accent-ink);padding:6px 12px;font-weight:700;letter-spacing:.14em}
html.lk .hero-full .eyebrow,html.lk .pagehead.has-img .eyebrow{color:#fff}
html.lk-eb-bar .hero-full .eyebrow,html.lk-eb-pill .hero-full .eyebrow{color:var(--accent-ink)}
html.lk-eb-pill .hero-full .eyebrow{background:var(--accent)}

/* ---------- knoppen ---------- */
html.lk-btn-pill{--r-btn:999px}
html.lk-btn-soft{--r-btn:10px}
html.lk-btn-square{--r-btn:0px}
html.lk-btn-sharp{--r-btn:0px}
html.lk-btn-sharp .btn{border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink);text-transform:uppercase;letter-spacing:.06em}
html.lk-btn-sharp .btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}
html.lk-btn-sharp :is(.hero-full,.hp-txt,.bg-dark,.cta-box) .btn{border-color:#fff;box-shadow:4px 4px 0 rgba(255,255,255,.35)}
html.lk:not(.lk-btn-sharp) .btn{box-shadow:none;border-width:1.5px}
html.lk:not(.lk-btn-sharp) .btn:hover{transform:translateY(-2px)}

/* ---------- kaarten ---------- */
html.lk-card-shadow :is(.card,.feat,.review,.step){border:0;box-shadow:var(--shadow);background:var(--surface)}
html.lk-card-border :is(.card,.feat,.review,.step){border:1.5px solid var(--line);box-shadow:none;background:transparent}
html.lk-card-flat :is(.card,.feat,.review,.step){border:0;box-shadow:none;background:var(--surface2)}
html.lk-card-flat .bg-soft :is(.card,.feat,.review,.step){background:var(--surface)}
html.lk-card-overlay .card{position:relative;border:0;box-shadow:none;min-height:400px;color:#fff;background:var(--dark)}
html.lk-card-overlay .card-media{position:absolute;inset:0;aspect-ratio:auto;margin:0;border-radius:inherit}
html.lk-card-overlay .card-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 30%,rgba(0,0,0,.82))}
html.lk-card-overlay .card-body{position:relative;margin-top:auto;pointer-events:none}
html.lk-card-overlay .card-body a{pointer-events:auto}
html.lk-card-overlay .card .h3,html.lk-card-overlay .card p,html.lk-card-overlay .card .more{color:#fff}
html.lk-card-overlay .feat{border:0;border-left:4px solid var(--accent);border-radius:0;box-shadow:none;background:var(--surface)}
html.lk-card-overlay .review,html.lk-card-overlay .step{border:0;box-shadow:var(--shadow)}
html.lk .bg-dark :is(.feat,.review,.step){background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12);box-shadow:none}

/* ---------- koppen links ---------- */
html.lk-head-left .sec-head.center{text-align:left;margin-left:0;margin-right:auto}
html.lk-head-left .sec-head.center .h2::after{margin-left:0}
html.lk-head-left .sec-head.center .lead{margin-left:0}
html.lk-head-center .sec-head{text-align:center;margin-inline:auto}
html.lk-head-center .sec-head .lead{margin-inline:auto}
html.lk-head-center .sec-head .h2::after{margin-inline:auto}

/* ---------- reviews ---------- */
html.lk-rvw-big .reviews{grid-template-columns:1fr 1fr}
html.lk-rvw-big .review:first-child{grid-column:1/-1;padding:clamp(32px,5vw,60px);text-align:left;align-items:flex-start}
html.lk-rvw-big .review:first-child blockquote{font-family:var(--font-h);font-size:clamp(1.5rem,2.6vw,2.2rem);line-height:1.25;font-style:normal}
html.lk-rvw-list .reviews{grid-template-columns:1fr;max-width:860px;margin-inline:auto;gap:0}
html.lk-rvw-list .review{display:grid;grid-template-columns:1fr 210px;gap:12px 40px;align-items:center;border-radius:0!important;border:0!important;box-shadow:none!important;background:transparent!important;border-bottom:1px solid var(--line)!important;padding:30px 0;text-align:left}
html.lk-rvw-list .review .stars{grid-column:2;grid-row:1}
html.lk-rvw-list .review blockquote{grid-column:1;grid-row:1/3;font-size:1.12rem}
html.lk-rvw-list .review .rv-who{grid-column:2;grid-row:2;flex-direction:row;align-items:center}
@media (max-width:700px){html.lk-rvw-big .reviews{grid-template-columns:1fr}html.lk-rvw-list .review{grid-template-columns:1fr}html.lk-rvw-list .review>*{grid-column:1!important;grid-row:auto!important}}

/* ---------- cijfers ---------- */
html.lk-stats-cards .stats{gap:18px}
html.lk-stats-cards .stat{background:var(--surface);color:var(--ink);padding:30px 22px;border-radius:var(--r-lg);box-shadow:var(--shadow)}
html.lk-stats-cards .bg-dark .stat{background:rgba(255,255,255,.07);color:#fff;box-shadow:none}
html.lk-stats-plain .stats{text-align:left;gap:0}
html.lk-stats-plain .stat{padding:6px 28px;border-left:2px solid var(--accent)}
html.lk-stats-plain .stat strong{font-size:clamp(2.8rem,5vw,4.2rem)}

/* ---------- decoratie ---------- */
html.lk:not(.lk-deco-glow) :is(.blob,.deco-circle){display:none}
html.lk-deco-glow .hero-split{background:radial-gradient(900px 520px at 88% 10%,color-mix(in srgb,var(--accent) 14%,transparent),transparent 62%),radial-gradient(700px 400px at 5% 95%,color-mix(in srgb,var(--accent2) 12%,transparent),transparent 60%)}
html.lk-deco-dots :is(.hero-split,.hero-stack,.hero-center){background-image:radial-gradient(color-mix(in srgb,var(--ink) 16%,transparent) 1.4px,transparent 1.6px);background-size:22px 22px}
html.lk-deco-grid :is(.hero-split,.hero-stack,.hero-center){background-image:linear-gradient(color-mix(in srgb,var(--ink) 7%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--ink) 7%,transparent) 1px,transparent 1px);background-size:56px 56px}
html.lk-deco-lines :is(.hero-split,.hero-stack,.hero-center)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:14px;background:repeating-linear-gradient(-45deg,var(--accent) 0 14px,var(--ink) 14px 28px);opacity:.9}
html.lk-deco-none .hero-split{background:none}

/* donkere en accentblokken volgen de palet-kleuren */
html.lk .sec.bg-dark{background:var(--dark)}
html.lk .sec.bg-soft{background:var(--surface2)}
html.lk .cta-box{background:var(--accent2)}
.hb-card .h1{font-size:clamp(2.3rem,4.4vw,4.1rem);overflow-wrap:break-word}
html.lk-eb-num .eyebrow{line-height:1.6;overflow:visible;padding-top:2px}
html.lk-eb-num .eyebrow::before{line-height:1;font-size:.95rem;display:inline-block;padding:2px 10px 2px 0}
html.lk .eyebrow::before{width:auto;height:auto;background:none;border-radius:0}
html.lk-eb-line .eyebrow::before{width:30px;height:1.5px;background:currentColor}
html.lk-eb-dot .eyebrow::before{width:8px;height:8px;border-radius:50%;background:var(--accent2)}
@media (max-width:900px){.hero-rev .hero-badge{right:12px;left:auto}.hero-rev .hero-media{margin-top:10px}}