:root{--bg:#0b0b0a;--panel:#141413;--ink:#f4f3eb;--soft:#a8a69e;--line:#33322f;--hi:#ffd640;--cream:#ece9df;--black:#0b0b0a;--pad:clamp(1.1rem,5vw,6rem);--sans:Arial,Helvetica,sans-serif;--mono:"SFMono-Regular",Consolas,monospace}*{box-sizing:border-box}html{scroll-behavior:smooth}html[lang=nl] [lang=en],html[lang=nl] [lang=de],html[lang=nl] [lang=fr],html[lang=nl] [lang=es],html[lang=nl] [lang=it],html[lang=nl] [lang=pt],html[lang=en] [lang=nl],html[lang=en] [lang=de],html[lang=en] [lang=fr],html[lang=en] [lang=es],html[lang=en] [lang=it],html[lang=en] [lang=pt],html[lang=de] [lang=nl],html[lang=de] [lang=en],html[lang=de] [lang=fr],html[lang=de] [lang=es],html[lang=de] [lang=it],html[lang=de] [lang=pt],html[lang=fr] [lang=nl],html[lang=fr] [lang=en],html[lang=fr] [lang=de],html[lang=fr] [lang=es],html[lang=fr] [lang=it],html[lang=fr] [lang=pt],html[lang=es] [lang=nl],html[lang=es] [lang=en],html[lang=es] [lang=de],html[lang=es] [lang=fr],html[lang=es] [lang=it],html[lang=es] [lang=pt],html[lang=it] [lang=nl],html[lang=it] [lang=en],html[lang=it] [lang=de],html[lang=it] [lang=fr],html[lang=it] [lang=es],html[lang=it] [lang=pt],html[lang=pt] [lang=nl],html[lang=pt] [lang=en],html[lang=pt] [lang=de],html[lang=pt] [lang=fr],html[lang=pt] [lang=es],html[lang=pt] [lang=it]{display:none!important}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);overflow-x:clip}a{color:inherit}img,video{display:block;width:100%;height:100%;object-fit:cover}button{font:inherit}.wrap{width:min(1700px,100%);margin-inline:auto;padding-inline:var(--pad)}.skip{position:fixed;left:-999px;top:1rem;z-index:99;background:var(--hi);color:#111;padding:.8rem}.skip:focus{left:1rem}.site-head{height:92px;display:flex;align-items:center;gap:2rem;padding:0 var(--pad);position:relative;z-index:20;background:rgba(11,11,10,.96);border-bottom:1px solid var(--line)}.brand{text-decoration:none;display:inline-flex;flex-direction:column;font-weight:900;letter-spacing:-.06em;font-size:1.35rem;line-height:1}.brand i{display:block;width:100%;height:4px;background:linear-gradient(90deg,var(--hi) 0 22%,var(--ink) 22%);margin-top:.35rem}.site-head nav{margin-left:auto;display:flex;align-items:center;gap:2rem}.site-head nav a{text-decoration:none;text-transform:uppercase;font-family:var(--mono);letter-spacing:.1em;font-size:.72rem;color:#d2d0c9}.site-head nav a[aria-current=page]{color:var(--hi)}.site-head .nav-cta{padding:.9rem 1.1rem;border-radius:999px}.menu-toggle{display:none;margin-left:auto;background:none;border:1px solid var(--line);color:var(--ink);padding:.65rem .8rem}.home-hero{min-height:calc(100svh - 92px);position:relative;display:flex;align-items:flex-end;overflow:hidden}.home-hero>video,.hero-shade{position:absolute;inset:0}.home-hero>video{object-position:center}.hero-shade{background:linear-gradient(90deg,rgba(4,4,3,.9) 0%,rgba(4,4,3,.42) 48%,rgba(4,4,3,.08)),linear-gradient(0deg,rgba(4,4,3,.78),transparent 60%)}.hero-copy{position:relative;padding:clamp(6rem,15vh,12rem) var(--pad) clamp(3rem,7vh,6rem);max-width:1050px}.eyebrow{font:700 .68rem/1.3 var(--mono);letter-spacing:.13em;text-transform:uppercase;color:var(--soft)}h1,h2,h3,p{margin-top:0}h1,h2,h3{letter-spacing:max(.02em,1.25px)}h3{letter-spacing:max(.03em,1.25px)}h1{font-size:clamp(3.6rem,9vw,9rem);line-height:.95;margin-bottom:2rem}h2{font-size:clamp(2.34rem,6.3vw,6.75rem);line-height:1}h3{font-size:clamp(1.53rem,2.7vw,2.7rem);line-height:1}.hero-copy>p:not(.eyebrow){font-size:clamp(1.05rem,1.6vw,1.4rem);line-height:1.55;max-width:54ch}.actions{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:2rem}.button{display:inline-flex;align-items:center;gap:1rem;text-decoration:none;background:var(--hi);color:#111;padding:1rem 1.25rem;border:1px solid var(--hi);font-weight:800;border-radius:999px}.button.ghost{background:rgba(0,0,0,.25);color:var(--ink);border-color:rgba(255,255,255,.35)}.button.dark{background:#111;color:white;border-color:#111}.metrics{display:grid;grid-template-columns:repeat(4,1fr);border-block:1px solid var(--line)}.metrics div{padding:2rem var(--pad);border-right:1px solid var(--line);display:flex;flex-direction:column;gap:.5rem}.metrics strong{font-size:clamp(2rem,3vw,4rem)}.metrics span{font:600 .68rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--soft)}.section,.statement{padding-block:clamp(5rem,10vw,11rem)}.statement h2{max-width:16.5ch}.statement em{color:var(--hi);font-style:normal}.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;margin-bottom:3rem}.section-head h2{margin:0}.text-link{font:700 .75rem var(--mono);letter-spacing:.08em;text-transform:uppercase;text-underline-offset:.35rem}.featured{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line)}.work-card{display:block;background:var(--panel);text-decoration:none;overflow:hidden}.work-card figure{aspect-ratio:4/3;margin:0;overflow:hidden;background:var(--case)}.work-card img{transition:transform .6s}.work-card:hover img{transform:scale(1.035)}.work-card>div{padding:1.4rem}.work-card span,.service-tease span{font:600 .68rem var(--mono);color:var(--soft)}.work-card h3{font-size:clamp(2.25rem,3.6vw,4.5rem);margin:.6rem 0}.work-card p{color:var(--soft);min-height:2.3em}.work-card b{font:700 .68rem var(--mono);color:var(--hi);text-transform:uppercase}.cream{background:var(--cream);color:#111}.cream .eyebrow,.cream p{color:#3a3833}.service-tease{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #aaa59a}.service-tease article{padding:2rem;border-right:1px solid #aaa59a}.service-tease article:last-child{border:0}.service-tease h3{font-size:clamp(1.8rem,2.7vw,3.6rem);margin:1rem 0}.service-tease p{line-height:1.55}.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(3rem,9vw,10rem)}.mini-steps p{display:grid;grid-template-columns:3rem 1fr;padding:1rem 0;border-bottom:1px solid var(--line);color:var(--soft)}.mini-steps b{color:var(--hi);font-family:var(--mono)}.yellow-cta{background:var(--hi);color:#111;padding:clamp(4rem,9vw,9rem) var(--pad);display:grid;grid-template-columns:1.2fr .8fr;gap:4rem;align-items:end}.yellow-cta h2{margin:0;font-size:clamp(3rem,7vw,7.5rem)}.yellow-cta>div:last-child p{font-size:1.25rem;max-width:36ch;line-height:1.5}.page-hero,.case-hero{padding-top:clamp(5rem,9vw,10rem);padding-bottom:clamp(4rem,8vw,8rem)}.page-hero h1{max-width:14.5ch}.page-hero>p:last-child{font-size:1.25rem;line-height:1.55;max-width:55ch;color:var(--soft)}.work-list{display:flex;flex-direction:column;gap:clamp(1rem,2.4vw,2.6rem);padding-bottom:9rem}.work-list .work-card{display:grid;grid-template-columns:1.2fr .8fr}.work-list .work-card figure{aspect-ratio:16/8}.work-list a.work-fashion figure{aspect-ratio:16/9;background:#141412}.work-list .work-fashion figure img{object-fit:contain}.work-fashion:hover img{transform:none}.work-list .work-card>div{display:flex;flex-direction:column;justify-content:center;padding:clamp(2rem,5vw,5rem)}.service-list{border-top:1px solid var(--line);padding-bottom:7rem}.service-groep{padding:3.2rem 0 1.4rem;border-bottom:1px solid var(--line)}.process-list .service-groep{border-bottom:0;padding:2.8rem 0 1rem}.process-list .service-groep:first-child{padding-top:1.6rem}.process-list article:last-child{border-bottom:1px solid var(--line)}.service-groep:first-child{padding-top:2.2rem}.service-groep .eyebrow{color:var(--hi)}.service-groep-sub{margin:.7rem 0 0;color:var(--soft);font-size:1.05rem;line-height:1.55;max-width:52ch}.service-row{display:grid;grid-template-columns:70px minmax(0,1.08fr) minmax(340px,.92fr);gap:clamp(1rem,3vw,3.5rem);padding:3rem 0;border-bottom:1px solid var(--line)}.service-no{font:700 .7rem var(--mono);color:var(--hi)}.service-row h2{font-size:clamp(2.05rem,3.8vw,4.86rem);margin:0;overflow-wrap:break-word;hyphens:auto}.service-row>div:last-child{font-size:1.05rem;line-height:1.6;color:var(--soft)}.service-row strong{display:block;color:var(--ink);margin-top:1rem}.note{padding-bottom:7rem;color:var(--soft);max-width:900px;line-height:1.6}.process-list{padding-bottom:8rem}.process-list article{display:grid;grid-template-columns:80px 1fr;align-items:center;border-top:1px solid var(--line);padding:1.5rem 0}.process-list article:last-child{border-bottom:1px solid var(--line)}.process-list span{font:700 .7rem var(--mono);color:var(--hi)}.process-list p{font-size:clamp(1.2rem,1.9vw,2rem);line-height:1.35;margin:0}.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);margin-bottom:5rem}.price-grid article{padding:clamp(1.5rem,3vw,3rem);background:var(--panel)}.price-grid span{font:.7rem var(--mono);color:var(--soft)}.price-grid h2{font-size:clamp(2rem,3.5vw,4.2rem);margin:1rem 0;letter-spacing:-.055em;line-height:.9}.price-grid p{color:var(--soft);line-height:1.6}.price-grid .featured-price{border-top:4px solid var(--hi)}.calculator{padding-block:4rem;border-block:1px solid var(--line)}.calculator>div:first-of-type{display:grid;grid-template-columns:1fr 1fr;gap:3rem}.calculator label{display:flex;flex-direction:column;gap:1rem;font-family:var(--mono);font-size:.75rem;text-transform:uppercase}.calculator input{width:100%;accent-color:var(--hi)}.calc-output{display:grid;grid-template-columns:1fr 1.6fr 1fr 1fr 1fr;gap:1px;background:var(--line);margin-top:2rem}.calc-output p{background:var(--panel);padding:1.3rem 1rem;display:flex;flex-direction:column}.calc-output strong{font-size:clamp(1.7rem,3vw,3rem);color:var(--hi)}
/* de verdeling is een formule, geen enkel getal — anders breekt hij over twee regels */
.calc-output #split{white-space:nowrap}.calc-output span{font:.65rem var(--mono);text-transform:uppercase;color:var(--soft)}.fine{color:var(--soft);font-size:.85rem}.price-list{padding-block:7rem}.price-list>p{display:flex;justify-content:space-between;gap:2rem;padding:1.4rem 0;border-top:1px solid var(--line);font-size:1.15rem}.price-list small{color:var(--soft)}.sample-page{min-height:calc(100svh - 92px);display:grid;grid-template-columns:1.2fr .8fr}.sample-page>div{padding:clamp(5rem,10vw,10rem) var(--pad);background:var(--hi);color:#111}.sample-page h1{max-width:9.2ch;line-height:1}.sample-page>div>p:not(.eyebrow){font-size:1.25rem;line-height:1.55;max-width:40ch}.sample-page aside{padding:clamp(5rem,10vw,10rem) var(--pad);display:grid;grid-template-columns:50px 1fr;align-content:center;gap:1rem}.sample-page aside span{font:700 .7rem var(--mono);color:var(--hi)}.sample-page aside p{padding-bottom:1rem;border-bottom:1px solid var(--line)}.case-hero{display:grid;grid-template-columns:1.25fr .75fr;gap:4rem;align-items:end;border-bottom:6px solid var(--case)}.case-hero h1{margin:.5rem 0 .75em;line-height:.95}.case-hero>div:last-child{font-size:1.2rem;line-height:1.55;color:var(--soft)}.case-media{padding-block:clamp(2rem,5vw,5rem)}.case-media figure{position:relative;margin:0;background:#171716;overflow:hidden}.case-media figcaption{position:absolute;left:.7rem;bottom:.7rem;z-index:2;background:rgba(5,5,5,.78);color:#f4f3eb;padding:.45rem .6rem;font:.6rem var(--mono);text-transform:uppercase;white-space:nowrap;letter-spacing:.08em}.wide{aspect-ratio:16/9;margin-bottom:1rem!important;border:10px solid var(--case)}.media-three{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;padding:clamp(1rem,4vw,4rem);background:var(--case)}.media-three figure{aspect-ratio:4/5}.media-two{display:grid;grid-template-columns:repeat(2,minmax(0,520px));justify-content:center;gap:1rem;padding:clamp(1rem,4vw,4rem);background:var(--case)}.media-two.portrait figure{aspect-ratio:9/16}.sound{position:absolute;right:.7rem;top:.7rem;z-index:2;border:1px solid rgba(255,255,255,.35);background:rgba(5,5,5,.78);color:white;border-radius:999px;padding:.6rem .8rem;font:.6rem var(--mono);text-transform:uppercase}.sound[aria-pressed=true]{background:var(--hi);color:#111}.landing{display:grid;grid-template-columns:.55fr 1.45fr;gap:clamp(2rem,6vw,7rem);align-items:center;padding:clamp(5rem,10vw,10rem) 0}.landing h2{font-size:clamp(2.25rem,4.5vw,5.4rem)}.landing p{color:var(--soft);line-height:1.6}.landing figure{border:clamp(6px,.65vw,10px) solid #20201f;background:#20201f}.placement{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,560px);gap:clamp(2rem,5vw,5rem);align-items:center;padding-block:clamp(4rem,8vw,8rem)}.placement-band{background:var(--cream);color:#111}.placement-band .eyebrow,.placement-band p{color:#3a3833}.placement figure{justify-self:end;width:100%}.placement h2{font-size:clamp(1.88rem,3.4vw,3.96rem);margin:.6rem 0 1.4rem}.placement p{color:#3a3833;line-height:1.6;max-width:46ch}.placement .fine{font-size:.82rem;color:#57554e;margin-top:1.2rem}.placement-feiten{margin:1.6rem 0 0;max-width:46ch}.placement-feiten dt{font:700 .64rem/1.3 var(--mono);letter-spacing:.11em;text-transform:uppercase;color:#111;margin-top:1.05rem;padding-top:.85rem;border-top:1px solid rgba(17,17,17,.14)}.placement-feiten dt:first-child{margin-top:0}.placement-feiten dd{margin:.4rem 0 0;font-size:.92rem;line-height:1.5;color:#3a3833}.placement figure{position:relative;margin:0}.placement figure img,.placement figure video{height:auto;object-fit:contain;border-radius:2%/2.26%;overflow:hidden}.placement figcaption{position:static;background:none;padding:.85rem 0 0;color:#57554e;font:700 .6rem/1.3 var(--mono);letter-spacing:.12em;text-transform:uppercase;white-space:normal}.landing figure img{height:auto;aspect-ratio:16/9;object-fit:contain}.fashion-film{position:relative;margin:0}.fashion-film video{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;display:block;background:#111}.fashion-film figcaption{position:absolute;left:.7rem;bottom:.7rem;z-index:2;background:rgba(5,5,5,.78);color:#f4f3eb;padding:.45rem .6rem;font:.6rem var(--mono);text-transform:uppercase;letter-spacing:.08em}.fashion-block{padding-block:clamp(3.5rem,7vw,7rem)}.fashion-block>div:first-child{max-width:54ch;margin-bottom:clamp(2rem,4vw,3.4rem)}.fashion-block h2{font-size:clamp(1.88rem,3.4vw,3.96rem);margin:.6rem 0 1.2rem}.fashion-block p{color:var(--soft);line-height:1.6}.fashion-swap,.fashion-trio{display:grid;gap:clamp(.8rem,1.6vw,1.4rem)}.fashion-swap{grid-template-columns:repeat(2,1fr)}.fashion-trio{grid-template-columns:repeat(3,1fr)}.fashion-swap figure,.fashion-trio figure{margin:0}.fashion-swap img,.fashion-trio img{width:100%;height:auto;display:block;background:#171716}.fashion-swap figcaption,.fashion-trio figcaption{padding:.7rem 0 0;color:var(--soft);font:700 .6rem/1.3 var(--mono);letter-spacing:.12em;text-transform:uppercase}.fashion-wide{margin:0}.fashion-wide img{width:100%;height:auto;display:block}.fashion-feiten{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(2rem,5vw,5rem);margin:0}.fashion-feiten dt{font:700 .64rem/1.3 var(--mono);letter-spacing:.11em;text-transform:uppercase;color:var(--ink);margin-top:1.4rem;padding-top:1rem;border-top:1px solid var(--line)}.fashion-feiten dd{margin:.5rem 0 0;font-size:.94rem;line-height:1.6;color:var(--soft)}.fashion-reeks-groep{margin-top:clamp(2.2rem,4vw,3.4rem)}.reeks-kop{display:flex;align-items:baseline;gap:1rem;margin:0 0 .9rem;padding-bottom:.7rem;border-bottom:1px solid var(--line)}.reeks-kop strong{font:800 1.05rem/1.2 var(--sans);letter-spacing:-.01em;color:var(--ink)}.reeks-kop span{font:700 .6rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--hi)}.fashion-reeks{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(.6rem,1.1vw,1rem)}.fashion-reeks figure{margin:0}.fashion-reeks img{width:100%;height:auto;display:block;background:#171716}.fashion-reeks figcaption{padding:.55rem 0 0;color:var(--soft);font:700 .56rem/1.3 var(--mono);letter-spacing:.11em;text-transform:uppercase}@media(max-width:900px){.fashion-reeks{grid-auto-flow:column;grid-auto-columns:64%;grid-template-columns:none;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding-bottom:.4rem}.fashion-reeks figure{scroll-snap-align:start}}@media(max-width:900px){.fashion-trio{grid-template-columns:1fr 1fr}.fashion-feiten{grid-template-columns:1fr}}@media(max-width:600px){.fashion-swap,.fashion-trio{grid-template-columns:1fr}}.case-feature{display:grid;grid-template-columns:.7fr 1.3fr;gap:4rem;align-items:center;padding:clamp(2rem,5vw,5rem);background:var(--case);color:#25060d}.case-feature figure{aspect-ratio:4/5}.next-case{display:flex;align-items:end;justify-content:space-between;padding:clamp(3rem,7vw,7rem) var(--pad);background:var(--cream);color:#111;text-decoration:none;text-transform:uppercase;font-family:var(--mono)}.next-case strong{font:900 clamp(3rem,8vw,9rem)/.8 var(--sans);letter-spacing:-.06em}footer{padding:4rem var(--pad) 8rem;display:grid;grid-template-columns:1fr auto auto;gap:3rem;border-top:1px solid var(--line);color:var(--soft)}footer .brand{color:var(--ink);width:max-content}.foot-links{display:grid;gap:.7rem}.foot-links a{font:700 .7rem var(--mono);text-transform:uppercase}.legal{font-size:.75rem}.lang-switch{position:fixed;right:1.1rem;bottom:1.1rem;z-index:30;display:inline-flex;align-items:center;background:rgba(11,11,10,.82)}.lang-switch a{position:relative;display:flex;align-items:center;justify-content:center;min-width:44px;min-height:38px;text-decoration:none;color:rgba(244,243,235,.72);font:700 .64rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;transition:color .18s ease,background-color .18s ease}.lang-switch a+a::before{content:'';position:absolute;left:0;top:28%;bottom:28%;width:1px;background:rgba(244,243,235,.18)}.lang-switch a:hover,.lang-switch a:focus-visible{color:var(--ink)}.lang-switch a[aria-current]{background:var(--hi);color:#111}.lang-switch a[aria-current]+a::before,.lang-switch a:has(+a[aria-current])::before{opacity:0}@media(max-width:900px){.site-head nav{display:none;position:absolute;left:0;right:0;top:92px;background:var(--bg);padding:2rem var(--pad);flex-direction:column;align-items:stretch}.site-head nav.open{display:flex}.menu-toggle{display:block}.metrics,.featured,.service-tease,.price-grid,.calc-output{grid-template-columns:repeat(3,1fr)}.split,.yellow-cta,.sample-page,.case-hero,.landing,.case-feature,.placement{grid-template-columns:1fr}.work-list .work-card{grid-template-columns:1fr}.service-row{grid-template-columns:50px 1fr}.service-row>div:last-child{grid-column:2}.media-three{grid-template-columns:1fr 1fr}.next-case{align-items:flex-start;flex-direction:column;gap:2rem}footer{grid-template-columns:1fr 1fr}}@media(max-width:600px){.site-head{height:76px}.site-head nav{top:76px}.home-hero{min-height:calc(100svh - 76px)}h1{font-size:clamp(3.06rem,15.3vw,4.95rem)}.metrics,.featured,.service-tease,.price-grid,.calc-output,.calculator>div:first-of-type,.media-three,.media-two{grid-template-columns:1fr}.section-head{align-items:flex-start;flex-direction:column}.work-list .work-card figure{aspect-ratio:4/3}.service-row{grid-template-columns:1fr}.service-row>div:last-child{grid-column:auto}.case-hero{gap:1rem}.yellow-cta{gap:2rem}.next-case strong{font-size:3.5rem}footer{grid-template-columns:1fr}.lang-switch{right:.7rem;bottom:.7rem}.lang-switch a{min-width:44px;min-height:44px}}


/* Approved Before Four wordmark and transparent overlay navigation. */
.site-head{position:fixed;top:0;left:0;right:0;background:linear-gradient(180deg,rgba(0,0,0,.60) 0%,rgba(0,0,0,.34) 45%,rgba(0,0,0,.10) 78%,rgba(0,0,0,0) 100%);border-bottom:0;-webkit-backdrop-filter:none;backdrop-filter:none}
/* Het logo is een vector (before-four-wordmark.svg), geen tekst meer.
   Daarmee is het op elk apparaat identiek - geen afhankelijkheid van welk lettertype
   het toestel heeft. Als masker geladen, zodat de kleur uit currentColor komt en
   hetzelfde bestand op donkere en lichte ondergrond werkt.
   De hoogte is de kaphoogte van het woordmerk; de breedte volgt uit aspect-ratio. */
.before-four-mark{display:block;height:.75rem;aspect-ratio:1270/95;width:auto;
  background:currentColor;color:var(--ink);text-decoration:none;flex:none;
  -webkit-mask:url(before-four-wordmark.svg) no-repeat center/contain;
          mask:url(before-four-wordmark.svg) no-repeat center/contain}
.home-hero{min-height:100svh}
h1{font-size:clamp(2.7rem,6.75vw,7.65rem)}
.hero-slogan{font-size:clamp(2.88rem,6.75vw,7.65rem)}
.hero-slogan span{display:block;white-space:nowrap}
.price-grid h2 span{font:inherit;color:inherit;letter-spacing:inherit;text-transform:inherit;line-height:inherit}
.page-hero,.case-hero{padding-top:clamp(8rem,12vw,12rem)}
.sample-page>div,.sample-page aside{padding-top:clamp(8rem,12vw,12rem)}
.media-three.portrait figure{aspect-ratio:9/16}
.zing-campaign{margin-top:1rem;padding:clamp(2rem,5vw,5rem);background:var(--case);color:#25060d}
.zing-campaign .eyebrow{color:#7f2339}
.zing-campaign-head{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,7vw,8rem);align-items:end;margin-bottom:clamp(2rem,4vw,4rem)}
.zing-campaign-head h2{margin:.5rem 0 0;font-size:clamp(2.7rem,5.4vw,6.75rem);line-height:1}
.zing-campaign-head>p{max-width:35ch;font-size:1.15rem;line-height:1.55}
.zing-campaign-grid{display:grid;grid-template-columns:minmax(260px,.82fr) minmax(0,1.18fr);gap:clamp(1.25rem,2.5vw,2.75rem);align-items:end;max-width:1400px;margin-inline:auto}
.zing-campaign-grid figure:first-child{aspect-ratio:9/16}
.zing-campaign-grid figure:last-child{aspect-ratio:4/5}
.zing-campaign-grid figure:last-child img{object-fit:contain;background:#f2a7b7}
@media(max-width:800px){.zing-campaign-head,.zing-campaign-grid{grid-template-columns:1fr}.zing-campaign-grid{gap:1.25rem}.zing-campaign-grid figure:first-child{width:min(100%,520px);justify-self:center}.zing-campaign-grid figure:last-child{width:100%}}
@media(max-width:600px){.before-four-mark{height:.63rem}.home-hero{min-height:100svh}.page-hero,.case-hero{padding-top:7rem}.sample-page>div,.sample-page aside{padding-top:7rem}}
.about-prose p{font-size:1.2rem;line-height:1.55;max-width:55ch;color:var(--soft)}
.about-prose a{color:var(--hi)}
.zing-campaign figcaption,.zing-campaign .sound{color:#f4f3eb}
.zing-campaign-grid figcaption{left:.7rem;bottom:.7rem}
.foot-meta{display:flex;flex-direction:column;gap:.75rem;justify-content:flex-start}
.foot-legal{display:flex;flex-wrap:wrap;gap:.55rem 1.15rem}
.foot-legal a{font:700 .7rem var(--mono);letter-spacing:.1em;text-transform:uppercase;text-decoration:none;color:var(--ink)}
.legal-page .page-hero h1{font-size:clamp(2rem,4.95vw,4.14rem);line-height:.95;max-width:20ch;margin-bottom:1.2rem}
.legal-prose{padding-bottom:8rem;max-width:65ch}
.legal-prose h2{font-size:clamp(1.35rem,2.2vw,1.85rem);letter-spacing:max(.02em,1.25px);line-height:1.2;margin:2.4rem 0 .7rem;color:var(--ink)}
.legal-prose p,.legal-prose li{font-size:1.2rem;line-height:1.6;color:var(--soft);margin:0 0 1rem}
.legal-prose a{color:var(--hi)}
.legal-prose code{font-family:var(--mono);font-size:.85em;color:var(--ink)}
.cookie-bar{position:fixed;left:0;right:0;bottom:0;z-index:25;display:flex;align-items:center;flex-wrap:wrap;gap:.75rem 1.15rem;padding:.85rem var(--pad);padding-right:12rem;background:#080808;border-top:1px solid var(--line);color:var(--ink)}
.cookie-bar p{margin:0;font-size:.95rem;line-height:1.4;color:var(--soft);flex:1 1 14rem}
.cookie-bar a{font:700 .65rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--hi);text-underline-offset:.28rem;white-space:nowrap}
.cookie-actions{display:flex;align-items:center;gap:.55rem}
.cookie-bar button{padding:.7rem 1.05rem;font:700 .65rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;white-space:nowrap}
.cookie-bar .cookie-decline{background:transparent;color:var(--ink);border:1px solid #5a5954}
.cookie-bar .cookie-ok{background:var(--hi);color:#111;border:1px solid var(--hi)}
.cookie-bar button:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
@media(max-width:600px){.cookie-bar{bottom:3.35rem;padding:.8rem .75rem}}
.page-hero>p:not(.eyebrow){font-size:1.25rem;line-height:1.55;max-width:55ch;color:var(--soft)}
.work-hero h1{line-height:.95}
.work-hero h1>span{display:block}
.work-hero h1>span+span{margin-top:.16em}
.home-process-title{line-height:1;font-size:clamp(2.34rem,6vw,6.75rem)}
.home-process-title>span{display:block}
.home-process-title>span+span{margin-top:.18em}
.yellow-cta h2{line-height:1}
.calculator>h2{font-size:clamp(2.25rem,4.95vw,5.4rem);margin-bottom:1rem}
.calculator-intro{max-width:62ch;color:var(--soft);font-size:1.1rem;line-height:1.55;margin-bottom:2rem}
.calculator>.credit-builder{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.credit-item{min-width:0;padding:clamp(1.15rem,2vw,2rem);background:var(--panel)}
.credit-item h3{font-size:clamp(1.35rem,2.15vw,2.35rem);line-height:1.05;margin-bottom:.55rem}
.credit-cost{margin:0;color:var(--soft);font:700 .68rem/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase}
.counter{display:grid;grid-template-columns:2.8rem minmax(3rem,1fr) 2.8rem;margin-top:1.35rem;border:1px solid var(--line)}
.counter button,.counter input{min-height:2.8rem;border:0;background:#0b0b0a;color:var(--ink);text-align:center}
.counter button{cursor:pointer;font-size:1.25rem}
.counter button:first-child{border-right:1px solid var(--line)}
.counter button:last-child{border-left:1px solid var(--line)}
.counter button:hover:not(:disabled),.counter button:focus-visible{background:var(--hi);color:#111}
.counter button:disabled{opacity:.28;cursor:not-allowed}
.calculator .counter input{width:100%;padding:0 .25rem;font:700 1.2rem var(--mono);appearance:textfield;-moz-appearance:textfield}
.calculator .counter input::-webkit-inner-spin-button,.calculator .counter input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.calculator .calc-output{grid-template-columns:.8fr 2.2fr 1fr 1fr 1fr}
.calculator .calc-output .calc-breakdown strong{font-size:clamp(1.2rem,2vw,2rem);line-height:1.1;white-space:normal}
@media(max-width:1050px){.calculator>.credit-builder{grid-template-columns:repeat(2,minmax(0,1fr))}.calculator .calc-output{grid-template-columns:repeat(3,1fr)}.calculator .calc-output .calc-breakdown{grid-column:span 2}}
@media(max-width:600px){.calculator>.credit-builder,.calculator .calc-output{grid-template-columns:1fr}.calculator .calc-output .calc-breakdown{grid-column:auto}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
/* Calculator: compact editorial grid with one-pixel rules, not open grey gutters. */
.calculator>div.credit-builder{grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.calculator>div.credit-builder .credit-item{display:flex;flex-direction:column;min-height:14rem;padding:clamp(1.35rem,2vw,2rem);background:var(--panel)}
.calculator>div.credit-builder .credit-item h3{min-height:2.1em;margin-bottom:.65rem}
.calculator>div.credit-builder .counter{margin-top:auto}
.calculator .calc-output{gap:1px;border:1px solid var(--line);background:var(--line)}
.calculator .calc-output p{min-width:0;justify-content:flex-end;margin:0;padding:1.5rem 1.25rem}
.calculator .calc-output .calc-breakdown strong{font-size:clamp(1.5rem,2.35vw,2.55rem);line-height:1.05;letter-spacing:-.045em}
.calculator .calc-output .calc-breakdown strong>span{font:inherit;text-transform:none;letter-spacing:inherit;color:var(--hi);white-space:normal}
.calculator .calc-output .calc-breakdown>span{margin-top:.55rem}
.calculator .fine{width:100%;max-width:none;margin-top:1.2rem;line-height:1.55}
@media(max-width:1050px){.calculator>div.credit-builder{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.calculator>div.credit-builder{grid-template-columns:1fr}.calculator>div.credit-builder .credit-item{min-height:12rem}}
/* ---------- contactpagina ---------- */
.contact-top{display:grid;grid-template-columns:1fr minmax(280px,38%);gap:clamp(2rem,5vw,5rem);
  align-items:end;padding:clamp(7rem,13vh,11rem) 0 clamp(2.5rem,5vw,4rem);border-bottom:1px solid var(--line)}
.contact-top-copy{padding-right:0}
.contact-top-copy h1{margin:.5rem 0 2.1rem}
.contact-intro{max-width:34rem;color:var(--soft);line-height:1.62;font-size:1.02rem}
.cf-hint{margin:.7rem 0 0;color:#807e77}

/* vier tellen: drie die lopen, een vierde die te laat is */
.contact-beats{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;padding-right:var(--pad)}
.contact-beats figure{position:relative;margin:0;aspect-ratio:9/16;overflow:hidden;border-radius:2px;background:var(--panel)}
.contact-beats video,.contact-beats img{width:100%;height:100%;object-fit:cover;display:block}
.contact-beats .beat-late img{filter:grayscale(1) brightness(.32)}
.contact-beats .beat-late::after{content:"";position:absolute;inset:0;background:rgba(11,11,10,.55)}
.contact-beats .beat-late span{position:absolute;left:.6rem;right:.6rem;bottom:.7rem;z-index:2;font-family:var(--mono);
  font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;color:#b9b7b0}

.contact-block{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2.5rem,6vw,7rem);
  padding-top:clamp(3rem,7vw,5.5rem);padding-bottom:clamp(4rem,9vw,7rem);align-items:start}

/* formulier */
.contact-form{display:flex;flex-direction:column}
.cf-row{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
.cf-row>div{display:flex;flex-direction:column;min-width:0}
.contact-form label{font:600 .72rem/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;
  color:var(--soft);margin:1.5rem 0 .5rem}
.cf-row label{margin-top:0}
.contact-form .opt{letter-spacing:.06em;opacity:.6}
.contact-form input,.contact-form textarea{font:400 1.02rem/1.5 var(--sans);color:var(--ink);
  background:rgba(244,243,235,.05);border:0;border-bottom:1px solid rgba(244,243,235,.28);
  border-radius:0;padding:.85rem .9rem;width:100%;transition:background .18s,border-color .18s}
.contact-form input:hover,.contact-form textarea:hover{background:rgba(244,243,235,.08);border-bottom-color:rgba(244,243,235,.5)}
.contact-form input:focus,.contact-form textarea:focus{outline:0;background:rgba(244,243,235,.1);border-bottom-color:var(--hi)}
.contact-form input::placeholder,.contact-form textarea::placeholder{color:#6f6d66}
.contact-form textarea{resize:vertical;min-height:8.5rem}
.contact-form .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.cf-send{display:flex;align-items:center;gap:1.6rem;flex-wrap:wrap;margin-top:2rem}
.cf-send .button{border:0;cursor:pointer}
.cf-send .fine{margin:0}
.cf-privacy{margin-top:1.4rem;color:#807e77}
.contact-form a{color:var(--ink)}

/* wat er daarna gebeurt */
.contact-steps{border-left:1px solid var(--line);padding-left:clamp(1.4rem,3vw,2.6rem)}
.contact-steps ol{list-style:none;margin:1.6rem 0 0;padding:0}
.contact-steps li{padding:0 0 1.7rem}
.contact-steps li+li{padding-top:1.7rem;border-top:1px solid var(--line)}
.contact-steps .beat{display:flex;gap:.22rem;height:.7rem;margin-bottom:.75rem}
.contact-steps .beat i{display:block;width:.24rem;background:var(--hi);border-radius:1px}
.contact-steps h3{font-size:1.02rem;margin:0 0 .35rem;letter-spacing:.02em}
.contact-steps p{margin:0;color:var(--soft);font-size:.94rem;line-height:1.55}
.steps-cta{margin-top:.6rem;padding-top:1.6rem;border-top:1px solid var(--line)}
.steps-cta p{margin:0 0 .9rem;color:var(--soft)}

.contact-status{border-left:3px solid var(--hi);padding:.95rem 1.15rem;margin:0 0 2rem;background:rgba(244,243,235,.06)}

@media(max-width:980px){
  .contact-top{grid-template-columns:1fr;align-items:start;padding-bottom:0;border-bottom:0}
  .contact-beats{padding:2.5rem var(--pad) 0;gap:.4rem}
  .contact-block{grid-template-columns:1fr;gap:3rem}
  .contact-steps{border-left:0;border-top:1px solid var(--line);padding-left:0;padding-top:2.5rem}
}
@media(max-width:600px){
  .cf-row{grid-template-columns:1fr;gap:0}
  .cf-row>div+div label{margin-top:1.5rem}
}

/* Approved parallax. Native scrolling; reduced motion respected. */
.hero-stage{position:relative}
.motion-on .hero-stage{height:160svh;min-height:880px}
.motion-on .home-hero{position:sticky;top:0;height:100svh;min-height:650px;isolation:isolate}
.motion-on .home-hero>video{transform:scale(var(--hero-scale,1.1));transform-origin:50% 52%;will-change:transform}
.motion-on .hero-copy{transform:translate3d(0,var(--hero-copy-y,0px),0);opacity:var(--hero-copy-opacity,1);will-change:transform}
.motion-on .hero-shade{background:linear-gradient(90deg,rgba(4,4,3,.86),rgba(4,4,3,.35) 55%,rgba(4,4,3,.08)),linear-gradient(0deg,rgba(4,4,3,.8),transparent 70%)}
.motion-on .metrics{position:relative;z-index:2;background:var(--bg)}
.motion-on .featured{gap:clamp(14px,2vw,30px);background:transparent;padding-block:28px 42px}
.motion-on .featured>.work-card{transform:translate3d(0,var(--card-y,0px),0);will-change:transform}
.motion-on [data-parallax-image]{transform:translate3d(0,var(--image-y,0px),0) scale(1.14);transition:none;will-change:transform}
.motion-on .work-card:hover [data-parallax-image]{transform:translate3d(0,var(--image-y,0px),0) scale(1.14)}
.motion-on [data-parallax-reveal]{transform:translate3d(0,var(--reveal-y,0px),0);opacity:var(--reveal-opacity,1)}
.motion-on .site-head{transition:background .25s ease}
.motion-on .site-head.past-hero{background:rgba(11,11,10,.95)}
.motion-on .scroll-trace{position:fixed;left:0;right:0;top:0;height:2px;z-index:40;background:var(--hi);transform:scaleX(var(--page-progress,0));transform-origin:0 50%;pointer-events:none}
@media(max-width:900px){
  .motion-on .hero-stage{height:132svh;min-height:0}
  .motion-on .home-hero{height:100svh;min-height:600px}
  .motion-on .featured{padding-block:0;gap:18px}
  .motion-on .featured>.work-card{transform:none;will-change:auto}
}
@media(max-width:600px){
}
@media(prefers-reduced-motion:reduce){
  .motion-on .hero-stage{height:auto;min-height:0}
  .motion-on .home-hero{position:relative;height:auto;min-height:100svh}
  .motion-on .home-hero>video,.motion-on .hero-copy,.motion-on [data-parallax-image],.motion-on [data-parallax-reveal],.motion-on .featured>.work-card{transform:none!important;opacity:1!important;will-change:auto}
  .scroll-trace{display:none}
}


/* ========== Theme: light mode + toggle (draft) ========== */
/* Existing :root tokens remain DARK. Light overrides via data-theme="light".
   System preference applies only when data-theme is unset (no saved choice / no FOUC). */
html[data-theme="light"]{
  --bg:#f4f3eb;
  --panel:#ffffff;
  --ink:#0b0b0a;
  --soft:#5a5954;
  --line:#d2d0c9;
  --hi:#ffd640;
  --cream:#ece9df;
  --black:#0b0b0a;
}
@media (prefers-color-scheme: light){
  :root:not([data-theme]){
    --bg:#f4f3eb;
    --panel:#ffffff;
    --ink:#0b0b0a;
    --soft:#5a5954;
    --line:#d2d0c9;
    --hi:#ffd640;
    --cream:#ece9df;
    --black:#0b0b0a;
  }
}

/* --- Light UI overrides (explicit data-theme="light") --- */
/* Default light nav/ink; homepage hero overrides keep light-on-dark until past-hero */
html[data-theme="light"] .site-head nav a:not(.nav-cta){color:#3a3833}

html[data-theme="light"] .site-head nav a[aria-current=page]{color:var(--hi)}
html[data-theme="light"] body:not(:has(.home-hero)) .site-head{
  background:rgba(244,243,235,.96);
  border-bottom:1px solid var(--line);
}
html[data-theme="light"] .site-head.past-hero,
html[data-theme="light"] .motion-on .site-head.past-hero{
  background:rgba(244,243,235,.96);
  border-bottom:1px solid var(--line);
}
html[data-theme="light"] .site-head.past-hero .before-four-mark,
html[data-theme="light"] .motion-on .site-head.past-hero .before-four-mark{color:var(--ink)}
html[data-theme="light"] .site-head.past-hero nav a:not(.nav-cta),
html[data-theme="light"] .motion-on .site-head.past-hero nav a:not(.nav-cta){color:#3a3833}
/* Over home hero (top): keep light logo/nav on dark shade — works with or without .motion-on */
html[data-theme="light"] body:has(.home-hero) .site-head:not(.past-hero){
  background:linear-gradient(180deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,.28) 45%,rgba(0,0,0,.08) 78%,rgba(0,0,0,0) 100%);
  border-bottom:0;
}
html[data-theme="light"] body:has(.home-hero) .site-head:not(.past-hero) nav a:not(.nav-cta){color:#d2d0c9}
html[data-theme="light"] body:has(.home-hero) .site-head:not(.past-hero) .before-four-mark{color:#f4f3eb}
html[data-theme="light"] .button.ghost{
  background:rgba(255,255,255,.55);
  color:var(--ink);
  border-color:rgba(11,11,10,.35);
}
html[data-theme="light"] .home-hero .button.ghost{
  background:rgba(0,0,0,.25);
  color:#f4f3eb;
  border-color:rgba(255,255,255,.35);
}
html[data-theme="light"] .home-hero .hero-copy{color:#f4f3eb}
html[data-theme="light"] .home-hero .eyebrow{color:#c8c5ba}
html[data-theme="light"] .cookie-bar{
  background:#f4f3eb;
  border-top:1px solid var(--line);
  color:var(--ink);
  box-shadow:0 -8px 24px rgba(11,11,10,.06);
}
html[data-theme="light"] .cookie-bar .cookie-decline{border-color:#aaa59a;color:var(--ink)}
html[data-theme="light"] .counter button,
html[data-theme="light"] .counter input{background:#ffffff;color:var(--ink)}
html[data-theme="light"] .contact-form input,
html[data-theme="light"] .contact-form textarea{
  background:rgba(11,11,10,.04);
  border-bottom:1px solid rgba(11,11,10,.22);
}
html[data-theme="light"] .contact-form input:hover,
html[data-theme="light"] .contact-form textarea:hover{
  background:rgba(11,11,10,.06);
  border-bottom-color:rgba(11,11,10,.4);
}
html[data-theme="light"] .contact-form input:focus,
html[data-theme="light"] .contact-form textarea:focus{
  background:rgba(11,11,10,.07);
  border-bottom-color:var(--hi);
}
html[data-theme="light"] .contact-status{background:rgba(11,11,10,.04)}
html[data-theme="light"] .cream{border-block:1px solid #d2d0c9}
html[data-theme="light"] .service-tease{border-color:#c4c0b4}
html[data-theme="light"] .service-tease article{border-right-color:#c4c0b4}
html[data-theme="light"] .landing figure{border-color:#d2d0c9;background:#e8e5db}
html[data-theme="light"] .work-list a.work-fashion figure{background:#e8e5db}
/* light chrome geometry removed — shared size lock below */
html[data-theme="light"] .lang-switch a{color:rgba(11,11,10,.55)}
html[data-theme="light"] .lang-switch a+a::before{background:rgba(11,11,10,.14)}
html[data-theme="light"] .lang-switch a:hover,
html[data-theme="light"] .lang-switch a:focus-visible{color:var(--ink)}
html[data-theme="light"] .theme-switch button{color:rgba(11,11,10,.72)}
html[data-theme="light"] .theme-switch button:hover,
html[data-theme="light"] .theme-switch button:focus-visible{color:var(--ink)}

/* System light when no saved data-theme (mirrors rules above) */
@media (prefers-color-scheme: light){
  :root:not([data-theme]) .site-head nav a:not(.nav-cta){color:#3a3833}

  :root:not([data-theme]) .site-head nav a[aria-current=page]{color:var(--hi)}
  :root:not([data-theme]) body:not(:has(.home-hero)) .site-head{
    background:rgba(244,243,235,.96);
    border-bottom:1px solid var(--line);
  }
  :root:not([data-theme]) .site-head.past-hero,
  :root:not([data-theme]) .motion-on .site-head.past-hero{
    background:rgba(244,243,235,.96);
    border-bottom:1px solid var(--line);
  }
  :root:not([data-theme]) .site-head.past-hero .before-four-mark,
  :root:not([data-theme]) .motion-on .site-head.past-hero .before-four-mark{color:var(--ink)}
  :root:not([data-theme]) .site-head.past-hero nav a:not(.nav-cta),
  :root:not([data-theme]) .motion-on .site-head.past-hero nav a:not(.nav-cta){color:#3a3833}
  :root:not([data-theme]) body:has(.home-hero) .site-head:not(.past-hero){
    background:linear-gradient(180deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,.28) 45%,rgba(0,0,0,.08) 78%,rgba(0,0,0,0) 100%);
    border-bottom:0;
  }
  :root:not([data-theme]) body:has(.home-hero) .site-head:not(.past-hero) nav a:not(.nav-cta){color:#d2d0c9}
  :root:not([data-theme]) body:has(.home-hero) .site-head:not(.past-hero) .before-four-mark{color:#f4f3eb}
  :root:not([data-theme]) .button.ghost{
    background:rgba(255,255,255,.55);
    color:var(--ink);
    border-color:rgba(11,11,10,.35);
  }
  :root:not([data-theme]) .home-hero .button.ghost{
    background:rgba(0,0,0,.25);
    color:#f4f3eb;
    border-color:rgba(255,255,255,.35);
  }
  :root:not([data-theme]) .home-hero .hero-copy{color:#f4f3eb}
  :root:not([data-theme]) .home-hero .eyebrow{color:#c8c5ba}
  :root:not([data-theme]) .cookie-bar{
    background:#f4f3eb;
    border-top:1px solid var(--line);
    color:var(--ink);
    box-shadow:0 -8px 24px rgba(11,11,10,.06);
  }
  :root:not([data-theme]) .cookie-bar .cookie-decline{border-color:#aaa59a;color:var(--ink)}
  :root:not([data-theme]) .counter button,
  :root:not([data-theme]) .counter input{background:#ffffff;color:var(--ink)}
  :root:not([data-theme]) .contact-form input,
  :root:not([data-theme]) .contact-form textarea{
    background:rgba(11,11,10,.04);
    border-bottom:1px solid rgba(11,11,10,.22);
  }
  :root:not([data-theme]) .contact-form input:hover,
  :root:not([data-theme]) .contact-form textarea:hover{
    background:rgba(11,11,10,.06);
    border-bottom-color:rgba(11,11,10,.4);
  }
  :root:not([data-theme]) .contact-form input:focus,
  :root:not([data-theme]) .contact-form textarea:focus{
    background:rgba(11,11,10,.07);
    border-bottom-color:var(--hi);
  }
  :root:not([data-theme]) .contact-status{background:rgba(11,11,10,.04)}
  :root:not([data-theme]) .cream{border-block:1px solid #d2d0c9}
  :root:not([data-theme]) .service-tease{border-color:#c4c0b4}
  :root:not([data-theme]) .service-tease article{border-right-color:#c4c0b4}
  :root:not([data-theme]) .landing figure{border-color:#d2d0c9;background:#e8e5db}
  :root:not([data-theme]) .work-list a.work-fashion figure{background:#e8e5db}
  :root:not([data-theme]) .chrome-switches .lang-switch,
  :root:not([data-theme]) .chrome-switches .theme-switch{
    background:rgba(244,243,235,.92);
    border:1px solid var(--line);
  }
  :root:not([data-theme]) .lang-switch a{color:rgba(11,11,10,.55)}
  :root:not([data-theme]) .lang-switch a+a::before{background:rgba(11,11,10,.14)}
  :root:not([data-theme]) .lang-switch a:hover,
  :root:not([data-theme]) .lang-switch a:focus-visible{color:var(--ink)}
  :root:not([data-theme]) .theme-switch button{color:rgba(11,11,10,.55)}
  :root:not([data-theme]) .theme-switch button:hover,
  :root:not([data-theme]) .theme-switch button:focus-visible{color:var(--ink)}
}


/* Liquid glass CTAs (Start trial) — glass on ::before so type stays sharp */
.site-head .nav-cta,
.button:not(.ghost):not(.dark){
  position:relative;
  isolation:isolate;
  border-radius:999px !important;
  background:transparent;
  color:#111 !important;
  border:1px solid rgba(255,255,255,.5);
  box-shadow:
    0 10px 30px rgba(0,0,0,.28),
    0 2px 8px rgba(255,214,64,.25);
  font-weight:800;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:geometricPrecision;
  transform:translateZ(0);
  transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.site-head .nav-cta::before,
.button:not(.ghost):not(.dark)::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  border-radius:inherit;
    background:
    linear-gradient(155deg, rgba(255,255,255,.48) 0%, rgba(255,255,255,.14) 34%, rgba(255,255,255,0) 68%),
    rgba(255,214,64,.74);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.7),
    inset 0 -1px 0 rgba(11,11,10,.08);
  -webkit-backdrop-filter: blur(18px) saturate(175%);
  backdrop-filter: blur(18px) saturate(175%);
  pointer-events:none;
}
.site-head .nav-cta:hover,
.site-head .nav-cta:focus-visible,
.button:not(.ghost):not(.dark):hover,
.button:not(.ghost):not(.dark):focus-visible{
  border-color:rgba(255,255,255,.65);
  box-shadow:
    0 14px 34px rgba(0,0,0,.32),
    0 3px 10px rgba(255,214,64,.35);
}
.site-head .nav-cta:hover::before,
.site-head .nav-cta:focus-visible::before,
.button:not(.ghost):not(.dark):hover::before,
.button:not(.ghost):not(.dark):focus-visible::before{
    background:
    linear-gradient(155deg, rgba(255,255,255,.55) 0%, rgba(255,255,255,.18) 38%, rgba(255,255,255,0) 70%),
    rgba(255,214,64,.86);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.78),
    inset 0 -1px 0 rgba(11,11,10,.06);
}
html[data-theme="light"] .site-head .nav-cta,
html[data-theme="light"] body:has(.home-hero) .site-head .nav-cta,
html[data-theme="light"] .site-head.past-hero .nav-cta,
html[data-theme="light"] .button:not(.ghost):not(.dark){
  color:#111 !important;
  border:1px solid rgba(11,11,10,.14);
  box-shadow:
    0 12px 28px rgba(11,11,10,.12),
    0 2px 8px rgba(255,214,64,.28);
  font-weight:800;
  background:transparent;
}
html[data-theme="light"] .site-head .nav-cta::before,
html[data-theme="light"] body:has(.home-hero) .site-head .nav-cta::before,
html[data-theme="light"] .site-head.past-hero .nav-cta::before,
html[data-theme="light"] .button:not(.ghost):not(.dark)::before{
    background:
    linear-gradient(155deg, rgba(255,255,255,.52) 0%, rgba(255,255,255,.16) 36%, rgba(255,255,255,0) 70%),
    rgba(255,214,64,.78);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.8),
    inset 0 -1px 0 rgba(11,11,10,.06);
  -webkit-backdrop-filter: blur(18px) saturate(175%);
  backdrop-filter: blur(18px) saturate(175%);
  backdrop-filter: none;
}



/* Lock chrome control geometry across themes (colors may differ; sizes must not) */
.chrome-switches,
.chrome-switches .lang-switch,
.chrome-switches .theme-switch,
.lang-toggle,
.theme-switch button{
  box-sizing:border-box;
}
.chrome-switches .theme-switch{
  display:inline-flex;
  align-items:center;
  gap:.15rem;
  height:1.85rem;
  padding:0;
  border-radius:999px;
}
.chrome-switches .lang-switch{
  display:inline-flex;
  align-items:center;
  height:1.85rem;
  padding:0;
}
.lang-toggle{
  height:1.85rem;
  min-height:1.85rem;
  max-height:1.85rem;
}
.theme-switch button{
  width:1.85rem;
  height:1.85rem;
  min-width:1.85rem;
  min-height:1.85rem;
  max-width:1.85rem;
  max-height:1.85rem;
  flex:none;
}

/* Chrome switches: pill + liquid glass */
.chrome-switches{
  --glass-bg: rgba(18,18,16,.28);
  --glass-border: rgba(255,255,255,.18);
  --glass-highlight: inset 0 1px 0 rgba(255,255,255,.14), inset 0 -1px 0 rgba(0,0,0,.10);
  --glass-shadow: 0 12px 40px rgba(0,0,0,.32), 0 2px 10px rgba(0,0,0,.18);
  position:fixed;
  right:.85rem;
  bottom:.85rem;
  z-index:30;
  display:flex;
  flex-direction:row;
  align-items:center;
  gap:.14rem;
  padding:.1rem;
  border-radius:999px;
  overflow:visible;
  background:
    linear-gradient(145deg, rgba(255,255,255,.06) 0%, rgba(255,255,255,.015) 36%, rgba(255,255,255,0) 68%),
    var(--glass-bg);
  border:1px solid var(--glass-border);
  box-shadow: var(--glass-highlight), var(--glass-shadow);
  -webkit-backdrop-filter: blur(3px) saturate(110%);
  backdrop-filter: blur(3px) saturate(110%);
}
.chrome-switches .lang-switch{
  position:static;
  right:auto;
  bottom:auto;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  display:inline-flex;align-items:center;height:1.85rem;padding:0;
  border-radius:999px;
}
.lang-switch--dropdown{
  position:relative;
}
.lang-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.35rem;
  height:1.85rem;
  min-width:4.35rem;
  padding:0 .72rem;
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px !important;
  background:rgba(255,255,255,.12);
  color:rgba(244,243,235,.96);
  font:700 .58rem/1 var(--mono);
  letter-spacing:.12em;
  text-transform:uppercase;
  cursor:pointer;
  overflow:hidden;
  -webkit-appearance:none;
  appearance:none;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16);
  transition:background .18s ease, color .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.lang-toggle:hover,
.lang-toggle:focus-visible{
  color:var(--ink);
  background:rgba(255,255,255,.08);
}
.lang-toggle:focus-visible{outline:2px solid var(--hi);outline-offset:2px}
.lang-switch--dropdown.is-open .lang-toggle{
  background:rgba(255,255,255,.08);
}
.lang-chevron{
  width:8px;
  height:8px;
  display:block;
  opacity:.75;
  transition:transform .18s ease;
}
.lang-switch--dropdown.is-open .lang-chevron{transform:rotate(180deg)}
.lang-menu{
  position:absolute;
  right:0;
  bottom:calc(100% + .55rem);
  min-width:4.6rem;
  display:flex;
  flex-direction:column;
  gap:.15rem;
  padding:.28rem;
  border-radius:1rem;
  background:
    linear-gradient(160deg, rgba(255,255,255,.18) 0%, rgba(255,255,255,.05) 42%, rgba(255,255,255,0) 72%),
    rgba(14,14,12,.55);
  border:1px solid rgba(255,255,255,.16);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 16px 40px rgba(0,0,0,.4);
  -webkit-backdrop-filter: blur(1px) saturate(100%);
  backdrop-filter: blur(1px) saturate(100%);
  overflow:hidden;
}
.lang-menu[hidden]{display:none!important}
.lang-switch--dropdown .lang-menu a{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:1.85rem;
  padding:0 .85rem;
  border-radius:999px;
  text-decoration:none;
  color:rgba(244,243,235,.78);
  font:700 .58rem/1 var(--mono);
  letter-spacing:.12em;
  text-transform:uppercase;
  background:transparent;
  transition:background .15s ease, color .15s ease;
}
.lang-switch--dropdown .lang-menu a+a::before{display:none}
.lang-switch--dropdown .lang-menu a:hover,
.lang-switch--dropdown .lang-menu a:focus-visible{
  color:var(--ink);
  background:rgba(255,255,255,.1);
}
.lang-switch--dropdown .lang-menu a[aria-current]{
  background:var(--hi);
  color:#111;
  box-shadow:0 4px 14px rgba(255,214,64,.28);
}
.theme-switch{
  display:inline-flex;
  align-items:center;
  gap:.15rem;
  height:1.85rem;
  padding:0;
  border-radius:999px;
  background:rgba(0,0,0,.18);
  border:1px solid rgba(255,255,255,.08);
  box-sizing:border-box;
}
.theme-switch button{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  width:1.85rem;
  height:1.85rem;
  border:0;
  border-radius:999px;
  background:transparent;
  color:rgba(244,243,235,.72);
  font:inherit;
  line-height:0;
  cursor:pointer;
  transition:color .18s ease, background-color .18s ease, box-shadow .18s ease, transform .18s ease;
  padding:0;
}
.theme-switch button+button::before{display:none}
.theme-switch button:hover,
.theme-switch button:focus-visible{
  color:var(--ink);
  background:rgba(255,255,255,.1);
}
.theme-switch button[aria-pressed="true"]{
  background:var(--hi);
  color:#111;
  box-shadow:0 4px 16px rgba(255,214,64,.32), inset 0 1px 0 rgba(255,255,255,.35);
}
.theme-switch button:focus-visible{outline:2px solid var(--hi);outline-offset:2px}
.theme-switch button .theme-icon{
  width:14px;
  height:14px;
  display:block;
  flex:none;
  pointer-events:none;
}
.theme-switch button[aria-pressed="true"] .theme-icon{transform:scale(1.04)}

html[data-theme="light"] .chrome-switches{
  --glass-bg: rgba(255,255,255,.22);
  --glass-border: rgba(11,11,10,.12);
  --glass-highlight: inset 0 1px 0 rgba(255,255,255,.45), inset 0 -1px 0 rgba(11,11,10,.03);
  --glass-shadow: 0 14px 40px rgba(11,11,10,.12), 0 2px 8px rgba(11,11,10,.06);
}
html[data-theme="light"] .lang-toggle{
  background:rgba(255,255,255,.30);
  border-color: rgba(11,11,10,.12);
  color:rgba(11,11,10,.88);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.45);
}
html[data-theme="light"] .lang-toggle:hover,
html[data-theme="light"] .lang-toggle:focus-visible,
html[data-theme="light"] .lang-switch--dropdown.is-open .lang-toggle{
  color:var(--ink);
  background:rgba(255,255,255,.38);
}
html[data-theme="light"] .lang-menu{
  background:
    linear-gradient(160deg, rgba(255,255,255,.18) 0%, rgba(255,255,255,.10) 50%, rgba(255,255,255,.08) 100%),
    rgba(255,255,255,.20);
  border-color:rgba(11,11,10,.12);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.45), 0 16px 40px rgba(11,11,10,.12);
}
html[data-theme="light"] .lang-switch--dropdown .lang-menu a{color:rgba(11,11,10,.78)}
html[data-theme="light"] .lang-switch--dropdown .lang-menu a:hover,
html[data-theme="light"] .lang-switch--dropdown .lang-menu a:focus-visible{
  color:var(--ink);
  background:rgba(11,11,10,.05);
}
html[data-theme="light"] .theme-switch{
  background:rgba(11,11,10,.05);
  border-color:rgba(11,11,10,.08);
}
html[data-theme="light"] .theme-switch button{color:rgba(11,11,10,.72)}
html[data-theme="light"] .theme-switch button:hover,
html[data-theme="light"] .theme-switch button:focus-visible{
  color:var(--ink);
  background:rgba(11,11,10,.06);
}

@media(max-width:600px){
  .chrome-switches{right:.55rem;bottom:.55rem}
  .lang-toggle{min-height:2.1rem}
  .theme-switch button{width:2.1rem;height:2.1rem}
}

/* Keep cookie bar clear of chrome switches */
.cookie-bar{bottom:4.6rem;padding-right:14rem}
@media(max-width:600px){
  .cookie-bar{bottom:5.6rem;padding-right:var(--pad)}
}

/* Liquid glass CTAs — system light */
@media (prefers-color-scheme: light){
  :root:not([data-theme]) .site-head .nav-cta,
  :root:not([data-theme]) body:has(.home-hero) .site-head .nav-cta,
  :root:not([data-theme]) .site-head.past-hero .nav-cta,
  :root:not([data-theme]) .button:not(.ghost):not(.dark){
    color:#111 !important;
    border:1px solid rgba(11,11,10,.14);
    box-shadow:
      0 12px 28px rgba(11,11,10,.12),
      0 2px 8px rgba(255,214,64,.28);
    font-weight:800;
    background:transparent;
  }
  :root:not([data-theme]) .site-head .nav-cta::before,
  :root:not([data-theme]) body:has(.home-hero) .site-head .nav-cta::before,
  :root:not([data-theme]) .site-head.past-hero .nav-cta::before,
  :root:not([data-theme]) .button:not(.ghost):not(.dark)::before{
        background:
      linear-gradient(155deg, rgba(255,255,255,.52) 0%, rgba(255,255,255,.16) 36%, rgba(255,255,255,0) 70%),
      rgba(255,214,64,.78);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.8),
      inset 0 -1px 0 rgba(11,11,10,.06);
    -webkit-backdrop-filter: blur(18px) saturate(175%);
    backdrop-filter: blur(18px) saturate(175%);
    backdrop-filter: none;
  }
}

/* --- Light-mode readable yellow (text only). Brand #ffd640 stays for fills/CTAs. --- */
html[data-theme="light"]{--hi-text:#8a6400}
@media (prefers-color-scheme: light){:root:not([data-theme]){--hi-text:#8a6400}}
html[data-theme="light"] .site-head nav a[aria-current=page],
html[data-theme="light"] .statement em,
html[data-theme="light"] .work-card b,
html[data-theme="light"] .mini-steps b,
html[data-theme="light"] .service-groep .eyebrow,
html[data-theme="light"] .service-no,
html[data-theme="light"] .process-list span,
html[data-theme="light"] .sample-page aside span,
html[data-theme="light"] .reeks-kop span,
html[data-theme="light"] .about-prose a,
html[data-theme="light"] .legal-prose a,
html[data-theme="light"] .cookie-bar a{color:var(--hi-text)}
html[data-theme="light"] .service-groep .eyebrow,
html[data-theme="light"] .service-no,
html[data-theme="light"] .process-list span,
html[data-theme="light"] .mini-steps b,
html[data-theme="light"] .work-card b{font-weight:800}
/* Keep bright yellow where it sits on the dark homepage hero */
html[data-theme="light"] body:has(.home-hero) .site-head:not(.past-hero) nav a[aria-current=page]{color:var(--hi)}

/* 06-10-2026: rasterkolommen niet laten oprekken door lange woorden (NL/DE); lange kop in een kaart mag afbreken. */
.metrics>*,.featured>*,.service-tease>*,.price-grid>*,.calc-output>*{min-width:0}
.service-tease h3,.service-tease p,.price-grid h2,.price-grid p{overflow-wrap:break-word;hyphens:auto}

/* 19-10-2026: rekenhulp als creditbalk (concept A) — rijen links, maandoverzicht met balk van twintig vakjes rechts. */
.calculator>div.rekenhulp{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(2rem,5vw,5rem);align-items:start;margin-top:1rem}.credit-rij{display:grid;grid-template-columns:2.6rem minmax(0,1fr) auto;align-items:center;gap:1.2rem;padding:1.3rem 0;border-bottom:1px solid var(--line)}.credit-rij:first-of-type{border-top:1px solid var(--line)}.credit-rij h3{font-size:1.25rem;line-height:1.2;margin:0 0 .35rem;letter-spacing:.01em}.credit-rij p{margin:0;color:var(--soft);font-size:.92rem;line-height:1.45}.rk-kost{font:700 .64rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--hi-text,var(--hi));white-space:nowrap}.rk-vorm{justify-self:center;display:grid;place-items:center;border-radius:4px}.rk-vorm.beeld{width:2.35rem;height:2.95rem}.rk-vorm.beeld svg{width:100%;height:100%;display:block}.rk-vorm.beeld rect{fill:var(--cream);stroke:rgba(0,0,0,.16);stroke-width:1.5}.rk-vorm.beeld circle{fill:var(--hi)}.rk-vorm.beeld path{fill:#1b1b19;opacity:.8}.rk-vorm.video{width:1.6rem;height:2.6rem;background:var(--hi)}.rk-vorm.v30{height:3rem}.rk-vorm.v45{height:3.4rem}.rk-vorm.video::after{content:'';border-left:7px solid #111;border-top:5px solid transparent;border-bottom:5px solid transparent;margin-left:2px}.calculator .credit-rij .counter{margin:0;width:9.5rem;border-radius:999px;overflow:hidden}.calc-sam{position:sticky;top:7rem;background:var(--panel);border:1px solid var(--line);padding:clamp(1.4rem,3vw,2.4rem)}.calc-sam .eyebrow{margin:0}.calc-groot{display:flex;align-items:baseline;gap:.8rem;margin:.6rem 0 1.4rem}.calc-groot strong{font-size:clamp(4rem,8vw,7rem);line-height:.85;letter-spacing:-.03em;color:var(--ink)}.calc-groot span,.calc-mini span{font:700 .72rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--soft)}.credit-balk{display:grid;grid-template-columns:repeat(20,minmax(0,1fr));margin:0 0 .7rem}.credit-balk i{height:2.6rem;margin-right:3px;border-radius:3px;border:1px dashed color-mix(in srgb,var(--soft) 45%,transparent);display:grid;place-items:center}.credit-balk i.heeft-vervolg{margin-right:0;border-top-right-radius:0;border-bottom-right-radius:0}.credit-balk i.vervolg{border-top-left-radius:0;border-bottom-left-radius:0}.credit-balk i.beeld{background:var(--cream);border:0;box-shadow:inset 0 0 0 1px rgba(0,0,0,.14)}.credit-balk i.video{background:var(--hi);border:0}.credit-balk i.video:not(.vervolg)::after{content:'';border-left:6px solid rgba(17,17,17,.7);border-top:4px solid transparent;border-bottom:4px solid transparent}.balk-legenda{display:flex;justify-content:space-between;gap:1rem;margin:0;font:700 .64rem var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--soft)}.balk-legenda b{color:var(--ink)}.calc-zin{margin:1.6rem 0 .35rem;font-size:1.15rem;line-height:1.45;color:var(--ink)}.calc-herkans{margin:0 0 1.6rem;color:var(--soft)}.calc-herkans b{color:var(--ink)}.calc-proef{margin:1rem 0 0;font-size:.88rem;line-height:1.5;color:var(--soft)}.calc-mini{display:none}@media(max-width:900px){.calculator>div.rekenhulp{grid-template-columns:1fr}.calc-sam{position:static}.calc-mini{display:flex;position:sticky;top:92px;z-index:5;align-items:center;gap:.7rem;padding:.75rem 0;background:var(--bg);border-bottom:1px solid var(--line)}.calc-mini strong{font-size:1.6rem;line-height:1;color:var(--ink)}.calc-mini .credit-balk{flex:1;margin:0}.calc-mini .credit-balk i{height:1.5rem;margin-right:2px}.calc-mini .credit-balk i.heeft-vervolg{margin-right:0}}@media(max-width:600px){.calc-mini{top:76px}.rk-sep{display:none}.rk-kost{display:block;margin-top:.35rem}.credit-rij{grid-template-columns:2rem minmax(0,1fr);row-gap:.9rem}.calculator .credit-rij .counter{grid-column:2;width:100%}.credit-balk i{height:2rem;margin-right:2px}.credit-balk i.heeft-vervolg{margin-right:0}}
/* 30-10-2026: hero-slogan houdt titelopmaak, ook als hij (na de SEO-aanpassing) een <p> is in plaats van <h1>. */
.hero-copy>p.hero-slogan,.hero-copy>h1.hero-slogan{font-size:min(clamp(2.88rem,6.75vw,7.65rem),11.4vw);font-weight:700;line-height:.95;letter-spacing:max(.02em,1.25px);margin:0 0 2rem;max-width:none}
/* 19-10-2026: tweede knop in de rekenhulp — mix doorgeven aan het contactformulier. */
.calc-knoppen{display:flex;flex-wrap:wrap;gap:.7rem;align-items:center}.calc-sam .button.calc-mix{background:transparent;color:var(--ink);border:1px solid color-mix(in srgb,var(--ink) 38%,transparent)}.calc-sam .button.calc-mix:hover,.calc-sam .button.calc-mix:focus-visible{border-color:var(--hi);color:var(--ink)}@media(max-width:600px){.calc-knoppen .button{width:100%;justify-content:center}}
/* 19-10-2026: uitklapblok advertentiebeheer — ingeklapt even hoog als voorheen. */
.service-meer{margin-top:1.4rem;border-top:1px solid var(--line)}.service-meer summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 0;font:700 .72rem/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink)}.service-meer summary::-webkit-details-marker{display:none}.service-meer summary::after{content:'+';font:400 1.4rem/1 var(--sans);color:var(--hi-text,var(--hi));transition:transform .2s ease}.service-meer[open] summary::after{content:'−'}.service-meer summary:hover,.service-meer summary:focus-visible{color:var(--hi-text,var(--hi))}.service-meer>div{padding-bottom:.4rem}.service-meer h3{font:700 .68rem/1.3 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink);margin:1.6rem 0 .6rem}.service-meer p{margin:0 0 .8rem}.service-meer ul{margin:0;padding-left:1.1rem}.service-meer li{margin-bottom:.35rem}.meer-tarieven{margin:0 0 1rem;border-top:1px solid var(--line)}.meer-tarieven p{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:.2rem 1rem;margin:0;padding:.7rem 0;border-bottom:1px solid var(--line)}.meer-tarieven b{color:var(--ink);font-weight:700}.meer-tarieven span{font-variant-numeric:tabular-nums}@media(prefers-reduced-motion:reduce){.service-meer summary::after{transition:none}}
/* 17-10-2026: gele knoppen dekkend geel met subtiele diepte — geen glas/transparantie (alle thema's). */
body .site-head .nav-cta::before,body .button:not(.ghost):not(.dark)::before{background:linear-gradient(180deg,#ffe27a 0%,#ffd640 55%,#f3c52f 100%)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.6),inset 0 -1px 0 rgba(120,85,0,.22),0 2px 6px rgba(0,0,0,.28),0 1px 1px rgba(0,0,0,.18)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
body .site-head .nav-cta:hover::before,body .site-head .nav-cta:focus-visible::before,body .button:not(.ghost):not(.dark):hover::before,body .button:not(.ghost):not(.dark):focus-visible::before{background:linear-gradient(180deg,#ffe892 0%,#ffdc58 55%,#f7cc3a 100%)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.7),inset 0 -1px 0 rgba(120,85,0,.2),0 4px 12px rgba(0,0,0,.3),0 1px 2px rgba(0,0,0,.18)!important}