@font-face{font-family:"Manrope";src:url(/assets/fonts/manrope.woff2) format("woff2");font-weight:400 800;font-style:normal;font-display:swap}
:root{
  --accent:#956950; --accent-licht:#b08e7c; --accent-donker:#74523e;
  --kop-bg:#7d5843; --kop-tekst:#ffffff; --kop-zacht:#e2dad6;
  --hero-van:#f0eae6; --hero-tot:#d8d3cf; --hero-tekst:#12171d; --hero-tag:#414448;
  --sluier:#e6dfdb; --held-tekst:#12171d; --held-tag:#373a3f;
  --ink:#12171d; --ink-soft:#5b6672; --line:#e3e7ec;
  --paper:#ffffff; --paper-tint:#f6f8fa;
  --knop-bg:#956950; --knop-tekst:#ffffff; --knop-hover:#835c46;
  --radius:6px; --radius-lg:10px; --knop-radius:999px;
  --sans:"Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --kopfont:"Manrope","Segoe UI",system-ui,sans-serif; --leesfont:"Manrope","Segoe UI",system-ui,sans-serif;
  --kopgewicht:800; --kopspatie:-.025em; --labelspatie:.09em;
  --kaart-bg:var(--paper-tint); --kaart-bg-tint:var(--paper); --kaart-rand:0; --kaart-schaduw:none;
  --opening-schaal:1.22;
  --shadow:0 1px 2px rgba(15,23,32,.05),0 10px 28px rgba(15,23,32,.09);
  --maxw:1180px; --lees:760px;
  --ruimte:clamp(44px,6vw,80px);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--leesfont);font-size:16px;line-height:1.6}
h1,h2,h3,h4{font-family:var(--kopfont);letter-spacing:var(--kopspatie);font-weight:var(--kopgewicht);line-height:1.15;margin:0}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
a:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:4px}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 20px}
.wrap--lees{max-width:calc(var(--lees) + 40px)}
.wrap--beeld{max-width:1000px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-120px;z-index:50;background:var(--knop-bg);color:var(--knop-tekst);padding:12px 18px;border-radius:var(--knop-radius);font-weight:700}
.skip:focus{top:12px}
/* Beeldvlak: het beeld vult het vlak; leeg toont het het palet en nooit een gat. */
.ph{position:relative;overflow:hidden;background:var(--paper-tint);container-type:inline-size}
.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* Leeg vlak: een tint van het palet met het initiaal als monogram, geschaald op de breedte van
   het vlak. Zo is een site zonder foto's herkenbaar in plaats van een rij grijze blokken. */
.ph:empty{background:linear-gradient(135deg,var(--paper-tint),var(--accent-licht));background:linear-gradient(135deg,var(--paper-tint) 20%,color-mix(in srgb,var(--accent) 22%,var(--paper-tint)))}
.ph:empty::after{content:"A";position:absolute;right:5%;bottom:-14%;font-family:var(--kopfont);font-weight:var(--kopgewicht);font-size:38cqi;line-height:1;color:transparent;-webkit-text-stroke:1.5px var(--ink-soft);opacity:.35;pointer-events:none}
.eyebrow{display:block;font-size:.78rem;font-weight:700;letter-spacing:var(--labelspatie);text-transform:uppercase;color:var(--accent-donker);margin:0 0 10px}
.btn{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:12px 24px;border:0;border-radius:var(--knop-radius);background:var(--knop-bg);color:var(--knop-tekst);font:inherit;font-size:.97rem;font-weight:700;line-height:1.2;cursor:pointer;transition:background .15s ease,transform .15s ease}
.btn:hover{background:var(--knop-hover);transform:translateY(-1px)}
.btn--pijl::after{content:"\2192";font-size:1.1em;line-height:1}
.btn--stil{background:var(--paper-tint);color:var(--ink);border:1px solid var(--line)}
.btn--stil:hover{background:var(--paper);border-color:var(--accent);color:var(--accent-donker)}
.btn--stil::before{content:"\2190";font-size:1.1em;line-height:1}

