/* The Batcave - prototype sitewide stijl */
@font-face{font-family:'Space Grotesk';src:url(/wp-content/fonts/space-grotesk/V8mDoQDjQSkFtoMM3T6r8E7mPbF4Cw.woff2) format('woff2');font-weight:300 700;font-display:swap}
@font-face{font-family:'Inter';src:url(/wp-content/fonts/inter/inter-latin-var.woff2) format('woff2');font-weight:100 900;font-display:swap}
@view-transition{navigation:auto}

:root{
 --ink:#0B0D11;--text:#33383F;--grey:#6E747C;--soft:#B9BEC4;--surface:#F4F5F6;--line:rgba(11,13,17,.09);
 --mint:#86FCEB;--mint-ink:#06231f;
 --display:'Space Grotesk',system-ui,sans-serif;--body:'Inter',system-ui,sans-serif;
 --ease:cubic-bezier(.22,1,.36,1);--ease-io:cubic-bezier(.76,0,.24,1);
 --g:clamp(20px,4vw,64px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--text);font-family:var(--body);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
p{margin:0}
h1,h2,h3,h4{font-family:var(--display);font-weight:500;color:var(--ink);margin:0;letter-spacing:-.03em;line-height:1.08}
::selection{background:var(--mint);color:var(--mint-ink)}
:focus-visible{outline:2px solid var(--ink);outline-offset:4px;border-radius:4px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.box{max-width:calc(1200px + 2*var(--g));margin-inline:auto}
.box.narrow{max-width:calc(980px + 2*var(--g))}
/* Raster */
.g{padding-inline:var(--g)}
.grid12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,1.6vw,24px)}
.lbl{font-family:var(--body);font-size:13px;font-weight:500;color:var(--grey);letter-spacing:0}
.lbl::before{content:"";display:inline-block;width:6px;height:6px;background:var(--mint);margin-right:10px;vertical-align:1px}
.stmt{font-family:var(--display);font-weight:500;font-size:clamp(20px,1.75vw,28px);line-height:1.3;letter-spacing:-.03em;color:var(--grey)}
.stmt b{font-weight:500;color:var(--ink)}
.sec{padding-block:clamp(88px,11vw,180px)}
.sec+.sec{padding-top:0}
.surface{background:var(--surface)}.surface+.sec,.sec+.surface,.dark+.sec,.sec+.dark{padding-top:clamp(88px,11vw,180px)}
.dark{background:var(--ink);color:rgba(255,255,255,.7)}.dark h1,.dark h2,.dark h3{color:#fff}.dark .stmt{color:rgba(255,255,255,.42)}.dark .stmt b{color:#fff}.dark .lbl{color:rgba(255,255,255,.5)}

/* Links en knoppen */
.tl{position:relative;display:inline-flex;align-items:center;gap:8px;font-family:var(--display);font-weight:500;font-size:15px;color:var(--ink);transition:transform .25s var(--ease)}
.dark .tl{color:#fff}
.tl::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--mint);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.tl:hover{transform:translateY(-2px)}.tl:hover::after{transform:scaleX(1)}
.tl .ar{transition:transform .3s var(--ease)}.tl:hover .ar{transform:translateX(3px)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--display);font-weight:500;font-size:15px;padding:15px 26px;border-radius:100px;background:var(--mint);color:var(--mint-ink);transition:transform .25s var(--ease),box-shadow .25s ease;border:0;cursor:pointer}
.btn:hover{transform:translateY(-2px);box-shadow:0 14px 30px -14px rgba(6,35,31,.45)}
.btn.ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px rgba(11,13,17,.18)}
.btn.ghost:hover{box-shadow:inset 0 0 0 1px var(--ink)}

