/* Lettertypes lokaal (geen Google Fonts: privacyvriendelijk) — Jost & Cormorant Garamond, SIL Open Font License */
@font-face{font-family:"Jost";font-style:normal;font-weight:300;font-display:swap;src:url(fonts/jost-latin-300-normal.woff2) format("woff2")}
@font-face{font-family:"Jost";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/jost-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Jost";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/jost-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:300;font-display:swap;src:url(fonts/cormorant-garamond-latin-300-normal.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:300;font-display:swap;src:url(fonts/cormorant-garamond-latin-300-italic.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/cormorant-garamond-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:400;font-display:swap;src:url(fonts/cormorant-garamond-latin-400-italic.woff2) format("woff2")}
/* Layout: filmisch als een parfumcampagne in de woestijn bij nacht — nachtblauw, wijde horizon, ruim gespatieerde kapitalen; één gloeiende horizonlijn en een kleine bronzen Gompy die door de site klimt en springt */
:root{
  --bg:#06080d;        /* woestijnnacht */
  --surface:#0b1019;
  --ink:#e8ebf1;       /* maanlicht */
  --muted:#8790a3;
  --line:#1c2433;
  --bronze:#c48a4f;    /* horizon bij zonsondergang = brons van de Gompy */
  --teal:#3a5bb8;      /* kobalt */
  --on-bronze:#06080d;
  --f-display:"Jost","Futura","Century Gothic",system-ui,sans-serif;
  --f-serif:"Cormorant Garamond",Garamond,Georgia,serif;
  --f-body:"Jost","Futura",system-ui,sans-serif;
  --f-mono:"Jost",system-ui,sans-serif;
  --s-1:.8rem; --s0:1rem; --s1:1.3rem; --s2:1.8rem; --s3:clamp(1.6rem,3.6vw,2.6rem); --s4:clamp(2.2rem,7.6vw,6rem);
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{margin:0}
img{max-width:100%}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:var(--f-body);font-weight:300;font-size:var(--s0);line-height:1.75;-webkit-font-smoothing:antialiased;
  background-image:radial-gradient(ellipse 120% 60% at 50% -10%,rgba(58,91,184,.16),transparent 60%)}
a{color:inherit}
::selection{background:var(--teal);color:var(--ink)}
:focus-visible{outline:2px solid var(--bronze);outline-offset:4px}
.wrap{max-width:1200px;margin-inline:auto;padding-inline:clamp(16px,5vw,56px)}
h1,h2,h3,h4{font-family:var(--f-display);font-weight:300;line-height:1.1;margin:0;text-wrap:balance}
h2{text-transform:uppercase;letter-spacing:.22em}
h3,h4{font-family:var(--f-serif);font-weight:400;letter-spacing:.01em}
p{margin:0}
strong{font-weight:500}
.eyebrow{font-size:var(--s-1);letter-spacing:.42em;text-transform:uppercase;color:var(--muted);display:inline-flex;align-items:center;gap:10px}
.mono{font-size:.76rem;letter-spacing:.1em;color:var(--muted);font-variant-numeric:tabular-nums}

/* Gompy */
.g{display:inline-block;width:14px;height:20px;color:var(--bronze);fill:currentColor;vertical-align:-4px;overflow:visible}
.g.s{width:11px;height:16px}
@keyframes hop{0%{transform:translateY(1px)}30%{transform:translateY(-16px) rotate(-8deg)}55%{transform:translateY(-20px) rotate(6deg)}80%{transform:translateY(0) scaleY(.85)}100%{transform:translateY(1px)}}
@keyframes flip{0%{transform:translateY(0) rotate(0)}40%{transform:translateY(-26px) rotate(-180deg)}75%{transform:translateY(-6px) rotate(-340deg)}100%{transform:translateY(0) rotate(-360deg)}}
.hop{animation:hop .75s cubic-bezier(.3,.7,.3,1)}

/* NAV */
.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:rgba(6,8,13,.82);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:20px}
.logo{display:inline-flex;align-items:center;gap:12px;font-weight:400;font-size:.78rem;letter-spacing:.5em;text-transform:uppercase;text-decoration:none;white-space:nowrap}
.logo span{color:var(--muted)}
.nav ul{display:flex;gap:clamp(16px,2.6vw,36px);list-style:none;margin:0;padding:0;flex-wrap:wrap;justify-content:flex-end}
.nav ul a{text-decoration:none;font-size:var(--s-1);letter-spacing:.3em;text-transform:uppercase;color:var(--muted);transition:color .3s}
.nav ul a:hover{color:var(--ink)}
@media (max-width:760px){.nav ul{display:none}}
.rule{border:0;border-top:1px solid var(--line);margin:0}

