:root {
--zwart: #000000;
--wit: #FFFFFF;
--gebroken-wit: #F1F1EF;
--goud: #A29061; --goud-donker: #7A6A3F; --goud-lijn: rgba(162, 144, 97, .55);
--grijs: #5E5E5E; --grijs-op-zwart: #BDBDB8;
--serif: "Cinzel", "Times New Roman", serif;
--sans: "Open Sans", system-ui, sans-serif;
--ruimte: clamp(4.5rem, 10vw, 8rem);
--rand: clamp(1.25rem, 5vw, 4rem);
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
margin: 0;
font-family: var(--sans);
font-size: 1.0625rem;
line-height: 1.7;
color: var(--zwart);
background: var(--gebroken-wit);
overflow-x: hidden;
}
img { display: block; max-width: 100%; height: auto; }
figure { margin: 0; }
h1, h2, h3 {
font-family: var(--serif);
font-weight: 400;
line-height: 1.2;
margin: 0;
letter-spacing: .02em;
}
h2 { font-size: clamp(1.75rem, 4vw, 2.5rem); }
h3 { font-size: 1.3rem; }
p { margin: 0 0 1em; }
p:last-child { margin-bottom: 0; }
a { color: inherit; }
:focus-visible { outline: 2px solid var(--goud); outline-offset: 4px; }
[id] { scroll-margin-top: 1.5rem; }
.skip {
position: absolute; left: 1rem; top: -5rem; z-index: 60;
background: var(--wit); color: var(--zwart); padding: .75rem 1rem;
}
.skip:focus { top: 1rem; } .knop {
display: inline-flex; align-items: center; justify-content: center;
min-height: 52px; padding: .85rem 1.9rem;
font-family: var(--serif); font-size: 1rem; letter-spacing: .06em;
text-decoration: none; text-align: center;
background: var(--goud); color: var(--zwart);
border: 1px solid var(--goud);
transition: background-color .25s ease, color .25s ease;
}
.knop:hover { background: transparent; color: var(--goud); }
.knop--licht:hover { color: var(--goud-donker); border-color: var(--goud-donker); }
.tekstlink {
display: inline-flex; align-items: center; min-height: 44px;
font-size: .95rem; font-weight: 600;
text-decoration: underline; text-decoration-color: var(--goud);
text-decoration-thickness: 1px; text-underline-offset: .35em;
}
.tekstlink:hover { text-decoration-thickness: 2px; } .top {
background: var(--zwart); color: var(--wit);
padding: .75rem var(--rand) .5rem;
display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
gap: .25rem 2rem;
}
.wordmark {
display: inline-flex; align-items: center; min-height: 44px;
font-family: var(--serif); font-size: 1.2rem; letter-spacing: .14em;
color: var(--wit); text-decoration: none;
}
.nav ul {
list-style: none; margin: 0 0 0 -.6rem; padding: 0;
display: flex; flex-wrap: wrap; column-gap: .1rem;
}
.nav ul a {
display: inline-flex; align-items: center; min-height: 44px;
padding: 0 .6rem;
font-size: .9375rem; color: var(--grijs-op-zwart); text-decoration: none;
}
.nav ul a:hover { color: var(--wit); text-decoration: underline; text-decoration-color: var(--goud); text-underline-offset: .4em; }
.nav__plan { display: none; }
@media (min-width: 1040px) {
.top { flex-wrap: nowrap; padding-block: 1rem; }
.nav { display: flex; align-items: center; gap: 1.5rem; }
.nav ul { margin: 0; }
.nav__plan { display: inline-flex; min-height: 44px; padding: .5rem 1.25rem; font-size: .9375rem; }
} @media (max-width: 959.98px) {
header.top { display: none; }
} .sectie { padding-block: var(--ruimte); }
.wrap { width: min(100% - 2 * var(--rand), 72rem); margin-inline: auto; }
.kop { max-width: 38rem; margin-bottom: clamp(2.5rem, 5vw, 4rem); }
.kop h2 { margin-bottom: .6em; }
.kop p { color: var(--grijs); }
.donker { background: var(--zwart); color: var(--wit); }
.donker .kop p { color: var(--grijs-op-zwart); }
.noot { font-size: .9375rem; line-height: 1.6; color: var(--grijs); max-width: 40rem; }
.donker .noot { color: var(--grijs-op-zwart); } .hero {
background: var(--zwart); color: var(--wit);
padding: 1.75rem var(--rand) var(--ruimte);
display: grid; gap: 2.75rem;
}
.hero__beeld {
justify-self: center;
width: min(100%, 34rem);
padding: 10px;
border: 1px solid rgba(162, 144, 97, .6);
}
.hero__beeld img {
width: 100%; height: auto;
aspect-ratio: 900 / 1140;
object-fit: contain;
background: var(--zwart);
}
.hero__tekst { max-width: 34rem; }
.hero h1 {
font-size: clamp(2.2rem, 9vw, 4.4rem);
line-height: 1.08;
margin-bottom: .6em;
}
.hero__lead { font-size: 1.2rem; line-height: 1.6; }
.hero__tekst p:not(.hero__lead) { color: var(--grijs-op-zwart); }
.hero__acties {
display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 2rem;
margin-top: 2.25rem;
}
.hero .tekstlink { color: var(--wit); }
@media (min-width: 960px) {
.hero {
grid-template-columns: minmax(0, 1fr) minmax(0, min(42vw, max(22rem, calc((100vh - 15rem) * .79)), 38rem));
align-items: center;
column-gap: clamp(3rem, 7vw, 7rem);
padding-block: clamp(2.5rem, 4vw, 3.5rem);
padding-inline: max(var(--rand), (100% - 78rem) / 2);
}
.hero__beeld { grid-column: 2; grid-row: 1; width: 100%; }
.hero__tekst { grid-column: 1; grid-row: 1; justify-self: end; }
}
@media (prefers-reduced-motion: no-preference) {
.hero__beeld img { animation: oplichten 1.6s ease-out both; }
@keyframes oplichten { from { opacity: 0; } to { opacity: 1; } }
} .stappen__lijst {
list-style: none; margin: 0; padding: 0;
display: grid; gap: 2.75rem;
}
.stappen__lijst li { border-top: 1px solid var(--goud); padding-top: 1.5rem; }
.stappen__nr {
display: block;
font-family: var(--serif); font-size: 2.75rem; line-height: 1;
color: var(--goud-donker);
margin-bottom: 1rem;
}
.stappen h3 { margin-bottom: .5em; }
.stappen p { color: var(--grijs); max-width: 30rem; }
@media (min-width: 760px) {
.stappen__lijst { grid-template-columns: repeat(3, 1fr); gap: clamp(2rem, 4vw, 4rem); }
} .manieren { background: var(--wit); }
.manieren__rij { display: grid; }
.manier { padding-block: 2rem; border-top: 1px solid var(--goud); }
.manier:last-child { border-bottom: 1px solid var(--goud); }
.manier h3 { font-size: 1.5rem; margin-bottom: .5em; }
.manier p { color: var(--grijs); max-width: 30rem; }
.manier__links { display: flex; flex-wrap: wrap; gap: 0 1.75rem; margin-top: .75rem; }
@media (min-width: 820px) {
.manieren__rij { grid-template-columns: 1fr 1fr; }
.manier { padding: .5rem clamp(2rem, 5vw, 4.5rem) .5rem 0; border-top: 0; }
.manier:last-child { border-bottom: 0; border-left: 1px solid var(--goud); padding: .5rem 0 .5rem clamp(2rem, 5vw, 4.5rem); }
} .digitaal__rij {
list-style: none; margin: 0; padding: 0;
display: grid;
}
.keus {
padding-block: 1.75rem 2rem;
border-top: 1px solid var(--goud);
}
.keus h3 { font-size: 1.35rem; letter-spacing: .03em; }
.keus__prijs {
margin: .5rem 0 0;
font-family: var(--serif); font-size: clamp(2.2rem, 7vw, 3rem); line-height: 1.1;
color: var(--goud);
font-variant-numeric: lining-nums;
}
@media (min-width: 820px) {
.digitaal__rij { grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--goud); }
.keus { border-top: 0; padding: 2.25rem clamp(1.5rem, 3vw, 3rem) 2.5rem; }
.keus + .keus { border-left: 1px solid var(--goud-lijn); }
.keus:first-child { padding-left: 0; }
}
.ook {
margin-top: 2.5rem; padding-top: 1.5rem;
border-top: 1px solid var(--goud-lijn);
display: flex; flex-wrap: wrap; align-items: baseline; gap: .5rem 1.25rem;
}
.ook__titel { margin: 0; font-weight: 600; color: var(--wit); }
.ook ul {
list-style: none; margin: 0; padding: 0;
display: flex; flex-wrap: wrap; gap: .25rem 1.75rem;
color: var(--grijs-op-zwart);
}
.ook li { white-space: nowrap; }
.ook b { font-family: var(--serif); font-weight: 400; color: var(--goud); margin-left: .35rem; }
.digitaal .noot { margin-top: 1.5rem; } .tastbaar__rij {
list-style: none; margin: 0 0 2.5rem; padding: 0;
display: grid; gap: 1.25rem;
}
.ding {
display: grid; grid-template-columns: 4.5rem 1fr; column-gap: 1.25rem; align-items: start;
padding: 1.75rem 1.5rem;
background: var(--wit);
border: 1px solid var(--goud-lijn);
}
.vorm {
grid-row: span 3;
align-self: center; justify-self: center;
border: 1px solid var(--goud);
outline: 1px solid var(--goud-lijn); outline-offset: 4px;
}
.vorm--afdruk { width: 2.6rem; height: 3.25rem; }
.vorm--album  { width: 3.1rem; height: 3.1rem; box-shadow: inset 2px 0 0 var(--goud-lijn); }
.vorm--wand   { width: 4rem;   height: 2.6rem; }
.ding h3 { font-size: 1.25rem; }
.ding__prijs { margin: .35rem 0 .35rem; color: var(--grijs); font-size: .9375rem; }
.ding__prijs span { font-family: var(--serif); font-size: 1.6rem; color: var(--goud-donker); margin-left: .3rem; }
.ding__wat { margin: 0; color: var(--grijs); font-size: .9375rem; line-height: 1.6; }
@media (min-width: 860px) {
.tastbaar__rij { grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.ding {
grid-template-columns: 1fr; text-align: center;
padding: 2.5rem 1.75rem 2.25rem;
}
.vorm { grid-row: auto; margin-bottom: 1.75rem; height: auto; }
.vorm--afdruk { width: 4rem;  aspect-ratio: 4 / 5; }
.vorm--album  { width: 4.75rem; aspect-ratio: 1; }
.vorm--wand   { width: 6.5rem; aspect-ratio: 8 / 5; }
.ding__wat { max-width: 18rem; margin-inline: auto; }
} .producten { background: var(--gebroken-wit); }
.producten__rij { display: grid; gap: clamp(3.5rem, 8vw, 5rem); }
.product { min-width: 0; }
.product__beeld {
position: relative;
aspect-ratio: 3 / 2;
overflow: hidden;
background: #1c1c1c;
}
.product__beeld img { width: 100%; height: 100%; object-fit: cover; }
.product__beeld::after {
content: ""; position: absolute; inset: 10px;
border: 1px solid rgba(162, 144, 97, .7);
pointer-events: none;
} .product__beeld--klein {
width: 58%; margin: -2.75rem 0 0 auto;
border: 6px solid var(--gebroken-wit);
box-sizing: content-box;
}
.product__tekst { padding-top: 1.5rem; max-width: 32rem; }
.product__nr {
margin: 0 0 .5rem;
font-family: var(--serif); font-size: .9rem; letter-spacing: .12em;
color: var(--goud-donker);
}
.product h3 { font-size: clamp(1.4rem, 5vw, 1.75rem); margin-bottom: .55em; }
.product__tekst > p:not(.product__nr) { color: var(--grijs); }
.product__waar {
padding-left: .9rem; border-left: 1px solid var(--goud);
font-size: .9375rem; line-height: 1.6;
}
.product .tekstlink { margin-top: .25rem; }
@media (min-width: 900px) {
.producten__rij { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(2.5rem, 5vw, 5rem); row-gap: 4.5rem; align-items: start; } .product:nth-child(even) { margin-top: 5rem; }
}
.vrij {
margin-top: clamp(3.5rem, 7vw, 5.5rem);
max-width: 46rem;
padding: clamp(1.5rem, 4vw, 2.5rem);
background: var(--zwart); color: var(--wit);
border: 1px solid var(--goud);
}
.vrij__titel { font-size: clamp(1.25rem, 4.5vw, 1.6rem); margin-bottom: .7em; color: var(--wit); }
.vrij p { color: var(--grijs-op-zwart); }
.vrij__links { display: flex; flex-wrap: wrap; gap: 0 1.75rem; margin-top: 1rem; }
.vrij .tekstlink { color: var(--wit); } .collecties { background: var(--wit); }
.collecties__rij { display: grid; }
.collectie {
padding-block: 2.25rem 2.5rem;
border-top: 1px solid var(--goud);
}
.collectie:last-child { border-bottom: 1px solid var(--goud); }
.collectie h3 { font-size: 1.8rem; }
.collectie__prijs {
font-family: var(--serif); font-size: 2.2rem; line-height: 1.2;
color: var(--goud-donker);
margin: .35rem 0 1.25rem;
font-variant-numeric: lining-nums;
}
.collectie__inhoud {
list-style: none; margin: 0; padding: 1rem 0 0;
border-top: 1px solid var(--goud-lijn);
}
.collectie__inhoud li {
display: grid; grid-template-columns: 2.75rem 1fr; align-items: baseline;
padding-block: .45rem;
line-height: 1.5;
}
.collectie__inhoud .n {
font-family: var(--serif); font-size: 1.3rem; color: var(--goud-donker);
font-variant-numeric: lining-nums tabular-nums;
}
.collectie__inhoud .n--leeg::before {
content: ""; display: inline-block;
width: 1.1rem; border-top: 1px solid var(--goud);
transform: translateY(-.3em);
}
@media (min-width: 980px) {
.collecties__rij { grid-template-columns: repeat(3, 1fr); border-block: 1px solid var(--goud); }
.collectie { border: 0; padding: 2.5rem clamp(1.5rem, 3vw, 3rem) 3rem; }
.collectie:last-child { border-bottom: 0; }
.collectie + .collectie { border-left: 1px solid var(--goud-lijn); }
.collectie:first-child { padding-left: 0; }
.collectie:last-child { padding-right: 0; }
}
.collecties .noot { margin-top: 2rem; } .collectie h3 { font-size: clamp(1.35rem, 5.4vw, 1.8rem); text-wrap: balance; overflow-wrap: break-word; }
.collectie__inhoud li { overflow-wrap: break-word; }
@media (min-width: 980px) {
.collecties__rij { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.collectie:nth-child(odd) { padding-left: 0; padding-right: clamp(1.5rem, 3vw, 3rem); border-left: 0; }
.collectie:nth-child(even) { padding-left: clamp(1.5rem, 3vw, 3rem); padding-right: 0; border-left: 1px solid var(--goud-lijn); }
.collectie:nth-child(n+3) { border-top: 1px solid var(--goud-lijn); }
}
.betaling {
margin-top: clamp(2.5rem, 5vw, 4rem); max-width: 46rem;
padding: clamp(1.5rem, 4vw, 2.5rem);
background: var(--gebroken-wit); border: 1px solid var(--goud-lijn);
}
.betaling__titel { font-size: 1.25rem; margin-bottom: .75rem; }
.betaling__lijst { list-style: none; margin: 0; padding: 0; }
.betaling__lijst li { padding: .7rem 0; border-top: 1px solid var(--goud-lijn); color: var(--grijs); line-height: 1.55; overflow-wrap: break-word; } .vragen__lijst { max-width: 46rem; border-top: 1px solid var(--goud); }
.vraag { border-bottom: 1px solid var(--goud-lijn); }
.vraag summary {
display: flex; align-items: center; justify-content: space-between; gap: 1.5rem;
min-height: 56px; padding-block: .9rem;
cursor: pointer; list-style: none;
font-family: var(--serif); font-size: 1.1rem; letter-spacing: .02em; line-height: 1.4;
}
.vraag summary::-webkit-details-marker { display: none; }
.vraag summary::after {
content: "+"; flex: none;
font-family: var(--sans); font-size: 1.5rem; line-height: 1; color: var(--goud-donker);
}
.vraag[open] summary::after { content: "\2212"; }
.vraag p { color: var(--grijs); max-width: 40rem; padding-bottom: 1.25rem; margin: 0; } .slot__tekst { max-width: 38rem; }
.slot h2 { margin-bottom: .6em; }
.slot__tekst > p { color: var(--grijs-op-zwart); }
.slot__feiten { list-style: none; margin: 1.75rem 0 2.5rem; padding: 0; }
.slot__feiten li { padding: .8rem 0; border-top: 1px solid rgba(162, 144, 97, .6); }
.slot__feiten li:last-child { border-bottom: 1px solid rgba(162, 144, 97, .6); } .voet {
background: var(--zwart); color: var(--grijs-op-zwart);
border-top: 1px solid rgba(162, 144, 97, .35);
padding: 3rem var(--rand) 2.5rem;
font-size: .875rem; line-height: 1.6;
}
.voet__binnen { width: min(100%, 72rem); margin-inline: auto; display: grid; gap: 1.25rem; }
.voet p { margin: 0; }
.voet a:not(.wordmark) { display: inline-block; padding-block: .7rem; margin-block: -.7rem; color: var(--wit); text-decoration-color: var(--goud); text-underline-offset: .25em; }
.voet__links { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .25rem 1.5rem; }
.voet__links a:not(.wordmark) { padding-block: .75rem; margin-block: -.25rem; }
@media (prefers-reduced-motion: reduce) {
html { scroll-behavior: auto; }
*, *::before, *::after { transition: none !important; animation: none !important; }
}.hm-kop, .hm-voet {
--hm-goud: #A29061;
--hm-wit: #FFFFFF;
--hm-zacht: rgba(255, 255, 255, .86);
--hm-pad: clamp(1.25rem, 5vw, 3rem);
background: #000000;
color: var(--hm-wit);
font-family: "Open Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
font-size: 1rem;
line-height: 1.5;
}
.hm-kop *, .hm-voet *, .hm-kop *::before, .hm-voet *::before { box-sizing: border-box; }
.hm-kop a:focus-visible, .hm-voet a:focus-visible, .hm-kop button:focus-visible {
outline: 2px solid var(--hm-goud);
outline-offset: 3px;
} .hm-kop {
position: relative;
z-index: 20;
border-bottom: 1px solid rgba(162, 144, 97, .25);
}
.hm-kop__balk {
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
max-width: 80rem;
margin-inline: auto;
padding: .6rem var(--hm-pad);
}
.hm-woordmerk {
display: inline-flex;
align-items: center;
min-height: 44px;
font-family: "Cinzel", "Times New Roman", serif;
font-size: 1.2rem;
font-weight: 500;
letter-spacing: .14em;
color: var(--hm-wit);
text-decoration: none;
}
.hm-knop {
display: inline-flex;
align-items: center;
gap: .6rem;
min-width: 44px;
min-height: 44px;
padding: .5rem 1rem;
background: transparent;
color: var(--hm-wit);
border: 1px solid rgba(255, 255, 255, .5);
font: 600 .9rem "Open Sans", system-ui, sans-serif;
cursor: pointer;
}
.hm-knop[aria-expanded="true"] { border-color: var(--hm-goud); }
.hm-knop__lijnen { position: relative; width: 16px; height: 10px; }
.hm-knop__lijnen::before, .hm-knop__lijnen::after {
content: "";
position: absolute;
left: 0; right: 0;
height: 1.5px;
background: currentColor;
transition: transform .2s;
}
.hm-knop__lijnen::before { top: 0; }
.hm-knop__lijnen::after { bottom: 0; }
.hm-knop[aria-expanded="true"] .hm-knop__lijnen::before { transform: translateY(4.25px) rotate(45deg); }
.hm-knop[aria-expanded="true"] .hm-knop__lijnen::after { transform: translateY(-4.25px) rotate(-45deg); }
.hm-menu ul { list-style: none; margin: 0; padding: 0; }
.hm-menu a {
display: flex;
align-items: center;
min-height: 48px;
color: var(--hm-wit);
text-decoration: none;
}
.hm-menu a:hover { color: var(--hm-goud); }
.hm-menu li + li { border-top: 1px solid rgba(255, 255, 255, .08); }
.hm-menu li:has(.hm-cta) { border-top: 0; margin-top: 1rem; }
.hm-cta {
justify-content: center;
border: 1px solid var(--hm-goud);
color: var(--hm-goud) !important;
}
.hm-menu a.hm-cta:hover { background: var(--hm-goud); color: #000000 !important; }
.hm-pijl { margin-left: .3rem; color: var(--hm-goud); font-size: .875rem; }
.hm-sr {
position: absolute; width: 1px; height: 1px; overflow: hidden;
clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}  .hm-js .hm-menu, .hm-js-vooruit .hm-menu {
display: none;
position: absolute;
left: 0; right: 0; top: 100%;
background: #000000;
padding: .5rem var(--hm-pad) 1.75rem;
border-top: 1px solid rgba(162, 144, 97, .4);
max-height: calc(100vh - 4rem);
overflow-y: auto;
}
.hm-js .hm-menu.is-open, .hm-js-vooruit .hm-menu.is-open { display: block; }
html:not(.hm-js-vooruit) .hm-kop:not(.hm-js) .hm-knop { display: none; }
html:not(.hm-js-vooruit) .hm-kop:not(.hm-js) .hm-kop__balk { flex-wrap: wrap; }
@media (min-width: 1040px) {
.hm-knop { display: none !important; }
.hm-menu, .hm-js .hm-menu, .hm-js-vooruit .hm-menu {
display: block;
position: static;
padding: 0;
border: 0;
background: none;
max-height: none;
overflow: visible;
}
.hm-menu ul { display: flex; gap: 1.6rem; align-items: center; }
.hm-menu li + li { border: 0; }
.hm-menu li:has(.hm-cta) { margin: 0 0 0 .5rem; }
.hm-menu a { min-height: 44px; min-width: 44px; font-size: .95rem; }
.hm-cta { padding: 0 1.1rem; }
.hm-kop__balk { padding-block: 1rem; }
} @media (min-width: 1040px) {
.hm-menu a { white-space: nowrap; }
.hm-woordmerk { flex-shrink: 0; white-space: nowrap; }
}
@media (min-width: 1040px) and (max-width: 1199px) {
.hm-menu ul { gap: .65rem; }
.hm-menu li:has(.hm-cta) { margin-left: .25rem; }
.hm-cta { padding: 0 .85rem; }
}
@media (prefers-reduced-motion: reduce) {
.hm-knop__lijnen::before, .hm-knop__lijnen::after { transition: none; }
} .hm-voet {
border-top: 1px solid rgba(162, 144, 97, .35);
padding-block: 3.5rem 2.5rem;
font-size: .95rem;
}
.hm-voet__binnen {
max-width: 80rem;
margin-inline: auto;
padding-inline: var(--hm-pad);
}
.hm-voet__rooster { display: grid; gap: 2.5rem; }
.hm-voet h2 {
margin: 0 0 .5rem;
font-family: "Cinzel", "Times New Roman", serif;
font-size: 1rem;
font-weight: 400;
line-height: 1.2;
letter-spacing: .08em;
color: var(--hm-goud);
}
.hm-voet ul { list-style: none; margin: 0; padding: 0; }
.hm-voet a {
display: inline-flex;
align-items: center;
min-width: 44px;
min-height: 44px;
color: var(--hm-zacht);
text-decoration: none;
}
.hm-voet a:hover { color: var(--hm-goud); text-decoration: underline; }
.hm-voet address { font-style: normal; color: var(--hm-zacht); margin: .75rem 0 .5rem; }
.hm-voet .hm-woordmerk { color: var(--hm-wit); }
.hm-ext { margin-left: .45rem; font-size: .875rem; color: rgba(255, 255, 255, .7); }
@media (min-width: 640px) {
.hm-voet__rooster { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1040px) {
.hm-voet__rooster { grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 3rem; }
}  .hm-menu a[aria-current="page"] { color: var(--hm-goud); }  @media (min-width: 1040px) {
.hm-menu--acht .hm-mob { display: none; }
}
@media (min-width: 1040px) and (max-width: 1199px) {
.hm-menu--acht ul { gap: .55rem; }
.hm-menu--acht a { font-size: .88rem; }
.hm-menu--acht li:has(.hm-cta) { margin-left: .2rem; }
.hm-menu--acht .hm-cta { padding: 0 .7rem; }
}