/* Navigatie */
.nav{position:fixed;inset:0 0 auto 0;z-index:50;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:14px var(--g);view-transition-name:nav;transition:background .35s ease,backdrop-filter .35s ease}
.nav.scr{background:rgba(255,255,255,.78);-webkit-backdrop-filter:saturate(180%) blur(18px);backdrop-filter:saturate(180%) blur(18px)}
.nav.dk.scr{background:rgba(11,13,17,.72)}
.nav .lg{justify-self:start;display:block;width:136px;color:var(--ink);transition:color .3s ease}
.nav.dk .lg{color:#fff}
.nav .lg svg{display:block;width:100%;height:auto}
.pill{position:relative;display:flex;gap:2px;padding:5px;border-radius:100px;background:rgba(244,245,246,.88);border:1px solid rgba(11,13,17,.06);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);transition:background .35s ease,border-color .35s ease}
.pill .ind{position:absolute;top:5px;bottom:5px;left:0;width:0;border-radius:100px;background:#fff;box-shadow:0 1px 4px rgba(11,13,17,.12);transition:transform .5s var(--ease),width .5s var(--ease),opacity .3s ease;pointer-events:none;opacity:0}
.pill a{position:relative;z-index:1;padding:9px 17px;font-family:var(--display);font-size:14px;font-weight:500;color:var(--grey);border-radius:100px;white-space:nowrap;transition:color .25s ease}
.pill a:hover,.pill a[aria-current]{color:var(--ink)}
.nav.dk .pill{background:rgba(36,38,43,.82);border-color:rgba(255,255,255,.08)}
.nav.dk .pill a{color:rgba(255,255,255,.55)}.nav.dk .pill a:hover,.nav.dk .pill a[aria-current]{color:#fff}
.nav.dk .pill .ind{background:rgba(255,255,255,.14);box-shadow:none}
.nav .rt{justify-self:end;display:flex;align-items:center;gap:8px}
.nav .cta{padding:11px 20px;font-size:14px}
.nav .mb{display:none;align-items:center;gap:10px;padding:10px 12px 10px 18px;border:0;border-radius:100px;background:rgba(244,245,246,.92);font:500 14px var(--display);color:var(--ink);cursor:pointer}
.nav .mb i{position:relative;width:18px;height:18px}
.nav .mb i::before,.nav .mb i::after{content:"";position:absolute;left:2px;right:2px;height:1.5px;background:currentColor;transition:transform .35s var(--ease)}
.nav .mb i::before{top:6px}.nav .mb i::after{top:11px}
.nav.open .mb i::before{transform:translateY(2.5px) rotate(45deg)}.nav.open .mb i::after{transform:translateY(-2.5px) rotate(-45deg)}
.sheet{position:fixed;inset:70px 12px auto 12px;z-index:49;background:#fff;border-radius:18px;padding:10px;box-shadow:0 30px 70px -30px rgba(0,0,0,.4);opacity:0;visibility:hidden;transform:translateY(-8px) scale(.98);transform-origin:top;transition:opacity .25s ease,transform .4s var(--ease),visibility 0s .4s}
.sheet.open{opacity:1;visibility:visible;transform:none;transition:opacity .25s ease,transform .4s var(--ease)}
.sheet a{display:flex;justify-content:space-between;padding:14px;border-radius:12px;font:500 24px/1.1 var(--display);letter-spacing:-.02em;color:var(--ink)}
.sheet a:hover{background:var(--surface)}
.sheet .btn{display:flex;margin-top:8px;font-size:16px}
@media (max-width:860px){.nav{grid-template-columns:1fr auto}.nav .pill,.nav .cta{display:none}.nav .mb{display:inline-flex}.nav .lg{width:108px}}

/* Paginaovergangen */
::view-transition-old(root){animation:vt-out .38s var(--ease-io) both}
::view-transition-new(root){animation:vt-in .62s var(--ease) .06s both}
@keyframes vt-out{to{opacity:0;transform:translateY(-24px)}}
@keyframes vt-in{from{opacity:0;transform:translateY(32px)}}
::view-transition-group(*){animation-duration:.7s;animation-timing-function:var(--ease)}
::view-transition-old(nav),::view-transition-new(nav){animation:none}
@media (prefers-reduced-motion:reduce){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}}

/* Intro (1x per bezoek) */
#intro{position:fixed;inset:0;z-index:100;background:#fff;display:none;align-items:center;justify-content:center;clip-path:inset(0 0 0 0)}
.intro-on #intro{display:flex;animation:intro-out .65s var(--ease-io) 1s forwards}
#intro .in{width:min(240px,50vw);color:var(--ink)}
#intro svg{display:block;width:100%;height:auto;overflow:visible}
#intro .lt{transform-box:fill-box}
.intro-on #intro .top .lt{transform:translateY(-110%);animation:lt .7s var(--ease) forwards;animation-delay:calc(.08s + var(--i)*.05s)}
.intro-on #intro .bot .lt{transform:translateY(110%);animation:lt .7s var(--ease) forwards;animation-delay:calc(.2s + var(--i)*.045s)}
#intro .sqr{transform-box:fill-box;transform-origin:center}
.intro-on #intro .sqr{transform:scale(0);animation:sq .5s cubic-bezier(.34,1.56,.64,1) .66s forwards}
@keyframes lt{to{transform:none}}@keyframes sq{to{transform:scale(1)}}
@keyframes intro-out{to{clip-path:inset(0 0 100% 0);visibility:hidden}}

/* Reveal bij scrollen */
.rv-on [data-rv]{opacity:0;transform:translateY(40px);transition:opacity .9s var(--ease),transform 1.1s var(--ease);transition-delay:calc(var(--d,0)*110ms)}
.rv-on [data-rv].in{opacity:1;transform:none}
.lm{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.lm>span{display:block;transform:translateY(105%);animation:up 1s var(--ease) forwards;animation-delay:var(--dl,.05s)}
.intro-on .lm>span{animation-delay:calc(var(--dl,.05s) + 1.15s)}
@keyframes up{to{transform:none}}

/* Cursorlabel boven projecten */
.cur{position:fixed;left:0;top:0;z-index:60;pointer-events:none;width:88px;height:88px;margin:-44px 0 0 -44px;border-radius:50%;background:var(--mint);color:var(--mint-ink);display:flex;align-items:center;justify-content:center;font:500 13px var(--display);transform:translate(var(--x,-200px),var(--y,-200px)) scale(0);transition:transform .35s var(--ease)}
.cur.on{transform:translate(var(--x),var(--y)) scale(1)}
@media (hover:none){.cur{display:none}}

/* Hero (home) */
.hero{padding-top:clamp(140px,18vw,220px)}
.hero h1{font-size:clamp(34px,4.1vw,62px);line-height:1.04;letter-spacing:-.04em;font-weight:500}
.hero h1 .gy{color:var(--soft)}
.mk{position:relative;display:inline-block;z-index:0}
.mk::before{content:"";position:absolute;left:-.03em;right:-.03em;bottom:.12em;height:.26em;background:var(--mint);z-index:-1;transform:scaleX(0);transform-origin:left;transition:transform .9s var(--ease)}
.mk.on::before{transform:scaleX(1)}
.hero .meta{margin-top:clamp(40px,5vw,72px);align-items:end;row-gap:28px}
.hero .meta .lead{grid-column:1/span 5;font-size:17px;line-height:1.55;color:var(--text)}
.hero .meta .act{grid-column:8/span 5;justify-self:end;display:flex;gap:24px;align-items:center;flex-wrap:wrap}
.rating{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--grey)}
.photo{display:block;margin-top:clamp(56px,7vw,110px);aspect-ratio:21/9;max-height:88vh;overflow:hidden;clip-path:inset(0 var(--g) round 6px)}
.photo img{width:100%;height:100%;object-fit:cover;object-position:center 30%;transform:scale(var(--s,1.06))}
@media (max-width:860px){.hero .meta .lead,.hero .meta .act{grid-column:1/-1;justify-self:start}.photo{aspect-ratio:4/5;clip-path:inset(0 var(--g) round 6px)}.photo img{transform:none}}

/* Logo's */
.logos{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:44px 40px;margin-top:36px;align-items:center}
.logos a{display:flex;align-items:center;justify-content:flex-start;height:48px}
.logos img{max-height:30px;max-width:100%;width:auto;filter:grayscale(1);opacity:.55;transition:opacity .3s,filter .3s}
.logos a:hover img{opacity:1;filter:none}
@media (max-width:860px){.logos{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 24px}}

/* Sectiekop */
.head{align-items:end;row-gap:24px;margin-bottom:clamp(40px,5vw,72px)}
.head .lbl{grid-column:1/span 3;align-self:start;padding-top:.6em}
.head .stmt{grid-column:4/span 7}
.head .more{grid-column:11/span 2;justify-self:end}
@media (max-width:860px){.head .lbl,.head .stmt,.head .more{grid-column:1/-1;justify-self:start}}

/* Projecten */
.cases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px clamp(12px,1.4vw,20px)}
.cases .full{grid-column:1/-1}
.case .im{overflow:hidden;border-radius:6px;background:var(--surface)}
.case img{width:100%;aspect-ratio:4/5;object-fit:cover;transition:transform 1.4s var(--ease)}
.case.full img{aspect-ratio:4/5}
.case:hover img{transform:scale(1.03)}
.case .cap{display:flex;justify-content:space-between;gap:16px;margin-top:16px}
.case .cap h3{font-size:15px;letter-spacing:-.015em}
.case .cap span{font-size:13px;color:var(--grey);text-align:right}
@media (max-width:1000px){.cases{grid-template-columns:1fr 1fr}}@media (max-width:600px){.cases{grid-template-columns:1fr}.case img,.case.full img{aspect-ratio:5/4}}

/* Filter */
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:40px}
.filters button{font:500 14px var(--display);padding:10px 18px;border-radius:100px;border:0;background:var(--surface);color:var(--grey);cursor:pointer;transition:background .25s,color .25s}
.filters button:hover{color:var(--ink)}
.filters button[aria-pressed="true"]{background:var(--ink);color:#fff}
.filters button sup{font-size:10px;margin-left:4px;opacity:.6}

/* Dienstenlijst */
.svcs{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.svcs li{border-bottom:1px solid var(--line)}
.svcs a{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,1.6vw,24px);align-items:center;padding:24px 0}
.svcs .n{grid-column:1/span 1;font-size:13px;color:var(--grey)}
.svcs h3{grid-column:2/span 5;font-size:clamp(18px,1.6vw,23px);letter-spacing:-.02em;color:var(--soft);transition:color .35s ease,transform .5s var(--ease)}
.svcs a:hover h3{color:var(--ink);transform:translateX(8px)}
.svcs p{grid-column:7/span 4;color:var(--grey);font-size:15px}
.svcs .pr{grid-column:11/span 2;justify-self:end;font:500 14px var(--display);color:var(--ink);display:inline-flex;gap:10px;align-items:center;white-space:nowrap}
.svcs .pr i{font-style:normal;transition:transform .3s var(--ease)}.svcs a:hover .pr i{transform:translateX(4px)}
.surface .svcs a:hover h3{color:var(--ink)}
@media (max-width:860px){.svcs a{grid-template-columns:1fr auto;row-gap:6px}.svcs .n{display:none}.svcs h3{grid-column:1;color:var(--ink)}.svcs p{grid-column:1/-1;grid-row:2}.svcs .pr{grid-column:2;grid-row:1}}

/* Reviews */
.revs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.6vw,24px)}
.rev{margin:0;padding:32px;border-radius:6px;background:rgba(255,255,255,.05);display:flex;flex-direction:column;min-height:260px}
.rev blockquote{margin:0;font:500 17px/1.5 var(--display);letter-spacing:-.015em;color:#fff}
.rev .st{color:var(--mint);font-size:13px;letter-spacing:3px;margin-bottom:24px}
.rev figcaption{margin-top:auto;padding-top:28px;font-size:14px;color:rgba(255,255,255,.55)}
.rev figcaption b{color:#fff;font-weight:500}
@media (max-width:860px){.revs{grid-template-columns:1fr}.rev{min-height:0}}

/* Over (home) */
.about{align-items:center;row-gap:48px}
.about .ph{grid-column:1/span 5;border-radius:6px;overflow:hidden;aspect-ratio:4/5}
.about .ph img{width:100%;height:100%;object-fit:cover}
.about .tx{grid-column:7/span 6}
.about .tx p{margin-top:20px;font-size:17px;max-width:54ch}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:48px;border-top:1px solid var(--line)}
.stats div{padding:22px 16px 0 0}
.stats b{display:block;font:500 clamp(30px,2.8vw,44px)/1 var(--display);letter-spacing:-.04em;color:var(--ink)}
.stats span{display:block;margin-top:10px;font-size:13px;color:var(--grey)}
@media (max-width:860px){.about .ph,.about .tx{grid-column:1/-1}.stats{grid-template-columns:1fr 1fr}.stats div{padding-bottom:20px}}

/* Afsluiter */
.end{text-align:left}
.end h2{font-size:clamp(30px,3.4vw,52px);line-height:1.06;letter-spacing:-.04em}
.end h2 .gy{color:var(--soft)}
.end .row{margin-top:48px;display:flex;gap:28px;align-items:center;flex-wrap:wrap}

/* Footer */
.foot{background:var(--ink);color:rgba(255,255,255,.55);padding:clamp(72px,8vw,120px) var(--g) 32px;font-size:14px}
.foot .top{row-gap:40px}
.foot .lgw{grid-column:1/span 4;color:#fff;width:150px}
.foot .lgw svg{width:100%;height:auto;display:block}
.foot .tag{margin-top:20px;max-width:30ch}
.foot .col{grid-column:span 2}
.foot .col .fh{font:500 13px var(--body);color:#fff;letter-spacing:0;margin:0 0 14px}
.foot .col a{display:block;padding:4px 0;color:rgba(255,255,255,.55);transition:color .2s}
.foot .col a:hover{color:var(--mint)}
.foot .bot{margin-top:clamp(56px,6vw,96px);padding-top:24px;border-top:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13px}
@media (max-width:860px){.foot .lgw{grid-column:1/-1}.foot .col{grid-column:span 6}}

/* Paginakop (binnenpagina's) */
.phd{padding-top:clamp(140px,16vw,220px);padding-bottom:clamp(56px,6vw,96px)}
.phd h1{font-size:clamp(34px,4.1vw,62px);line-height:1.04;letter-spacing:-.04em}
.phd h1 .gy{color:var(--soft)}
.phd .intro{margin-top:32px;font-size:clamp(17px,1.4vw,20px);max-width:52ch;color:var(--text)}
.crumb{font-size:13px;color:var(--grey);margin-bottom:28px;display:flex;gap:10px}
.crumb a:hover{color:var(--ink)}

/* Case-detail */
.chero{padding-top:clamp(140px,16vw,200px)}
.chero h1{font-size:clamp(34px,4.1vw,62px);line-height:1.04;letter-spacing:-.04em}
.chero .sub{margin-top:18px;font:500 clamp(18px,1.5vw,22px)/1.35 var(--display);letter-spacing:-.02em;color:var(--grey);max-width:30ch}
.cimg{margin-top:clamp(48px,6vw,88px)}
.cimg img{width:100%;aspect-ratio:2/1;object-fit:cover;border-radius:6px}
.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;padding-block:28px;border-bottom:1px solid var(--line)}
.facts dt{font-size:13px;color:var(--grey)}.facts dd{margin:4px 0 0;font:500 16px var(--display);color:var(--ink)}
.facts a{text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:4px}
.facts a:hover{text-decoration-color:var(--mint)}
.body2{row-gap:32px}
.body2 .lbl{grid-column:1/span 3;padding-top:.5em}
.body2 .tx{grid-column:4/span 7;font-size:17px;line-height:1.65;color:var(--text)}
.body2 .tx p+p{margin-top:1em}
.nums{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.6vw,24px)}
.nums div{background:var(--surface);border-radius:6px;padding:clamp(24px,2.4vw,36px)}
.nums b{display:block;font:500 clamp(36px,3.4vw,52px)/1 var(--display);letter-spacing:-.05em;color:var(--ink)}
.nums span{display:block;margin-top:14px;color:var(--grey);font-size:15px}
.dl{list-style:none;margin:0;padding:0;columns:2;column-gap:clamp(12px,1.6vw,24px)}
.dl li{break-inside:avoid;padding:12px 0;border-top:1px solid var(--line);font:500 15px var(--display);color:var(--ink);display:flex;gap:12px}
.dl li::before{content:"";width:6px;height:6px;margin-top:.55em;background:var(--mint);flex:0 0 auto}
.gal{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.6vw,24px)}
.gal img{width:100%;border-radius:6px;aspect-ratio:6/5;object-fit:cover;background:var(--surface)}
.quote{grid-column:3/span 8;font:500 clamp(20px,2vw,30px)/1.3 var(--display);letter-spacing:-.03em;color:var(--ink)}
.quote cite{display:block;margin-top:28px;font:400 15px var(--body);color:var(--grey);font-style:normal}
.next{display:block;padding-block:clamp(88px,10vw,160px);background:var(--surface)}
.next .lbl{display:block;margin-bottom:24px}
.next h2{font-size:clamp(30px,3.4vw,52px);letter-spacing:-.04em;line-height:1.04;color:var(--soft);transition:color .4s ease}
.next:hover h2{color:var(--ink)}
.next .pv{margin-top:40px;overflow:hidden;border-radius:6px;max-width:520px}
.next .pv img{aspect-ratio:2/1;object-fit:cover;width:100%;transition:transform 1.2s var(--ease)}
.next:hover .pv img{transform:scale(1.04)}
@media (max-width:860px){.facts{grid-template-columns:1fr 1fr}.body2 .lbl,.body2 .tx,.quote{grid-column:1/-1}.nums{grid-template-columns:1fr}.dl{columns:1}.gal{grid-template-columns:1fr}.cimg img{aspect-ratio:4/3}}