/* HERO — campagnebeeld */
.hero{position:relative;overflow:hidden;isolation:isolate;border-bottom:1px solid var(--line)}
.hero-img{position:absolute;inset:0;z-index:-2}
.hero-img img{width:100%;height:100%;object-fit:cover;object-position:60% 40%;filter:grayscale(1) contrast(1.15) brightness(.7)}
.hero-img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,28,70,.55),rgba(6,8,13,.25) 40%,rgba(6,8,13,.92)),linear-gradient(90deg,rgba(6,8,13,.85),transparent 65%);mix-blend-mode:normal}
#maze{position:absolute;inset:0;width:100%;height:100%;opacity:.18;z-index:-1}
.hero .wrap{position:relative;padding-block:clamp(110px,16vw,210px) clamp(72px,9vw,120px)}
.hero .welcome{font-size:var(--s-1);letter-spacing:.42em;text-transform:uppercase;color:var(--muted);margin-bottom:28px}
.hero h1{font-size:var(--s4);font-weight:300;text-transform:uppercase;letter-spacing:.32em;line-height:1.05;margin-right:-.32em}
.hero h1 em{font-style:normal;display:block;color:var(--ink)}
.alias{font-family:var(--f-serif);font-style:italic;font-size:var(--s2);margin-top:20px;color:var(--bronze)}
.alias i{font-style:italic}
.tagline{font-family:var(--f-serif);font-style:italic;font-size:var(--s1);color:var(--ink);opacity:.85;margin-top:30px;max-width:30ch}
.btns{display:flex;gap:32px;flex-wrap:wrap;align-items:center;margin-top:44px}
.btn{display:inline-flex;align-items:center;gap:12px;padding:15px 30px;border:1px solid var(--ink);text-decoration:none;font-family:var(--f-body);font-weight:400;font-size:var(--s-1);letter-spacing:.32em;text-transform:uppercase;color:var(--ink);background:transparent;cursor:pointer;transition:background .35s,color .35s}
.btn:hover{background:var(--ink);color:var(--bg)}
.btn.primary{background:var(--ink);color:var(--bg)}
.btn.primary:hover{background:transparent;color:var(--ink)}
.btns .btn:not(.primary){border:0;padding:15px 0;border-bottom:1px solid var(--muted)}
.btns .btn:not(.primary):hover{background:transparent;border-color:var(--bronze);color:var(--bronze)}
.horizon{position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,var(--bronze) 30%,#f0b878 50%,var(--bronze) 70%,transparent);box-shadow:0 0 24px 2px rgba(196,138,79,.45)}
.hero-g{position:absolute;bottom:0;left:62%;width:13px;height:19px}
.hero-meta{position:absolute;right:clamp(16px,5vw,56px);bottom:22px;text-align:right;max-width:46ch}
@media (max-width:760px){.hero-meta{position:static;padding:0 16px 24px;text-align:left}}

/* SECTIONS */
section{padding-block:clamp(96px,12vw,160px)}
.sec-head{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px 64px;align-items:end;margin-bottom:clamp(48px,6vw,80px);padding-bottom:30px;border-bottom:1px solid var(--line)}
.sec-head h2{font-size:var(--s3);margin-top:16px;margin-right:-.22em}
.sec-head p{color:var(--muted);max-width:50ch}
.sec-head > .g{position:absolute;right:6%;bottom:0;transform:translateY(1px);cursor:pointer}
@media (max-width:760px){.sec-head{grid-template-columns:1fr}}

/* PORTALS */
.portals{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,3vw,40px)}
.portal{position:relative;display:block;text-decoration:none;aspect-ratio:4/5;overflow:hidden;background:var(--surface)}
.portal .cap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:34px;background:linear-gradient(transparent,rgba(6,8,13,.9));display:grid;gap:10px}
.portal h3{font-family:var(--f-display);font-weight:300;font-size:1.3rem;text-transform:uppercase;letter-spacing:.3em}
.portal .cap span{font-size:var(--s-1);letter-spacing:.3em;text-transform:uppercase;color:var(--bronze)}
@media (max-width:700px){.portals{grid-template-columns:1fr}.portal{aspect-ratio:4/3}}

/* MEDIA — filmische koele grading, kleur bij hover */
.media{position:relative;overflow:hidden;background:var(--surface)}
.media canvas,.media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.media img{filter:saturate(.45) contrast(1.08) brightness(.88);transition:transform 1.6s cubic-bezier(.2,.6,.2,1),filter .9s}
.media::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;background:linear-gradient(180deg,rgba(30,50,110,.22),rgba(6,8,13,.2));transition:opacity .9s}
a:hover .media img,.work:hover .media img,.case:hover .media img,.comm article:hover .media img{transform:scale(1.03);filter:none}
a:hover .media::after,.work:hover .media::after,.case:hover .media::after,.comm article:hover .media::after{opacity:0}
.portal .media{position:absolute;inset:0}

/* THEMES */
.themes{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(250px,100%),1fr));gap:0 48px}
.themes a{display:flex;justify-content:space-between;gap:12px;text-decoration:none;padding:17px 0;border-bottom:1px solid var(--line);font-size:.78rem;letter-spacing:.26em;text-transform:uppercase;transition:color .3s,padding .3s}
.themes a::after{content:"→";color:var(--muted)}
.themes a:hover{color:var(--bronze);padding-left:6px}

/* WORKS */
.tabs{display:flex;gap:32px;flex-wrap:wrap;margin-bottom:48px;border-bottom:1px solid var(--line)}
.tabs button{font-family:var(--f-body);font-weight:400;font-size:var(--s-1);letter-spacing:.28em;text-transform:uppercase;padding:0 0 15px;border:0;border-bottom:1px solid transparent;margin-bottom:-1px;background:transparent;color:var(--muted);cursor:pointer}
.tabs button[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--bronze)}
.series-intro{max-width:62ch;color:var(--muted);margin-bottom:44px}
.series-intro strong{color:var(--ink)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(230px,100%),1fr));gap:60px 32px}
.work{position:relative;display:grid;gap:14px;align-content:start}
.work .media{aspect-ratio:1/1}
.work.round .media{border-radius:50%}
.work.tall .media{aspect-ratio:3/4}
.work h4{font-size:1.35rem}
.work .mono{margin-top:-8px}
.work .peek{position:absolute;top:0;right:12px;width:11px;height:16px;transform:translateY(4px);opacity:0;transition:transform .7s cubic-bezier(.3,1.4,.4,1),opacity .3s;z-index:3}
.work:hover .peek{opacity:1;transform:translateY(-17px)}
.more{margin-top:48px;color:var(--muted)}
.more a{color:var(--ink);text-decoration-color:var(--bronze);text-underline-offset:5px}

/* GOMPY */
.gompy{background:linear-gradient(180deg,var(--surface),var(--bg));border-block:1px solid var(--line)}
.gompy .wrap{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(40px,7vw,96px);align-items:center}
.gompy figure{margin:0}
.gompy figure .media{aspect-ratio:373/536}
.gompy figcaption{margin-top:14px}
.gompy h2{font-size:var(--s3);margin:16px -.22em 28px 0}
.gompy p{color:var(--muted)}
.gompy p+p{margin-top:16px}
.gompy .sig{font-family:var(--f-serif);font-style:italic;font-size:var(--s1);margin-top:28px;color:var(--ink)}
.pull{font-family:var(--f-serif);font-style:italic;font-size:var(--s2);line-height:1.25;color:var(--ink)!important;margin-top:40px;padding-top:30px;border-top:1px solid var(--line)}
@media (max-width:760px){.gompy .wrap{grid-template-columns:1fr}}