/* Kopbalk: een balk. Merk links, menu rechts; het <details>-menu neemt over op mobiel en zodra
   er negen of meer items zijn -- meer past niet naast een merknaam, en een tweede regel is
   geen navigatie maar een lijst. */
.top{position:sticky;top:0;z-index:20;background:var(--kop-bg);color:var(--kop-tekst);box-shadow:0 1px 0 rgba(127,127,127,.22)}
.top__bar{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:72px;padding-block:8px}
.brand{display:flex;align-items:center;gap:12px;min-width:0;color:inherit;flex:none}
.brand__mark{width:42px;height:42px;border-radius:var(--radius);background:var(--knop-bg);color:var(--knop-tekst);flex:none;display:grid;place-items:center;font-family:var(--kopfont);font-weight:800;font-size:19px}
.brand__tekst{min-width:0;display:grid}
.brand__name{font-family:var(--kopfont);font-size:1.25rem;font-weight:var(--kopgewicht);letter-spacing:var(--kopspatie);line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.brand__tag{font-size:.78rem;color:var(--kop-zacht);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.brand__tag:empty{display:none}
.nav{flex:0 1 auto;min-width:0;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
.nav::-webkit-scrollbar{display:none}
.nav__list{display:flex;justify-content:flex-end;gap:2px;list-style:none;margin:0;padding:0}
.nav__list li:nth-child(n+9){display:none}
.top:has(.nav__list li:nth-child(9)) .nav__list li:nth-child(n+8){display:none}
.nav__list a{display:inline-flex;align-items:center;min-height:44px;padding:8px 13px;border-radius:var(--knop-radius);font-size:.95rem;font-weight:600;color:var(--kop-zacht);white-space:nowrap;transition:color .15s,background .15s}
.nav__list a:hover{color:var(--kop-tekst);background:rgba(127,127,127,.14)}
.nav__list a[aria-current="page"]{color:var(--kop-tekst);text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:3px;text-underline-offset:9px}
.menu{position:relative;display:none;flex:none}
.top:has(.nav__list li:nth-child(9)) .menu{display:block}
.menu__knop{list-style:none;display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:8px 14px;border:1px solid rgba(127,127,127,.4);border-radius:var(--knop-radius);cursor:pointer;font-weight:600;font-size:.92rem;color:var(--kop-tekst);user-select:none}
.menu__knop::-webkit-details-marker{display:none}
.menu__knop::marker{content:""}
.menu__lijnen{display:block;width:18px;height:2px;background:currentColor;box-shadow:0 -6px 0 currentColor,0 6px 0 currentColor}
.menu[open] .menu__knop{background:rgba(127,127,127,.14)}
.menu__paneel{position:absolute;right:0;top:calc(100% + 10px);width:min(92vw,360px);max-height:min(70vh,560px);overflow:auto;background:var(--kop-bg);color:var(--kop-tekst);border:1px solid rgba(127,127,127,.3);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:8px;z-index:30}
.menu__list{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.menu__list a{display:block;padding:12px 14px;border-radius:var(--radius);font-weight:600;color:var(--kop-zacht)}
.menu__list a:hover,.menu__list a[aria-current="page"]{color:var(--kop-tekst);background:rgba(127,127,127,.14)}

/* Opening. Zonder foto: het verloop van het palet met een groot omlijnd initiaal en twee
   accentbalken. Met foto: de foto onder de sluier en de waas van de variant; de tekstkleur
   daarop is door de generator tegen die stapeling gemeten. */
.hero{position:relative;overflow:hidden;isolation:isolate;display:grid;align-items:end;background:linear-gradient(135deg,var(--hero-van),var(--hero-tot));color:var(--hero-tekst);min-height:min(calc(54vh * var(--opening-schaal)),calc(480px * var(--opening-schaal)))}
.hero__foto{position:absolute;inset:0;z-index:0}
.hero__foto:empty{display:none}
.hero__foto img{width:100%;height:100%;object-fit:cover}
/* De sluier is een verloop: bovenin blijft de foto vrij, vanaf 30% van de hoogte ligt zij er volledig
   op. De tekst staat onderaan en raakt dus alleen de stapeling waartegen de generator haar
   kleur heeft gemeten; erboven mag de foto zichzelf zijn. */
.hero__foto::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 0%,var(--sluier) 30%);opacity:0.55}
.hero:has(> .hero__foto img){background:var(--sluier);color:var(--held-tekst);min-height:min(calc(64vh * var(--opening-schaal)),calc(600px * var(--opening-schaal)))}
.hero:has(> .hero__foto img)::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(255,255,255,0.3),rgba(255,255,255,0.52) 55%,rgba(255,255,255,0.74))}
.hero:has(> .hero__foto img) .hero__deco{display:none}
.hero:has(> .hero__foto img) .hero__tag{color:var(--held-tag)}
.hero__deco{position:absolute;inset:0;z-index:0;pointer-events:none;user-select:none}
.hero__deco::before{content:"";position:absolute;inset:0;background:radial-gradient(70% 90% at 82% 8%,rgba(255,255,255,.14),transparent 60%)}
.hero__letter{position:absolute;right:2%;bottom:-16%;font-family:var(--kopfont);font-weight:var(--kopgewicht);font-size:clamp(220px,40vw,600px);line-height:.85;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:2px var(--hero-tag);opacity:.32}
.hero__blok{position:absolute;bottom:0;height:8px;background:var(--accent)}
.hero__blok--a{left:0;width:min(44%,520px)}
.hero__blok--b{left:min(44%,520px);width:min(12%,140px);background:var(--accent-licht)}
.hero__inner{position:relative;z-index:2;width:100%;padding:calc(76px * var(--opening-schaal)) 20px calc(64px * var(--opening-schaal))}
.hero__tekst{max-width:760px;margin-inline:0;text-align:left}
.hero__streep{display:block;width:64px;height:6px;border-radius:3px;background:var(--accent);margin:0 0 24px}
.hero__merk{display:none;width:52px;height:52px;border-radius:var(--radius);background:var(--knop-bg);color:var(--knop-tekst);place-items:center;font-family:var(--kopfont);font-weight:800;font-size:22px;margin:0 0 22px}
.hero h1{margin:0 0 16px;font-size:clamp(2.2rem,6vw,4rem);line-height:1.02;max-width:16ch;margin-inline:0;text-wrap:balance}
.hero__tag{margin:0 0 28px;font-size:clamp(1.05rem,1.6vw,1.2rem);line-height:1.5;max-width:56ch;margin-inline:0;color:var(--hero-tag)}
.hero__tag:empty{display:none}
.hero__tag:empty + .btn{margin-top:6px}