/* Dienstpagina */
.price{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.6vw,24px)}
.price .pc{border-radius:6px;padding:clamp(28px,2.6vw,40px);background:#fff;display:flex;flex-direction:column;min-height:340px;box-shadow:inset 0 0 0 1px var(--line)}
.price .pc.hl{background:var(--ink);color:rgba(255,255,255,.7);box-shadow:none}.price .pc.hl h3,.price .pc.hl .p{color:#fff}
.price .pc h3{font-size:22px;letter-spacing:-.02em}
.price .pc .p{margin-top:16px;font:500 clamp(28px,2.4vw,38px)/1 var(--display);letter-spacing:-.04em;color:var(--ink)}
.price .pc .p small{font:400 14px var(--body);letter-spacing:0;color:var(--grey);margin-left:6px}
.price .pc ul{list-style:none;padding:0;margin:24px 0 0;font-size:15px}
.price .pc li{padding:8px 0;border-top:1px solid var(--line)}
.price .pc.hl li{border-color:rgba(255,255,255,.12)}
.price .pc .btn{margin-top:auto;align-self:flex-start}
.price .pc .sp{flex:1;min-height:28px}
.steps3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.6vw,24px)}
.steps3 div{border-top:1px solid var(--ink);padding-top:20px}
.steps3 .n{font-size:13px;color:var(--grey)}
.steps3 h3{font-size:24px;margin-top:40px;letter-spacing:-.02em}
.steps3 p{margin-top:12px;color:var(--grey);font-size:15px;max-width:34ch}
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:24px;padding:22px 0;font:500 17px/1.4 var(--display);letter-spacing:-.015em;color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{flex:0 0 auto;width:28px;height:28px;border-radius:50%;background:var(--surface);position:relative;transition:background .25s,transform .45s var(--ease)}
.faq summary i::before,.faq summary i::after{content:"";position:absolute;left:8px;right:8px;top:13px;height:2px;background:var(--ink)}
.faq summary i::after{transform:rotate(90deg);transition:transform .45s var(--ease)}
.faq details[open] summary i{background:var(--mint)}.faq details[open] summary i::after{transform:rotate(0)}
.faq .a{overflow:hidden}
.faq .a p{padding:0 0 28px;max-width:62ch;color:var(--text)}
@media (max-width:860px){.price,.steps3{grid-template-columns:1fr}.price .pc{min-height:0}}

/* Over */
.over-ph{border-radius:6px;overflow:hidden}
.over-ph img{width:100%;aspect-ratio:21/9;object-fit:cover;object-position:center 35%}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips span{padding:9px 16px;border-radius:100px;background:var(--surface);font:500 14px var(--display);color:var(--ink)}
.clist{columns:3;column-gap:clamp(12px,1.6vw,24px);list-style:none;padding:0;margin:0}
.clist li{padding:12px 0;border-top:1px solid var(--line);font:500 15px var(--display);color:var(--ink);break-inside:avoid}
@media (max-width:860px){.clist{columns:2}.over-ph img{aspect-ratio:4/3}}

/* Contact */
.ctg{row-gap:48px}
.ctg .l{grid-column:1/span 5}
.ctg .r{grid-column:7/span 6}
.ctl{list-style:none;padding:0;margin:0;border-top:1px solid var(--line)}
.ctl li{padding:20px 0;border-bottom:1px solid var(--line)}
.ctl small{display:block;font-size:13px;color:var(--grey)}
.ctl a,.ctl span{font:500 18px/1.3 var(--display);letter-spacing:-.02em;color:var(--ink)}
.ctl a:hover{color:var(--grey)}
.form{display:grid;gap:14px}
.form label{display:grid;gap:8px;font-size:13px;color:var(--grey)}
.form input,.form textarea,.form select{font:inherit;font-size:16px;color:var(--ink);background:var(--surface);border:1px solid transparent;border-radius:6px;padding:15px 16px;transition:border-color .2s,background .2s;width:100%}
.form textarea{min-height:140px;resize:vertical}
.form input:focus,.form textarea:focus,.form select:focus{outline:0;border-color:var(--ink);background:#fff}
.form .two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.seg{display:flex;flex-wrap:wrap;gap:8px}
.seg label{display:block;position:relative}
.seg input{position:absolute;left:0;top:0;width:1px;height:1px;opacity:0;pointer-events:none}
.seg span{display:inline-block;padding:10px 16px;border-radius:100px;background:var(--surface);font:500 14px var(--display);color:var(--grey);cursor:pointer;transition:background .2s,color .2s}
.seg input:checked+span{background:var(--ink);color:#fff}
.seg input:focus-visible+span{outline:2px solid var(--ink);outline-offset:2px}
.note{font-size:13px;color:var(--grey)}
@media (max-width:860px){.ctg .l,.ctg .r{grid-column:1/-1}.form .two{grid-template-columns:1fr}}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}.rv-on [data-rv]{opacity:1;transform:none}.lm>span{transform:none}.mk::before{transform:scaleX(1)}}

