.kop{padding-bottom:clamp(72px,8vw,120px)}
.terug{display:inline-flex;align-items:center;gap:12px;min-height:44px;margin-bottom:clamp(20px,3vw,40px);font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--gips-3);text-decoration:none;transition:color .25s}
.terug:hover{color:var(--koper-licht)}
.kop .intro{margin-bottom:clamp(48px,6vw,88px)}
.kopbeeld{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:28px;align-items:end}
.luik-eet{grid-column:1/8}
.luik-eet .kader{aspect-ratio:3/4}
.luik-eet img{object-position:50% 50%}
.luik-eet .m{max-width:none}
.kopbeeld .feiten{grid-column:9/13;grid-template-columns:minmax(0,1fr);margin:0}
.kopbeeld .feiten div,.kopbeeld .feiten div+div{padding:20px 0 22px;border-left:0;border-bottom:1px solid var(--lijn-zacht)}
.kopbeeld .feiten dt{margin-bottom:10px}
.kopbeeld .feiten dd b{font-size:clamp(34px,3.2vw,48px)}
.kopbeeld .feiten dd span{max-width:34ch}
@media (max-width:980px){
  .luik-eet{grid-column:1/8}
  .kopbeeld .feiten{grid-column:8/13}
  .kopbeeld .feiten div:nth-child(3){padding-left:0}
}
@media (max-width:760px){
  .kopbeeld{column-gap:16px}
  .luik-eet,.kopbeeld .feiten{grid-column:1/13}
  .kopbeeld .feiten{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px;margin-top:12px}
}
@media (max-width:560px){.kopbeeld .feiten{grid-template-columns:minmax(0,1fr);margin-top:8px}}
.case{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px}
.hfd{grid-column:1/4;position:sticky;top:calc(var(--nav-h) + 16px);align-self:start}
.hfd ol{list-style:none;margin:0;padding:0;border-top:1px solid var(--lijn);cursor:default}
.hfd li::before{content:"";position:absolute;left:0;top:-1px;height:1px;width:100%;background:var(--koper);transform:scaleX(0);transform-origin:0 50%;transition:transform .7s var(--ease)}
.hfd li.is-active::before{transform:scaleX(1)}
.hfd li{position:relative;display:flex;gap:16px;align-items:baseline;min-height:56px;padding:16px 0;border-bottom:1px solid var(--lijn-zacht);color:var(--gips-3);transition:color .25s}
.hfd li .n{font-family:var(--mono);font-size:11px;letter-spacing:.16em;color:var(--koper-licht);flex:none;width:2.2em;font-variant-numeric:tabular-nums}
.hfd li .t{font-family:var(--display);font-size:20px;line-height:1.1}
.hfd li.is-active{color:var(--gips)}
.hfd-voet{margin-top:32px;font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;color:var(--gips-3);line-height:1.8;max-width:36ch}
.hoofdstukken{grid-column:5/13}
.h{position:relative;padding-bottom:clamp(72px,8vw,120px)}
.h+.h{padding-top:clamp(64px,7vw,104px);border-top:1px solid var(--lijn-zacht)}
.h:last-child{padding-bottom:0}
.h .n{font-family:var(--mono);font-size:var(--t-mono);letter-spacing:.2em;text-transform:uppercase;color:var(--koper-licht);display:flex;align-items:center;gap:14px;margin-bottom:26px}
.h .n::before{content:"";width:30px;height:1px;background:var(--koper);flex:none}
.h h2{font-size:clamp(34px,3.6vw,56px);line-height:1.02;margin-bottom:30px;max-width:18ch}
.h .tekst{font-size:17.5px;max-width:58ch}
.h .fig{margin-top:clamp(40px,5vw,64px)}
.h .fig .m{max-width:none}
.h-verder{margin-top:28px}
.opgave{list-style:none;margin:clamp(36px,4.4vw,52px) 0 0;padding:0;border-top:1px solid var(--lijn);max-width:58ch}
.opgave li{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,8fr);gap:6px 28px;padding:18px 0;border-bottom:1px solid var(--lijn-zacht);align-items:baseline}
.opgave .w{font-family:var(--mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--gips-3)}
.opgave span:last-child{font-size:16px;color:var(--gips-2);line-height:1.55}
.h-huis{max-width:640px}
.h-huis .kader{aspect-ratio:3/4}
.h-huis.h-overloop .kader{aspect-ratio:4/5}
.h-huis.h-plafond .kader{aspect-ratio:5/6}
.h-huis.h-plafond img{object-position:50% 0}
.h-huis img{object-position:50% 50%}
.h-huis figcaption{flex-direction:column;gap:6px}
.h-huis .m{text-align:left;max-width:none}
@media (max-width:600px){.h-huis{max-width:none}}
@media (max-width:980px){
  .hfd{grid-column:1/13;position:static;margin-bottom:clamp(40px,6vw,64px)}
  .hfd ol{display:none}
  .hfd-voet{margin-top:0;max-width:52ch;line-height:1.7}
  .hoofdstukken{grid-column:1/13}
}
@media (max-width:980px){
  .hfd{order:1;margin:clamp(40px,6vw,64px) 0 0}
}
@media (max-width:600px){
  .opgave li{grid-template-columns:1fr;gap:4px}
}
.band.band-typo{aspect-ratio:auto;height:clamp(360px,60vh,620px);min-height:0;max-height:none;align-items:flex-end;
  background:
    radial-gradient(70% 80% at 0% 78%,rgba(184,152,122,.13) 0%,rgba(184,152,122,.04) 46%,rgba(184,152,122,0) 72%),
    linear-gradient(100deg,rgba(234,218,198,.10) 0%,rgba(234,218,198,.035) 34%,rgba(19,14,11,0) 62%),
    var(--nacht)}