/* Rubriekpaneel, over de onderrand van de opening heen. */
/* `flow-root`: anders schiet de negatieve marge van het paneel door naar de band zelf en legt die
   band 30px papier over de onderrand van de opening (foto en accentbalken). */
.railwrap{background:var(--paper);position:relative;z-index:3;display:flow-root}
.railwrap:has(.rail__items:empty){display:none}
.rail{display:flex;align-items:center;flex-wrap:wrap;gap:10px 18px;margin-top:-30px;padding:16px 20px;background:var(--kaart-bg);border:var(--kaart-rand);box-shadow:var(--kaart-schaduw);border-radius:var(--radius-lg)}
.rail__label{font-size:.75rem;font-weight:700;letter-spacing:var(--labelspatie);text-transform:uppercase;color:var(--ink-soft)}
.rail__items{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;min-height:40px;padding:6px 16px;border-radius:var(--knop-radius);background:var(--paper-tint);background:color-mix(in srgb,var(--accent) 9%,var(--paper));border:1px solid var(--line);color:var(--ink);font-size:.9rem;font-weight:600;line-height:1.2;transition:border-color .15s,color .15s}
.chip:hover{border-color:var(--accent);color:var(--accent-donker)}

/* Secties met ritme. */
.sec{padding:var(--ruimte) 0}
.sec--tint{background:var(--paper-tint)}
.sec__head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:12px 24px;margin-bottom:clamp(22px,3vw,34px)}
.sec__head h1,.sec__head h2{font-size:clamp(1.7rem,3.2vw,2.4rem);line-height:1.1;text-wrap:balance}
.sec__head .eyebrow{margin-bottom:8px}
#artikelen{scroll-margin-top:90px}