/* PERSONAL */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(170px,100%),1fr));gap:36px 32px}
.steps li{display:grid;gap:10px;align-content:start;padding-top:18px;border-top:1px solid var(--line);color:var(--muted)}
.steps b{font-family:var(--f-serif);font-weight:300;font-style:italic;color:var(--bronze);font-size:1.6rem;line-height:1}
.cases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin-top:80px}
.case{display:grid;gap:12px;align-content:start}
.case .media{aspect-ratio:4/5}
.case h4{font-size:1.5rem;margin-top:4px}
.case p{color:var(--muted)}
@media (max-width:860px){.cases{grid-template-columns:1fr}.case .media{aspect-ratio:4/3}}

/* COMMISSIONS */
.comm{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:60px 32px}
.comm article{display:grid;gap:10px;align-content:start;min-width:0}
.comm .media{aspect-ratio:4/3}
.comm h3{font-size:1.5rem}
.comm p{color:var(--muted)}
.comm a{color:var(--ink);text-decoration-color:var(--bronze);text-underline-offset:4px}
.tag{font-size:var(--s-1);letter-spacing:.28em;text-transform:uppercase;color:var(--bronze);margin-top:8px}
@media (max-width:900px){.comm{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.comm{grid-template-columns:1fr}}

/* BIO */
.bio{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(40px,7vw,96px)}
.bio .portrait .media{aspect-ratio:4/3}
.bio .portrait figcaption{margin-top:14px}
.bio-text{max-width:64ch;display:grid;gap:18px;color:var(--muted)}
.bio-text h2{color:var(--ink);margin-top:-4px;margin-right:-.22em}
.bio-text .lead{font-family:var(--f-serif);font-size:var(--s2);line-height:1.35;color:var(--ink);font-weight:300}
.facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;margin-top:24px;padding-top:32px;border-top:1px solid var(--line)}
.facts h4{font-family:var(--f-body);font-weight:400;font-size:var(--s-1);letter-spacing:.32em;text-transform:uppercase;color:var(--bronze);margin-bottom:10px}
.facts p{color:var(--ink)}
.press{display:flex;flex-direction:column;gap:8px}
.press a{color:var(--ink);text-decoration-color:var(--line);text-underline-offset:4px}
.press a:hover{text-decoration-color:var(--bronze)}
@media (max-width:820px){.bio{grid-template-columns:1fr}.facts{grid-template-columns:1fr}}

/* EXPO'S */
.timeline{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:64px}
.timeline li{display:grid;grid-template-columns:4.5rem minmax(0,1fr);gap:20px;padding:18px 0;border-bottom:1px solid var(--line)}
.timeline .y{font-size:.85rem;letter-spacing:.2em;color:var(--bronze);padding-top:3px}
.timeline .d{color:var(--muted);font-size:.9rem;display:block}
@media (max-width:760px){.timeline{grid-template-columns:1fr}}

/* CONTACT */
.contact{background:radial-gradient(ellipse 90% 70% at 50% 120%,rgba(58,91,184,.22),transparent 60%),var(--surface);border-top:1px solid var(--line)}
.contact .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,7vw,96px)}
.contact h2{font-size:var(--s3);margin:16px -.22em 24px 0}
.contact p.sub{color:var(--muted);max-width:46ch}
.card-lines{display:grid;margin-top:40px}
.card-lines div{display:grid;grid-template-columns:7rem minmax(0,1fr);gap:12px;align-items:baseline;border-top:1px solid var(--line);padding:16px 0}
.card-lines span:first-child{font-size:var(--s-1);letter-spacing:.3em;text-transform:uppercase;color:var(--muted)}
.copy{font-family:var(--f-body);font-size:.6rem;letter-spacing:.22em;text-transform:uppercase;margin-left:12px;padding:3px 8px;border:1px solid var(--line);background:transparent;color:var(--muted);cursor:pointer}
.copy:hover{color:var(--ink);border-color:var(--bronze)}
.socials{display:flex;gap:28px;flex-wrap:wrap;margin-top:32px}
.socials a{text-decoration:none;font-size:var(--s-1);letter-spacing:.28em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--line);padding-bottom:4px}
.socials a:hover{color:var(--ink);border-color:var(--bronze)}
form{display:grid;gap:22px}
label{font-size:var(--s-1);letter-spacing:.3em;text-transform:uppercase;color:var(--muted);display:grid;gap:4px}
input,textarea{font-family:var(--f-body);font-weight:300;font-size:1.05rem;letter-spacing:0;text-transform:none;padding:10px 0;background:transparent;border:0;border-bottom:1px solid var(--line);color:var(--ink);width:100%;border-radius:0}
input::placeholder,textarea::placeholder{color:#8790a3}
textarea{min-height:120px;resize:vertical}
input:focus,textarea:focus{outline:none;border-bottom-color:var(--bronze)}
form .btn{justify-self:start;margin-top:8px}
.form-note{font-family:var(--f-serif);font-style:italic;font-size:1.15rem;color:var(--ink);min-height:1.5em;display:flex;gap:8px;align-items:center}
.news{margin-top:56px;padding-top:36px;border-top:1px solid var(--line)}
.news h3{font-size:var(--s2);margin-bottom:6px}
.news p{color:var(--muted)}
.news form{grid-template-columns:minmax(0,1fr) auto;align-items:end;margin-top:18px}
.news small{display:block;color:var(--muted);margin-top:12px;font-size:.82rem}
@media (max-width:820px){.contact .wrap{grid-template-columns:1fr}}
@media (max-width:460px){.news form{grid-template-columns:1fr}}

footer{position:relative;padding-block:36px;border-top:1px solid var(--line);overflow:hidden}
footer .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:var(--s-1);letter-spacing:.26em;text-transform:uppercase;color:var(--muted)}
footer a{color:var(--muted);text-decoration:none}
footer a:hover{color:var(--ink)}
.walker{position:absolute;top:-15px;left:0;width:11px;height:16px;}
.walker svg{width:100%;height:100%;animation:bob .5s ease-in-out infinite alternate}
@keyframes walk{0%{transform:translateX(-20px)}48%{transform:translateX(48vw)}50%{transform:translateX(48vw) translateY(-14px)}52%{transform:translateX(48vw)}100%{transform:translateX(calc(100vw + 20px))}}
@keyframes bob{from{transform:translateY(0)}to{transform:translateY(-1.5px)}}