/* Bewijs per project (vervangt de cijfertegels) */
.proof{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,4vw,72px);align-items:start}
.proof ol{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.proof li{border-bottom:1px solid var(--line)}
.proof li>div{display:grid;grid-template-columns:88px minmax(0,1fr) auto;gap:20px;align-items:baseline;padding:20px 0;cursor:default}
.proof b{font:500 22px/1 var(--display);letter-spacing:-.03em;color:var(--soft);transition:color .35s ease}
.proof .w{font:500 16px/1.4 var(--display);letter-spacing:-.01em;color:var(--grey);transition:color .35s ease}
.proof .c{font-size:13px;color:var(--grey);white-space:nowrap}
.proof li.on b,.proof li.on .w{color:var(--ink)}
.proof li.on b{color:var(--ink)}
.proof .pv{position:sticky;top:110px;aspect-ratio:4/5;border-radius:6px;overflow:hidden;background:var(--surface)}
.proof .pv img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.04);transition:opacity .6s ease,transform 1.2s var(--ease)}
.proof .pv img.on{opacity:1;transform:none}
@media (max-width:860px){.proof{grid-template-columns:1fr}.proof .pv{display:none}.proof li>div{grid-template-columns:64px minmax(0,1fr)}.proof .c{grid-column:2}.proof b,.proof .w{color:var(--ink)}}
.foot .clk{font-variant-numeric:tabular-nums}

/* Hero: portret naast de tekst in plaats van volle breedte */
.hgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,400px);gap:clamp(40px,6vw,96px);align-items:end}
.hero .hgrid .meta{display:block;margin-top:clamp(28px,3vw,44px)}
.hero .hgrid .meta .lead{max-width:520px}
.hero .hgrid .meta .act{justify-self:auto;margin-top:28px;display:flex;gap:24px;align-items:center;flex-wrap:wrap}
.hph{display:block;aspect-ratio:4/5;overflow:hidden;border-radius:6px;background:var(--surface)}
.hph img{width:100%;height:100%;object-fit:cover;object-position:center 25%;display:block}
@media (max-width:860px){.hgrid{grid-template-columns:1fr}.hph{aspect-ratio:1/1;max-width:420px}}

/* Variant B: titel krijgt de ruimte, portret als kleine signatuur */
.hb h1{font-size:clamp(38px,5vw,76px)}
.hbm{display:grid;grid-template-columns:200px minmax(0,560px);gap:32px;align-items:end;margin-top:clamp(48px,6vw,88px)}
.hbp{display:block;aspect-ratio:4/5;overflow:hidden;border-radius:6px;background:var(--surface)}
.hbp img{width:100%;height:100%;object-fit:cover;object-position:center 22%;display:block}
.hbt .lead{font-size:17px;line-height:1.55;color:var(--text)}
.hbt .act{margin-top:24px;display:flex;gap:24px;align-items:center;flex-wrap:wrap}
@media (max-width:600px){.hbm{grid-template-columns:1fr;gap:24px}.hbp{width:112px}}
.hb{min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding-top:120px;padding-bottom:64px}
.hb .hbt .lead{color:var(--grey)}

/* Geen gat onder de hero van 100vh */
.hb{padding-bottom:clamp(24px,3vw,40px)}
.hb+.sec{padding-top:clamp(24px,3vw,40px)!important}
/* Variant C: brede strook */
.hc{justify-content:flex-end;padding-top:140px}
.hc .hcm{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-top:clamp(28px,3vw,44px);flex-wrap:wrap}
.hc .hcm .lead{max-width:560px;font-size:17px;line-height:1.55;color:var(--grey)}
.hc .hcm .act{display:flex}
.hcp{display:block;margin-top:clamp(36px,4vw,56px);aspect-ratio:1200/380;max-height:42svh;width:100%;overflow:hidden;border-radius:6px;background:var(--surface)}
.hcp img{width:100%;height:100%;object-fit:cover;object-position:center 28%;display:block}
@media (max-width:600px){.hcp{aspect-ratio:4/3;max-height:none}.hcp img{object-position:center 20%}}

/* Logo's op één lijn */
.logos{grid-template-columns:repeat(10,minmax(0,1fr));gap:28px;margin-top:28px}
.logos a{justify-content:center;height:40px}
.logos img{max-height:24px}
@media (max-width:1100px){.logos{grid-template-columns:repeat(5,minmax(0,1fr));gap:28px 24px}}
@media (max-width:600px){.logos{grid-template-columns:repeat(2,minmax(0,1fr))}.logos a{justify-content:flex-start}}
/* Scroll-hint onderaan de hero */
.hb{position:relative}
.cue{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--grey);text-decoration:none;opacity:0;animation:cueIn .8s ease 1.2s forwards}
html.intro-on .cue{animation-delay:2.4s}
.cue i{position:relative;display:block;width:1px;height:40px;background:var(--line,#E3E5E8);overflow:hidden}
.cue i::after{content:"";position:absolute;left:0;top:-40%;width:1px;height:40%;background:var(--ink);animation:cueRun 2.2s cubic-bezier(.65,0,.35,1) infinite}
.cue:hover{color:var(--ink)}
@keyframes cueIn{to{opacity:1}}
@keyframes cueRun{0%{top:-40%}60%,100%{top:100%}}
@media (prefers-reduced-motion:reduce){.cue{animation:none;opacity:1}.cue i::after{animation:none;top:30%}}
@media (max-height:780px),(max-width:600px){.cue{display:none}}

/* Bewijs: beeld even hoog als de lijst */
.proof{align-items:stretch}
.proof .pv{position:relative;top:auto;aspect-ratio:auto;min-height:420px}
.proof li>div{padding:18px 0}

/* Tablet: beeld naast de cijfers houden, overfoto naast de tekst */
@media (max-width:860px) and (min-width:601px){
 .proof{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:28px}
 .proof{align-items:start}.proof .pv{display:block;min-height:0;aspect-ratio:4/5;position:sticky;top:90px}
 .proof li>div{grid-template-columns:56px minmax(0,1fr);gap:14px;padding:14px 0}
 .proof .c{grid-column:2;margin-top:-6px}
 .proof b,.proof .w{color:var(--grey)}.proof li.on b,.proof li.on .w{color:var(--ink)}
 .about .ph{grid-column:1/span 5}.about .tx{grid-column:6/span 7}
}
@media (max-width:600px){.about .ph{max-width:340px;aspect-ratio:1/1}}
.case .cap .st{margin-top:4px;font-size:13px;color:var(--ink);display:flex;align-items:center;gap:8px}
.case .cap .st::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--mint)}