/* De tekst van een statische voorpagina; leeg bij een blogvoorpagina en dan onzichtbaar. */
.sec--voorpagina:has(.voorpagina:empty){display:none}
.voorpagina{max-width:var(--lees);margin:0 auto;font-size:1.08rem}
.voorpagina > p:first-child{font-size:1.22em;line-height:1.5}

/* Tijdschriftraster: het eerste bericht groot, de lijst met de nieuwste ernaast, de rest eronder.
   `display:contents` maakt de kaarten en de lijst kinderen van hetzelfde raster. */
.mag{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.mag__kaarten{display:contents}
.mag__kaarten .card:first-child{grid-column:1 / -2;grid-row:span 2;order:-2}
.mag__kaarten .card:first-child .card__img{aspect-ratio:auto;flex:1 1 0;min-height:300px}
.mag__kaarten .card:first-child .card__body{padding:22px 26px 26px}
.mag__kaarten .card:first-child .card__title{font-size:clamp(1.35rem,2.2vw,1.9rem)}
.mag__kaarten .card:first-child .card__sam{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.mag__kaarten .card:first-child .card__sam:empty{display:none}
.mag__kaarten .card:first-child:nth-last-child(-n+2){grid-row:auto}
.mag__kaarten .card:first-child:nth-last-child(-n+2) .card__img{aspect-ratio:2 / 1;min-height:0;flex:none}
.mag__kaarten .card:only-child{grid-column:1 / -1;display:grid;grid-template-columns:1.15fr 1fr}
.mag__kaarten .card:only-child .card__img{aspect-ratio:auto;min-height:360px;flex:none}
.mag__kaarten .card:only-child .card__body{padding:clamp(24px,3vw,44px);align-self:center}
.aside{grid-column:-2 / -1;grid-row:1 / span 2;order:-1;min-width:0;container-type:inline-size;background:var(--kaart-bg);border:var(--kaart-rand);box-shadow:var(--kaart-schaduw);border-radius:var(--radius-lg);padding:22px 22px 10px}
.aside:not(:has(.rij:nth-child(3))){display:none}
/* In een vierkolomsraster is de lijst smal: dan nummer en titel, zonder miniatuur. */
@container (max-width:330px){.aside .rij__thumb{display:none}.aside .rij__link{grid-template-columns:auto minmax(0,1fr)}}
.aside__kop{margin:0 0 6px;font-family:var(--leesfont);font-size:.78rem;font-weight:700;letter-spacing:var(--labelspatie);text-transform:uppercase;color:var(--accent-donker)}
.sec--tint .card,.sec--tint .aside{background:var(--kaart-bg-tint)}

/* Kaarten als systeem: 3:2, dezelfde randen, meta als eyebrow, hover en focus. */
.card{display:flex;flex-direction:column;min-width:0;background:var(--kaart-bg);border:var(--kaart-rand);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--kaart-schaduw);transition:transform .2s ease,box-shadow .2s ease}
.card:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(15,23,32,.10),0 24px 48px rgba(15,23,32,.10)}
.card__img{aspect-ratio:3 / 2}
.card__img img{transition:transform .6s ease}
.card:hover .card__img img{transform:scale(1.04)}
.card__body{display:flex;flex-direction:column;gap:8px;padding:18px 20px 22px}
.card__meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:0;font-size:.76rem;font-weight:700;letter-spacing:var(--labelspatie);text-transform:uppercase;color:var(--ink-soft)}
.card__rubriek{color:var(--accent-donker)}
.card__rubriek:empty{display:none}
.card__rubriek:not(:empty) + .card__datum::before{content:"";width:4px;height:4px;border-radius:50%;background:var(--ink-soft);display:inline-block;margin-right:10px;vertical-align:middle}
.card__datum{text-transform:none;letter-spacing:0;font-weight:500}
.card__datum:empty{display:none}
.card__title{font-size:1.1rem;line-height:1.3;letter-spacing:-.01em;color:var(--ink);text-wrap:pretty;transition:color .15s}
.card:hover .card__title{color:var(--accent-donker)}
.card__sam{display:none;margin:0;color:var(--ink-soft);font-size:.98rem;line-height:1.55}