/* KLIMRAIL — Gompy klimt mee terwijl je scrollt */
.rail{position:fixed;right:max(6px,env(safe-area-inset-right,0px));top:calc(env(safe-area-inset-top,0px) + 96px);bottom:calc(env(safe-area-inset-bottom,0px) + 40px);width:1px;background:linear-gradient(transparent,var(--line) 8%,var(--line) 92%,transparent);z-index:25;pointer-events:none}
.climber{position:absolute;left:-7px;top:0;width:15px;height:22px;padding:0;border:0;background:none;cursor:pointer;pointer-events:auto;will-change:transform}
.climber svg{width:15px;height:22px;display:block}
.climber.flip svg{animation:flip .9s cubic-bezier(.3,.7,.3,1)}
.climber .tip{position:absolute;right:22px;top:2px;white-space:nowrap;font-size:.6rem;letter-spacing:.28em;text-transform:uppercase;color:var(--muted);opacity:0;transition:opacity .3s}
.climber:hover .tip,.climber:focus-visible .tip{opacity:1}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.media img,.work .peek{transition:none}.walker{animation:none;left:auto;right:8%}.walker svg,.hop,.climber.flip svg{animation:none}}

/* ===== Meerdere pagina's ===== */
.skip{position:absolute;left:-9999px;top:8px;z-index:99;background:var(--ink);color:var(--bg);padding:8px 14px}
.skip:focus{left:8px}
.nav ul a[aria-current="page"]{color:var(--ink);border-bottom:1px solid var(--bronze);padding-bottom:4px}
.menu-btn{display:none;background:none;border:1px solid var(--line);color:var(--ink);font:inherit;font-size:var(--s-1);letter-spacing:.3em;text-transform:uppercase;padding:9px 14px;cursor:pointer}
@media (max-width:900px){
  .nav ul{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;gap:0;background:var(--bg);border-bottom:1px solid var(--line);padding:8px clamp(16px,5vw,56px) 20px}
  .nav ul.open{display:flex}
  .nav ul li a{display:block;padding:14px 0;border-bottom:1px solid var(--line)}
  .nav ul a[aria-current="page"]{border-bottom-color:var(--line);color:var(--bronze)}
  .menu-btn{display:inline-block}
  .nav .wrap{position:relative}
}
@media (min-width:901px){.nav ul{display:flex!important}}

/* Gompy-vector */
.gv{display:inline-block;color:var(--bronze);fill:currentColor;width:16px;height:17px;vertical-align:-3px;overflow:visible}
.gv.white{color:var(--ink)}
.logo .gv{width:15px;height:16px}
.sec-head > .gv{position:absolute;right:6%;bottom:0;width:18px;height:19px;cursor:pointer;transform-origin:50% 100%}
.hero-g{width:18px;height:19px;bottom:1px;left:62%;position:absolute}
.work .peek{width:15px;height:16px}

/* Hero slideshow */
.slides{position:absolute;inset:0;z-index:-2}
.slides figure{position:absolute;inset:0;margin:0;opacity:0;transition:opacity 1.8s ease}
.slides figure.on{opacity:1}
.slides img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.15) brightness(.62)}
.slides figure.on img{animation:kb 9s ease-out forwards}
@keyframes kb{from{transform:scale(1.08) translateX(1%)}to{transform:scale(1) translateX(0)}}
.slides::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,28,70,.55),rgba(6,8,13,.2) 40%,rgba(6,8,13,.94)),linear-gradient(90deg,rgba(6,8,13,.85),transparent 70%)}
.slide-dots{position:absolute;left:clamp(16px,5vw,56px);bottom:24px;display:flex;gap:10px;z-index:2}
.slide-dots button{width:26px;height:2px;border:0;padding:0;background:var(--line);cursor:pointer}
.slide-dots button[aria-current="true"]{background:var(--bronze)}
.slide-cap{position:absolute;left:clamp(16px,5vw,56px);bottom:40px;z-index:2}
@media (max-width:760px){.slide-cap{display:none}}