/* ===================== WordPress-thema: aanvullingen ===================== */
/* Uitklappanelen in de pill */
.pill .dd{position:relative;display:flex}
.pill .dd>a{display:inline-flex;align-items:center;gap:6px}
.pill .cv{width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-2px) rotate(45deg);opacity:.55;transition:transform .35s var(--ease)}
.pill .dd:hover .cv,.pill .dd:focus-within .cv{transform:translateY(1px) rotate(225deg)}
.ddp{position:absolute;top:calc(100% + 12px);left:50%;min-width:300px;transform:translate(-50%,-6px);opacity:0;visibility:hidden;transition:opacity .22s ease,transform .4s var(--ease),visibility 0s linear .22s;z-index:60}
.ddp::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px}
.pill .dd:hover .ddp,.pill .dd:focus-within .ddp{opacity:1;visibility:visible;transform:translate(-50%,0);transition:opacity .22s ease,transform .4s var(--ease)}
.ddi{background:#fff;border-radius:22px;padding:8px;box-shadow:0 1px 2px rgba(11,13,17,.06),0 24px 60px -24px rgba(11,13,17,.28);border:1px solid rgba(11,13,17,.05)}
.ddi a{display:block;padding:12px 16px;border-radius:14px;white-space:normal;color:var(--ink)!important;transition:background .2s ease}
.ddi a:hover,.ddi a:focus-visible{background:var(--surface)}
.ddi b{display:block;font:500 15px/1.25 var(--display);letter-spacing:-.01em}
.ddi span{display:block;margin-top:3px;font:400 13px/1.4 var(--body);color:var(--grey)}
.nav.dk .ddi{background:#1A1D22;border-color:rgba(255,255,255,.06)}.nav.dk .ddi a{color:#fff!important}.nav.dk .ddi a:hover{background:rgba(255,255,255,.07)}
/* Taalkeuze */
.lsw{display:flex;align-items:center;gap:2px;margin-right:6px;font:500 12px var(--display);letter-spacing:.04em}
.lsw a{padding:8px 8px;border-radius:100px;color:var(--grey);transition:color .2s}
.lsw a:hover,.lsw a[aria-current]{color:var(--ink)}
.nav.dk .lsw a{color:rgba(255,255,255,.5)}.nav.dk .lsw a[aria-current],.nav.dk .lsw a:hover{color:#fff}
@media (max-width:1180px){.nav{grid-template-columns:1fr auto}.nav .pill,.nav .cta,.nav .rt>.lsw{display:none}.nav .mb{display:inline-flex}}
/* Mobiel blad */
.sheet{max-height:calc(100svh - 90px);overflow:auto}
.sheet .sg>a{display:flex;justify-content:space-between}
.sheet .ss{display:flex;flex-wrap:wrap;gap:6px;padding:0 14px 12px}
.sheet .ss a{display:inline-block;padding:8px 12px;font:500 14px var(--display);border-radius:100px;background:var(--surface);color:var(--text)}
.sheet .sb{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 6px 4px}
.sheet .sb .btn{margin:0;flex:1}
.sheet .lsw.sm a{padding:10px 12px;font-size:14px}

/* Logo's zonder link */
.logos .lgo{display:flex;align-items:center;justify-content:center;height:40px}
.logos .lgo:hover img{opacity:1;filter:none}
.rating{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--grey)}

/* Lopende tekst: pagina's en blog */
.prose{max-width:720px;font-size:17px;line-height:1.7;color:var(--text)}
.prose>*+*{margin-top:1.1em}
.prose h2{font-size:clamp(24px,2.1vw,30px);line-height:1.2;margin-top:2.2em;letter-spacing:-.03em}
.prose h3{font-size:clamp(19px,1.5vw,22px);line-height:1.3;margin-top:1.8em;letter-spacing:-.02em}
.prose h4{font-size:17px;margin-top:1.6em}
.prose h2+*,.prose h3+*,.prose h4+*{margin-top:.6em}
.prose a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--mint);text-decoration-thickness:2px;text-underline-offset:4px}
.prose a:hover{text-decoration-color:var(--ink)}
.prose ul,.prose ol{padding-left:1.2em}.prose li+li{margin-top:.4em}
.prose ul li::marker{color:var(--mint-ink)}
.prose strong{color:var(--ink);font-weight:600}
.prose img,.prose figure img{border-radius:6px}
.prose figure{margin:2em 0}.prose figcaption{font-size:13px;color:var(--grey);margin-top:10px}
.prose blockquote{margin:2em 0;padding:0 0 0 22px;border-left:2px solid var(--mint);font:500 20px/1.45 var(--display);color:var(--ink);letter-spacing:-.02em}
.prose blockquote cite{display:block;margin-top:10px;font:400 14px var(--body);color:var(--grey);font-style:normal}
.prose table{width:100%;border-collapse:collapse;font-size:15px}.prose th,.prose td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left}
.prose details{border-top:1px solid var(--line);padding:16px 0}.prose summary{cursor:pointer;font:500 17px var(--display);color:var(--ink)}
.prose .wp-block-buttons{display:flex;gap:12px;flex-wrap:wrap}
.prose .wp-block-button__link{display:inline-flex;padding:14px 24px;border-radius:100px;background:var(--mint);color:var(--mint-ink);text-decoration:none;font:500 15px var(--display)}
.prose hr{border:0;border-top:1px solid var(--line);margin:2.4em 0}
.prose .lead,.prose>p:first-child{font-size:19px;color:var(--ink)}
.wp-block-embed iframe,.prose iframe{width:100%;aspect-ratio:16/9;height:auto;border:0;border-radius:6px}
.prose video,.cbody video{width:100%;border-radius:6px}

/* Casepagina: blokken uit de editor */
.cbody>*+*{margin-top:clamp(56px,7vw,110px)}
.cbody .tbc-split{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,1.6vw,24px)}
.cbody .tbc-split>h2{grid-column:1/span 3;font:500 13px var(--body);letter-spacing:0;color:var(--grey);padding-top:.5em}
.cbody .tbc-split>h2::before{content:"";display:inline-block;width:6px;height:6px;background:var(--mint);margin-right:10px;vertical-align:1px}
.cbody .tbc-split>*:not(h2){grid-column:4/span 8}
.cbody .tbc-split>p{font:500 clamp(18px,1.5vw,22px)/1.45 var(--display);letter-spacing:-.02em;color:var(--ink)}
.cbody .tbc-split>p+p{margin-top:1em}
.cbody .tbc-split>p a{text-decoration:underline;text-decoration-color:var(--mint);text-decoration-thickness:2px;text-underline-offset:4px}
.cbody ul.tbc-nums{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.6vw,24px)}
.cbody ul.tbc-nums li{background:var(--surface);border-radius:6px;padding:clamp(24px,2.4vw,36px);color:var(--grey);font-size:15px}
.cbody ul.tbc-nums strong{display:block;margin-bottom:14px;font:500 clamp(36px,3.4vw,52px)/1 var(--display);letter-spacing:-.05em;color:var(--ink)}
.cbody ul.tbc-dl{list-style:none;margin:0;padding:0;columns:2;column-gap:clamp(12px,1.6vw,24px)}
.cbody ul.tbc-dl li{break-inside:avoid;padding:12px 0;border-top:1px solid var(--line);font:500 15px var(--display);color:var(--ink);display:flex;gap:12px}
.cbody ul.tbc-dl li::before{content:"";width:6px;height:6px;margin-top:.55em;background:var(--mint);flex:0 0 auto}
.cbody .wp-block-gallery,.cbody .tbc-gal{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.6vw,24px);margin-inline:0;padding:0}
.cbody .wp-block-gallery figure{margin:0}
.cbody .wp-block-gallery img{width:100%;height:100%;aspect-ratio:6/5;object-fit:cover;border-radius:6px;background:var(--surface)}
.cbody .wp-block-gallery.tbc-one,.cbody .wp-block-gallery:has(>figure:only-child){grid-template-columns:1fr}
.cbody .wp-block-gallery:has(>figure:only-child) img{aspect-ratio:auto}
.cbody .wp-block-image{margin:0}.cbody .wp-block-image img{width:100%;border-radius:6px}
.cbody .wp-block-quote,.cbody blockquote{margin:0;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,1.6vw,24px);padding:clamp(32px,4vw,64px) 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cbody blockquote p{grid-column:4/span 8;font:500 clamp(20px,1.9vw,28px)/1.35 var(--display);letter-spacing:-.03em;color:var(--ink)}
.cbody blockquote p::before{content:"\201C";color:var(--mint-ink);margin-right:2px}
.cbody blockquote cite{grid-column:4/span 8;margin-top:20px;font:400 14px var(--body);color:var(--grey);font-style:normal}
.cbody .wp-block-video{margin:0}
.cbody .wp-block-embed{margin:0}
@media (max-width:860px){.cbody .tbc-split>h2,.cbody .tbc-split>*:not(h2),.cbody blockquote p,.cbody blockquote cite{grid-column:1/-1}.cbody .tbc-split>h2{margin-bottom:16px}.cbody ul.tbc-nums{grid-template-columns:1fr}.cbody ul.tbc-dl{columns:1}.cbody .wp-block-gallery{grid-template-columns:1fr}}