/* Genummerde lijst met de nieuwste berichten. */
.list{list-style:none;margin:0;padding:0;counter-reset:rij}
.rij{counter-increment:rij;border-top:1px solid var(--line)}
.rij:first-child{border-top:0}
.rij__link{display:grid;grid-template-columns:auto 60px minmax(0,1fr);gap:14px;align-items:center;padding:12px 0;min-height:44px}
.rij__link::before{content:counter(rij,decimal-leading-zero);font-family:var(--kopfont);font-weight:var(--kopgewicht);font-size:.85rem;color:var(--accent-donker);letter-spacing:var(--labelspatie);min-width:1.6em}
.rij__thumb{width:60px;height:60px;border-radius:var(--radius);display:block}
.rij__titel{font-family:var(--kopfont);font-weight:var(--kopgewicht);font-size:.95rem;line-height:1.35;color:var(--ink);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;transition:color .15s}
.rij__link:hover .rij__titel{color:var(--accent-donker)}
.rij__datum{display:block;margin-top:4px;font-size:.78rem;color:var(--ink-soft)}
.rij__datum:empty{display:none}

/* Paginering (de renderer levert de nav; de levering geeft haar vorm). */
.paginering{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:clamp(28px,4vw,44px);font-weight:600;font-size:.95rem}
.paginering a{display:inline-flex;align-items:center;min-height:44px;padding:10px 18px;border:1px solid var(--line);border-radius:var(--knop-radius);color:var(--ink);transition:border-color .15s,color .15s}
.paginering a:hover{border-color:var(--accent);color:var(--accent-donker)}
.paginering__stand{color:var(--ink-soft);padding:0 8px;font-variant-numeric:tabular-nums}

/* Artikel: kop met meta, groot beeld, leesbreedte, nette body. */
.artikel__kop{padding:clamp(40px,6vw,72px) 0 clamp(20px,3vw,32px);text-align:left}
.artikel__datum{margin:0 0 14px;font-size:.78rem;font-weight:700;letter-spacing:var(--labelspatie);text-transform:uppercase;color:var(--accent-donker)}
.artikel__datum:empty{display:none}
.artikel__titel{font-size:clamp(2rem,4.6vw,3.2rem);line-height:1.08;text-wrap:balance}
.wrap--beeld:has(.artikel__beeld:empty){display:none}
.artikel__beeld{margin:0 0 clamp(28px,4vw,44px);border-radius:var(--radius-lg);overflow:hidden;aspect-ratio:2 / 1;position:relative;background:var(--paper-tint)}
.artikel__beeld img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.artikel__body{font-family:var(--leesfont);font-size:1.09rem;line-height:1.72}
.artikel__body > p:first-child{font-size:1.14em;line-height:1.6}
.artikel__body h2,.artikel__body h3,.artikel__body h4{line-height:1.2;margin:1.7em 0 .55em;text-wrap:balance}
.artikel__body h2{font-size:1.65rem}
.artikel__body h3{font-size:1.3rem}
.artikel__body h4{font-size:1.1rem}
.artikel__body p{margin:0 0 1.2em}
.artikel__body ul,.artikel__body ol{margin:0 0 1.2em;padding-left:1.4em}
.artikel__body li{margin-bottom:.45em}
.artikel__body li::marker{color:var(--accent-donker)}
.artikel__body a{color:var(--accent-donker);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px}
.artikel__body a:hover{color:var(--ink)}
.artikel__body blockquote{margin:1.6em 0;padding:.4em 0 .4em 1.2em;border-left:4px solid var(--accent);font-size:1.12em;line-height:1.55}
.artikel__body blockquote p:last-child{margin-bottom:0}
.artikel__body figure{margin:1.8em 0}
.artikel__body img{border-radius:var(--radius);width:100%}
.artikel__body figcaption{font-size:.86rem;color:var(--ink-soft);margin-top:.6em}
.artikel__body table{width:100%;border-collapse:collapse;margin:1.6em 0;font-size:.95em}
.artikel__body th,.artikel__body td{padding:.65em .8em;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.artikel__body th{background:var(--paper-tint);font-family:var(--kopfont);font-weight:700}
.artikel__body pre,.artikel__body code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.92em}
.artikel__body pre{background:var(--paper-tint);padding:1em 1.2em;border-radius:var(--radius);overflow:auto}
.artikel__body hr{border:0;border-top:1px solid var(--line);margin:2em 0}
.artikel__voet{margin-top:clamp(32px,4vw,48px);padding:24px 0 var(--ruimte);border-top:1px solid var(--line)}