/* Paginakop (subpagina's) */
.page-hero{position:relative;border-bottom:1px solid var(--line);padding-block:clamp(72px,10vw,128px) clamp(48px,6vw,72px);background:radial-gradient(ellipse 70% 90% at 80% 0%,rgba(58,91,184,.18),transparent 60%)}
.page-hero h1{font-size:clamp(1.9rem,5.4vw,4rem);text-transform:uppercase;letter-spacing:.24em;margin:18px -.24em 22px 0;line-height:1.1}
.page-hero p.lead{font-family:var(--f-serif);font-size:var(--s1);color:var(--muted);max-width:56ch}
.page-hero .horizon{bottom:-1px}
.crumbs{font-size:var(--s-1);letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.crumbs a{color:var(--muted);text-decoration:none}
.crumbs a:hover{color:var(--ink)}

/* Doelgroepen */
.aud{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.aud a{background:var(--bg);padding:clamp(24px,3vw,36px);text-decoration:none;display:grid;gap:12px;align-content:start;min-height:220px;transition:background .4s}
.aud a:hover{background:var(--surface)}
.aud h3{font-family:var(--f-display);font-weight:300;text-transform:uppercase;letter-spacing:.2em;font-size:1rem}
.aud p{color:var(--muted);font-size:.95rem}
.aud span{margin-top:auto;font-size:var(--s-1);letter-spacing:.28em;text-transform:uppercase;color:var(--bronze)}
@media (max-width:900px){.aud{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.aud{grid-template-columns:1fr}.aud a{min-height:0}}

/* Split blok */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(36px,6vw,88px);align-items:center}
.split .media{aspect-ratio:4/5}
.split.rev > :first-child{order:2}
.split h2{font-size:var(--s3);margin:14px -.22em 24px 0}
.split p{color:var(--muted)}
.split p + p{margin-top:14px}
.split ul{color:var(--muted);padding-left:1.1em;margin:18px 0 0}
.split li{margin:6px 0}
@media (max-width:820px){.split{grid-template-columns:1fr}.split.rev > :first-child{order:0}.split .media{aspect-ratio:4/3}}

/* FAQ */
.faq{max-width:820px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:22px 40px 22px 0;position:relative;font-family:var(--f-serif);font-size:1.35rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:20px;color:var(--bronze);font-family:var(--f-body);font-size:1.3rem;transition:transform .3s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{color:var(--muted);padding:0 0 24px;max-width:66ch}

/* CTA-band */
.cta-band{border-block:1px solid var(--line);text-align:center;padding-block:clamp(72px,9vw,120px)}
.cta-band h2{font-size:var(--s3);margin:16px -.22em 20px 0}
.cta-band p{color:var(--muted);max-width:52ch;margin-inline:auto}
.cta-band .btns{justify-content:center}

/* Juridische pagina's */
.legal{max-width:760px}
.legal h2{font-size:1.05rem;letter-spacing:.24em;margin:48px -.24em 14px 0}
.legal h3{font-size:1.25rem;margin:26px 0 8px}
.legal p,.legal li{color:var(--muted)}
.legal p + p{margin-top:12px}
.legal ul{padding-left:1.2em}
.legal li{margin:6px 0}
.legal strong{color:var(--ink)}
.legal a{color:var(--ink);text-decoration-color:var(--bronze);text-underline-offset:4px}
.legal .meta{font-size:var(--s-1);letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-bottom:28px}
.legal table{width:100%;border-collapse:collapse;font-size:.92rem;margin-top:12px}
.legal th,.legal td{text-align:left;padding:10px 12px 10px 0;border-bottom:1px solid var(--line);vertical-align:top;color:var(--muted)}
.legal th{color:var(--ink);font-weight:400;font-size:var(--s-1);letter-spacing:.18em;text-transform:uppercase}
.tablewrap{overflow-x:auto}
.todo{border:1px dashed var(--bronze);color:var(--ink)!important;padding:2px 6px}

/* Footer uitgebreid */
.foot-grid{display:grid;grid-template-columns:1.4fr repeat(3,minmax(0,1fr));gap:32px;padding-bottom:28px;margin-bottom:22px;border-bottom:1px solid var(--line)}
.foot-grid h4{font-family:var(--f-body);font-weight:400;font-size:var(--s-1);letter-spacing:.3em;text-transform:uppercase;color:var(--ink);margin-bottom:12px}
.foot-grid ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.foot-grid a,.foot-grid p{font-size:.88rem;letter-spacing:.04em;text-transform:none;color:var(--muted)}
.linkbtn{background:none;border:0;padding:0;font:inherit;font-size:.88rem;color:var(--muted);cursor:pointer;text-align:left}
.linkbtn:hover{color:var(--ink)}
@media (max-width:820px){.foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.foot-grid{grid-template-columns:1fr}}

/* Cookiebanner */
.cookie{position:fixed;left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:60;max-width:560px;background:var(--surface);border:1px solid var(--line);box-shadow:0 20px 50px rgba(0,0,0,.6);padding:22px}
.cookie h2{font-size:.85rem;letter-spacing:.28em;margin-bottom:10px;display:flex;gap:10px;align-items:center}
.cookie p{color:var(--muted);font-size:.9rem}
.cookie p a{color:var(--ink)}
.cookie .row{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.cookie .row .btn{padding:11px 16px;flex:1 1 140px;justify-content:center}
.cookie .opts{display:grid;gap:10px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.cookie .opts label{display:flex;gap:10px;align-items:flex-start;text-transform:none;letter-spacing:0;font-size:.9rem;color:var(--ink)}
.cookie .opts input{width:auto;margin-top:5px;accent-color:var(--bronze)}
.cookie .opts small{display:block;color:var(--muted)}

/* Formulier-privacy */
.form-privacy{font-size:.85rem;color:var(--muted)}
.form-privacy a{color:var(--ink)}

/* Gompy-loper */
.runner{position:fixed;bottom:calc(env(safe-area-inset-bottom,0px) + 6px);left:0;z-index:24;width:20px;height:21px;pointer-events:none;opacity:0}
.runner.go{animation:run 16s linear forwards}
.runner .gv{width:20px;height:21px;animation:stride .32s ease-in-out infinite alternate}
@keyframes run{0%{opacity:1;transform:translateX(-30px)}100%{opacity:1;transform:translateX(calc(100vw + 30px))}}
@keyframes stride{from{transform:translateY(0) rotate(-3deg)}to{transform:translateY(-4px) rotate(3deg)}}
.runner .gv.leap{animation:leap .7s cubic-bezier(.3,.7,.3,1)}
@keyframes leap{0%{transform:translateY(0)}50%{transform:translateY(-34px) rotate(-14deg)}100%{transform:translateY(0)}}
.climber svg{width:18px;height:19px}
.climber{width:18px;height:19px;left:-9px}
.climber.step svg{transform:scaleX(-1)}
@media (prefers-reduced-motion:reduce){.runner{display:none}.slides figure.on img{animation:none}.slides figure{transition:none}}
@media (max-width:560px){
  .hero h1{font-size:clamp(1.9rem,10vw,2.6rem);letter-spacing:.16em;margin-right:-.16em}
  .page-hero h1{letter-spacing:.14em;margin-right:-.14em}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 16px}
  .work h3{font-size:1.1rem!important}
}

/* ===== Afwerking 29/10: mobiel ===== */
html,body{overflow-x:clip}
.rail{right:max(14px,env(safe-area-inset-right,0px))}
.tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
.card-lines span{overflow-wrap:anywhere}
@media (max-width:560px){h2{letter-spacing:.12em}.sec-head h2,.bio-text h2{margin-right:0}}

/* ===== Foto's 29/10: kunstwerken altijd in originele kleur, sfeerfoto's kleuren open bij scrollen ===== */
.media img{filter:none!important}
.media::after{display:none}
a:hover .media img,.work:hover .media img,.case:hover .media img,.comm article:hover .media img{filter:none}
.media.reveal img{filter:grayscale(1) brightness(.9)!important;transition:filter 1.6s ease,transform 1.6s cubic-bezier(.2,.6,.2,1)}
.media.reveal.in img{filter:none!important}
.hero-img img{filter:grayscale(1) brightness(.8);transition:filter 2.4s ease .3s}
.hero-img.in img{filter:brightness(.92)}
.hero-img::after{background:linear-gradient(180deg,rgba(6,8,13,.35),rgba(6,8,13,.1) 40%,rgba(6,8,13,.85)),linear-gradient(90deg,rgba(6,8,13,.75),transparent 60%)}
@media (prefers-reduced-motion:reduce){.media.reveal img,.hero-img img{transition:none}}
/* hero-slides: elke foto kleurt open zodra ze in beeld komt */
.slides img{filter:grayscale(1) brightness(.75);transition:filter 2.6s ease .4s}
.slides figure.on img{filter:brightness(.9)}
.slides::after{background:linear-gradient(180deg,rgba(6,8,13,.35),rgba(6,8,13,.08) 40%,rgba(6,8,13,.88)),linear-gradient(90deg,rgba(6,8,13,.8),transparent 62%)}
@media (prefers-reduced-motion:reduce){.slides img{transition:none}}

/* ===== Specialistronde 29/10 ===== */
/* leesbaarheid: kleine kapitalen iets groter, minder spatiëring */
.nav ul a,.btn,.eyebrow,.tabs button,label,.socials a,footer .wrap,.themes a,.facts h4,.tag{letter-spacing:.2em}
.copy{font-size:.75rem;min-height:28px;padding:5px 10px}
.climber .tip{font-size:.75rem}
input,textarea,select{border-bottom-color:#4a5468}
select{font-family:var(--f-body);font-weight:300;font-size:1.05rem;letter-spacing:0;text-transform:none;padding:10px 0;background:transparent;border:0;border-bottom:1px solid #4a5468;color:var(--ink);width:100%;border-radius:0}
select option{background:var(--surface);color:var(--ink)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.ev-only{display:grid;gap:22px}.ev-only[hidden]{display:none}
@media (max-width:460px){.row2{grid-template-columns:1fr}}
/* kunstwerken: echte kleur, een zachte schaduw in plaats van een tint */
.work .media,.case .media{box-shadow:0 18px 40px -18px rgba(0,0,0,.8)}
/* sfeerfoto's starten licht gedempt en kleuren open */
.media.reveal img{filter:saturate(.35) brightness(.82)!important}
/* hero: slideshow pauzeknop */
.slide-pause{position:absolute;left:calc(clamp(16px,5vw,56px) + 120px);bottom:14px;z-index:3;background:none;border:0;color:var(--muted);font:inherit;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;cursor:pointer;padding:6px 4px;min-height:24px}
.slide-pause:hover{color:var(--ink)}
/* cookiebanner op desktop compacter, rechtsonder */
@media (min-width:900px){.cookie{left:auto;right:24px;max-width:420px;padding:18px 20px}.cookie p{font-size:.85rem}}

/* ---- Gompy 2.0 ---- */
.hero-g{transform-origin:50% 100%;z-index:2}
footer .walker{left:0;opacity:0}
footer .walker.go{opacity:1;animation:walk 14s linear 1 forwards}
@keyframes walk{0%{transform:translateX(-20px)}45%{transform:translateX(46vw)}50%{transform:translateX(48vw) translateY(-14px)}55%{transform:translateX(50vw)}100%{transform:translateX(calc(100vw + 20px))}}
.runner .gv{animation:none}.runner.go .gv{animation:stride .32s ease-in-out infinite alternate}
.tabs{position:relative}
.tab-g{position:absolute;left:0;bottom:-1px;width:16px;height:17px;transition:transform .45s cubic-bezier(.3,.7,.3,1);pointer-events:none}
.tab-g .gv{width:16px;height:17px;display:block;transform:translateY(-100%)}
.tab-g.step .gv{transform:translateY(-100%) scaleX(-1)}
.tabs button[aria-selected="true"]{border-bottom-color:transparent;box-shadow:inset 0 -1px 0 var(--bronze)}
.steps li{position:relative}
.step-g{position:absolute;right:0;top:-10px;width:14px;height:15px}
.step-g .gv{width:14px;height:15px;display:block}
.paint-line{position:absolute;left:0;right:0;bottom:-1px;height:2px;pointer-events:none}
.paint-line i{position:absolute;left:0;top:0;height:2px;width:100%;background:linear-gradient(90deg,var(--bronze),#f0b878);transform:scaleX(0);transform-origin:left;box-shadow:0 0 12px rgba(196,138,79,.5)}
.paint-line .gv{position:absolute;left:0;bottom:2px;width:16px;height:17px;opacity:0}
.paint-line.go i{animation:paint 1.8s cubic-bezier(.5,.1,.3,1) forwards}
.paint-line.go .gv{animation:painter 1.8s cubic-bezier(.5,.1,.3,1) forwards}
.paint-line.done i{transform:none}
@keyframes paint{to{transform:scaleX(1)}}
@keyframes painter{0%{opacity:1;left:0}92%{opacity:1;left:calc(100% - 16px)}100%{opacity:1;left:calc(100% - 16px)}}
.abseil{position:absolute;left:max(10px,calc((100vw - 1200px)/2 - 34px));width:16px;pointer-events:none;z-index:1}
main{position:relative}
.abseil .rope{position:absolute;left:7px;top:0;width:1px;background:linear-gradient(var(--bronze),rgba(196,138,79,.4))}
.abseil .who{position:absolute;left:0;top:0;width:16px;height:17px;display:block}
.abseil .who .gv{width:16px;height:17px;display:block}
@media (max-width:1279px){.abseil{display:none}}
.egg{position:relative;display:inline-block;vertical-align:baseline;margin-left:.35em;width:24px;height:24px;padding:6px;border:0;background:none;cursor:pointer;opacity:.55;transition:opacity .3s}
.egg .gv{width:10px;height:11px;display:block;margin:0 auto}
.egg:hover,.egg:focus-visible{opacity:1}
.egg.found{opacity:1}
.g-toast{position:fixed;left:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:70;max-width:360px;margin:0;padding:14px 18px;background:var(--surface);border:1px solid var(--line);border-left:2px solid var(--bronze);color:var(--ink);font-size:.9rem;display:flex;gap:10px;align-items:center;transform:translateY(140%);opacity:0;transition:transform .5s cubic-bezier(.3,.7,.3,1),opacity .4s}
.g-toast.on{transform:none;opacity:1}
.g-toast .gv{width:16px;height:17px;flex:none}
.deliver{display:inline-flex;align-items:flex-end;gap:2px;color:var(--bronze);margin-bottom:6px}
.deliver .gv{width:18px;height:19px}.deliver .env{width:14px;height:10px;margin-bottom:9px}
.linkbtn.motion-toggle[aria-pressed="true"]{color:var(--bronze)}
/* sticky mobiele balk op events en muurschilderingen */
.mbar{display:none}
@media (max-width:760px){
  .mbar{display:grid;grid-template-columns:1fr 1fr;position:fixed;left:0;right:0;bottom:0;z-index:40;background:rgba(6,8,13,.94);backdrop-filter:blur(10px);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom,0px)}
  .mbar a{display:flex;align-items:center;justify-content:center;min-height:52px;text-decoration:none;font-size:.78rem;letter-spacing:.2em;text-transform:uppercase}
  .mbar a:first-child{background:var(--ink);color:var(--bg)}
  body:has(.mbar) footer{padding-bottom:80px}
  body:has(.mbar) .runner{bottom:62px}
}
/* projectenlijst muurschilderingen */
.projects{list-style:none;margin:0;padding:0;display:grid;gap:0}
.projects li{display:grid;grid-template-columns:4.5rem minmax(0,1fr);gap:20px;padding:24px 0;border-bottom:1px solid var(--line)}
.projects .y{color:var(--bronze);letter-spacing:.2em;font-size:.85rem;padding-top:4px}
.projects h3{font-size:1.4rem;margin-bottom:6px}
.projects p{color:var(--muted)}
.projects a{color:var(--ink);text-decoration-color:var(--bronze);text-underline-offset:4px}
/* 404 */
.lost{min-height:70vh;display:grid;place-items:center;text-align:center;position:relative;overflow:hidden}
.lost #maze{opacity:.22}
.lost .gv.big{width:46px;height:48px;color:var(--bronze);fill:currentColor;transform:scaleX(-1)}
.lost h1{font-size:var(--s3);text-transform:uppercase;letter-spacing:.22em;margin:22px 0 14px}
.lost p{color:var(--muted);max-width:42ch;margin:0 auto}
.lost .btns{justify-content:center}

/* beweging uit: alles stil */
html[data-motion="off"] *,html[data-motion="off"] *::before,html[data-motion="off"] *::after{animation:none!important;transition:none!important}
html[data-motion="off"] .runner,html[data-motion="off"] footer .walker{display:none}
@media (prefers-reduced-motion:reduce){.runner,footer .walker{display:none}.tab-g{transition:none}.paint-line i{transform:none}}
.sec-head > .gv{cursor:default}
.tab-g,.tab-g .gv{width:13px;height:14px}
.sec-head:has(.paint-line) > .gv{display:none}
.hero-g{width:17px!important;height:18px!important}
body:has(.mbar) .g-toast{bottom:calc(70px + env(safe-area-inset-bottom,0px))}
@media (max-width:760px){body:has(.mbar) .cookie{bottom:calc(70px + env(safe-area-inset-bottom,0px))}}
.lead .egg,.pull .egg,h2 .egg,h3 .egg{vertical-align:middle}

/* ===== Gompy 3.0 — de reiziger ===== */
footer{overflow:visible}
.sec-head > .gv{display:none}
.g-journey{position:absolute;left:0;top:0;width:0;height:0;z-index:6;pointer-events:none}
.g-trav{position:absolute;left:0;top:0;width:17px;height:18px;will-change:transform;transition:opacity .4s}
.g-trav .gv{width:17px;height:18px;display:block;transform-origin:50% 100%;filter:drop-shadow(0 0 6px rgba(196,138,79,.35))}
.g-trav.wait{opacity:0}
.g-trav.walking .gv{animation:gstep .28s ease-in-out infinite alternate}
.g-trav.dropping .gv{animation:gsway 1.2s ease-in-out infinite alternate}
@keyframes gstep{from{margin-top:0}to{margin-top:-3px}}
@keyframes gsway{from{rotate:-6deg}to{rotate:6deg}}
.g-journey.sm .g-trav,.g-journey.sm .g-trav .gv{width:13px;height:14px}
.g-rope{position:absolute;width:1px;background:linear-gradient(rgba(196,138,79,.15),var(--bronze));display:none}
.g-trail{position:absolute;height:2px;transform:scaleX(0);background:linear-gradient(90deg,var(--bronze),#f0b878,var(--bronze));box-shadow:0 0 10px rgba(196,138,79,.45);transition:transform .15s linear}
.g-burst{position:fixed;z-index:90;pointer-events:none;color:var(--bronze)}
.g-burst .gv{width:100%;height:100%;display:block;filter:drop-shadow(0 2px 6px rgba(0,0,0,.5))}
.nav .logo .gv{width:20px!important;height:21px!important;overflow:visible;transition:transform .3s}
.nav .logo{padding-top:4px}
.g-cameo{position:fixed;right:28px;bottom:84px;z-index:55;width:clamp(90px,11vw,150px);height:auto;aspect-ratio:96.3/101.5;pointer-events:none;opacity:0}
.g-cameo.on{opacity:1}
.g-cameo .gv{width:100%;height:100%;display:block;filter:drop-shadow(0 18px 28px rgba(0,0,0,.6)) drop-shadow(0 0 22px rgba(196,138,79,.35))}
.g-foot{position:absolute;right:clamp(16px,6vw,80px);bottom:100%;width:clamp(56px,6vw,84px);aspect-ratio:96.3/101.5;transform:translateY(40%) scale(.3);opacity:0;transform-origin:50% 100%;transition:transform 1.1s cubic-bezier(.2,1.4,.4,1),opacity .5s;cursor:pointer;z-index:3}
.g-foot.up{transform:none;opacity:1}
.g-foot .gv{width:100%;height:100%;display:block;filter:drop-shadow(0 0 18px rgba(196,138,79,.35))}
.g-up{position:fixed;right:max(16px,env(safe-area-inset-right,0px));bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:45;width:44px;height:44px;border:1px solid var(--line);border-radius:50%;background:rgba(11,16,25,.85);backdrop-filter:blur(6px);display:grid;place-items:center;cursor:pointer;opacity:0;transform:translateY(20px);transition:opacity .4s,transform .4s,border-color .3s;pointer-events:none}
.g-up.on{opacity:1;transform:none;pointer-events:auto}
.g-up:hover{border-color:var(--bronze)}
.g-up .gv{width:20px;height:21px;overflow:visible}
.g-up .tip{position:absolute;right:52px;white-space:nowrap;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);opacity:0;transition:opacity .3s}
.g-up:hover .tip,.g-up:focus-visible .tip{opacity:1}
body:has(.mbar) .g-up{bottom:calc(70px + env(safe-area-inset-bottom,0px))}
.g-cursor{position:fixed;left:0;top:0;z-index:95;width:16px;height:17px;pointer-events:none;opacity:0;transition:opacity .3s}
.g-cursor.on{opacity:1}
.g-cursor .gv{width:16px;height:17px;display:block;transform-origin:50% 100%;transition:transform .2s;filter:drop-shadow(0 2px 4px rgba(0,0,0,.6))}
.g-cursor.sit .gv{animation:gsit 2.4s ease-in-out infinite}
@keyframes gsit{0%,100%{scale:1 1}50%{scale:1.04 .94}}
html[data-motion="off"] .g-cursor,html[data-motion="off"] .g-cameo,html[data-motion="off"] .g-rope{display:none}
@media (prefers-reduced-motion:reduce){.g-cursor,.g-cameo{display:none}.g-foot{transition:none}}
@media (max-width:760px){.g-cameo{width:80px;bottom:150px;right:16px}}

/* KUNSTWERKEN NOOIT AFKNIPPEN (2/11/2026)
   Schilderijen, bronzen, koffiewerken en muurschilderingen tonen altijd volledig,
   in hun eigen verhouding: geen vast kader, geen cover-crop, geen zoom bij hover. */
.work .media,.case .media,.gompy figure .media{aspect-ratio:auto!important;background:transparent;overflow:visible;border-radius:0!important}
.work .media img,.case .media img,.gompy figure .media img{position:relative;inset:auto;width:100%;height:auto;object-fit:contain;transform:none!important}
.work:hover .media img,.case:hover .media img,.gompy figure:hover .media img{transform:none!important}
.sold{margin-top:-6px;font-size:var(--s-1);letter-spacing:.28em;text-transform:uppercase;color:var(--bronze)}
.timeline.upcoming .y{white-space:nowrap}
.up-link{display:inline-block;margin-top:8px;margin-right:14px;font-size:var(--s-1);letter-spacing:.18em;text-transform:uppercase;color:var(--bronze);text-decoration:none;border-bottom:1px solid currentColor}
.timeline.upcoming li{grid-template-columns:6.5rem minmax(0,1fr)}
/* twee beelden naast elkaar (Gompy the Traveler, Gompy bij schilderijen) */
.cases.duo{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:0}
.cases.duo figcaption{margin-top:12px}
@media (max-width:560px){.cases.duo{grid-template-columns:1fr}}
/* ronde werken die als losse cirkel gefotografeerd zijn: aan een warme muur hangen i.p.v. uitgeknipt */
.work.round .media{background:radial-gradient(ellipse at 50% 28%,#f1ebe3 0%,#ddd3c6 70%,#cfc4b5 100%);padding:11%;box-shadow:none;filter:drop-shadow(0 22px 26px rgba(0,0,0,.35))}
.work.round .media img{clip-path:circle(closest-side at 50% 50%)}
.work.round .media::after{display:none}
/* reisverhalen: kleinere foto's, drie naast elkaar */
.cases.trav{margin-top:0}
.cases.trav figcaption{margin-top:12px}
@media (min-width:561px) and (max-width:860px){.cases.trav{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* warmere, cognackleurige sfeer op de homepage (dossier 3/11/2026) */
.slides::after{background:linear-gradient(180deg,rgba(40,20,8,.38),rgba(20,10,4,.08) 40%,rgba(10,6,4,.9)),linear-gradient(90deg,rgba(18,9,4,.82),transparent 62%)}
.slides figure.on img{filter:brightness(.92) sepia(.12) saturate(1.05)}
.hero{background:radial-gradient(ellipse 120% 70% at 80% 0%,rgba(196,138,79,.14),transparent 60%)}

/* geen labyrint-cirkels meer over de homepagefoto's (3/11/2026) */
.hero #maze{display:none}

/* Coffee & Cigar Art: reeksen uit de presentatiemap, tafels (3/11/2026) */
.cc-group,.cc-why{margin-top:clamp(64px,8vw,104px);padding-top:clamp(32px,4vw,48px);border-top:1px solid var(--line)}
.cc-h{font-family:var(--f-display);font-weight:300;text-transform:uppercase;letter-spacing:.2em;font-size:var(--s2);margin:12px 0 18px}
.cc-group .series-intro a{color:var(--ink);text-decoration-color:var(--bronze);text-underline-offset:4px}
.cc-why{max-width:68ch;color:var(--muted)}
.cc-why p+p{margin-top:14px}
.cc-why .sig{font-family:var(--f-serif);font-style:italic;font-size:var(--s1);color:var(--ink)}
.tabpanel>.cc-group:first-child,[role=tabpanel]>.cc-group:first-of-type{margin-top:32px}

/* homepage: tekst in de hero beter leesbaar over de foto's (3/11/2026) */
.slides::after{background:linear-gradient(180deg,rgba(20,10,4,.45),rgba(20,10,4,.12) 40%,rgba(10,6,4,.9)),linear-gradient(90deg,rgba(12,7,3,.9) 0%,rgba(12,7,3,.72) 38%,rgba(12,7,3,.25) 62%,transparent 80%)}
.hero .wrap>*{text-shadow:0 2px 18px rgba(0,0,0,.75),0 1px 3px rgba(0,0,0,.6)}
.hero .welcome{color:#efe4d6;font-size:.95rem;letter-spacing:.32em}
.hero .tagline{opacity:1;color:#f3ece3}
.hero .alias{color:#d9a46a}
@media (max-width:760px){.slides::after{background:linear-gradient(180deg,rgba(12,7,3,.55),rgba(12,7,3,.5) 45%,rgba(10,6,4,.92))}}