.band.band-typo::after{background:linear-gradient(180deg,var(--roet) 0%,rgba(26,20,16,0) 22%),linear-gradient(0deg,var(--nacht) 0%,rgba(19,14,11,0) 18%)}
.band-typo::before{content:"";position:absolute;left:0;right:0;bottom:clamp(26px,3.2vw,44px);height:1px;z-index:0;opacity:.5;pointer-events:none;
  background:linear-gradient(90deg,var(--koper-licht) 0%,var(--koper) 42%,rgba(154,122,96,.35) 78%,rgba(154,122,96,.12) 100%)}
.band-typo .band-tekst{width:100%;padding-bottom:clamp(64px,7vw,108px)}
.band-typo .band-zin{font-size:clamp(38px,5vw,76px);max-width:12ch;text-shadow:none}
@media (max-width:760px){.band-typo .band-tekst{padding-bottom:clamp(60px,16vw,80px)}}
.res-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;align-items:start}
.res-tekst{grid-column:1/7}
.res-tekst h2{font-size:var(--t-kop);line-height:.98;margin-bottom:34px}
.res-tekst .tekst{font-size:var(--t-lead)}
.res-citaat{grid-column:8/13;padding-top:12px}
.res-citaat .citaat-blok blockquote p{font-size:clamp(26px,2.6vw,38px)}
@media (max-width:980px){.res-tekst,.res-citaat{grid-column:1/13}.res-citaat{margin-top:48px;padding-top:0}}
.res-beeld{grid-column:1/13;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:56px 24px;align-items:start;margin-top:clamp(56px,7vw,96px)}
.res-beeld .kader{aspect-ratio:3/4}
.res-beeld .rb-lig .kader{aspect-ratio:4/3}
.res-beeld img{object-position:50% 50%}
.res-beeld figcaption{flex-direction:column;gap:6px}
.res-beeld .m{text-align:left;max-width:none}
.rb-l{grid-column:1/7}
.rb-r{grid-column:7/13;margin-top:clamp(48px,7vw,112px)}
@media (max-width:640px){.res-beeld{row-gap:40px}.rb-l,.rb-r{grid-column:1/13;margin-top:0}}
.verder-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:40px 28px;align-items:start}
.register{grid-column:1/8;list-style:none;margin:0;padding:0;border-top:1px solid var(--lijn)}
.register li{position:relative}
.register li::before{content:"";position:absolute;left:0;top:-1px;height:1px;width:100%;background:var(--koper);transform:scaleX(0);transform-origin:0 50%;transition:transform .7s var(--ease)}
.register li:hover::before,.register li:focus-within::before{transform:scaleX(1)}
.register a{display:grid;grid-template-columns:3.2em minmax(0,1fr) auto;gap:10px 20px;align-items:baseline;padding:30px 0 28px;border-bottom:1px solid var(--lijn-zacht);text-decoration:none;color:var(--gips)}
.register .n{font-family:var(--mono);font-size:11.5px;letter-spacing:.16em;color:var(--koper-licht);font-variant-numeric:tabular-nums}
.register .t{font-family:var(--display);font-size:clamp(28px,2.9vw,42px);line-height:1.04;transition:color .25s}
.register .m{grid-column:2;font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;color:var(--gips-3);line-height:1.6}
.register .pijl{grid-column:3;grid-row:1;align-self:center;width:26px;color:var(--koper-licht)}
.register a:hover .t,.register a:focus-visible .t{color:var(--koper-licht)}
.volgende{grid-column:9/13;position:sticky;top:calc(var(--nav-h) + 24px)}
.volgende h3{font-size:clamp(28px,2.6vw,38px);line-height:1.05;margin-bottom:18px}
.volgende p{font-size:15.5px;color:var(--gips-2);max-width:30ch}
.volgende .btn{margin-top:28px}
.volgende .meer{margin-top:6px;display:flex}
@media (max-width:980px){.register{grid-column:1/13}.volgende{grid-column:1/13;position:static}.volgende p:not(.label){max-width:46ch}}
@media (max-width:600px){
  .verder-grid{column-gap:16px}
  .register a{grid-template-columns:minmax(0,1fr) auto;gap:8px 16px;padding:24px 0 22px}
  .register .n{grid-column:1}
  .register .t{grid-column:1;font-size:28px}
  .register .m{grid-column:1}
  .register .pijl{grid-column:2;grid-row:2}
}