/* Blogkaarten */
.posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(32px,3vw,48px) clamp(12px,1.6vw,24px)}
.post{display:block}
.post .im{overflow:hidden;border-radius:6px;aspect-ratio:16/10;background:var(--surface)}
.post .im img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.post:hover .im img{transform:scale(1.04)}
.post .meta{display:flex;gap:14px;margin-top:18px;font-size:13px;color:var(--grey)}
.post h3{margin-top:8px;font-size:clamp(17px,1.4vw,20px);line-height:1.3;letter-spacing:-.02em;transition:color .3s}
.post p{margin-top:8px;font-size:15px;color:var(--grey)}
.post .noimg{display:block;width:100%;height:100%;background:linear-gradient(135deg,var(--surface),#e9ebed)}
.filters a{font:500 14px var(--display);padding:10px 18px;border-radius:100px;background:var(--surface);color:var(--grey)}
.filters a:hover{color:var(--ink)}.filters a[aria-current]{background:var(--ink);color:#fff}
.pgn{display:flex;gap:8px;justify-content:center;margin-top:64px}
.pgn a,.pgn span{display:inline-flex;min-width:42px;height:42px;align-items:center;justify-content:center;border-radius:100px;font:500 14px var(--display);color:var(--grey);background:var(--surface)}
.pgn .current{background:var(--ink);color:#fff}
@media (max-width:1000px){.posts{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.posts{grid-template-columns:1fr}}
/* Blogpost */
.ph-post h1{font-size:clamp(30px,3.4vw,50px);line-height:1.08}
.pmeta{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:28px;font-size:14px;color:var(--grey)}
.pimg{margin-block:clamp(40px,5vw,72px)}
.pimg img{width:100%;border-radius:6px;aspect-ratio:16/9;object-fit:cover}
.art .prose{margin-inline:auto}
.author{display:flex;gap:18px;align-items:center;max-width:720px;margin:72px auto 0;padding:24px;border-radius:6px;background:var(--surface)}
.author img{width:64px;height:80px;object-fit:cover;border-radius:4px}
.author b{font:500 16px var(--display);color:var(--ink)}.author p{margin-top:4px;font-size:14px;color:var(--grey)}
.art .g.box.narrow{max-width:calc(820px + 2*var(--g))}

/* Formulieren */
.form .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form .fa{display:flex;gap:20px;align-items:center;flex-wrap:wrap;margin-top:6px}
.form .ck{display:flex;gap:12px;align-items:flex-start;font-size:13px;line-height:1.5;color:var(--grey)}
.form .ck input{width:18px;height:18px;margin-top:2px;padding:0;accent-color:var(--ink);flex:0 0 auto}
.form .note.ok{color:var(--ink)}.form .note.err{color:#b42318}
.form.sent{opacity:.5;pointer-events:none}
.btn[disabled]{opacity:.6;cursor:progress}

/* Calendly */
.cal{margin-top:clamp(56px,7vw,110px);scroll-margin-top:96px}
.cal-in{min-height:700px;border-radius:6px;background:var(--surface);overflow:hidden;display:grid;place-items:center}
.cal-in iframe{width:100%;height:700px;border:0;display:block}
.cal-ph{font-size:14px;color:var(--grey);text-align:center;padding:24px}

/* Scan en rapport */
.scan{max-width:720px}
.rep{margin-top:48px;padding-top:40px;border-top:1px solid var(--line)}
.rep .sc{display:flex;align-items:baseline;gap:16px}
.rep .sc b{font:500 clamp(56px,6vw,88px)/1 var(--display);letter-spacing:-.05em;color:var(--ink)}
.rep .sc span{font-size:14px;color:var(--grey)}
.rep .bar{height:4px;border-radius:4px;background:var(--surface);margin:22px 0 32px;overflow:hidden}
.rep .bar i{display:block;height:100%;background:var(--ink);width:0;transition:width 1.4s var(--ease)}
.rep .sum{font:500 clamp(18px,1.5vw,22px)/1.45 var(--display);letter-spacing:-.02em;color:var(--ink)}
.rep ol{list-style:none;margin:36px 0 0;padding:0}
.rep li{display:grid;grid-template-columns:28px 1fr;gap:6px 14px;padding:20px 0;border-top:1px solid var(--line)}
.rep li .s{width:10px;height:10px;border-radius:50%;margin-top:.45em;background:var(--soft)}
.rep li .s.good{background:#2BB673}.rep li .s.warn{background:#F2B544}.rep li .s.bad{background:#E5484D}
.rep li h4{font:500 16px var(--display);color:var(--ink)}
.rep li p{grid-column:2;font-size:15px;color:var(--text)}
.rep li p.fix{color:var(--grey)}
.rep .next-step{margin-top:40px;display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.scan-load{display:flex;align-items:center;gap:14px;color:var(--grey);font-size:15px}
.scan-load i{width:18px;height:18px;border-radius:50%;border:2px solid var(--line);border-top-color:var(--ink);animation:spin .9s linear infinite}
@keyframes spin{to{transform:rotate(1turn)}}

.row404{display:flex;gap:24px;align-items:center;flex-wrap:wrap;margin-top:36px}
/* Cookiebanner van Complianz in dezelfde stijl */
.cmplz-cookiebanner{font-family:var(--body)!important;border-radius:18px!important;box-shadow:0 24px 60px -24px rgba(11,13,17,.3)!important}
.cmplz-cookiebanner .cmplz-btn{border-radius:100px!important;font-family:var(--display)!important;font-weight:500!important}
.cmplz-cookiebanner .cmplz-btn.cmplz-accept{background:var(--mint)!important;border-color:var(--mint)!important;color:var(--mint-ink)!important}

/* Landingspagina's: bouwstenen */
.phd .crumb{margin-bottom:28px}
.crumb{display:flex;gap:10px;font-size:13px;color:var(--grey)}.crumb a:hover{color:var(--ink)}
.phd .intro2{margin-top:16px;font-size:16px;max-width:60ch;color:var(--grey)}
.hrow{display:flex;gap:28px;align-items:center;flex-wrap:wrap;margin-top:40px}
.head h2.stmt{grid-column:4/span 8;font-size:clamp(20px,1.75vw,28px);line-height:1.3}
.head .hint{grid-column:4/span 7;margin-top:16px;font-size:16px;line-height:1.6;color:var(--grey)}
.head .stmt.big{grid-column:4/span 8}
.sb{grid-column:4/span 9}
.sb>*+*{margin-top:40px}
.sb .sp2{font-size:17px;line-height:1.65;color:var(--text);max-width:62ch}
.sb .sp2+.sp2{margin-top:16px}
.sb .sp2 a,.feat a:not(.tl),.dl a{text-decoration:underline;text-decoration-color:var(--mint);text-decoration-thickness:2px;text-underline-offset:4px}
.feat{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.6vw,24px)}
.feat.n1{grid-template-columns:1fr}
.fc{padding:clamp(24px,2.4vw,36px);border-radius:6px;background:var(--surface);display:flex;flex-direction:column;gap:12px}
.surface .fc{background:#fff}
.fc .n{font-size:13px;color:var(--grey)}
.fc h3{font-size:clamp(18px,1.5vw,22px);letter-spacing:-.02em;line-height:1.25;margin-top:20px}
.fc p{font-size:15px;color:var(--text);line-height:1.6}
.fc .dl{columns:1;margin-top:4px}
.fc .tl{margin-top:auto;padding-top:12px;align-self:flex-start}
.fc .fi{margin:-8px -8px 8px;border-radius:4px;overflow:hidden;aspect-ratio:16/10;background:#fff}
.fc .fi img{width:100%;height:100%;object-fit:cover}
.fimg img{width:100%;border-radius:6px}
.dl.one{columns:1}
.dl li b{margin-right:6px}
.steps3 h3{font-size:clamp(18px,1.5vw,22px);margin-top:28px}
.scanwrap{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(32px,4vw,64px);align-items:start}
.scanwrap .sl{padding:clamp(24px,2.6vw,40px);border-radius:6px;background:var(--surface)}
.surface .scanwrap .sl{background:#fff}
.scanwrap .scan{margin-top:24px}
.scanwrap .sr2>*+*{margin-top:16px}
.h3s{font-size:clamp(18px,1.5vw,22px);letter-spacing:-.02em}
.tailnote{padding-block:0 clamp(56px,6vw,96px)!important}
.tailnote .sb{grid-column:1/-1}
@media (max-width:860px){.head h2.stmt,.head .hint,.sb{grid-column:1/-1}.feat,.scanwrap{grid-template-columns:1fr}}
/* Cookiebanner: rustig kaartje linksonder in plaats van midden in beeld */
@media (min-width:768px){#cmplz-cookiebanner-container .cmplz-cookiebanner.cmplz-center,#cmplz-cookiebanner-container .cmplz-cookiebanner{top:auto!important;bottom:20px!important;left:20px!important;right:auto!important;transform:none!important;max-width:380px!important;width:380px!important}}
/* WordPress-blokken: eigen layout van WP uitschakelen waar wij het raster bepalen */
.tbc-split>.wp-block-group__inner-container{display:contents}
.cbody .tbc-split>.wp-block-group__inner-container>h2{grid-column:1/span 3;font:500 13px var(--body);letter-spacing:0;color:var(--grey);padding-top:.5em}
.cbody .tbc-split>.wp-block-group__inner-container>h2::before{content:"";display:inline-block;width:6px;height:6px;background:var(--mint);margin-right:10px;vertical-align:1px}
.cbody .tbc-split>.wp-block-group__inner-container>*:not(h2){grid-column:4/span 8}
.cbody .tbc-split>.wp-block-group__inner-container>p{font:500 clamp(18px,1.5vw,22px)/1.45 var(--display);letter-spacing:-.02em;color:var(--ink)}
.cbody .tbc-split>.wp-block-group__inner-container>p+p{margin-top:1em}
.cbody .tbc-split p a{text-decoration:underline;text-decoration-color:var(--mint);text-decoration-thickness:2px;text-underline-offset:4px}
.cbody .wp-block-gallery>figure,.cbody .wp-block-gallery>.wp-block-image{width:auto!important;display:block!important;margin:0!important;flex:none!important}
.cbody .wp-block-gallery>figure img{width:100%!important;height:auto!important;aspect-ratio:6/5;object-fit:cover}
@media (max-width:860px){.cbody .tbc-split>.wp-block-group__inner-container>h2,.cbody .tbc-split>.wp-block-group__inner-container>*:not(h2){grid-column:1/-1}}
.sr2 .dl{columns:1}
.pgn{align-items:center}.pgn a,.pgn span{height:42px!important;padding:0 14px;box-sizing:border-box}
.art .prose{margin-inline:0}.art .author{margin-left:0}

/* ===== Ronde 4 aanpassingen ===== */
.foot .lgw{grid-column:1/span 2}
@media (max-width:860px){.foot .lgw{grid-column:1/-1}}
/* Reviews: bedrijf onder de naam */
.rev figcaption{display:flex;flex-direction:column;gap:2px}
.rev figcaption .co{color:#fff;opacity:.85}
.rev figcaption .gr{font-size:12px;opacity:.7;margin-top:4px}
/* Volgend project gecentreerd op desktop */
@media (min-width:861px){.next .g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,520px);column-gap:clamp(40px,6vw,96px);align-items:center}.next .lbl{grid-column:1;grid-row:1;align-self:end}.next h2{grid-column:1;grid-row:2;align-self:start}.next .pv{grid-column:2;grid-row:1/span 3;margin-top:0;max-width:none}.next .go{grid-column:1;grid-row:3;align-self:start;margin-top:28px}.next .g{grid-template-rows:1fr auto 1fr}}
.next .go{display:inline-flex;margin-top:24px}
/* Mobiel: drie cases op de homepage, logo's compact, menu ruimer, knoppen onder elkaar */
@media (max-width:600px){
 #werk .cases .case:nth-child(n+4){display:none}
 .logos{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:18px 14px!important}
 .logos .lgo{justify-content:center;height:28px}
 .logos img{max-height:16px}
 .end .row{flex-direction:column;align-items:flex-start;gap:18px}
 .cbody .tbc-split>.wp-block-group__inner-container>h2{margin-bottom:18px}
 .cbody .tbc-split>.wp-block-group__inner-container>p+ul,.cbody .tbc-split ul.tbc-dl{margin-top:4px}
}
.sheet{padding:14px}
.sheet .sg>a{padding:18px 14px;font-size:26px}
.sheet .sg+.sg{border-top:1px solid var(--line)}
.sheet .ss{gap:8px;padding:0 14px 18px}
.sheet .sb{padding:16px 6px 6px}
/* Ruimte tussen blokken op casepagina's, ook op mobiel */
.cbody>*+*{margin-top:clamp(64px,8vw,110px)}
.cbody ul.tbc-dl li:first-child{border-top:1px solid var(--line)}
/* Scrollbare laptop */
.lap{margin:0;max-width:1000px;margin-inline:auto}
.lap-h{display:flex;justify-content:center;margin-bottom:18px;font-size:13px;color:var(--grey)}
.lap-h .mbl{display:none}
@media (hover:none){.lap-h .dsk{display:none}.lap-h .mbl{display:inline}}
.lap-f{width:86%;margin:0 auto;padding:12px 12px 14px;background:#141414;border-radius:16px 16px 4px 4px;box-shadow:0 30px 60px -30px rgba(11,13,17,.45)}
.lap-s{aspect-ratio:16/10;overflow-y:auto;overflow-x:hidden;border-radius:4px;background:#fff;overscroll-behavior:contain;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.lap-s img{width:100%;height:auto;display:block}
.lap-b{width:100%;height:14px;margin-top:0;background:linear-gradient(#d9dbde,#b9bec4);border-radius:0 0 14px 14px;position:relative}
.lap-b::before{content:"";position:absolute;left:50%;top:0;width:16%;height:5px;transform:translateX(-50%);background:#a9aeb4;border-radius:0 0 6px 6px}
@media (max-width:600px){.lap-f{width:100%;padding:7px 7px 9px;border-radius:10px 10px 3px 3px}.lap-b{height:9px}}
/* Scanrapport: vervolgstap */
.rep .up{margin-top:40px;padding:28px;border-radius:6px;background:var(--surface)}
.surface .rep .up{background:#fff}
.rep .up h4{font:500 19px/1.3 var(--display);color:var(--ink)}
.rep .up p{margin-top:8px;font-size:15px;color:var(--text)}
.rep .up .row{display:flex;gap:20px;align-items:center;flex-wrap:wrap;margin-top:20px}
.cbody>*+ul.tbc-nums,.cbody>*+ul.tbc-dl,.cbody>*+.wp-block-gallery,.cbody>*+.lap,.cbody>*+blockquote,.cbody>*+.wp-block-quote{margin-top:clamp(64px,8vw,110px)!important}
/* Slotblok: titel links, knoppen rechts op desktop */
@media (min-width:861px){
 .end .g{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:48px;align-items:end}
 .end .g>.lbl{grid-column:1/-1}
 .end .g>h2{grid-column:1}
 .end .g>.row{grid-column:2;grid-row:2;margin:0!important;padding-bottom:.35em;flex-wrap:nowrap}
}
/* Volgend project en slotblok: minder lege ruimte, een fijne lijn ertussen */
.next{padding-bottom:clamp(64px,7vw,110px)}
.next+.end{padding-top:0!important}
.next+.end .g{border-top:1px solid var(--line);padding-top:clamp(56px,6vw,96px)}
.next+.end .g{max-width:1200px;width:calc(100% - 2*var(--g));padding-inline:0}
/* Mobiel: enkel de eerste 5 logo's, op een lijn en iets groter */
@media (max-width:600px){
 .logos .lgo:nth-child(n+6){display:none}
 .logos{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:14px!important}
 .logos .lgo{height:36px}
 .logos img{max-height:22px}
}
/* Overal enkel de eerste 5 logo's, groter en ruimer verdeeld */
.logos .lgo:nth-child(n+6){display:none}
.logos{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:40px!important}
.logos .lgo{height:52px}
.logos img{max-height:32px}
@media (max-width:600px){.logos{gap:14px!important}.logos .lgo{height:36px}.logos img{max-height:22px}}
/* Desktop opnieuw alle 10 op een lijn, mobiel de eerste 5 */
@media (min-width:601px){
 .logos .lgo:nth-child(n+6){display:flex}
 .logos{grid-template-columns:repeat(10,minmax(0,1fr))!important;gap:28px!important}
 .logos .lgo{height:40px}
 .logos img{max-height:26px}
}
@media (min-width:601px) and (max-width:1100px){.logos{grid-template-columns:repeat(5,minmax(0,1fr))!important}}
.steps3.steps4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1000px){.steps3.steps4{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.steps3.steps4{grid-template-columns:1fr}}
.head h2.stmt{color:var(--grey)}
.sb .price{margin-top:0}
/* ---------- Pijlers ---------- */
.pil{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.6vw,24px)}
.pil .pc{background:#fff;border-radius:6px;padding:clamp(24px,2.4vw,36px);display:flex;flex-direction:column}
.pil .n{font-size:13px;color:var(--grey)}
.pil h3{font-size:clamp(24px,2.2vw,32px);letter-spacing:-.03em;line-height:1.1;margin-top:28px}
.pil h3 .gy{display:block;color:var(--soft)}
.pil p{margin-top:16px;font-size:15px;line-height:1.6;color:var(--text)}
.pil ul{list-style:none;margin:24px 0 0;padding:0;border-top:1px solid var(--line)}
.pil li{border-bottom:1px solid var(--line)}
.pil li a{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:13px 0;font:500 15px var(--display);color:var(--ink)}
.pil li a i{font-style:normal;color:var(--grey);transition:transform .3s var(--ease)}
.pil li a:hover i{transform:translateX(4px);color:var(--ink)}
@media (max-width:900px){.pil{grid-template-columns:1fr}}
/* ---------- Scan-kiezer ---------- */
.spk{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(28px,4vw,72px);align-items:start}
.spk .tabs{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.spk .tabs button{appearance:none;background:none;border:0;border-bottom:1px solid var(--line);text-align:left;padding:22px 0;cursor:pointer;display:grid;grid-template-columns:16px 1fr;column-gap:14px;row-gap:6px;font:inherit;color:inherit}
.spk .tabs button::before{content:"";grid-row:1;width:10px;height:10px;margin-top:.55em;background:var(--line);transition:background .3s}
.spk .tabs .t{grid-column:2;font:500 clamp(20px,1.8vw,26px)/1.2 var(--display);letter-spacing:-.02em;color:var(--soft);transition:color .3s}
.spk .tabs .d{grid-column:2;font-size:14px;color:var(--grey);line-height:1.5;max-height:0;overflow:hidden;opacity:0;transition:max-height .4s var(--ease),opacity .3s}
.spk .tabs button[aria-selected=true]::before{background:var(--mint)}
.spk .tabs button[aria-selected=true] .t,.spk .tabs button:hover .t{color:var(--ink)}
.spk .tabs button[aria-selected=true] .d{max-height:80px;opacity:1}
.spk .tabs button:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
.spk .pane{background:#fff;border-radius:6px;padding:clamp(24px,2.6vw,40px)}
.spk .ph{font-size:clamp(24px,2.2vw,32px);letter-spacing:-.03em;margin-top:20px}
.spk .pd{margin-top:10px;color:var(--grey);font-size:15px;line-height:1.55}
.spk .scan{margin-top:24px}
.spk .pane.sw{animation:spkf .45s var(--ease)}
@keyframes spkf{from{opacity:.4;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (max-width:900px){.spk{grid-template-columns:1fr}.spk .tabs{flex-direction:row;overflow-x:auto;border-top:0;gap:8px;scrollbar-width:none}.spk .tabs::-webkit-scrollbar{display:none}.spk .tabs button{border:1px solid var(--line);border-radius:100px;padding:10px 16px;display:block;white-space:nowrap;flex:0 0 auto}.spk .tabs button::before,.spk .tabs .d{display:none}.spk .tabs .t{font-size:15px}.spk .tabs button[aria-selected=true]{background:var(--ink);border-color:var(--ink)}.spk .tabs button[aria-selected=true] .t{color:#fff}}
/* ---------- Reviews 5 ---------- */
.revs.n5{grid-template-columns:repeat(6,minmax(0,1fr))}
.revs.n5 .rev{grid-column:span 2}
.revs.n5 .rev:nth-child(-n+2){grid-column:span 3}
.rev .rc{margin-top:10px;color:var(--mint);font:500 14px var(--display)}
.rev .rc:hover{text-decoration:underline}
@media (max-width:900px){.revs.n5{grid-template-columns:1fr}.revs.n5 .rev,.revs.n5 .rev:nth-child(-n+2){grid-column:auto}}
.sec:not(.surface) .pil .pc{background:var(--surface)}
.spk .fa .btn .stype{display:inline}
@media (max-width:900px){.spk .tabs .t{color:var(--grey)}}

/* Vraag / Aanpak / Resultaat bovenaan een case */
.qar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,32px);margin-top:clamp(40px,5vw,72px);padding-top:clamp(24px,3vw,36px);border-top:1px solid var(--line)}
.qar .t{margin-top:14px;font:500 clamp(17px,1.35vw,20px)/1.45 var(--display);letter-spacing:-.015em;color:var(--ink)}
.qar>div:last-child .t{color:var(--ink)}
@media (max-width:800px){.qar{grid-template-columns:1fr}}
/* Altijd ruimte tussen tekst en een beeld, video of embed eronder */
.cbody>:is(.tbc-split,.wp-block-group,p,ul,ol,h2,h3)+:is(figure,.wp-block-video,.wp-block-embed,.wp-block-image,video,iframe){margin-top:clamp(40px,5vw,72px)!important}
.prose :is(p,ul,ol,h2,h3)+:is(figure,.wp-block-video,.wp-block-embed,.wp-block-image,.wp-block-gallery,video,iframe){margin-top:clamp(32px,4vw,56px)}
.qar{border-top:0;padding-top:0;margin-top:clamp(32px,4vw,56px)}
.vplay{position:relative;display:block;overflow:hidden;border-radius:12px;line-height:0}
.vplay video{display:block;width:100%}
.vplay-b{position:absolute;inset:0;margin:auto;width:84px;height:84px;border:0;border-radius:50%;background:rgba(255,255,255,.92);box-shadow:0 10px 30px -10px rgba(11,13,17,.45);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .3s var(--ease),background .3s}
.vplay-b span{width:0;height:0;border-style:solid;border-width:13px 0 13px 21px;border-color:transparent transparent transparent var(--ink);margin-left:5px}
.vplay:hover .vplay-b{transform:scale(1.06);background:var(--mint)}
.vplay-b:focus-visible{outline:3px solid var(--mint);outline-offset:3px}
.vplay.on .vplay-b{opacity:0;pointer-events:none}
.vplay::after{content:"";position:absolute;inset:0;background:rgba(11,13,17,.12);pointer-events:none;transition:opacity .3s}
.vplay.on::after{opacity:0}
@media(max-width:600px){.vplay-b{width:64px;height:64px}.vplay-b span{border-width:10px 0 10px 16px}}

.foot .top.c4 .lgw{grid-column:1/span 4}.foot .top.c3 .lgw{grid-column:1/span 6}
@media (max-width:860px){.foot .top.c4 .lgw,.foot .top.c3 .lgw{grid-column:1/-1}}
.qar{display:none!important}
.rep .adlib{margin-top:28px;padding:22px 24px;background:var(--surface);border-radius:8px}.rep .adlib h4{font:500 18px var(--display);letter-spacing:-.02em}.rep .adlib p{margin-top:8px;color:var(--text);font-size:15px;line-height:1.55}.rep .adlib .row{display:flex;flex-wrap:wrap;gap:12px 24px;margin-top:14px}.rep .notsee{margin-top:22px;font-size:14px;line-height:1.6;color:var(--grey)}.rep .notsee b{color:var(--ink);font-weight:500}
/* Galerij: elk beeld volledig in het vak, op de lichte achtergrond (zoals de casekaarten) */
.cbody .wp-block-gallery>figure{background:var(--surface);border-radius:6px;overflow:hidden;isolation:isolate;aspect-ratio:6/5}
.cbody .wp-block-gallery>figure img{width:100%!important;height:100%!important;aspect-ratio:auto!important;object-fit:contain!important;padding:5%;background:transparent!important;mix-blend-mode:multiply;border-radius:0}
.cbody .wp-block-gallery:has(>figure:only-child)>figure{aspect-ratio:auto}
.cbody .wp-block-gallery:has(>figure:only-child)>figure img{height:auto!important}
/* Scan: wat het volledige rapport nog bekijkt, gemiddelde, gesprek */
.rep .scan-avg{margin-top:26px;font-size:14px;color:var(--grey)}
.rep .locked{margin-top:28px;padding:22px 24px;border:1px solid var(--line);border-radius:8px}
.rep .locked h4{display:flex;align-items:center;gap:10px;font:500 18px var(--display);letter-spacing:-.02em;color:var(--ink)}
.rep .locked .lk{position:relative;width:12px;height:10px;border-radius:2px;background:var(--grey);margin-top:5px;flex:none}
.rep .locked .lk::before{content:"";position:absolute;left:2px;top:-7px;width:8px;height:8px;border:2px solid var(--grey);border-bottom:0;border-radius:6px 6px 0 0;box-sizing:border-box}
.rep .locked>p{margin-top:6px;font-size:14px;color:var(--grey)}
.rep .locked ul{list-style:none;margin:12px 0 0;padding:0}
.rep .locked li{display:block;padding:10px 0;border-top:1px solid var(--line);font-size:15px;color:var(--grey);grid-template-columns:none}
.rep .up .note{margin-top:16px;font-size:13px;color:var(--grey)}
.rep .up .call{font-weight:500}
.scan .optin{margin-top:10px;font-size:13px;line-height:1.5;color:var(--grey)}
.scancount{display:inline-flex;align-items:center;gap:10px;font-size:14px;color:var(--grey)}
.scancount::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--mint)}
.rep .up .call{display:inline-flex;gap:8px;justify-content:flex-start;align-items:center}
/* Lijsten met een vette kop en uitleg (bv. "Drie vragen"): kop boven, tekst eronder, gelijke kolommen */
.dl:has(>li>strong){columns:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(16px,2vw,32px)}
.dl li:has(>strong){flex-direction:column;gap:6px;padding:16px 0}
.dl li:has(>strong)::before{display:none}
.dl li>strong{font:500 17px/1.3 var(--display);letter-spacing:-.01em;color:var(--ink)}
.dl li>strong+span{font:400 15px/1.55 var(--body);color:var(--grey)}
@media(max-width:700px){.dl:has(>li>strong){grid-template-columns:1fr}}