/* Lijstpagina: kop, omschrijving, raster, paginering. */
.lijst{padding-bottom:var(--ruimte)}
.lijst__kop{padding:clamp(40px,6vw,64px) 0 clamp(24px,3vw,36px);border-bottom:1px solid var(--line);margin-bottom:clamp(28px,4vw,44px)}
.lijst__kop h1{font-size:clamp(1.9rem,4vw,2.8rem);line-height:1.08;text-wrap:balance}
.lijst__omschrijving{margin:12px 0 0;max-width:68ch;color:var(--ink-soft);font-size:1.05rem}
.lijst__omschrijving:empty{display:none}
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}

/* 404: rustig, met een weg terug. */
.nietgevonden{padding:clamp(64px,10vw,120px) 0;text-align:center}
.nietgevonden h1{margin:0 0 12px;font-size:clamp(2rem,4.6vw,3rem)}
.nietgevonden p{margin:0 0 28px;color:var(--ink-soft);font-size:1.1rem}

/* Voet in de kopkleur: merk, pagina's, rubrieken, en een smalle onderregel. */
.foot{background:var(--kop-bg);color:var(--kop-zacht)}
.foot__grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:36px;padding:clamp(40px,6vw,64px) 0 clamp(28px,4vw,40px);align-items:start}
.foot .brand{color:var(--kop-tekst)}
.foot h3{margin:0 0 14px;font-family:var(--leesfont);font-size:.78rem;font-weight:700;letter-spacing:var(--labelspatie);text-transform:uppercase;color:var(--kop-tekst)}
.foot__col ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px 18px;font-size:.95rem}
.foot__col a{display:inline-block;padding:4px 0}
.foot__col a:hover,.foot__col a[aria-current="page"]{color:var(--kop-tekst)}
.foot__col:has(ul:empty){display:none}
.foot__legal{border-top:1px solid rgba(127,127,127,.28);padding:18px 0 24px;font-size:.85rem}

@media(max-width:1100px){.brand__tag{display:none}}
@media(max-width:900px){
  .nav{display:none}
  .menu{display:block}
  .mag,.grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mag__kaarten .card:first-child{grid-column:1 / -1;grid-row:auto}
  .mag__kaarten .card:first-child .card__img{flex:none;aspect-ratio:16 / 9;min-height:0}
  .aside{display:none}
  .foot__grid{grid-template-columns:1fr 1fr}
  .foot__merk{grid-column:1 / -1}
  .hero__letter{font-size:220px;right:-4%;top:-6%;bottom:auto;opacity:.22}
}
@media(max-width:600px){
  .mag,.grid{grid-template-columns:1fr}
  .mag__kaarten .card:only-child{grid-template-columns:1fr}
  .mag__kaarten .card:only-child .card__img{min-height:0;aspect-ratio:3 / 2}
  .hero__inner{padding:56px 20px 44px}
  .hero h1{font-size:clamp(2rem,9vw,2.6rem)}
  .rail{margin-top:-22px;padding:14px 16px}
  .chip{min-height:44px}
  .foot__grid{grid-template-columns:1fr}
  .foot__merk{grid-column:auto}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}