.winkel.terra {
--terra-zij: 24px;
--winkel-letter: var(--winkel-letter-keuze, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif);
font-family: var(--winkel-letter);
}
.winkel.terra .shop-header.vorm-terra { height: 66px; background: var(--card, #fff); border-bottom: 0; }
.winkel.terra .shop-header.vorm-terra .shop-header-in { height: 66px; align-items: center; gap: 8px; }
.winkel.terra .shop-header.vorm-terra .shop-paneel-knop,
.winkel.terra .shop-header.vorm-terra .shop-kopknop,
.winkel.terra .shop-header.vorm-terra .shop-koptel,
.winkel.terra .shop-header.vorm-terra .shop-wagen,
.winkel.terra .shop-header.vorm-terra .shop-zoek input { height: 42px; }
.winkel.terra .shop-header.vorm-terra .shop-paneel-knop {
width: 142px;
background: var(--winkel-accent);
color: var(--nova-accent-op);
border: 0;
border-radius: var(--nova-r-klein, 8px);
}
.winkel.terra .shop-header.vorm-terra .shop-zoek { flex: 0 1 351px; }
.winkel.terra .shop-header.vorm-terra .shop-zoek input {
border: 1px solid var(--nova-lijn);
border-radius: var(--nova-r-klein, 8px);
background: var(--card, #fff);
}
.winkel.terra .shop-header.vorm-terra .shop-kopknop {
background: var(--nova-vlak);
border: 0;
border-radius: var(--nova-r-klein, 8px);
padding-inline: 18px;
}
.winkel.terra .shop-header.vorm-terra .shop-koptel {
width: 43px;
background: var(--nova-vlak);
border: 0;
border-radius: var(--nova-r-klein, 8px);
justify-content: center;
}
.winkel.terra .shop-header.vorm-terra .shop-kop-rechts { gap: 0; align-items: center; }
.winkel.terra .shop-header.vorm-terra .shop-kop-rechts > * + * { border-left: 1px solid var(--nova-lijn); padding-left: 12px; margin-left: 12px; }
.winkel.terra .shop-header.vorm-terra .shop-wagen {
background: var(--winkel-accent);
color: var(--nova-accent-op);
border: 0;
border-radius: var(--nova-r-klein, 8px);
padding-inline: 18px;
}
.winkel.terra .shop-menu.vorm-terra { height: 34px; background: var(--nova-vlak); border: 0; }
.winkel.terra.menu-ruim .shop-menu.vorm-terra,
.winkel.terra.menu-ruim .shop-menu.vorm-terra .shop-menu-in { height: 42px; }
.winkel.terra.menu-ruim .shop-menu2.vorm-terra { margin-top: -42px; height: 42px; }
.winkel.terra .shop-menu.vorm-terra .shop-menu-in {
height: 34px;
align-items: center;
min-width: 0;
gap: 36px;
padding-inline: 0 var(--menu2-b, 260px);
overflow-x: auto;
scrollbar-width: none;
}
.winkel.terra .shop-menu.vorm-terra .shop-menu-in::-webkit-scrollbar { display: none; }
.winkel.terra .shop-menu.vorm-terra .shop-menu-item { padding-inline: 0; align-self: stretch; display: flex; align-items: center; flex: 0 0 auto; }
.winkel.terra .shop-menu.vorm-terra .shop-menu-kop { color: var(--nova-inkt); font-weight: 500; }
.winkel.terra .shop-menu2.vorm-terra { position: relative; z-index: 3; margin: -34px 0 0 auto; height: 34px; width: max-content; background: transparent; border: 0; }
.winkel.terra .shop-menu2.vorm-terra .shop-menu2-in { height: 100%; display: flex; align-items: center; gap: 38px; padding-inline: 0; }
.winkel.terra .shop-menu2.vorm-terra a { color: var(--nova-inkt); font-weight: 500; white-space: nowrap; }
@media (max-width: 1023px) {
.winkel.terra .shop-menu.vorm-terra,
.winkel.terra .shop-menu2.vorm-terra { display: none; }
}
@media (min-width: 1024px) {
.winkel.terra .shop-pdp {
display: grid;
grid-template-columns: minmax(0, 651fr) minmax(0, 605fr);
gap: 46px;
align-items: start;
}
}
.winkel.terra .pdp-hoofdfoto,
.winkel.terra .shop-pdp-beeld {
border: 1px solid var(--nova-lijn);
border-radius: var(--hoek, 12px);
background: var(--card, #fff);
}
.winkel.terra .pdp-hoofdfoto { width: 100%; aspect-ratio: 1; object-fit: contain; }
.winkel.terra .pdp-strook img {
width: 93px;
height: 93px;
object-fit: contain;
border: 1px solid var(--nova-lijn);
border-radius: var(--nova-r-klein, 8px);
background: var(--card, #fff);
}
.winkel.terra .pdp-koopvorm {
background: var(--nova-vlak);
border-radius: var(--hoek, 12px);
padding: 24px;
}
.winkel.terra .pdp-vouwregel {
min-height: 58px;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px solid var(--nova-lijn);
}
.winkel.terra .shop-kaart {
border: 1px solid var(--nova-lijn);
border-radius: var(--hoek, 12px);
box-shadow: none;
background: var(--card, #fff);
}
.winkel.terra .shop-kaart:hover { border-color: var(--winkel-accent); }
.winkel.terra .btn-primary,
.winkel.terra .shop-kaart .nova-knop,
.winkel.terra .pdp-koop {
background: var(--winkel-accent);
color: var(--nova-accent-op);
border: 0;
border-radius: var(--nova-r-klein, 8px);
box-shadow: none;
font-weight: 600;
}
.winkel.terra .ghost {
background: var(--nova-vlak);
border: 0;
border-radius: var(--nova-r-klein, 8px);
color: var(--nova-inkt);
}
.winkel.terra .shop-filterbalk,
.winkel.terra .shop-catblok {
border: 1px solid var(--nova-lijn);
border-radius: var(--hoek, 12px);
box-shadow: none;
background: var(--card, #fff);
}
.winkel.terra h1, .winkel.terra h2, .winkel.terra h3,
.winkel.terra .shop-kaart h3, .winkel.terra .site-kop, .winkel.terra .pdp-titel {
font-family: var(--winkel-letter);
color: var(--nova-inkt);
font-weight: 700;
}
.winkel.terra .pdp-titel { font-size: 32px; line-height: 40px; font-weight: 700; margin: 0 0 12px; }
.winkel.terra .pdp-kort { font-size: 16px; line-height: 24px; color: var(--nova-inkt); }
.winkel.terra .pdp-beoordeling { font-size: 14px; line-height: 20px; }
.winkel.terra .pdp-artikelnr { font-size: 13px; line-height: 20px; }
.winkel.terra .pdp-koopvorm { padding: 20px; }
.winkel.terra .pdp-koopregel { display: flex; align-items: stretch; gap: 12px; }
.winkel.terra .pdp-koopregel .teller {
flex: 0 0 144px;
height: 62px;
background: var(--card, #fff);
border: 0;
border-radius: var(--nova-r-klein, 8px);
display: flex;
align-items: center;
justify-content: space-between;
}
.winkel.terra .pdp-koopregel .pdp-koop { flex: 1 1 auto; height: 62px; }
.winkel.terra .pdp-koopvorm .shop-betaallogos {
display: flex;
justify-content: center;
align-items: center;
gap: 16px;
margin-top: 20px;
}
@media (max-width: 1023px) {
.winkel.terra .shop-pdp { display: block; }
.winkel.terra .pdp-koopregel .teller { flex: 0 0 120px; }
}
@media (max-width: 559px) {
.winkel.terra .pdp-koopregel { flex-wrap: wrap; }
.winkel.terra .pdp-koopregel .teller { flex: 0 0 120px; }
.winkel.terra .pdp-koopregel .pdp-koop { flex: 1 1 100%; }
.winkel.terra .pdp-titel { font-size: 24px; line-height: 32px; }
.winkel.terra .pdp-koopvorm { padding: 16px; }
}
@media (max-width: 559px) {
.winkel.terra .shop-main { background: var(--nova-vlak); }
.winkel.terra .shop-kaart { background: var(--card, #fff); border-color: transparent; }
.winkel.terra .shop-main { padding-inline: 16px; }
.winkel.terra .shop-tegels {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 12px;
}
.winkel.terra .shop-lade-knop {
background: var(--winkel-accent);
color: var(--nova-accent-op);
border: 0;
border-radius: var(--nova-r-klein, 5px);
width: 44px;
height: 44px;
flex: none;
}
.winkel.terra .shop-header-in { flex-wrap: nowrap; gap: 8px; }
.winkel.terra .shop-header .shop-paneel-knop,
.winkel.terra .shop-header .shop-kopknop,
.winkel.terra .shop-header .shop-koptel { display: none; }
.winkel.terra .shop-header-in img { max-height: 32px; width: auto; }
.winkel.terra .shop-kaart .nova-prijs { flex-wrap: nowrap; white-space: nowrap; }
.winkel.terra .shop-kaart .nova-prijs > * { min-width: 0; }
.winkel.terra .shop-kaart .nova-sterren,
.winkel.terra .shop-kaart .nova-code,
.winkel.terra .shop-kaart .nova-titel { min-width: 0; overflow-wrap: anywhere; }
.winkel.terra .shop-kaart .nova-sterren { flex-wrap: nowrap; min-width: 0; }
.winkel.terra .shop-kaart .nova-sterren span {
font-size: 11px;
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.winkel.terra .shop-kaart { overflow: hidden; }
.winkel.terra .shop-lijstbalk {
display: flex;
flex-wrap: nowrap;
align-items: center;
gap: 12px;
min-height: 45px;
}
.winkel.terra .shop-lijstbalk .shop-inveld,
.winkel.terra .shop-lijstbalk .shop-weergave,
.winkel.terra .shop-lijstbalk select[name="per"] { display: none; }
.winkel.terra .shop-lijstbalk .shop-telling { flex: 1 1 auto; text-align: center; white-space: nowrap; }
.winkel.terra .shop-lijstbalk select[name="sorteer"] { flex: 0 0 auto; }
.winkel.terra .shop-filterknop {
height: 45px;
background: var(--card, #fff);
border: 1px solid var(--nova-lijn);
border-radius: var(--nova-r-klein, 5px);
color: var(--nova-inkt);
font-weight: 600;
}
.winkel.terra .shop-zoek-knop {
border: 1px solid var(--nova-lijn);
border-radius: var(--nova-r-klein, 5px);
width: 44px;
height: 44px;
flex: none;
background: var(--card, #fff);
}
}
.winkel.terra .shop-subtegels {
display: flex;
flex-wrap: nowrap;
gap: 8px;
overflow-x: auto;
scrollbar-width: none;
margin-bottom: 24px;
}
.winkel.terra .shop-subtegels::-webkit-scrollbar { display: none; }
.winkel.terra .shop-subtegel {
flex: 0 0 auto;
min-height: 56px;
padding: 8px 16px;
gap: 12px;
background: var(--nova-vlak);
border: 0;
border-radius: var(--nova-r-klein, 5px);
color: var(--nova-inkt);
font-weight: 600;
}
.winkel.terra .shop-subtegel:hover { background: var(--nova-vlak); color: var(--winkel-accent); }
.winkel.terra .shop-subtegel-beeld { width: 40px; height: 40px; flex: none; display: grid; place-items: center; }
.winkel.terra .shop-subtegel-beeld img { max-width: 100%; max-height: 100%; object-fit: contain; }
.winkel.terra .shop-kaart .nova-chip.nova-chip--wacht {
height: 26px;
display: inline-flex;
align-items: center;
padding-inline: 10px;
border-radius: var(--nova-r-mini, 4px);
background: var(--nova-groen);
color: var(--card, #fff);
font-size: 12px;
font-weight: 700;
}
.winkel.terra .shop-kaart .nova-inwagen,
.winkel.terra .shop-kaart .nova-hart {
width: 44px;
height: 44px;
flex: none;
border-radius: var(--nova-r-klein, 5px);
}
.winkel.terra .shop-kaart .nova-inwagen {
background: var(--winkel-accent);
color: var(--nova-accent-op);
border: 0;
}
.winkel.terra .shop-kaart .nova-hart {
background: var(--card, #fff);
border: 1px solid var(--nova-lijn);
color: var(--winkel-accent);
}
.winkel.terra .shop-menu.vorm-terra {
--menu-p: 12px;
}
.winkel.terra .shop-menu.vorm-terra .shop-menu-kop {
padding-inline: var(--menu-p);
}
.winkel.terra .shop-menu.vorm-terra .shop-menu-in > .shop-menu-item:first-child {
margin-inline-start: calc(var(--nova-zij) - var(--menu-p));
}
.winkel.terra {
--nova-h-groot: var(--h-groot, 65px);
--nova-h-klein: var(--h-klein, 36px);
--nova-teller-b: var(--teller-b, 2.0923);
--terra-icoonknop: 50px;
--terra-gat: 12px;
--terra-r-knop: var(--nova-r-klein);
--terra-r-veld: max(0px, calc(var(--nova-r-klein) - 1px));
--terra-teller-gedempt: color-mix(in srgb, var(--nova-inkt) 50%, var(--card));
--terra-veldlijn: color-mix(in srgb, var(--nova-lijn) 95%, var(--nova-inkt));
--terra-accent-zacht: color-mix(in srgb, var(--nova-accent) 6%, var(--card));
--terra-accent-licht: color-mix(in srgb, var(--nova-accent) 20%, var(--card));
--terra-accent-diep: color-mix(in srgb, var(--nova-accent) 88%, var(--nova-inkt));
--terra-neg-zacht: color-mix(in srgb, var(--neg) 15%, var(--card));
--terra-schaduw: 0 2px 5px color-mix(in srgb, var(--nova-inkt) 30%, transparent);
}
.winkel.terra .btn-primary,
.winkel.terra .pdp-koop,
.winkel.terra .afr-knop,
.winkel.terra .inlog-knop {
height: var(--nova-h-klein);
display: inline-flex;
align-items: center;
justify-content: center;
gap: var(--terra-gat);
padding-inline: var(--terra-gat);
border: 0;
border-radius: var(--terra-r-knop);
background: var(--nova-accent);
color: var(--nova-accent-op);
font-family: inherit;
font-size: 15px;
font-weight: 700;
line-height: 1;
text-decoration: none;
box-shadow: none;
cursor: pointer;
}
.winkel.terra .pdp-koop,
.winkel.terra .afr-knop {
height: var(--nova-h-groot);
padding-inline: calc(var(--terra-gat) * 2);
font-size: 18px;
}
.winkel.terra .btn-primary:hover,
.winkel.terra .pdp-koop:hover,
.winkel.terra .afr-knop:hover,
.winkel.terra .inlog-knop:hover { background: var(--terra-accent-diep); opacity: 1; }
.winkel.terra .btn-primary:active,
.winkel.terra .pdp-koop:active,
.winkel.terra .afr-knop:active { background: var(--terra-accent-diep); }
.winkel.terra .btn-primary[disabled],
.winkel.terra .pdp-koop[disabled],
.winkel.terra .afr-knop[disabled],
.winkel.terra .inlog-knop[disabled],
.winkel.terra .pdp-koop[aria-disabled="true"] {
background: var(--nova-vlak);
color: var(--terra-teller-gedempt);
box-shadow: none;
cursor: not-allowed;
}
.winkel.terra .btn-primary[disabled]:hover,
.winkel.terra .pdp-koop[disabled]:hover,
.winkel.terra .afr-knop[disabled]:hover { background: var(--nova-vlak); }
.winkel.terra .pdp-koop svg,
.winkel.terra .afr-knop svg { flex: none; }
.winkel.terra button.ghost,
.winkel.terra a.ghost,
.winkel.terra .pdp-knop-licht,
.winkel.terra .afr-knop-licht,
.winkel.terra .inlog-knop-wit {
height: var(--nova-h-klein);
display: inline-flex;
align-items: center;
justify-content: center;
gap: var(--terra-gat);
padding-inline: var(--terra-gat);
border: 1px solid var(--terra-veldlijn);
border-radius: var(--terra-r-veld);
background: var(--card);
color: var(--nova-accent);
font-family: inherit;
font-size: 15px;
font-weight: 700;
line-height: 1;
text-decoration: none;
box-shadow: none;
cursor: pointer;
}
.winkel.terra button.ghost:hover,
.winkel.terra a.ghost:hover,
.winkel.terra .pdp-knop-licht:hover,
.winkel.terra .afr-knop-licht:hover,
.winkel.terra .inlog-knop-wit:hover {
background: var(--terra-accent-zacht);
border-color: var(--terra-accent-zacht);
color: var(--nova-accent);
}
.winkel.terra button.ghost:active,
.winkel.terra a.ghost:active,
.winkel.terra .pdp-knop-licht:active,
.winkel.terra .afr-knop-licht:active,
.winkel.terra .inlog-knop-wit:active {
background: var(--nova-accent);
border-color: var(--nova-accent);
color: var(--nova-accent-op);
}
.winkel.terra button.ghost[disabled],
.winkel.terra .pdp-knop-licht[aria-disabled="true"] {
background: var(--nova-vlak);
border-color: var(--nova-lijn);
color: var(--terra-teller-gedempt);
cursor: not-allowed;
}
.winkel.terra button.ghost svg,
.winkel.terra .pdp-knop-licht svg { flex: none; }
.winkel.terra .pdp-koop.klein,
.winkel.terra .btn-primary.small,
.winkel.terra .afr-knop.klein,
.winkel.terra .afr-knop-klein {
height: var(--nova-h-klein);
display: inline-flex;
align-items: center;
justify-content: center;
gap: var(--terra-gat);
padding-inline: var(--terra-gat);
border: 0;
border-radius: var(--terra-r-veld);
background: var(--nova-accent);
color: var(--nova-accent-op);
font-size: 15px;
font-weight: 700;
line-height: 1;
}
.winkel.terra .pdp-wens,
.winkel.terra .shop-kaart.vorm-terra .nova-hart,
.winkel.terra .shop-kaart.vorm-terra .nova-inwagen {
width: var(--terra-icoonknop);
height: var(--terra-icoonknop);
flex: none;
display: grid;
place-items: center;
border-radius: var(--terra-r-veld);
box-shadow: none;
cursor: pointer;
}
.winkel.terra .pdp-wens,
.winkel.terra .shop-kaart.vorm-terra .nova-hart {
background: var(--card);
border: 1px solid var(--terra-veldlijn);
color: var(--nova-accent);
}
.winkel.terra .pdp-wens:hover,
.winkel.terra .shop-kaart.vorm-terra .nova-hart:hover {
background: var(--terra-accent-licht);
border-color: var(--terra-accent-licht);
color: var(--nova-accent);
}
.winkel.terra .pdp-wens:active,
.winkel.terra .shop-kaart.vorm-terra .nova-hart:active {
background: var(--nova-accent);
border-color: var(--nova-accent);
color: var(--nova-accent-op);
}
.winkel.terra .pdp-wens.aan,
.winkel.terra .shop-kaart.vorm-terra .nova-hart.aan {
background: var(--neg);
border-color: var(--neg);
color: var(--card);
}
.winkel.terra .pdp-wens.aan:hover,
.winkel.terra .shop-kaart.vorm-terra .nova-hart.aan:hover {
background: var(--terra-neg-zacht);
border-color: var(--terra-neg-zacht);
color: var(--neg);
}
.winkel.terra .pdp-wens svg,
.winkel.terra .shop-kaart.vorm-terra .nova-hart svg { fill: none; }
.winkel.terra .shop-kaart.vorm-terra .nova-inwagen {
background: var(--nova-accent);
color: var(--nova-accent-op);
border: 0;
border-radius: var(--terra-r-knop);
}
.winkel.terra .shop-kaart.vorm-terra .nova-inwagen:hover { background: var(--terra-accent-diep); }
.winkel.terra .teller {
border: 1px solid var(--terra-veldlijn);
border-radius: var(--terra-r-veld);
background: var(--card);
box-shadow: none;
}
.winkel.terra .teller.groot { --nova-teller-k: var(--teller-k, .785); }
.winkel.terra .teller button {
color: var(--terra-teller-gedempt);
font-size: 18px;
font-weight: 400;
}
.winkel.terra .teller.groot button { font-size: 22px; color: var(--terra-teller-gedempt); }
.winkel.terra .teller button:hover {
background: var(--terra-accent-zacht);
color: var(--terra-teller-gedempt);
}
.winkel.terra .teller.groot input {
font-size: 18px;
font-weight: 700;
color: var(--nova-inkt);
}
.winkel.terra .teller:hover { border-color: var(--nova-accent); }
.winkel.terra .teller:focus-within {
border-color: var(--nova-accent);
box-shadow: none;
}
.winkel.terra .teller:has(input:focus-visible) {
box-shadow: 0 0 0 2px var(--terra-accent-licht);
}
.winkel.terra .teller:has(input:disabled) {
opacity: 1;
background: var(--nova-vlak);
border-color: var(--nova-lijn);
pointer-events: none;
}
.winkel.terra .teller:has(input:disabled) button,
.winkel.terra .teller:has(input:disabled) input { color: var(--terra-teller-gedempt); }
.winkel.terra .pdp-koopvorm { gap: var(--terra-gat); }
.winkel.terra .pdp-aantal-kop {
font-size: 14px;
font-weight: 500;
color: var(--nova-inkt);
margin: 0 0 1px;
}
.winkel.terra .pdp-koopregel {
display: flex;
align-items: stretch;
gap: var(--terra-gat);
}
.winkel.terra .pdp-koopregel .teller {
flex: none;
height: var(--nova-h-groot);
border: 1px solid var(--terra-veldlijn);
border-radius: var(--terra-r-veld);
background: var(--card);
}
.winkel.terra .pdp-koopregel .teller:hover,
.winkel.terra .pdp-koopregel .teller:focus-within { border-color: var(--nova-accent); }
.winkel.terra .pdp-koopregel .pdp-koop {
flex: 1 1 auto;
height: var(--nova-h-groot);
}
@media (max-width: 767px) {
.winkel.terra .pdp-koopregel { flex-wrap: wrap; }
.winkel.terra .pdp-koopregel .pdp-koop { flex: 1 0 100%; }
}
.winkel.terra .pdp-voorraadwens .pdp-koop {
background: var(--terra-neg-zacht);
color: var(--neg);
box-shadow: none;
}
.winkel.terra .pdp-voorraadwens .pdp-koop:hover {
background: var(--neg);
color: var(--card);
}
.winkel.terra .pdp-voorraadwens-rij {
gap: var(--terra-gat);
align-items: stretch;
}
.winkel.terra .pdp-voorraadwens-rij .pdp-koop {
height: auto;
min-height: var(--nova-h-klein);
align-self: stretch;
}
.winkel.terra .pdp-vtabel-rij.uitverkocht { color: var(--terra-teller-gedempt); }
.winkel.terra .pdp-vtabel-rij.uitverkocht .pdp-vtabel-naam b,
.winkel.terra .pdp-vtabel-rij.uitverkocht .pdp-vtabel-prijs b { color: var(--terra-teller-gedempt); }
.winkel.terra .shop-header.vorm-terra .shop-btw-schakel {
width: 48px;
height: 26px;
border-radius: 999px;
background: var(--nova-vlak);
padding: 0;
}
.winkel.terra .shop-header.vorm-terra .shop-btw-schakel::after {
width: 20px;
height: 20px;
top: 3px;
left: 3px;
background: var(--card);
box-shadow: 0 1px 2px color-mix(in srgb, var(--nova-inkt) 20%, transparent);
}
.winkel.terra .shop-header.vorm-terra .shop-btw.aan .shop-btw-schakel { background: var(--nova-accent); }
.winkel.terra .shop-header.vorm-terra .shop-btw.aan .shop-btw-schakel::after { left: 25px; }
.winkel.terra.schaduw .pdp-koop,
.winkel.terra.schaduw .btn-primary,
.winkel.terra.schaduw .afr-knop,
.winkel.terra.schaduw .inlog-knop,
.winkel.terra.schaduw .shop-kaart.vorm-terra .nova-inwagen,
.winkel.terra.schaduw .pdp-wens.aan { box-shadow: var(--terra-schaduw); }
.winkel.terra.schaduw .pdp-koop[disabled],
.winkel.terra.schaduw .afr-knop[disabled],
.winkel.terra.schaduw button.ghost,
.winkel.terra.schaduw .pdp-knop-licht,
.winkel.terra.schaduw .teller { box-shadow: none; }
.winkel.terra .pdp-koop:focus-visible,
.winkel.terra .btn-primary:focus-visible,
.winkel.terra .afr-knop:focus-visible,
.winkel.terra .inlog-knop:focus-visible,
.winkel.terra button.ghost:focus-visible,
.winkel.terra a.ghost:focus-visible,
.winkel.terra .pdp-knop-licht:focus-visible,
.winkel.terra .afr-knop-licht:focus-visible,
.winkel.terra .pdp-wens:focus-visible,
.winkel.terra .shop-kaart.vorm-terra .nova-hart:focus-visible,
.winkel.terra .shop-kaart.vorm-terra .nova-inwagen:focus-visible {
outline: 0;
box-shadow: 0 0 0 3px var(--terra-accent-licht);
}
.winkel.terra .teller button:focus-visible {
outline: 2px solid var(--nova-accent);
outline-offset: -2px;
border-radius: var(--terra-r-veld);
}
@media (max-width: 1180px) {
.winkel.terra .pdp-koop.klein,
.winkel.terra .afr-knop.klein,
.winkel.terra .afr-knop-klein,
.winkel.terra .btn-primary,
.winkel.terra .inlog-knop,
.winkel.terra button.ghost,
.winkel.terra a.ghost,
.winkel.terra .pdp-knop-licht,
.winkel.terra .afr-knop-licht,
.winkel.terra .inlog-knop-wit,
.winkel.terra .pdp-voorraadwens-rij .pdp-koop { min-height: 44px; }
}
.winkel.terra .pdp-prijs {
display: flex;
flex-wrap: wrap;
align-items: baseline;
column-gap: 9px;
row-gap: 3px;
font-size: 24px;
line-height: 1.2;
font-weight: 600;
color: var(--nova-inkt);
font-variant-numeric: tabular-nums;
}
.winkel.terra .pdp-prijs .klein:not(:last-child) {
order: -1;
flex: 0 0 100%;
font-size: 13px;
line-height: 1.3;
font-weight: 400;
color: var(--nova-inkt);
}
.winkel.terra .pdp-prijs .klein:last-child {
order: 1;
font-size: 14px;
line-height: 1.3;
font-weight: 400;
color: color-mix(in srgb, var(--nova-inkt) 80%, transparent);
}
.winkel.terra .pdp-prijs s {
order: 3;
flex: 0 0 100%;
margin: 0;
font-size: 14px;
line-height: 1.3;
font-weight: 400;
color: color-mix(in srgb, var(--nova-inkt) 65%, transparent);
text-decoration-line: line-through;
text-decoration-thickness: 1px;
}
.winkel.terra .pdp-prijs:has(s) { color: var(--neg); }
.winkel.terra .pdp-tweedeprijs {
font-size: 14px;
line-height: 1.3;
margin-top: 4px;
color: color-mix(in srgb, var(--nova-inkt) 80%, transparent);
}
.winkel.terra .pdp-prijsbron {
display: inline-flex;
align-items: center;
height: 23px;
margin-top: 10px;
padding: 0 6px;
border-radius: var(--nova-r-klein);
background: color-mix(in srgb, var(--pos) 15%, var(--card));
color: var(--pos);
font-size: 12px;
line-height: 1;
font-weight: 600;
}
.winkel.terra .pdp-inlogprijs b { font-size: 24px; line-height: 1.2; font-weight: 600; color: var(--nova-inkt); }
.winkel.terra .pdp-inlogprijs span { font-size: 14px; line-height: 1.3; color: color-mix(in srgb, var(--nova-inkt) 80%, transparent); }
.winkel.terra .pdp-staffels {
display: block;
margin: 14px 0;
border: 2px solid var(--nova-lijn);
border-radius: var(--nova-r-klein);
background: var(--card);
overflow: hidden;
}
.winkel.terra .pdp-staffel {
display: grid;
grid-template-columns: 40.6% minmax(0, 1fr) auto;
align-items: center;
gap: 0;
min-height: 34px;
padding: 4px 11px;
border: 0;
border-radius: 0;
box-shadow: none;
min-width: 0;
font-size: 15px;
line-height: 1.3;
color: var(--nova-inkt);
text-decoration: none;
}
.winkel.terra .pdp-staffel + .pdp-staffel { border-top: 2px solid var(--nova-lijn); }
.winkel.terra .pdp-staffel small {
grid-column: 1;
grid-row: 1;
font-size: 15px;
color: var(--nova-inkt);
white-space: normal;
}
.winkel.terra .pdp-staffel span {
grid-column: 2;
grid-row: 1;
font-size: 15px;
color: var(--pos);
white-space: nowrap;
}
.winkel.terra .pdp-staffel b {
grid-column: 3;
grid-row: 1;
font-size: 15px;
font-weight: 600;
text-align: right;
white-space: nowrap;
font-variant-numeric: tabular-nums;
}
.winkel.terra .pdp-staffel:hover { background: var(--nova-vlak); }
.winkel.terra .pdp-staffel.aan { background: var(--nova-vlak); box-shadow: none; }
.winkel.terra .pdp-staffel.aan b { color: var(--winkel-accent); }
.winkel.terra .pdp-staffel:focus-visible {
outline: 2px solid var(--winkel-accent);
outline-offset: -2px;
}
.winkel.terra .pdp-vtabel {
border: 2px solid var(--nova-lijn);
border-radius: var(--nova-r-klein);
background: var(--card);
font-size: 15px;
}
.winkel.terra .pdp-vtabel-kop {
height: 31px;
min-height: 0;
padding: 0 11px;
gap: 12px;
background: var(--nova-vlak);
border-bottom: 2px solid var(--nova-lijn);
font-size: 15px;
font-weight: 600;
color: var(--nova-inkt);
}
.winkel.terra .pdp-vtabel-rij {
min-height: 34px;
padding: 6px 11px;
gap: 12px;
background: var(--card);
}
.winkel.terra .pdp-vtabel-rij + .pdp-vtabel-rij::before {
left: 0;
right: 0;
height: 2px;
background: var(--nova-lijn);
}
.winkel.terra .pdp-vtabel-naam b { font-size: 15px; font-weight: 600; color: var(--nova-inkt); }
.winkel.terra .pdp-vtabel-naam small { font-size: 13px; color: color-mix(in srgb, var(--nova-inkt) 65%, transparent); }
.winkel.terra .pdp-vtabel-prijs b { font-size: 15px; font-weight: 600; color: var(--nova-inkt); font-variant-numeric: tabular-nums; }
.winkel.terra .pdp-vtabel-prijs small { font-size: 13px; color: color-mix(in srgb, var(--nova-inkt) 80%, transparent); }
.winkel.terra .pdp-vtabel-voorraad { font-size: 15px; font-weight: 600; }
.winkel.terra .pdp-vtabel-voorraad.stand-ja { color: var(--pos); }
.winkel.terra .pdp-vtabel-voorraad.stand-nee { color: var(--neg); }
.winkel.terra .pdp-vtabel-rij:hover { background: var(--nova-vlak); }
.winkel.terra .pdp-vtabel-rij.gekozen { background: color-mix(in srgb, var(--pos) 15%, var(--card)); }
.winkel.terra .pdp-vtabel-rij.gekozen::after { width: 2px; background: var(--pos); }
.winkel.terra .pdp-vtabel-rij.uitverkocht { color: color-mix(in srgb, var(--nova-inkt) 65%, transparent); }
.winkel.terra .pdp-vtabel-rij.uitverkocht .pdp-vtabel-naam b,
.winkel.terra .pdp-vtabel-rij.uitverkocht .pdp-vtabel-prijs b,
.winkel.terra .pdp-vtabel-rij.uitverkocht .pdp-vtabel-naam small,
.winkel.terra .pdp-vtabel-rij.uitverkocht .pdp-vtabel-prijs small { color: color-mix(in srgb, var(--nova-inkt) 65%, transparent); }
.winkel.terra .pdp-vtabel-rij.uitverkocht .pdp-vtabel-aantal { opacity: .65; }
.winkel.terra .pdp-vtabel-voet {
padding: 12px 11px;
border-top: 2px solid var(--nova-lijn);
background: var(--card);
}
.winkel.terra .pdp-vtabel-som { color: color-mix(in srgb, var(--nova-inkt) 80%, transparent); font-size: 15px; }
.winkel.terra .pdp-vtabel-som b { color: var(--nova-inkt); font-size: 18px; }
.winkel.terra .pdp-vtabel .pdp-koop[disabled] {
opacity: .65;
cursor: not-allowed;
}
.winkel.terra .pdp-koopvorm .field {
position: relative;
gap: 10px;
margin-bottom: 32px;
}
.winkel.terra .pdp-koopvorm .field label {
font-size: 14px;
line-height: 1.3;
font-weight: 400;
color: color-mix(in srgb, var(--nova-inkt) 65%, transparent);
}
.winkel.terra .pdp-koopvorm .field select {
appearance: none;
height: 51px;
padding: 0 47px 0 19px;
border: 1px solid var(--nova-lijn);
border-radius: var(--nova-r-klein);
background: var(--card);
font-size: 16px;
color: var(--nova-inkt);
cursor: pointer;
}
.winkel.terra .pdp-koopvorm .field select:hover { border-color: color-mix(in srgb, var(--nova-inkt) 30%, var(--nova-lijn)); }
.winkel.terra .pdp-koopvorm .field select:focus-visible {
outline: 0;
border-color: var(--winkel-accent);
box-shadow: 0 0 0 3px color-mix(in srgb, var(--winkel-accent) 14%, transparent);
}
.winkel.terra .pdp-koopvorm .field select:disabled {
background: var(--nova-vlak);
color: color-mix(in srgb, var(--nova-inkt) 65%, transparent);
cursor: not-allowed;
}
.winkel.terra .pdp-koopvorm .field:has(select)::after {
content: "";
position: absolute;
right: 18px;
bottom: 24.5px;
width: 7px;
height: 7px;
border-right: 1.6px solid currentColor;
border-bottom: 1.6px solid currentColor;
transform: rotate(45deg);
color: color-mix(in srgb, var(--nova-inkt) 65%, transparent);
pointer-events: none;
}
.winkel.terra .pdp-artikelnr {
font-size: 14px;
line-height: 1.3;
color: color-mix(in srgb, var(--nova-inkt) 65%, transparent);
}
.winkel.terra .pdp-artikelnr b {
font-weight: 400;
color: var(--nova-inkt);
}
@media (max-width: 600px) {
.winkel.terra .pdp-vtabel-rij { padding: 12px 11px; }
.winkel.terra .pdp-vtabel-voet { padding: 12px 11px; }
.winkel.terra .pdp-staffel { grid-template-columns: minmax(0, 1fr) auto auto; column-gap: 10px; }
}
.winkel.terra {
--terra-goed: var(--pos);
--terra-goed-vlak: color-mix(in srgb, var(--pos) 15%, var(--card));
--terra-letop: var(--warn);
--terra-letop-vlak: color-mix(in srgb, var(--warn) 25%, var(--card));
--terra-fout: var(--neg);
--terra-fout-vlak: color-mix(in srgb, var(--neg) 15%, var(--card));
--terra-gedempt: color-mix(in srgb, var(--nova-inkt) 62%, var(--card));
}
.winkel.terra .nova-chip {
box-sizing: border-box;
height: 26px;
padding: 0 8px;
gap: 7px;
border: 0;
border-radius: var(--nova-r-mini);
font-size: 14px;
font-weight: 700;
color: var(--terra-goed);
background: var(--terra-goed-vlak);
}
.winkel.terra .nova-chip.nova-chip--bijna,
.winkel.terra .nova-chip.nova-chip--wacht {
color: var(--terra-letop);
background: var(--terra-letop-vlak);
}
.winkel.terra .nova-chip.nova-chip--nee {
color: var(--terra-fout);
background: var(--terra-fout-vlak);
}
.winkel.terra .nova-chiprij .nova-chip:not(:has(svg)) {
height: 32px;
padding: 0 12px;
font-size: 15px;
}
.winkel.terra .nova-chiprij {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px;
}
.winkel.terra .shop-kaart .nova-chip:has(svg),
.winkel.terra .pdp-voorraad .nova-chip:not(.nova-chip--wacht) {
height: auto;
padding: 0;
border-radius: 0;
background: none;
font-size: 14px;
font-weight: 700;
line-height: 20px;
}
.winkel.terra .shop-kaart .nova-chip svg {
width: 18px;
height: 18px;
stroke-width: 2.4;
flex: none;
}
.winkel.terra .pdp-voorraad .nova-chip:not(.nova-chip--wacht) { gap: 8px; }
.winkel.terra .pdp-voorraad .nova-chip:not(.nova-chip--wacht)::before {
content: "";
width: 6px;
height: 6px;
border-radius: 50%;
background: currentColor;
flex: none;
}
.winkel.terra .pdp-voorraad-zin {
font-size: 13px;
line-height: 20px;
color: var(--terra-gedempt);
}
.winkel.terra .pdp-voorraad {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px 16px;
}
.winkel.terra .pdp-bezorg-waarde.groen { color: var(--terra-goed); }
.winkel.terra .pdp-bezorg-rij.soort-levertijd .pdp-bezorg-waarde.groen {
display: inline-flex;
align-items: center;
gap: 8px;
font-weight: 700;
}
.winkel.terra .pdp-bezorg-rij.soort-levertijd .pdp-bezorg-waarde.groen::before {
content: "";
width: 6px;
height: 6px;
border-radius: 50%;
background: currentColor;
flex: none;
}
.winkel.terra .pdp-vestigingen {
border: 1px solid var(--nova-lijn);
border-radius: var(--hoek);
background: var(--card);
box-shadow: none;
}
.winkel.terra .pdp-vestigingen[open] summary,
.winkel.terra .pdp-vestiging { border-bottom-color: var(--nova-lijn); }
.winkel.terra .pdp-vestiging small { color: var(--terra-gedempt); }
.winkel.terra .nova-vestigingen { color: var(--winkel-accent); }
.winkel.terra .nova-vestigingen:hover,
.winkel.terra .nova-vestigingen:focus-visible { text-decoration: underline; }
.winkel.terra .pdp-voorraadwens {
border: 0;
border-radius: var(--hoek);
background: var(--nova-vlak);
padding: 20px;
}
.winkel.terra .pdp-voorraadwens label { font-size: 14px; font-weight: 700; color: var(--nova-inkt); }
.winkel.terra .pdp-voorraadwens-rij { gap: 12px; }
.winkel.terra .pdp-voorraadwens-rij input {
height: var(--nova-h);
padding: 0 12px;
border: 1px solid var(--nova-lijn);
border-radius: var(--nova-r-klein);
background: var(--card);
color: var(--nova-inkt);
}
.winkel.terra .pdp-voorraadwens .pdp-koop.klein {
height: auto;
align-self: stretch;
min-height: var(--nova-h);
padding-inline: 18px;
font-size: 14px;
}
.winkel.terra .pdp-voorraadwens-ok { color: var(--terra-goed); font-weight: 700; }
.winkel.terra .pdp-voorraadwens-fout { color: var(--terra-fout); }
.winkel.terra .pdp-voorraadwens input:disabled,
.winkel.terra .pdp-voorraadwens .pdp-koop:disabled {
opacity: .5;
cursor: not-allowed;
}
.winkel.terra {
--terra-goud: var(--winkel-ster, var(--nova-ster));
--terra-goud-leeg: color-mix(in srgb, var(--terra-goud) 35%, transparent);
}
.winkel.terra .nova-sterren {
height: 16px;
align-items: center;
gap: 6px;
}
.winkel.terra .nova-sterren .sterren {
flex: 0 0 88px;
width: 88px;
height: 16px;
}
.winkel.terra .nova-sterren .sterren .leeg,
.winkel.terra .nova-sterren .sterren .vol { gap: 2px; }
.winkel.terra .nova-sterren .sterren .vol { color: var(--terra-goud); }
.winkel.terra .nova-sterren .sterren .leeg { color: var(--terra-goud-leeg); }
.winkel.terra .nova-sterren .sterren svg { transform: scale(1.24); }
.winkel.terra .nova-sterren .oordeel {
font-size: 14px;
line-height: 16px;
font-weight: 400;
color: var(--nova-inkt);
}
.winkel.terra .pdp-oordeel {
display: inline-flex;
align-items: center;
gap: 6px;
margin: 0 0 12px;
color: var(--nova-inkt);
text-decoration: none;
width: fit-content;
}
.winkel.terra .pdp-oordeel b {
font-size: 14px;
line-height: 16px;
font-weight: 700;
color: var(--nova-inkt);
}
.winkel.terra .pdp-oordeel > span {
font-size: 14px;
line-height: 16px;
font-weight: 400;
color: var(--nova-inkt);
text-decoration: underline;
text-decoration-thickness: 1px;
text-underline-offset: 1px;
}
.winkel.terra .pdp-oordeel .nova-sterren .oordeel { display: none; }
.winkel.terra .shop-kaart .nova-sterren .oordeel { text-decoration: none; }
.winkel.terra .pdp-oordeel-item header .nova-sterren { height: 16px; }
.winkel.terra .pdp-oordeel:hover { opacity: 1; }
.winkel.terra .pdp-oordeel:hover > span { text-decoration-thickness: 2px; }
.winkel.terra .pdp-oordeel:focus-visible {
outline: 2px solid var(--winkel-accent);
outline-offset: 3px;
border-radius: var(--nova-r-klein);
}
.winkel.terra .pdp-oordelen-kop { gap: 6px; }
.winkel.terra .pdp-oordelen-kop .hoeveel {
font-size: 14px;
line-height: 16px;
color: var(--nova-inkt);
}
.winkel.terra .pdp-oordelen-kop .nova-sterren .oordeel { display: none; }
.winkel.terra .pdp-oordeel-item .nova-sterren .oordeel { display: none; }
.winkel.terra .pdp-oordelen-meer { gap: 12px; }
.winkel.terra .pdp-oordelen-meer svg { width: 20px; height: 20px; }
.winkel.terra .pdp-oordelen-vink:checked ~ .pdp-oordelen-meer svg { transform: rotate(180deg); }
.winkel.terra .chat-sterren .chat-ster { color: var(--terra-goud-leeg); }
.winkel.terra .chat-sterren .chat-ster:hover,
.winkel.terra .chat-sterren .chat-ster.aan { color: var(--terra-goud); }
.winkel.terra .chat-beoordeling .chat-start[disabled] {
opacity: .5;
cursor: default;
}
.winkel.terra .chat-sterren .chat-ster:focus-visible {
outline: 2px solid var(--winkel-accent);
outline-offset: 2px;
border-radius: var(--nova-r-klein);
}
.winkel.terra .shop-lijst {
grid-template-columns: minmax(0, 269fr) minmax(0, 1147fr);
gap: 18px 24px;
}
.winkel.terra .shop-filterkaart {
background: var(--card);
border: 0;
border-radius: var(--nova-r-klein);
box-shadow: none;
padding: 0 18px;
}
.winkel.terra .shop-catgroep,
.winkel.terra .shop-filtergroep {
padding: 21px 0 18px;
margin-bottom: 0;
background: none;
border-radius: 0;
}
.winkel.terra .shop-catgroep + .shop-catgroep,
.winkel.terra .shop-catgroep + .shop-filtervorm .shop-filtergroep:first-child,
.winkel.terra .shop-filtergroep + .shop-filtergroep {
border-top: 1px solid var(--nova-lijn);
margin-inline: -18px;
padding-inline: 18px;
}
.winkel.terra .shop-catgroep:not([open]),
.winkel.terra .shop-filtergroep:not([open]) {
padding-block: 10px 11px;
}
.winkel.terra .shop-catgroep-kop {
font-size: 16px;
line-height: 24px;
font-weight: 700;
color: var(--nova-inkt);
gap: 12px;
}
.winkel.terra .shop-catgroep-kop .chevron {
width: 22px;
height: 22px;
flex: 0 0 auto;
margin-right: -5px;
}
.winkel.terra .shop-catgroep:not([open]) > .shop-catgroep-kop .chevron,
.winkel.terra .shop-filtergroep:not([open]) > .shop-catgroep-kop .chevron {
transform: none;
}
.winkel.terra .shop-filtereenheid {
color: color-mix(in srgb, var(--nova-inkt) 50%, transparent);
font-weight: 400;
}
.winkel.terra .shop-filterlijst {
gap: 11px;
margin-top: 13px;
}
.winkel.terra .shop-filterregel {
align-items: center;
gap: 0;
padding: 0;
min-height: 20px;
font-size: 14px;
line-height: 20px;
color: var(--nova-inkt);
}
.winkel.terra .shop-filternaam {
flex: 0 1 auto;
margin-left: 13px;
}
.winkel.terra .shop-filteraantal {
margin-left: 4px;
font-size: 13px;
color: color-mix(in srgb, var(--nova-inkt) 50%, transparent);
}
.winkel.terra .shop-catvak {
width: 20px;
height: 20px;
border: 1px solid var(--nova-lijn);
border-radius: var(--nova-r-mini);
background-color: var(--card);
}
.winkel.terra .shop-filterregel input[type="checkbox"]:checked + .shop-catvak,
.winkel.terra .shop-catregel.actief .shop-catvak {
border-color: var(--winkel-accent);
background-size: 12px;
}
.winkel.terra .shop-filterregel:hover .shop-catvak,
.winkel.terra .shop-catregel:hover .shop-catvak {
border-color: var(--winkel-accent);
}
.winkel.terra .shop-filterregel:hover .shop-filternaam,
.winkel.terra .shop-catregel:hover { color: var(--winkel-accent); }
.winkel.terra .shop-filterregel input[type="checkbox"]:focus-visible + .shop-catvak {
outline: 2px solid var(--winkel-accent);
outline-offset: 2px;
}
.winkel.terra .shop-filterregel input[type="checkbox"]:disabled + .shop-catvak {
border-color: color-mix(in srgb, var(--nova-lijn) 60%, transparent);
background-color: var(--nova-vlak);
}
.winkel.terra .shop-filterregel input[type="checkbox"]:disabled ~ .shop-filternaam,
.winkel.terra .shop-filterregel input[type="checkbox"]:disabled ~ .shop-filteraantal {
color: color-mix(in srgb, var(--nova-inkt) 35%, transparent);
}
.winkel.terra .shop-filterregel:has(input[type="checkbox"]:disabled) {
cursor: default;
}
.winkel.terra .shop-filterregel:has(input[type="checkbox"]:disabled):hover .shop-catvak {
border-color: color-mix(in srgb, var(--nova-lijn) 60%, transparent);
}
.winkel.terra .shop-filtermeer > summary {
display: flex;
align-items: center;
gap: 12px;
font-size: 14px;
line-height: 20px;
color: var(--winkel-accent);
padding-top: 5px;
}
.winkel.terra .shop-filtermeer > summary::after {
content: "";
width: 7px;
height: 7px;
border-right: 1.5px solid currentColor;
border-bottom: 1.5px solid currentColor;
transform: translateY(-2px) rotate(45deg);
}
.winkel.terra .shop-filtermeer[open] > summary::after {
transform: translateY(2px) rotate(225deg);
}
.winkel.terra .shop-cat {
margin-top: 13px;
gap: 11px;
}
.winkel.terra .shop-catregel {
gap: 13px;
min-height: 20px;
font-size: 14px;
line-height: 20px;
}
.winkel.terra .shop-cat a.actief { font-weight: 400; }
.winkel.terra .shop-cattak-rij { min-height: 20px; gap: 12px; }
.winkel.terra .shop-cattak-knop {
width: 22px;
height: 22px;
margin-right: -5px;
border-radius: var(--nova-r-mini);
color: var(--nova-inkt);
}
.winkel.terra .shop-cattak-rij:hover .shop-cattak-knop {
background: color-mix(in srgb, var(--winkel-accent) 8%, transparent);
color: var(--winkel-accent);
}
.winkel.terra .shop-cattak-onder {
margin: 11px 0 0 10px;
padding-left: 13px;
gap: 11px;
border-left: 1px solid var(--nova-lijn);
}
.winkel.terra .shop-filterbereik {
margin-top: 13px;
gap: 8px;
}
.winkel.terra .shop-filterbereik input {
height: 40px;
width: 100%;
min-width: 0;
padding: 0 12px;
background: var(--card);
border: 1px solid var(--nova-lijn);
border-radius: var(--nova-r-mini);
font-size: 14px;
color: var(--nova-inkt);
text-align: left;
}
.winkel.terra .shop-filterbereik span,
.winkel.terra .shop-filterrand {
font-size: 13px;
color: color-mix(in srgb, var(--nova-inkt) 50%, transparent);
}
.winkel.terra .shop-filterrand { margin-top: 8px; }
.winkel.terra .shop-filterknoppen {
flex-wrap: wrap;
gap: 12px;
padding: 4px 0 21px;
}
.winkel.terra .shop-filterknoppen .btn-primary {
flex: 1 1 100%;
height: 40px;
background: var(--nova-vlak);
color: var(--nova-inkt);
border: 0;
border-radius: var(--nova-r-klein);
box-shadow: none;
font-size: 16px;
font-weight: 600;
}
.winkel.terra .shop-filterknoppen .btn-primary:hover {
background: color-mix(in srgb, var(--nova-vlak) 70%, var(--nova-lijn));
}
.winkel.terra .shop-filterknoppen .btn-primary:focus-visible {
outline: 2px solid var(--winkel-accent);
outline-offset: 2px;
}
.winkel.terra .shop-filterknoppen .ghost {
flex: 1 1 100%;
display: block;
width: 100%;
height: auto;
padding: 0;
background: none;
border: 0;
border-radius: 0;
text-align: left;
justify-content: flex-start;
text-decoration: underline;
text-underline-offset: 3px;
font-size: 14px;
font-weight: 400;
color: var(--nova-inkt);
}
.winkel.terra .shop-filterknoppen .ghost:hover { color: var(--winkel-accent); }
.winkel.terra .shop-filterknop {
height: 40px;
padding-inline: 18px;
background: var(--nova-vlak);
color: var(--nova-inkt);
border: 0;
border-radius: var(--nova-r-klein);
font-size: 16px;
font-weight: 600;
}
.winkel.terra .shop-filterknop-plus { font-size: 18px; font-weight: 400; line-height: 1; }
.winkel.terra .shop-lijst.filters-boven .shop-catgroep,
.winkel.terra .shop-lijst.filters-boven .shop-filtergroep {
border-top: 0;
margin-inline: 0;
padding-inline: 0;
}
.winkel.terra .shop-lijst.filters-boven,
.winkel.terra .shop-lijst.filters-knop {
grid-template-columns: minmax(0, 1fr);
}
@media (max-width: 1023px) {
.winkel.terra .shop-lijst { grid-template-columns: minmax(0, 1fr); }
}
.winkel.terra .shop-select {
height: 40px;
min-width: 129px;
padding: 0 40px 0 16px;
background-color: var(--card);
border: 1px solid var(--nova-lijn);
border-radius: var(--nova-r-mini);
font-size: 14px;
color: var(--nova-inkt);
font-weight: 600;
}
.winkel.terra .shop-inveld {
height: 40px;
padding: 0 16px;
background: var(--card);
border: 1px solid var(--nova-lijn);
border-radius: var(--nova-r-mini);
font-size: 14px;
}
.winkel.terra .shop-telling {
font-size: 14px;
color: color-mix(in srgb, var(--nova-inkt) 50%, transparent);
}
.winkel.terra .shop-weergave { gap: 8px; }
.winkel.terra .shop-weergave button {
width: 45px;
height: 45px;
background: var(--card);
border: 1px solid var(--nova-lijn);
border-radius: var(--nova-r-klein);
color: var(--nova-inkt);
}
.winkel.terra .shop-weergave button:first-child,
.winkel.terra .shop-weergave button:last-child {
border-radius: var(--nova-r-klein);
border-left: 1px solid var(--nova-lijn);
}
.winkel.terra .shop-weergave button.aan {
background: var(--nova-vlak);
border-color: var(--nova-vlak);
color: var(--nova-inkt);
}
.winkel.terra .shop-weergave button:hover {
border-color: var(--winkel-accent);
color: var(--winkel-accent);
}
.winkel.terra {
--terra-kop: 34px;
--terra-kop-h2: calc(var(--terra-kop) * .91);
--terra-kop-h3: calc(var(--terra-kop) * .82);
--terra-kop-h4: calc(var(--terra-kop) * .65);
--terra-kop-h5: calc(var(--terra-kop) * .53);
--terra-kop-steek: 1.25;
--terra-lees: 16px;
--terra-lees-steek: 28px;
--terra-lees-breed: 600px;
--terra-kruimel: 14px;
--terra-zacht: 65%;
--terra-nu: 80%;
--terra-weg: 50%;
}
.winkel.terra .shop-kruimels {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 11px;
font-size: var(--terra-kruimel);
line-height: 21px;
font-weight: 400;
padding-top: 20px;
margin: 0 0 32px;
}
.winkel.terra .shop-kruimels a {
color: color-mix(in srgb, var(--nova-inkt) var(--terra-weg), transparent);
text-decoration: none;
font-weight: 400;
}
.winkel.terra .shop-kruimels a:last-child,
.winkel.terra .shop-kruimels [aria-current="page"] {
color: color-mix(in srgb, var(--nova-inkt) var(--terra-nu), transparent);
font-weight: 400;
}
.winkel.terra .shop-kruimels .kruimel-terug {
display: inline-flex;
align-items: center;
gap: 6px;
margin-inline-start: -6px;
color: var(--nova-inkt);
}
.winkel.terra .shop-kruimels .kruimel-terug svg {
width: 16px;
height: 16px;
flex: none;
stroke-width: 2;
}
.winkel.terra .shop-kruimels > .shop-kruimel-scheiding,
.winkel.terra .shop-kruimels > span[aria-hidden="true"] {
flex: none;
display: inline-block;
width: 6px;
height: 10px;
font-size: 0;
background: currentColor;
color: color-mix(in srgb, var(--nova-inkt) var(--terra-weg), transparent);
clip-path: polygon(0 0, 1.8px 0, 6px 5px, 1.8px 10px, 0 10px, 4.2px 5px);
}
.winkel.terra .shop-kruimels a:hover {
color: var(--nova-inkt);
text-decoration: underline;
text-underline-offset: 2px;
}
.winkel.terra .shop-kruimels a:focus-visible {
color: var(--nova-inkt);
outline: 2px solid var(--winkel-accent);
outline-offset: 3px;
border-radius: var(--nova-r-mini, 4px);
}
.winkel.terra .shop-kruimels [aria-current="page"] {
cursor: default;
}
.winkel.terra h1,
.winkel.terra h2,
.winkel.terra h3,
.winkel.terra h4,
.winkel.terra h5 {
font-family: var(--winkel-letter);
color: var(--nova-inkt);
font-weight: 700;
line-height: var(--terra-kop-steek);
letter-spacing: 0;
text-wrap: balance;
margin: 0 0 16px;
}
.winkel.terra h1 { font-size: var(--terra-kop); }
.winkel.terra h2 { font-size: var(--terra-kop-h2); }
.winkel.terra h3 { font-size: var(--terra-kop-h3); }
.winkel.terra h4 { font-size: var(--terra-kop-h4); }
.winkel.terra h5 { font-size: var(--terra-kop-h5); }
.winkel.terra .shop-cattekst-in h3,
.winkel.terra .shop-lijsttekst-in h3,
.winkel.terra .shop-lijsttekst h3 {
margin-top: var(--terra-lees-steek);
}
.winkel.terra .shop-cattekst-in > h3:first-child,
.winkel.terra .shop-lijsttekst-in > h3:first-child,
.winkel.terra .shop-lijsttekst > h3:first-child {
margin-top: 0;
}
.winkel.terra .shop-lijsttitel {
font-size: var(--terra-kop-h3);
line-height: var(--terra-kop-steek);
font-weight: 700;
color: var(--nova-inkt);
margin: 0 0 16px;
text-wrap: balance;
}
.winkel.terra .shop-lijstkolom {
display: flex;
flex-direction: column;
min-width: 0;
}
.winkel.terra .shop-catkop {
position: relative;
overflow: hidden;
border-radius: var(--hoek, 12px);
height: 250px;
margin: 0 0 16px;
background: var(--nova-vlak);
}
.winkel.terra .shop-catkop.hoogte-sm { height: 175px; }
.winkel.terra .shop-catkop.hoogte-lg { height: 325px; }
.winkel.terra .shop-catkop-foto {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.winkel.terra .shop-catkop-waas {
position: absolute;
inset: 0;
display: flex;
align-items: flex-end;
padding: 20px 24px;
background: linear-gradient(180deg, transparent 45%, color-mix(in srgb, var(--nova-inkt) 55%, transparent));
}
.winkel.terra .shop-catkop.donker .shop-catkop-waas {
background: linear-gradient(180deg, color-mix(in srgb, var(--nova-inkt) 25%, transparent) 0%, color-mix(in srgb, var(--nova-inkt) 60%, transparent) 100%);
}
.winkel.terra .shop-catkop-titel {
margin: 0;
color: var(--card);
font-size: var(--terra-kop-h3);
line-height: var(--terra-kop-steek);
font-weight: 700;
}
.winkel.terra .shop-lijst.catkop-titel .shop-catkop-foto { display: none; }
.winkel.terra .shop-lijst.catkop-titel .shop-catkop { min-height: 0; height: auto; background: none; }
.winkel.terra .shop-lijst.catkop-titel .shop-catkop-waas { position: static; background: none; padding: 0; }
.winkel.terra .shop-lijst.catkop-titel .shop-catkop-titel { color: var(--nova-inkt); }
.winkel.terra .shop-cattekst {
margin: 0 0 24px;
}
.winkel.terra .shop-cattekst-in {
color: color-mix(in srgb, var(--nova-inkt) var(--terra-zacht), transparent);
font-size: var(--terra-lees);
line-height: var(--terra-lees-steek);
font-weight: 400;
max-width: var(--terra-lees-breed);
white-space: pre-line;
}
.winkel.terra .shop-cattekst-in p,
.winkel.terra .shop-cattekst-in ul,
.winkel.terra .shop-cattekst-in ol,
.winkel.terra .shop-lijsttekst-in p,
.winkel.terra .shop-lijsttekst p {
margin: 0 0 var(--terra-lees-steek);
}
.winkel.terra .shop-cattekst-in > *:first-child,
.winkel.terra .shop-lijsttekst-in > *:first-child,
.winkel.terra .shop-lijsttekst > *:first-child { margin-top: 0; }
.winkel.terra .shop-cattekst-in > *:last-child,
.winkel.terra .shop-lijsttekst-in > *:last-child,
.winkel.terra .shop-lijsttekst > *:last-child { margin-bottom: 0; }
.winkel.terra .shop-cattekst.gevouwen .shop-cattekst-in {
max-height: calc(4 * var(--terra-lees-steek));
overflow: hidden;
-webkit-mask-image: none;
mask-image: none;
}
.winkel.terra .pdp-meer {
display: inline-flex;
align-items: center;
gap: 12px;
margin-top: 12px;
padding: 0;
border: 0;
background: none;
font: inherit;
font-size: var(--terra-lees);
line-height: 24px;
font-weight: 400;
color: var(--winkel-accent);
cursor: pointer;
text-decoration: none;
}
.winkel.terra .pdp-meer svg {
width: 16px;
height: 16px;
flex: none;
stroke-width: 3;
transition: transform .15s ease;
}
.winkel.terra .pdp-meer:hover {
color: color-mix(in srgb, var(--winkel-accent) 82%, var(--nova-inkt));
text-decoration: underline;
text-underline-offset: 3px;
}
.winkel.terra .pdp-meer:active {
color: color-mix(in srgb, var(--winkel-accent) 70%, var(--nova-inkt));
}
.winkel.terra .pdp-meer:focus-visible {
outline: 2px solid var(--winkel-accent);
outline-offset: 3px;
border-radius: var(--nova-r-mini, 4px);
}
.winkel.terra .pdp-meer:disabled,
.winkel.terra .pdp-meer[aria-disabled="true"] {
color: color-mix(in srgb, var(--nova-inkt) var(--terra-weg), transparent);
text-decoration: none;
cursor: default;
}
.winkel.terra .shop-cattekst:not(.gevouwen) .pdp-meer svg,
.winkel.terra .pdp-verhaal:not(.gevouwen) .pdp-meer svg {
transform: rotate(180deg);
}
.winkel.terra .shop-cattekst.gevouwen .woord-minder,
.winkel.terra .shop-cattekst:not(.gevouwen) .woord-meer,
.winkel.terra .pdp-verhaal.gevouwen .woord-minder,
.winkel.terra .pdp-verhaal:not(.gevouwen) .woord-meer {
display: none;
}
.winkel.terra .shop-lijsttekst,
.winkel.terra .shop-lijsttekst-in {
color: color-mix(in srgb, var(--nova-inkt) var(--terra-zacht), transparent);
font-size: var(--terra-lees);
line-height: var(--terra-lees-steek);
max-width: var(--terra-lees-breed);
}
.winkel.terra .shop-lijst.cattekst-boven .shop-lijsttekst,
.winkel.terra .shop-lijst.cattekst-inklap .shop-lijsttekst {
order: -1;
margin: 0 0 24px;
}
.winkel.terra .shop-lijsttekst-inklap > summary {
cursor: pointer;
list-style: none;
padding: 12px 0;
color: var(--winkel-accent);
font-size: var(--terra-lees);
line-height: 24px;
font-weight: 400;
}
.winkel.terra .shop-lijsttekst-inklap > summary::-webkit-details-marker { display: none; }
.winkel.terra .shop-lijsttekst-inklap > summary::after {
content: " ▾";
color: var(--winkel-accent);
}
.winkel.terra .shop-lijsttekst-inklap[open] > summary::after { content: " ▴"; }
.winkel.terra .shop-lijsttekst-inklap > summary:hover { text-decoration: underline; text-underline-offset: 3px; }
.winkel.terra .shop-lijsttekst-inklap > summary:focus-visible {
outline: 2px solid var(--winkel-accent);
outline-offset: 3px;
border-radius: var(--nova-r-mini, 4px);
}
@media (max-width: 700px) {
.winkel.terra {
--terra-kop: 26px;
}
.winkel.terra .shop-kruimels {
flex-wrap: nowrap;
overflow-x: auto;
scrollbar-width: none;
padding-top: 14px;
margin-bottom: 20px;
}
.winkel.terra .shop-kruimels::-webkit-scrollbar { display: none; }
.winkel.terra .shop-kruimels a { white-space: nowrap; }
.winkel.terra .shop-catkop { height: 150px; }
.winkel.terra .shop-catkop.hoogte-lg { height: 200px; }
.winkel.terra .shop-catkop-waas { padding: 12px 16px; }
}
@media (prefers-reduced-motion: reduce) {
.winkel.terra .pdp-meer svg { transition: none; }
}
.winkel.terra .pdp-verhaal { position: relative; margin-top: 35px; }
.winkel.terra .pdp-verhaal-tekst {
font-size: 16px;
line-height: 25px;
color: var(--nova-inkt);
overflow-wrap: anywhere;
}
.winkel.terra .pdp-verhaal-tekst p,
.winkel.terra .pdp-verhaal-tekst ul,
.winkel.terra .pdp-verhaal-tekst ol { margin: 0 0 25px; }
.winkel.terra .pdp-verhaal-tekst > :first-child { margin-top: 0; }
.winkel.terra .pdp-verhaal-tekst > :last-child { margin-bottom: 0; }
.winkel.terra .pdp-verhaal-tekst h3 {
font-size: 16px;
line-height: 25px;
font-weight: 700;
color: var(--nova-inkt);
margin: 25px 0 0;
}
.winkel.terra .pdp-verhaal-tekst > h3:first-child {
font-size: 28px;
line-height: 36px;
margin: 0 0 24px;
}
.winkel.terra .pdp-verhaal-tekst ul { list-style: none; padding-left: 0; }
.winkel.terra .pdp-verhaal-tekst ul > li { position: relative; padding-left: 25px; margin: 0; }
.winkel.terra .pdp-verhaal-tekst ul > li::before {
content: "";
position: absolute;
left: 10px;
top: 10px;
width: 4px;
height: 4px;
border-radius: 50%;
background: currentColor;
}
.winkel.terra .pdp-verhaal-tekst ol { padding-left: 25px; }
.winkel.terra .pdp-verhaal-tekst li { margin: 0; }
.winkel.terra .pdp-verhaal-tekst a {
color: var(--winkel-accent);
text-decoration: underline;
text-underline-offset: 3px;
}
.winkel.terra .pdp-meer {
display: inline-flex;
align-items: center;
gap: 7px;
margin-top: 25px;
padding: 0;
border: 0;
background: none;
font-family: inherit;
font-size: 16px;
line-height: 25px;
font-weight: 600;
color: var(--winkel-accent);
cursor: pointer;
}
.winkel.terra .pdp-meer svg { transition: transform .15s ease; }
.winkel.terra .pdp-verhaal:not(.gevouwen) .pdp-meer svg { transform: rotate(180deg); }
.winkel.terra .pdp-verhaal.gevouwen .woord-minder,
.winkel.terra .pdp-verhaal:not(.gevouwen) .woord-meer { display: none; }
.winkel.terra .pdp-meer:hover { text-decoration: underline; text-underline-offset: 3px; }
.winkel.terra .pdp-meer:focus-visible { outline: 2px solid var(--winkel-accent); outline-offset: 3px; border-radius: var(--nova-r-klein, 8px); }
.winkel.terra .pdp-verhaal.gevouwen .pdp-verhaal-tekst {
max-height: 250px;
overflow: hidden;
-webkit-mask-image: linear-gradient(var(--nova-inkt) 62%, transparent);
mask-image: linear-gradient(var(--nova-inkt) 62%, transparent);
}
.winkel.terra .shop-pdp.pdp-tabs .pdp-verhaal-tekst { max-height: none; -webkit-mask-image: none; mask-image: none; }
.winkel.terra .pdp-specblok { margin-top: 35px; }
.winkel.terra .pdp-specblok h2 {
font-size: 18px;
line-height: 26px;
font-weight: 700;
color: var(--nova-inkt);
margin: 0 0 8px;
}
.winkel.terra .pdp-spectabel { margin: 0; }
.winkel.terra .pdp-specregel {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
align-items: baseline;
gap: 0;
padding: 14px 0;
border-bottom: 2px solid var(--nova-lijn);
font-size: 16px;
line-height: 20px;
color: var(--nova-inkt);
}
.winkel.terra .pdp-spectabel .pdp-specregel:last-child { border-bottom: 0; }
.winkel.terra .pdp-specregel dt,
.winkel.terra .pdp-specregel dd {
margin: 0;
color: var(--nova-inkt);
font-weight: 400;
text-align: left;
overflow-wrap: anywhere;
}
.winkel.terra .pdp-specregel dd a {
color: var(--nova-inkt);
text-decoration: underline;
text-decoration-thickness: 1px;
text-decoration-color: color-mix(in srgb, var(--nova-inkt) 50%, transparent);
text-underline-offset: 2px;
}
.winkel.terra .pdp-specregel dd a:hover { text-decoration-color: currentColor; }
.winkel.terra .pdp-specregel dd a:focus-visible { outline: 2px solid var(--winkel-accent); outline-offset: 2px; }
.winkel.terra .pdp-specblok { container-type: inline-size; }
@container (min-width: 868px) {
.winkel.terra .pdp-spectabel {
columns: 2;
column-gap: 48px;
column-rule: 2px solid var(--nova-lijn);
}
.winkel.terra .pdp-specregel {
grid-template-columns: minmax(0, 250fr) minmax(0, 160fr);
padding: 6px 0;
font-size: 14px;
line-height: 20px;
break-inside: avoid;
}
}
@media (max-width: 560px) {
.winkel.terra .pdp-specregel {
grid-template-columns: minmax(0, 1fr);
align-items: start;
row-gap: 2px;
padding: 12px 0;
}
.winkel.terra .pdp-specregel dt { font-weight: 600; }
}
.winkel.terra {
--terra-foto-verhouding: 654 / 500;
--terra-foto-lucht: 23px;
--terra-mini: 95px;
--terra-mini-gat: 12px;
--terra-mini-boven: 12px;
}
.winkel.terra .shop-pdp-beeld .pdp-hoofdfoto {
display: block;
box-sizing: border-box;
width: 100%;
height: auto;
aspect-ratio: var(--terra-foto-verhouding);
padding: var(--terra-foto-lucht);
object-fit: contain;
background: var(--card);
border: 1px solid var(--nova-lijn);
border-radius: var(--nova-r-klein);
}
.winkel.terra .shop-pdp-beeld .pdp-geenfoto {
box-sizing: border-box;
width: 100%;
height: auto;
aspect-ratio: var(--terra-foto-verhouding);
display: grid;
place-items: center;
background: var(--nova-vlak);
border: 1px solid var(--nova-lijn);
border-radius: var(--nova-r-klein);
color: var(--nova-gedempt);
}
.winkel.terra .shop-pdp-beeld .pdp-strook {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
gap: var(--terra-mini-gat);
margin-top: var(--terra-mini-boven);
}
.winkel.terra.strook-midden .shop-pdp-beeld .pdp-strook {
justify-content: center;
}
.winkel.terra .shop-pdp-beeld .pdp-strook img {
box-sizing: border-box;
width: var(--terra-mini);
height: var(--terra-mini);
flex: 0 0 auto;
object-fit: contain;
background: var(--card);
border: 1px solid var(--nova-lijn);
border-radius: var(--nova-r-klein);
cursor: pointer;
}
.winkel.terra .shop-pdp-beeld .pdp-strook img:hover {
border-color: var(--winkel-accent);
}
.winkel.terra .shop-pdp-beeld .pdp-strook img:focus-visible {
outline: 0;
border-color: var(--winkel-accent);
box-shadow: 0 0 0 3px color-mix(in srgb, var(--winkel-accent) 14%, transparent);
}
.winkel.terra .shop-pdp-beeld .pdp-strook img[aria-current] {
border-color: var(--winkel-accent);
box-shadow: inset 0 0 0 1px var(--winkel-accent);
}
.winkel.terra .shop-pdp-beeld .pdp-strook img[aria-disabled="true"] {
opacity: .45;
pointer-events: none;
}
.winkel.terra.uitverkocht-dof .shop-pdp:has(.nova-chip--nee) .pdp-hoofdfoto,
.winkel.terra.uitverkocht-dof .shop-pdp:has(.nova-chip--nee) .pdp-strook img {
opacity: .55;
}
@media (max-width: 700px) {
.winkel.terra {
--terra-foto-lucht: 12px;
}
}
.winkel.terra {
--terra-kenm-pilrand: var(--terra-veldlijn, color-mix(in srgb, var(--nova-lijn) 95%, var(--nova-inkt)));
--terra-kenm-ring: color-mix(in srgb, var(--nova-inkt) 10%, var(--card));
}
.winkel.terra .pdp-bovenregel {
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 12px;
margin-bottom: 12px;
flex-wrap: wrap;
}
.winkel.terra .pdp-bovenregel .pdp-paden,
.winkel.terra .pdp-bovenregel .pdp-paden a,
.winkel.terra .pdp-artikelnr {
font-size: 14px;
line-height: 20px;
}
.winkel.terra .pdp-bovenregel .pdp-paden {
display: flex;
flex-wrap: wrap;
gap: 12px;
min-width: 0;
}
.winkel.terra .pdp-artikelnr { white-space: nowrap; }
.winkel.terra .shop-kaart .nova-code {
font-size: 14px;
line-height: 20px;
color: color-mix(in srgb, var(--nova-inkt) 65%, var(--card));
font-weight: 400;
margin-top: 4px;
}
.winkel.terra .shop-kaart .nova-specs {
display: flex;
flex-wrap: wrap;
gap: 4px;
margin-top: 8px;
}
.winkel.terra .shop-kaart .nova-spec {
display: inline-flex;
align-items: center;
box-sizing: border-box;
height: 29px;
padding: 0 9px;
border: 1px solid var(--terra-kenm-pilrand);
border-radius: var(--nova-r-mini);
background: var(--card);
color: var(--nova-inkt);
font-size: 14px;
line-height: 20px;
font-weight: 400;
white-space: nowrap;
}
.winkel.terra .shop-kaart a.nova-spec { text-decoration: none; }
.winkel.terra .shop-kaart a.nova-spec:hover { border-color: var(--nova-inkt); }
.winkel.terra .shop-kaart a.nova-spec:focus-visible {
outline: 2px solid var(--winkel-accent);
outline-offset: 2px;
}
.winkel.terra .pdp-kenmerken {
margin: 24px 0 0;
border: 2px solid var(--nova-lijn);
border-radius: var(--nova-r-klein);
background: var(--card);
overflow: hidden;
}
.winkel.terra .pdp-kenmerk {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
min-height: 46px;
padding: 0 15px 0 16px;
border-bottom: 2px solid var(--nova-lijn);
font-size: 15px;
line-height: 20px;
color: var(--nova-inkt);
}
.winkel.terra .pdp-kenmerken .pdp-kenmerk:last-child { border-bottom: 0; }
.winkel.terra .pdp-kenmerk dt {
margin: 0;
font-weight: 400;
color: var(--nova-inkt);
}
.winkel.terra .pdp-kenmerk dd {
margin: 0;
display: inline-flex;
align-items: center;
gap: 12px;
text-align: right;
font-weight: 700;
color: var(--nova-inkt);
}
.winkel.terra .pdp-kenmerk dd svg {
flex: none;
width: 24px;
height: 24px;
padding: 4px;
box-sizing: border-box;
border-radius: 50%;
background: var(--nova-vlak);
border: 1px solid transparent;
color: var(--nova-inkt);
transition: background .12s ease, border-color .12s ease;
}
.winkel.terra a.pdp-kenmerk {
text-decoration: none;
color: inherit;
}
.winkel.terra a.pdp-kenmerk:hover dd svg,
.winkel.terra a.pdp-kenmerk:focus-visible dd svg {
background: var(--card);
border-color: var(--terra-kenm-ring);
}
.winkel.terra a.pdp-kenmerk:focus-visible {
outline: 2px solid var(--winkel-accent);
outline-offset: -2px;
border-radius: var(--nova-r-mini);
}
.winkel.terra a.pdp-kenmerk:active dd svg { background: var(--nova-vlak); }
.winkel.terra a.pdp-kenmerk[aria-disabled="true"] {
opacity: .45;
pointer-events: none;
}
.winkel.terra a.pdp-kenmerk[aria-disabled="true"] dd svg {
background: var(--nova-vlak);
border-color: transparent;
}
@media (max-width: 559px) {
.winkel.terra .pdp-kenmerken {
border-inline: 0;
border-block: 0;
border-radius: 0;
margin-top: 18px;
}
.winkel.terra .pdp-kenmerk {
min-height: 31px;
padding-inline: 0;
font-size: 14px;
gap: 10px;
}
.winkel.terra .pdp-kenmerken .pdp-kenmerk:last-child { border-bottom: 2px solid var(--nova-lijn); }
.winkel.terra .pdp-kenmerk dt { min-width: 0; }
.winkel.terra .pdp-kenmerk dd { flex: none; }
}
@media (max-width: 559px) {
.winkel.terra .shop-kaart .nova-spec { font-size: 13px; height: 26px; padding: 0 8px; }
}
.winkel.terra {
--terra-koop-rand: 24px;
--terra-koop-gat: 12px;
--terra-koop-hoek: var(--hoek, 8px);
--terra-plus-stap: 32px;
--terra-gegevens-h: 48px;
--terra-chevron: 24px;
}
.winkel.terra .shop-pdp-info {
display: flex;
flex-direction: column;
gap: 0;
min-width: 0;
}
.winkel.terra .shop-pdp-info > * { order: 14; }
.winkel.terra .shop-pdp-info > .pdp-oordeel { order: 1; align-self: flex-start; }
.winkel.terra .shop-pdp-info > .pdp-titelregel { order: 2; }
.winkel.terra .shop-pdp-info > .nova-chiprij { order: 3; }
.winkel.terra .shop-pdp-info > .pdp-kort { order: 4; }
.winkel.terra .shop-pdp-info > .pdp-bovenregel { order: 5; }
.winkel.terra .shop-pdp-info > .pdp-inlogprijs,
.winkel.terra .shop-pdp-info > .pdp-prijsvak { order: 6; }
.winkel.terra .shop-pdp-info > .pdp-staffels { order: 7; }
.winkel.terra .shop-pdp-info > .pdp-vtabel,
.winkel.terra .shop-pdp-info > .pdp-koopvorm { order: 8; }
.winkel.terra .shop-pdp-info > .pdp-voorraad { order: 9; }
.winkel.terra .shop-pdp-info > .pdp-voorraadwens { order: 10; }
.winkel.terra .shop-pdp-info > .shop-usp-lijst { order: 11; }
.winkel.terra .shop-pdp-info > .pdp-kenmerken { order: 12; }
.winkel.terra .shop-pdp-info > .pdp-hulp { order: 20; }
.winkel.terra .shop-pdp-info > .pdp-voorraad { margin-top: 26px; }
.winkel.terra .shop-pdp-info > .pdp-voorraad:not(:has(*)) { display: none; margin: 0; }
.winkel.terra .pdp-bovenregel {
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 12px;
flex-wrap: wrap;
margin: 20px 0 0;
}
.winkel.terra .shop-pdp-info > .pdp-prijsvak { margin: 31px 0 22px; }
.winkel.terra .shop-pdp-info > .pdp-inlogprijs { margin: 31px 0 0; }
.winkel.terra .pdp-paden { display: flex; flex-wrap: wrap; gap: 12px; }
.winkel.terra .pdp-paden a {
color: var(--winkel-accent);
text-decoration: underline;
text-decoration-thickness: 1px;
text-underline-offset: 3px;
}
.winkel.terra .pdp-paden a:hover { color: var(--terra-accent-diep, var(--winkel-accent)); }
.winkel.terra .pdp-paden a:focus-visible {
outline: 2px solid var(--winkel-accent);
outline-offset: 2px;
border-radius: var(--nova-r-mini);
}
.winkel.terra .pdp-koopvorm {
background: var(--nova-vlak);
border: 0;
border-radius: var(--terra-koop-hoek);
box-shadow: none;
padding: var(--terra-koop-rand);
margin: 0;
}
.winkel.terra .pdp-koopvorm select {
background: var(--card);
border: 1px solid var(--terra-veldlijn, var(--nova-lijn));
border-radius: var(--nova-r-klein);
color: var(--nova-inkt);
}
.winkel.terra .pdp-koopvorm select:hover { border-color: var(--winkel-accent); }
.winkel.terra .pdp-betalen {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
gap: 30px;
margin: 22px 0 0;
}
.winkel.terra .pdp-betaallogo {
height: 29px;
width: auto;
max-width: 68px;
padding: 0;
border: 0;
border-radius: 0;
background: none;
box-sizing: border-box;
}
.winkel.terra .pdp-betaalwijze {
font-size: 13px;
color: var(--terra-gedempt, var(--nova-inkt));
}
.winkel.terra .shop-usp-lijst {
display: flex;
flex-direction: column;
gap: calc(var(--terra-plus-stap) - 22px);
margin: 26px 0 0;
font-size: 16px;
line-height: 22px;
color: var(--nova-inkt);
}
.winkel.terra .shop-usp-lijst span { display: flex; align-items: center; }
.winkel.terra .shop-usp-lijst span::before {
color: var(--pos);
font-weight: 700;
margin-right: 14px;
}
.winkel.terra .pdp-kenmerken {
margin: 26px 0 0;
border: 1px solid var(--nova-lijn);
border-radius: var(--terra-koop-hoek);
background: var(--card);
overflow: hidden;
}
.winkel.terra .pdp-kenmerk {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
min-height: var(--terra-gegevens-h);
padding: 0 20px;
border-bottom: 1px solid var(--nova-lijn);
font-size: 15px;
color: var(--nova-inkt);
text-decoration: none;
}
.winkel.terra .pdp-kenmerk:last-child { border-bottom: 0; }
.winkel.terra .pdp-kenmerk dt { margin: 0; font-weight: 400; }
.winkel.terra .pdp-kenmerk dd {
margin: 0;
display: flex;
align-items: center;
gap: 12px;
font-weight: 700;
text-align: right;
}
.winkel.terra .pdp-kenmerk dd svg {
width: var(--terra-chevron);
height: var(--terra-chevron);
padding: 5px;
box-sizing: border-box;
border-radius: 50%;
background: var(--nova-vlak);
color: var(--nova-inkt);
flex: none;
}
.winkel.terra .pdp-kenmerk.klikbaar { cursor: pointer; }
.winkel.terra .pdp-kenmerk.klikbaar:hover { background: var(--nova-vlak); }
.winkel.terra .pdp-kenmerk.klikbaar:hover dd svg {
background: var(--winkel-accent);
color: var(--winkel-accent-op, var(--nova-accent-op));
}
.winkel.terra .pdp-kenmerk.klikbaar:focus-visible {
outline: 2px solid var(--winkel-accent);
outline-offset: -2px;
}
.winkel.terra .pdp-inlogprijs {
display: flex;
flex-direction: column;
align-items: stretch;
gap: 0;
background: var(--nova-vlak);
border: 0;
border-radius: var(--terra-koop-hoek);
box-shadow: none;
padding: var(--terra-koop-rand);
}
.winkel.terra .pdp-inlogprijs b { margin: 0; }
.winkel.terra .pdp-inlogprijs span { margin: 10px 0 0; }
.winkel.terra .pdp-inlogprijs .pdp-inlogknop {
display: flex;
align-items: center;
justify-content: center;
align-self: stretch;
flex: none;
width: 100%;
height: 62px;
margin: 24px 0 0;
border: 1px solid var(--card);
border-radius: var(--nova-r-klein);
background: var(--winkel-accent);
color: var(--winkel-accent-op, var(--nova-accent-op));
font-weight: 700;
text-align: center;
text-decoration: none;
box-shadow: none;
}
.winkel.terra.schaduw .pdp-inlogprijs .pdp-inlogknop { box-shadow: var(--terra-schaduw); }
.winkel.terra .pdp-inlogprijs .pdp-inlogknop:hover {
background: var(--terra-accent-diep, var(--winkel-accent));
color: var(--winkel-accent-op, var(--nova-accent-op));
}
.winkel.terra .pdp-inlogprijs .pdp-inlogknop:focus-visible {
outline: 0;
box-shadow: 0 0 0 2px var(--terra-accent-licht, var(--nova-vlak));
}
.winkel.terra .pdp-inlogprijs .pdp-inlogknop:active { transform: translateY(1px); }
.winkel.terra .pdp-inlogprijs .pdp-inlogknop[aria-disabled="true"] {
background: var(--nova-vlak);
border-color: var(--nova-lijn);
color: var(--terra-gedempt, var(--nova-inkt));
box-shadow: none;
pointer-events: none;
}
.winkel.terra .pdp-koopvorm:not(:has(.pdp-koop)) {
background: none;
padding: 0;
border-radius: 0;
}
.winkel.terra .pdp-koopvorm:not(:has(.pdp-koop)) .pdp-aantal-kop,
.winkel.terra .pdp-koopvorm:not(:has(.pdp-koop)) .pdp-koopregel { display: none; }
.winkel.terra .pdp-koopvorm-weg { display: none; padding: 0; background: none; }
.winkel.terra .pdp-koopbalk {
background: var(--card);
border-top: 1px solid var(--nova-lijn);
}
.winkel.terra .pdp-koopbalk-naam b { color: var(--nova-inkt); font-weight: 700; }
.winkel.terra .pdp-koopbalk-naam span { color: var(--terra-gedempt, var(--nova-inkt)); }
@media (max-width: 767px) {
.winkel.terra { --terra-koop-rand: 16px; }
.winkel.terra .pdp-betalen { gap: 18px; }
.winkel.terra .pdp-betaallogo { height: 24px; }
.winkel.terra .pdp-kenmerk { padding: 0 14px; }
.winkel.terra .pdp-inlogprijs .pdp-inlogknop { height: var(--nova-h-hoog); }
}
.winkel.terra {
--terra-hulp-rand: 48px;
--terra-hulp-rand-kaia: 36px;
--terra-hulp-kaart: 70px;
--terra-hulp-tegel: 35px;
--terra-hulp-icoon: 15px;
--terra-hulp-klein: 14px;
--terra-hulp-knop: 50px;
--terra-hulp-envelop: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 18'%3E%3Cpath fill-rule='evenodd' d='M0 0h24v18H0zM1.6 1.6v14.8h20.8V1.6zM3 3l9 6.6L21 3v2.2l-9 6.6-9-6.6z'/%3E%3C/svg%3E");
}
.winkel.terra .pdp-hulp {
margin-top: 24px;
padding: var(--terra-hulp-rand);
background: var(--nova-vlak);
border: 0;
border-radius: var(--terra-r-knop);
box-shadow: none;
container-type: inline-size;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(263px, 1fr));
column-gap: var(--terra-gat);
row-gap: 0;
align-items: stretch;
}
.winkel.terra .pdp-hulp > h2 {
grid-column: 1 / -1;
order: 1;
margin: 0;
font-family: var(--winkel-letter);
font-size: var(--terra-kop-h3);
line-height: 34px;
font-weight: 700;
color: var(--nova-accent);
}
.winkel.terra .pdp-hulp:not(.pdp-hulp-kaia) > p:not(.pdp-hulp-tijd) {
grid-column: 1 / -1;
order: 2;
margin: 0;
font-size: var(--terra-kop-h3);
line-height: 34px;
font-weight: 700;
color: var(--nova-inkt);
}
.winkel.terra .pdp-hulp .pdp-hulp-tijd {
grid-column: 1 / -1;
order: 3;
margin: 10px 0 0;
font-size: var(--terra-lees);
line-height: 24px;
font-weight: 400;
color: var(--nova-inkt);
}
.winkel.terra .pdp-hulp-tel,
.winkel.terra .pdp-hulp-mail {
position: relative;
order: 4;
margin: 34px 0 0;
min-width: 0;
min-height: var(--terra-hulp-kaart);
box-sizing: border-box;
display: flex;
align-items: center;
gap: var(--terra-gat);
padding: var(--terra-gat);
background: var(--card);
border: 0;
border-radius: var(--terra-r-knop);
box-shadow: none;
color: var(--nova-inkt);
font-size: var(--terra-lees);
line-height: 20px;
font-weight: 700;
text-decoration: none;
overflow-wrap: anywhere;
}
.winkel.terra .pdp-hulp-mail { order: 5; }
@container (max-width: 537px) {
.winkel.terra .pdp-hulp:has(.pdp-hulp-tel) .pdp-hulp-mail { margin-top: var(--terra-gat); }
}
.winkel.terra .pdp-hulp:not(:has(.pdp-hulp-tel)) .pdp-hulp-mail,
.winkel.terra .pdp-hulp:not(:has(.pdp-hulp-mail)) .pdp-hulp-tel {
grid-column: 1 / -1;
}
.winkel.terra .pdp-hulp-tel svg {
flex: none;
box-sizing: border-box;
width: var(--terra-hulp-tegel);
height: var(--terra-hulp-tegel);
padding: calc((var(--terra-hulp-tegel) - var(--terra-hulp-icoon)) / 2);
background: var(--nova-vlak);
border-radius: var(--terra-r-veld);
color: var(--nova-accent);
}
.winkel.terra .pdp-hulp-mail::before {
content: "";
flex: none;
width: var(--terra-hulp-tegel);
height: var(--terra-hulp-tegel);
background: var(--nova-vlak);
border-radius: var(--terra-r-veld);
}
@supports (mask-image: none) or (-webkit-mask-image: none) {
.winkel.terra .pdp-hulp-mail:not(:has(svg))::after {
content: "";
position: absolute;
left: var(--terra-gat);
top: 50%;
width: var(--terra-hulp-tegel);
height: var(--terra-hulp-tegel);
transform: translateY(-50%);
background: var(--nova-accent);
-webkit-mask-image: var(--terra-hulp-envelop);
mask-image: var(--terra-hulp-envelop);
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position: center;
mask-position: center;
-webkit-mask-size: 17px 13px;
mask-size: 17px 13px;
}
}
.winkel.terra .pdp-hulp-mail:has(svg)::before { display: none; }
.winkel.terra .pdp-hulp-mail svg {
flex: none;
box-sizing: border-box;
width: var(--terra-hulp-tegel);
height: var(--terra-hulp-tegel);
padding: calc((var(--terra-hulp-tegel) - var(--terra-hulp-icoon)) / 2);
background: var(--nova-vlak);
border-radius: var(--terra-r-veld);
color: var(--nova-accent);
}
.winkel.terra .pdp-hulp.pdp-hulp-kaia {
display: block;
margin-top: 24px;
padding: var(--terra-hulp-rand-kaia);
background: var(--nova-vlak);
border: 0;
border-radius: var(--terra-r-knop);
box-shadow: none;
}
.winkel.terra .pdp-hulp-kaia h2 {
margin: 0;
font-family: var(--winkel-letter);
font-size: var(--terra-kop-h3);
line-height: 34px;
font-weight: 700;
color: var(--nova-accent);
}
.winkel.terra .pdp-hulp-kaia h2 span { color: var(--nova-inkt); }
.winkel.terra .pdp-hulp-kaia p {
margin: 10px 0 0;
font-size: var(--terra-lees);
line-height: 24px;
font-weight: 400;
color: var(--nova-inkt);
}
.winkel.terra .pdp-hulp-kaia p b { font-weight: 700; }
.winkel.terra .pdp-hulp-chat {
display: inline-flex;
align-items: center;
justify-content: center;
height: var(--terra-hulp-knop);
margin-top: 30px;
padding-inline: 21px;
background: var(--nova-accent);
color: var(--nova-accent-op);
border: 0;
border-radius: var(--terra-r-knop);
box-shadow: none;
font-family: inherit;
font-size: var(--terra-lees);
font-weight: 700;
line-height: 1;
text-decoration: none;
cursor: pointer;
}
.winkel.terra .afr-hulp {
display: flex;
flex-direction: column;
text-align: right;
font-size: var(--terra-hulp-klein);
line-height: 20px;
color: var(--nova-inkt);
}
.winkel.terra .afr-hulp b { font-weight: 700; color: var(--nova-accent); }
.winkel.terra .shop-footer.vorm-terra .shop-socials-rij {
display: flex;
flex-wrap: wrap;
gap: var(--terra-gat);
}
.winkel.terra .shop-footer.vorm-terra .shop-social {
display: inline-flex;
align-items: center;
justify-content: center;
height: var(--terra-hulp-tegel);
min-width: var(--terra-hulp-tegel);
padding-inline: var(--terra-gat);
background: var(--nova-vlak);
border: 0;
border-radius: var(--terra-r-knop);
box-shadow: none;
color: var(--nova-inkt);
font-size: var(--terra-lees);
font-weight: 600;
line-height: 1;
text-decoration: none;
}
.winkel.terra .pdp-hulp-tel:hover,
.winkel.terra .pdp-hulp-mail:hover {
background: var(--terra-accent-zacht);
color: var(--nova-inkt);
text-decoration: none;
}
.winkel.terra .pdp-hulp-tel:active,
.winkel.terra .pdp-hulp-mail:active {
background: var(--terra-accent-licht);
color: var(--nova-inkt);
}
.winkel.terra .pdp-hulp-tel:focus-visible,
.winkel.terra .pdp-hulp-mail:focus-visible {
outline: 0;
box-shadow: 0 0 0 3px var(--terra-accent-licht);
}
.winkel.terra .pdp-hulp-chat:hover { background: var(--terra-accent-diep); color: var(--nova-accent-op); }
.winkel.terra .pdp-hulp-chat:active { background: var(--terra-accent-diep); }
.winkel.terra .pdp-hulp-chat:focus-visible {
outline: 0;
box-shadow: 0 0 0 3px var(--terra-accent-licht);
}
.winkel.terra .pdp-hulp-chat[aria-disabled="true"],
.winkel.terra .pdp-hulp-chat[disabled] {
background: var(--nova-vlak);
color: var(--terra-gedempt);
box-shadow: none;
cursor: not-allowed;
pointer-events: none;
}
.winkel.terra .shop-footer.vorm-terra .shop-social:hover {
background: var(--terra-accent-zacht);
color: var(--nova-inkt);
text-decoration: none;
}
.winkel.terra .shop-footer.vorm-terra .shop-social:active {
background: var(--terra-accent-licht);
}
.winkel.terra .shop-footer.vorm-terra .shop-social:focus-visible {
outline: 0;
box-shadow: 0 0 0 3px var(--terra-accent-licht);
}
@media (max-width: 559px) {
.winkel.terra .pdp-hulp,
.winkel.terra .pdp-hulp.pdp-hulp-kaia { padding: 24px; }
.winkel.terra .pdp-hulp-chat { width: 100%; }
}
.winkel.terra {
--terra-betaallogo-hoog: 24px;
}
.winkel.terra .shop-usp-lijst {
display: flex;
flex-direction: column;
gap: 12px;
font-size: 16px;
line-height: 20px;
font-weight: 400;
color: var(--nova-inkt);
margin: 2px 0 30px;
}
.winkel.terra .shop-usp-lijst span {
display: flex;
align-items: flex-start;
gap: 14px;
}
.winkel.terra .shop-usp-lijst span::before {
content: "✓";
flex: 0 0 14px;
color: var(--pos);
font-size: 19px;
line-height: 20px;
font-weight: 400;
margin-right: 0;
text-align: left;
}
.winkel.terra .pdp-betalen {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
gap: 27px;
min-height: 74px;
margin-top: 7px;
background: none;
border: 0;
padding: 0;
}
.winkel.terra .pdp-betalen .pdp-betaallogo,
.winkel.terra .shop-betaallogos .shop-betaallogo-beeld {
height: var(--terra-betaallogo-hoog);
width: auto;
max-width: none;
padding: 0;
border: 0;
border-radius: 0;
background: none;
box-sizing: border-box;
display: block;
object-fit: contain;
}
.winkel.terra .pdp-betalen .pdp-betaalwijze,
.winkel.terra .shop-betaallogos .shop-betaallogo {
display: inline-flex;
align-items: center;
height: auto;
padding: 0;
border: 0;
border-radius: 0;
background: none;
color: var(--nova-inkt);
font-size: 14px;
line-height: 20px;
font-weight: 600;
}
.winkel.terra .shop-footer .shop-betaallogos {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 27px;
}
.winkel.terra .shop-subtegels {
display: flex;
flex-wrap: wrap;
gap: 24px;
margin: 0 0 24px;
}
.winkel.terra .shop-subtegel {
display: inline-flex;
align-items: center;
gap: 20px;
padding: 0 20px 0 14px;
min-height: 64px;
box-sizing: border-box;
background: var(--nova-vlak);
border: 1px solid transparent;
border-radius: var(--nova-r-mini, 4px);
color: var(--nova-inkt);
text-decoration: none;
transition: background-color .2s, border-color .2s;
}
.winkel.terra .shop-subtegel:hover,
.winkel.terra .shop-subtegel:focus-visible {
background: var(--card);
border-color: var(--nova-lijn);
}
.winkel.terra .shop-subtegel:focus-visible {
outline: 2px solid var(--winkel-accent, var(--nova-accent));
outline-offset: 2px;
}
.winkel.terra .shop-subtegel:active {
background: var(--card);
border-color: var(--nova-lijn);
}
.winkel.terra .shop-subtegel-beeld {
width: 58px;
height: 38px;
flex: none;
display: grid;
place-items: center;
}
.winkel.terra .shop-subtegel-beeld img {
max-width: 100%;
max-height: 100%;
object-fit: contain;
}
.winkel.terra .shop-subtegel b {
font-size: 17px;
line-height: 20px;
font-weight: 600;
color: var(--nova-inkt);
}
.winkel.terra .site-blok > section.site-cta,
.winkel.terra .site-cta {
background: var(--nova-vlak);
border-radius: var(--nova-r-klein, 8px);
border: 0;
box-shadow: none;
padding: 24px 20px 20px;
box-sizing: border-box;
}
.winkel.terra .site-cta .site-cta-in {
text-align: left;
max-width: none;
margin: 0;
padding: 0;
}
.winkel.terra .site-cta h2 {
font-size: 28px;
line-height: 36px;
font-weight: 800;
color: var(--nova-inkt);
margin: 0 0 4px;
}
.winkel.terra .site-cta p {
font-size: 17px;
line-height: 24px;
font-weight: 400;
color: var(--terra-gedempt, color-mix(in srgb, var(--nova-inkt) 65%, var(--nova-vlak)));
margin: 0 0 26px;
}
.winkel.terra .site-cta .site-knop,
.winkel.terra .site-cta .btn-primary {
height: 50px;
padding-inline: 16px;
border-radius: var(--nova-r-mini, 4px);
font-size: 16px;
font-weight: 700;
background: var(--winkel-accent, var(--nova-accent));
color: var(--winkel-accent-op, var(--nova-accent-op));
}
@media (max-width: 559px) {
.winkel.terra .site-cta h2 { font-size: 24px; line-height: 30px; }
.winkel.terra .site-cta p { font-size: 16px; line-height: 22px; }
.winkel.terra .site-blok > section.site-cta,
.winkel.terra .site-cta { padding: 20px 16px 16px; }
.winkel.terra .shop-subtegels { gap: 12px; }
.winkel.terra .shop-subtegel { width: 100%; }
.winkel.terra .pdp-betalen { gap: 16px; min-height: 0; }
.winkel.terra .shop-footer .shop-betaallogos { gap: 16px; }
.winkel.terra .shop-usp-lijst { font-size: 15px; }
}
.winkel.terra .site-berichtkop {
display: flex;
flex-direction: column;
background: var(--nova-vlak);
border-radius: var(--nova-r-klein, 8px);
overflow: hidden;
padding-block: 0 28px;
margin-block-end: 0;
box-sizing: border-box;
}
.winkel.terra .site-berichtkop .site-berichtfoto {
order: -1;
aspect-ratio: 852 / 200;
width: auto;
height: auto;
max-width: none;
object-fit: cover;
border-radius: 0;
margin-block: 0;
}
.winkel.terra .site-berichtkop .site-berichtfoto { margin-inline: -20px; }
.winkel.terra.nova .site-berichtkop .site-berichtfoto {
margin-inline: calc(-1 * var(--nova-zij));
}
.winkel.terra .site-berichtkop h1 {
font-size: var(--terra-kop, 34px);
line-height: calc(var(--terra-kop, 34px) * var(--terra-kop-steek, 1.25));
font-weight: 800;
letter-spacing: -.01em;
color: var(--nova-inkt);
margin: 28px 0 0;
text-wrap: balance;
}
.winkel.terra .site-berichtkop .cell-sub {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 18px;
font-size: 13px;
line-height: 20px;
font-weight: 400;
color: var(--nova-inkt);
margin: 16px 0 0;
}
.winkel.terra .site-berichtkop .cell-sub time {
display: inline-flex;
align-items: center;
height: 29px;
padding-inline: 13px;
border: 1px solid var(--nova-lijn);
border-radius: var(--nova-r-mini, 4px);
background: transparent;
color: var(--nova-inkt);
box-sizing: border-box;
white-space: nowrap;
}
.winkel.terra .site-boom {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 11px;
font-size: var(--terra-kruimel, 14px);
line-height: 21px;
font-weight: 400;
padding-top: 0;
margin-block: 20px 0;
}
.winkel.terra .site-boom .site-boom-terug {
display: inline-flex;
align-items: center;
gap: 6px;
color: var(--nova-inkt);
text-decoration: none;
font-weight: 400;
}
.winkel.terra .site-boom .site-boom-links {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 11px;
}
.winkel.terra .site-boom .site-boom-link {
border: 0;
border-radius: 0;
background: none;
padding: 0;
font-size: inherit;
line-height: inherit;
color: color-mix(in srgb, var(--nova-inkt) var(--terra-weg, 50%), transparent);
text-decoration: none;
font-weight: 400;
}
.winkel.terra .site-boom .site-boom-link.aan {
border: 0;
background: none;
padding: 0;
color: color-mix(in srgb, var(--nova-inkt) var(--terra-nu, 80%), transparent);
font-weight: 400;
}
.winkel.terra .site-boom .site-boom-link:hover {
color: var(--nova-inkt);
text-decoration: none;
border-color: transparent;
background: none;
}
.winkel.terra .site-boom .site-boom-link + .site-boom-link::before {
content: "";
flex: none;
display: inline-block;
width: 6px;
height: 10px;
margin-inline-end: 11px;
vertical-align: -1px;
background: currentColor;
color: color-mix(in srgb, var(--nova-inkt) var(--terra-weg, 50%), transparent);
clip-path: polygon(0 0, 1.8px 0, 6px 5px, 1.8px 10px, 0 10px, 4.2px 5px);
}
.winkel.terra .site-boom a:focus-visible {
outline: 2px solid var(--winkel-accent);
outline-offset: 2px;
border-radius: var(--nova-r-mini, 4px);
}
.winkel.terra .site-berichtkop ~ .site-pagina {
gap: 36px;
padding-top: 36px;
}
.winkel.terra .site-berichtkop ~ .site-pagina .site-blok:not(.opm-vlak-grijs):not(.opm-vlak-accent) > section {
padding-block: 0;
}
.winkel.terra .site-berichtkop ~ .site-pagina .site-blok > section > :last-child {
margin-bottom: 0;
}
.winkel.terra .site-berichtkop ~ .site-pagina .site-blok > section > h2 {
font-size: var(--terra-kop-h2, 31px);
line-height: calc(var(--terra-kop-h2, 31px) * var(--terra-kop-steek, 1.25));
font-weight: 800;
letter-spacing: -.01em;
color: var(--nova-inkt);
margin: 0 0 18px;
}
.winkel.terra .site-berichtkop ~ .site-pagina .site-blok > section h3 {
font-size: 24px;
line-height: 32px;
font-weight: 700;
color: var(--nova-inkt);
margin: 18px 0 15px;
}
.winkel.terra .site-berichtkop ~ .site-pagina .site-blok > section p {
font-size: var(--terra-lees, 16px);
line-height: 25px;
max-width: 796px;
font-weight: 400;
color: color-mix(in srgb, var(--nova-inkt) var(--terra-zacht, 65%), transparent);
margin: 0 0 14px;
}
.winkel.terra .site-berichtkop ~ .site-pagina .site-blok > section p b,
.winkel.terra .site-berichtkop ~ .site-pagina .site-blok > section p strong {
font-weight: 700;
color: var(--nova-inkt);
}
.winkel.terra .site-berichtkop ~ .site-pagina .site-blok > section ul,
.winkel.terra .site-berichtkop ~ .site-pagina .site-blok > section ol {
font-size: var(--terra-lees, 16px);
line-height: 25px;
font-weight: 400;
color: var(--nova-inkt);
padding-inline-start: 24px;
max-width: 796px;
margin: 0 0 14px;
}
.winkel.terra .site-berichtkop ~ .site-pagina .site-blok > section li {
margin: 0;
}
.winkel.terra .site-berichtkop ~ .site-pagina .site-blok > section li b,
.winkel.terra .site-berichtkop ~ .site-pagina .site-blok > section li strong {
font-weight: 700;
color: var(--nova-inkt);
}
.winkel.terra .site-berichtkop ~ .site-pagina .site-blok > section p a,
.winkel.terra .site-berichtkop ~ .site-pagina .site-blok > section li a {
color: var(--winkel-accent);
text-decoration: underline;
text-underline-offset: 2px;
font-weight: 700;
}
.winkel.terra .site-pagina .site-blok > section.site-tekstfoto.vlak-accent {
background: var(--winkel-accent);
color: var(--nova-accent-op);
border-radius: var(--nova-r-klein, 8px);
border: 0;
box-shadow: none;
padding: 0;
overflow: hidden;
align-items: start;
gap: 0;
box-sizing: border-box;
}
.winkel.terra .site-pagina .site-blok > section.site-tekstfoto.vlak-accent .site-tekstfoto-in {
padding: 32px 36px 36px;
text-align: left;
box-sizing: border-box;
}
.winkel.terra .site-pagina .site-blok > section.site-tekstfoto.vlak-accent h2 {
font-size: 28px;
line-height: 36px;
font-weight: 800;
color: var(--nova-accent-op);
margin: 0 0 20px;
}
.winkel.terra .site-pagina .site-blok > section.site-tekstfoto.vlak-accent p {
font-size: var(--terra-lees, 16px);
line-height: 24px;
font-weight: 400;
color: var(--nova-accent-op);
margin: 0 0 12px;
}
.winkel.terra .site-pagina .site-blok > section.site-tekstfoto.vlak-accent p b,
.winkel.terra .site-pagina .site-blok > section.site-tekstfoto.vlak-accent p strong {
font-weight: 700;
color: var(--nova-accent-op);
}
.winkel.terra .site-pagina .site-blok > section.site-tekstfoto.vlak-accent .site-knop,
.winkel.terra .site-pagina .site-blok > section.site-tekstfoto.vlak-accent .btn-primary {
display: inline-flex;
align-items: center;
justify-content: center;
height: 50px;
padding-inline: 16px;
border: 0;
border-radius: var(--nova-r-mini, 4px);
font-size: 16px;
font-weight: 700;
background: var(--nova-accent-op);
color: var(--winkel-accent);
text-decoration: none;
}
.winkel.terra .site-pagina .site-blok > section.site-tekstfoto.vlak-accent .site-tekstfoto-foto {
align-self: end;
border-radius: 0;
width: 100%;
height: auto;
display: block;
}
.winkel.terra .site-berichtkop ~ .site-reacties {
padding-block: 36px 0;
}
@media (max-width: 559px) {
.winkel.terra .site-berichtkop h1 {
font-size: 24px;
line-height: 32px;
margin-top: 20px;
}
.winkel.terra .site-berichtkop { padding-block: 0 20px; }
.winkel.terra .site-berichtkop .cell-sub { gap: 10px; margin-top: 12px; }
.winkel.terra .site-berichtkop .site-berichtfoto { aspect-ratio: 3 / 2; }
.winkel.terra .site-berichtkop ~ .site-pagina { gap: 24px; padding-top: 24px; }
.winkel.terra .site-berichtkop ~ .site-pagina .site-blok > section > h2 {
font-size: 24px;
line-height: 30px;
margin-bottom: 12px;
}
.winkel.terra .site-berichtkop ~ .site-pagina .site-blok > section h3 {
font-size: 19px;
line-height: 26px;
margin: 14px 0 10px;
}
.winkel.terra .site-pagina .site-blok > section.site-tekstfoto.vlak-accent .site-tekstfoto-in { padding: 20px 16px 16px; }
.winkel.terra .site-pagina .site-blok > section.site-tekstfoto.vlak-accent h2 { font-size: 24px; line-height: 30px; margin-bottom: 14px; }
.winkel.terra .site-pagina .site-blok > section.site-tekstfoto.vlak-accent p { font-size: 16px; line-height: 22px; }
}
@media (max-width: 1023px) {
.winkel.terra .shop-header.vorm-terra { height: auto; }
.winkel.terra .shop-header.vorm-terra .shop-header-in {
height: auto;
flex-wrap: wrap;
padding-block: 12px;
row-gap: 12px;
}
.winkel.terra .shop-header.vorm-terra .shop-zoek {
order: 10;
flex: 1 0 100%;
max-width: none;
}
.winkel.terra .shop-header.vorm-terra .shop-lade-knop {
display: inline-flex;
align-items: center;
justify-content: center;
flex: none;
width: 42px;
height: 42px;
background: var(--nova-vlak);
border: 0;
border-radius: var(--nova-r-klein, 8px);
color: var(--nova-inkt);
}
.winkel.terra .shop-pdp > .shop-pdp-info { margin-top: var(--terra-zij); }
.winkel.terra .shop-pdp-beeld .pdp-hoofdfoto { max-height: 60svh; }
}
@media (max-width: 559px) {
.winkel.terra .shop-header.vorm-terra .shop-kopknop { display: none; }
.winkel.terra .shop-header.vorm-terra .shop-koptel-tekst { display: none; }
.winkel.terra .shop-header.vorm-terra .shop-kop-rechts { gap: calc(var(--terra-gat) / 2); }
.winkel.terra .shop-header.vorm-terra .shop-kop-rechts > * + * {
border-left: 0;
padding-left: 0;
margin-left: 0;
}
.winkel.terra .shop-header.vorm-terra .shop-wagen { padding-inline: var(--terra-gat); }
.winkel.terra .shop-lade { background: var(--card); }
.winkel.terra .shop-lade-kop { background: var(--card); }
.winkel.terra .shop-lade-sluit,
.winkel.terra .shop-lade-terug {
background: var(--card);
width: 42px;
height: 42px;
border: 1px solid var(--nova-lijn);
border-radius: var(--nova-r-klein, 8px);
color: var(--nova-inkt);
}
.winkel.terra .shop-lade-scheiding {
background: var(--nova-vlak);
border-top: 1px solid var(--nova-lijn);
border-bottom: 1px solid var(--nova-lijn);
}
.winkel.terra .shop-lade-vlak { background: var(--nova-vlak); }
.winkel.terra .shop-lade-sectie { margin-top: var(--terra-gat); }
.winkel.terra .shop-lade-sectiekop {
color: var(--nova-inkt);
font-weight: 500;
}
.winkel.terra .shop-lade-cta {
background: var(--winkel-accent);
color: var(--nova-accent-op);
border: 0;
border-radius: var(--nova-r-klein, 8px);
}
.winkel.terra .pdp-koopregel .teller { height: var(--nova-h-hoog); }
.winkel.terra .shop-pdp-beeld .pdp-strook {
flex-wrap: nowrap;
overflow-x: auto;
scrollbar-width: none;
}
.winkel.terra .shop-pdp-beeld .pdp-strook::-webkit-scrollbar { display: none; }
}
.winkel.terra .site-inhoud {
background: var(--nova-vlak);
border-radius: var(--hoek, 8px);
padding: 24px;
margin-block: 36px;
}
.winkel.terra .site-inhoud-kop { font-size: 16px; font-weight: 700; color: var(--nova-inkt); display: block; margin-bottom: 12px; }
.winkel.terra .site-inhoud ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.winkel.terra .site-inhoud-regel a { font-size: 14px; line-height: 21px; color: var(--nova-inkt); text-decoration: none; }
.winkel.terra .site-inhoud-regel a:hover { color: var(--winkel-accent); text-decoration: underline; }
.winkel.terra .site-inhoud-regel.diep { padding-left: 16px; }
.winkel.terra .site-inhoud-regel:target a,
.winkel.terra .site-inhoud-regel a:focus-visible { color: var(--winkel-accent); font-weight: 700; text-decoration: underline; }
@media (min-width: 1200px) {
.winkel.terra .site-inhoud { float: right; width: 311px; margin: 0 0 36px 36px; }
}
.winkel.terra .site-leestijd { white-space: nowrap; }
.winkel.terra .site-auteur { display: flex; align-items: center; gap: 12px; margin-top: 16px; }
.winkel.terra .site-auteurfoto { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; flex: none; }
.winkel.terra .site-auteurwie { display: grid; }
.winkel.terra .site-auteurwie b { font-size: 16px; line-height: 22px; color: var(--nova-inkt); }
.winkel.terra .site-auteurrol { font-size: 16px; line-height: 22px; color: var(--nova-inkt); opacity: .65; }
.winkel.terra .site-rubrieken { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.winkel.terra .site-rubriek {
display: inline-flex;
align-items: center;
height: 32px;
padding-inline: 14px;
border-radius: var(--nova-r-mini, 4px);
background: var(--winkel-accent);
color: var(--nova-accent-op);
font-size: 14px;
font-weight: 700;
}
@media (min-width: 1024px) {
.winkel.terra .shop-pdp {
grid-template-columns: minmax(0, 766fr) minmax(0, 604fr);
gap: 46px;
}
}
.winkel.terra .shop-pdp-beeld { border: 0; border-radius: 0; background: none; padding: 0; }
.winkel.terra .pdp-galerij.strook-links.met-strook {
display: grid;
grid-template-columns: 91px minmax(0, 1fr);
gap: 25px;
align-items: start;
}
.winkel.terra .pdp-galerij.strook-links .pdp-strook { display: flex; flex-direction: column; gap: 18px; }
.winkel.terra .pdp-galerij:not(.strook-links) .pdp-strook { display: flex; gap: 14px; margin-top: 16px; overflow-x: auto; }
.winkel.terra .pdp-mini {
width: 91px; height: 89px; flex: none;
border: 1px solid var(--nova-lijn);
border-radius: 6px;
background: var(--card, #fff);
overflow: hidden;
transition: border-color .15s;
}
.winkel.terra .pdp-galerij:not(.strook-links) .pdp-mini { width: 88px; height: 74px; }
.winkel.terra .pdp-mini img { width: 100%; height: 100%; object-fit: contain; }
.winkel.terra .pdp-mini.aan, .winkel.terra .pdp-mini:hover { border-color: var(--winkel-accent); }
.winkel.terra .pdp-fotokaart {
min-height: 777px;
border: 1px solid var(--nova-lijn);
border-radius: var(--hoek, 12px);
background: var(--card, #fff);
display: flex; align-items: center; justify-content: center;
padding: 24px 100px;
}
.winkel.terra .pdp-fotoknop { width: auto; max-width: 100%; }
.winkel.terra .pdp-hoofdfoto {
width: 100%; height: auto; max-height: 640px; object-fit: contain;
aspect-ratio: auto; border: 0; border-radius: 0; background: none;
}
.winkel.terra .pdp-fotoknop { width: 100%; }
.winkel.terra .pdp-fotolabels { left: 30px; top: 24px; gap: 12px; }
.winkel.terra .pdp-fotolabel {
font-size: 13px; font-weight: 750; padding: 7px 14px; border-radius: 5px; border: 0;
background: var(--nova-inkt); color: var(--card, #fff);
}
.winkel.terra .pdp-fotolabel:nth-child(n+2) { background: var(--nova-vlak); color: var(--winkel-accent); }
.winkel.terra .pdp-pijl {
display: flex; position: absolute; top: 50%; margin-top: -26px;
width: 52px; height: 52px;
border: 1px solid var(--nova-lijn); border-radius: 10px;
background: var(--card, #fff); color: var(--nova-inkt);
align-items: center; justify-content: center; cursor: pointer; padding: 0;
}
.winkel.terra .pdp-pijl.vorig { left: 44px; }
.winkel.terra .pdp-pijl.volgend { right: 44px; }
.winkel.terra .pdp-pijl:hover { border-color: var(--winkel-accent); color: var(--winkel-accent); }
.winkel.terra .pdp-geenfoto { color: var(--nova-gedempt); font-weight: 650; }
.winkel.terra .shop-pdp-info > .pdp-oordeel { margin: 0 0 10px; }
.winkel.terra .shop-pdp-info h1 { font-size: 27px; font-weight: 800; letter-spacing: -.5px; line-height: 1.2; margin: 0 0 16px; }
.winkel.terra .pdp-kort { font-size: 15px; line-height: 24px; margin: 0 0 22px; }
.winkel.terra .pdp-bovenregel { display: flex; align-items: center; font-size: 13.5px; margin: 0 0 18px; }
.winkel.terra .pdp-paden { display: flex; gap: 18px; }
.winkel.terra .pdp-paden a { color: var(--nova-inkt); text-decoration: underline; }
.winkel.terra .pdp-artikelnr { margin-left: auto; color: var(--nova-inkt); }
.winkel.terra .pdp-artikelnr b { font-weight: 500; }
.winkel.terra .pdp-koopblok-vlak {
background: var(--nova-vlak);
border-radius: var(--hoek, 12px);
padding: 20px;
display: flex; flex-direction: column;
position: relative;
}
.winkel.terra .pdp-koopblok-vlak > .pdp-koopvorm { display: contents; }
.winkel.terra .pdp-koopblok-vlak > .pdp-koopvorm.pdp-koopvorm-weg { display: none; }
.winkel.terra .pdp-koopblok-vlak > .pdp-prijsvak { order: 1; }
.winkel.terra .pdp-koopblok-vlak > .pdp-inlogprijs { order: 1; }
.winkel.terra .pdp-koopblok-vlak > .pdp-staffeltabel { order: 2; }
.winkel.terra .pdp-koopblok-vlak > .pdp-staffels { order: 2; }
.winkel.terra .pdp-koopblok-vlak .pdp-koopvorm > .field { order: 3; }
.winkel.terra .pdp-koopblok-vlak .pdp-koopvorm > .pdp-aantal-kop { order: 4; }
.winkel.terra .pdp-koopblok-vlak .pdp-koopvorm > .pdp-koopregel { order: 5; }
.winkel.terra .pdp-koopblok-vlak > .pdp-voorraad { order: 6; }
.winkel.terra .pdp-koopblok-vlak .pdp-koopvorm > .pdp-betalen { order: 7; }
.winkel.terra .pdp-koopblok-vlak > .pdp-voorraadwens { order: 8; }
.winkel.terra .pdp-koopblok-vlak > .pdp-vtabel { order: 3; }
.winkel.terra .pdp-koopblok-vlak > .pdp-prijsvak {
display: flex; flex-direction: column; align-items: flex-end;
text-align: right; min-height: 46px; margin: 0 0 18px; padding: 0;
}
.winkel.terra .pdp-koopblok-vlak .pdp-prijs { display: flex; align-items: baseline; gap: 8px; font-size: 23px; font-weight: 800; color: var(--winkel-accent); line-height: 1.1; }
.winkel.terra .pdp-koopblok-vlak .pdp-prijs s { font-size: 14px; font-weight: 500; color: var(--nova-gedempt); }
.winkel.terra .pdp-koopblok-vlak .pdp-prijs .klein { font-size: 12.5px; font-weight: 500; color: var(--nova-gedempt); }
.winkel.terra .pdp-koopblok-vlak .pdp-tweedeprijs,
.winkel.terra .pdp-koopblok-vlak .pdp-prijsbron { font-size: 12.5px; color: var(--nova-gedempt); margin-top: 5px; }
.winkel.terra .pdp-koopblok-vlak > .pdp-staffeltabel > summary {
position: absolute; left: 20px; top: 20px;
font-size: 15px; font-weight: 750; color: var(--nova-inkt); gap: 14px;
}
.winkel.terra .pdp-koopblok-vlak > .pdp-staffeltabel[open] > summary svg { transform: rotate(180deg); }
.winkel.terra .pdp-koopblok-vlak > .pdp-staffeltabel > table {
margin: 0 0 18px; background: var(--card, #fff); border-radius: 6px; overflow: hidden; font-size: 13px;
}
.winkel.terra .pdp-koopblok-vlak > .pdp-staffeltabel th { background: var(--nova-vlak); color: var(--nova-gedempt); font-weight: 600; padding: 9px 14px; border: 0; }
.winkel.terra .pdp-koopblok-vlak > .pdp-staffeltabel td { padding: 9px 14px; border-top: 1px solid var(--nova-lijn); font-weight: 600; }
.winkel.terra .pdp-koopblok-vlak > .pdp-staffeltabel tr.aan td { background: var(--nova-vlak); }
.winkel.terra .pdp-koopblok-vlak .pdp-aantal-kop { display: block; font-size: 13px; color: var(--nova-gedempt); margin: 0 0 9px; }
.winkel.terra .pdp-koopblok-vlak .pdp-koopregel { display: flex; gap: 8px; align-items: stretch; margin: 0; }
.winkel.terra .pdp-koopblok-vlak .teller.pdp-teller {
width: 136px; height: 62px; flex: none;
border: 1px solid var(--nova-lijn); border-radius: 8px; background: var(--card, #fff);
display: flex; align-items: center; justify-content: space-between; padding: 0 6px;
}
.winkel.terra .pdp-koopblok-vlak .teller.pdp-teller button { width: 36px; height: 100%; border: 0; background: none; font-size: 18px; color: var(--nova-inkt); cursor: pointer; }
.winkel.terra .pdp-koopblok-vlak .teller.pdp-teller input { width: 40px; border: 0; background: none; text-align: center; font-size: 16px; font-weight: 650; color: var(--nova-inkt); -moz-appearance: textfield; }
.winkel.terra .pdp-koopblok-vlak .teller.pdp-teller input::-webkit-outer-spin-button,
.winkel.terra .pdp-koopblok-vlak .teller.pdp-teller input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.winkel.terra .pdp-koopblok-vlak .pdp-koop {
flex: 1; height: 62px; border: 0; border-radius: 8px;
background: var(--winkel-accent); color: var(--winkel-accent-ink, #fff);
font-size: 15px; font-weight: 750; display: flex; align-items: center; justify-content: center; gap: 12px;
cursor: pointer; margin: 0; padding: 0 16px;
}
.winkel.terra .pdp-koopblok-vlak .pdp-koop:hover { filter: brightness(.94); }
.winkel.terra .pdp-koopblok-vlak > .pdp-voorraad { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 16px; margin: 16px 0 18px; font-size: 13.5px; font-weight: 700; }
.winkel.terra .pdp-koopblok-vlak > .pdp-voorraad .pdp-voorraad-zin { order: 1; color: var(--nova-groen); }
.winkel.terra .pdp-koopblok-vlak > .pdp-voorraad .nova-chip { order: 2; margin-left: auto; background: none; padding: 0; border: 0; color: var(--nova-groen); font-size: 13.5px; font-weight: 700; }
.winkel.terra .pdp-koopblok-vlak > .pdp-voorraad .nova-chip--bijna,
.winkel.terra .pdp-koopblok-vlak > .pdp-voorraad .nova-chip--nee { color: var(--neg); }
.winkel.terra .pdp-koopblok-vlak > .pdp-voorraad .nova-vestigingen { order: 3; width: 100%; }
.winkel.terra .pdp-koopblok-vlak > .pdp-voorraad .pdp-vestigingen { order: 4; width: 100%; }
.winkel.terra .pdp-koopblok-vlak .pdp-betalen { display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 34px; margin: 0; flex-wrap: wrap; }
.winkel.terra .pdp-koopblok-vlak .pdp-betaallogo { height: 22px; width: auto; max-width: 84px; object-fit: contain; }
.winkel.terra .pdp-koopblok-vlak > .pdp-inlogprijs { display: flex; flex-direction: column; gap: 4px; margin: 0 0 18px; }
.winkel.terra .pdp-koopblok-vlak > .pdp-inlogprijs b { font-size: 17px; font-weight: 800; }
.winkel.terra .pdp-koopblok-vlak > .pdp-inlogprijs span { font-size: 13.5px; color: var(--nova-gedempt); margin-bottom: 14px; }
.winkel.terra .pdp-koopblok-vlak > .pdp-inlogprijs .pdp-inlogknop {
height: 62px; border-radius: 8px; background: var(--winkel-accent); color: var(--winkel-accent-ink, #fff);
font-size: 15px; font-weight: 750; display: flex; align-items: center; justify-content: center; text-decoration: none;
}
.winkel.terra .shop-pdp-info > .shop-usp-lijst { display: flex; flex-direction: column; gap: 0; margin: 14px 0 0; }
.winkel.terra .shop-pdp-info > .shop-usp-lijst span {
display: flex; align-items: center; gap: 13px; font-size: 14.5px; font-weight: 600; margin: 0 0 14px; padding: 0; border: 0; background: none;
}
.winkel.terra .shop-pdp-info > .shop-usp-lijst span { position: relative; padding-left: 30px; }
.winkel.terra .shop-pdp-info > .shop-usp-lijst span::before {
content: ""; position: absolute; left: 0; top: 50%; margin-top: -8.5px;
width: 17px; height: 17px; border-radius: 50%; background: var(--nova-groen);
}
.winkel.terra .shop-pdp-info > .shop-usp-lijst span::after {
content: ""; position: absolute; left: 6px; top: 50%; margin-top: -5px;
width: 4px; height: 8px; border-right: 2px solid var(--card, #fff); border-bottom: 2px solid var(--card, #fff);
transform: rotate(40deg);
}
.winkel.terra .pdp-bezorg { border: 1px solid var(--nova-lijn); border-radius: var(--hoek, 12px); margin: 12px 0 0; padding: 0; background: var(--card, #fff); }
.winkel.terra .pdp-bezorg-rij { border-top: 1px solid var(--nova-lijn); margin: 0; }
.winkel.terra .pdp-bezorg-rij:first-child { border-top: 0; }
.winkel.terra .pdp-bezorg-rij > summary,
.winkel.terra .pdp-bezorg-regel { min-height: 59px; display: flex; align-items: center; gap: 12px; padding: 0 20px; font-size: 14.5px; cursor: pointer; list-style: none; }
.winkel.terra .pdp-bezorg-rij > summary::-webkit-details-marker { display: none; }
.winkel.terra .pdp-bezorg-icoon-vlak { display: none; }
.winkel.terra .pdp-bezorg-kop { display: flex; flex-direction: column; }
.winkel.terra .pdp-bezorg-kop b { font-weight: 500; color: var(--nova-inkt); }
.winkel.terra .pdp-bezorg-zin { font-size: 12.5px; color: var(--nova-gedempt); }
.winkel.terra .pdp-bezorg-waarde { margin-left: auto; font-weight: 750; color: var(--nova-inkt); }
.winkel.terra .pdp-bezorg-waarde.groen { color: var(--nova-groen); }
.winkel.terra .pdp-bezorg-pijl, .winkel.terra .pdp-bezorg-leeg {
width: 22px; height: 22px; border-radius: 50%; border: 1px solid var(--nova-lijn); flex: none;
display: flex; align-items: center; justify-content: center; color: var(--nova-inkt);
}
.winkel.terra .pdp-bezorg-pijl svg { transform: rotate(-90deg); }
.winkel.terra .pdp-bezorg-rij[open] > summary .pdp-bezorg-pijl svg { transform: none; }
.winkel.terra .pdp-bezorg-leeg { visibility: hidden; }
.winkel.terra .pdp-bezorg-uitleg { padding: 0 20px 18px; font-size: 13.5px; line-height: 1.6; color: var(--nova-inkt); }
.winkel.terra .pdp-bezorg-postcode { display: flex; align-items: center; gap: 12px; min-height: 59px; padding: 8px 20px; border-top: 1px solid var(--nova-lijn); font-size: 13.5px; }
.winkel.terra .shop-pdp-onder { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 46px; align-items: start; margin-top: 110px; }
.winkel.terra .pdp-onder-links, .winkel.terra .pdp-onder-rechts { min-width: 0; }
.winkel.terra .pdp-punten-titel, .winkel.terra .pdp-downloads-kop, .winkel.terra .pdp-onder-rechts .pdp-specblok h2 {
font-size: 16.5px; font-weight: 800; margin: 0 0 16px; color: var(--nova-inkt);
}
.winkel.terra .pdp-punten-blok { display: block; margin: 0; }
.winkel.terra .pdp-punten-blok .pdp-punten-kop { display: none; }
.winkel.terra .pdp-punten-blok .pdp-punt { display: flex; align-items: center; gap: 11px; font-size: 14px; margin: 9px 0; }
.winkel.terra .pdp-punten-blok .pdp-punt-teken {
width: 15px; height: 15px; border-radius: 50%; flex: none; font-size: 12px; line-height: 15px; text-align: center; color: var(--card, #fff);
}
.winkel.terra .pdp-punten-blok .pdp-punt.plus .pdp-punt-teken { background: var(--nova-groen); }
.winkel.terra .pdp-punten-blok .pdp-punt.min .pdp-punt-teken { background: var(--neg); }
.winkel.terra .pdp-onder-links .pdp-verhaal { border-top: 1px solid var(--nova-lijn); margin-top: 26px; padding-top: 26px; }
.winkel.terra .pdp-onder-links .pdp-verhaal-tekst h2 { font-size: 25px; font-weight: 800; letter-spacing: -.4px; margin: 0 0 16px; }
.winkel.terra .pdp-onder-links .pdp-verhaal-tekst h3 { font-size: 14.5px; font-weight: 750; margin: 22px 0 7px; }
.winkel.terra .pdp-onder-links .pdp-verhaal-tekst p { font-size: 14.5px; line-height: 1.62; margin: 0 0 14px; }
.winkel.terra .pdp-onder-links .pdp-verhaal-tekst ul, .winkel.terra .pdp-onder-links .pdp-verhaal-tekst ol { margin: 0 0 14px; padding-left: 20px; font-size: 14.5px; line-height: 1.72; }
.winkel.terra .pdp-onder-links .pdp-meer { color: var(--winkel-accent); font-weight: 700; font-size: 14px; display: inline-flex; align-items: center; gap: 7px; }
.winkel.terra .pdp-onder-rechts .pdp-specblok { margin: 0; padding: 0; border: 0; background: none; }
.winkel.terra .pdp-onder-rechts .pdp-spectabel { margin: 0; }
.winkel.terra .pdp-onder-rechts .pdp-specregel { display: flex; align-items: center; min-height: 33px; border-bottom: 1px solid var(--nova-lijn); font-size: 13.5px; padding: 0; margin: 0; }
.winkel.terra .pdp-onder-rechts .pdp-specregel dt { font-weight: 600; color: var(--nova-inkt); }
.winkel.terra .pdp-onder-rechts .pdp-specregel dd { margin: 0 0 0 auto; font-weight: 600; color: var(--nova-inkt); text-align: right; }
.winkel.terra .pdp-onder-rechts .pdp-specregel dd a { color: var(--nova-inkt); text-decoration: underline; }
.winkel.terra .pdp-downloads { margin: 0 0 44px; }
.winkel.terra .pdp-downloadkaart { border: 1px solid var(--nova-lijn); border-radius: var(--hoek, 12px); background: var(--card, #fff); }
.winkel.terra .pdp-download { display: flex; align-items: center; min-height: 64px; padding: 0 20px; border-top: 1px solid var(--nova-lijn); font-size: 14.5px; font-weight: 650; margin: 0; text-decoration: none; color: var(--nova-inkt); }
.winkel.terra .pdp-download:first-child { border-top: 0; }
.winkel.terra .pdp-download-knop {
display: flex; align-items: center; gap: 8px; margin-left: auto; height: 34px; padding: 0 14px; border-radius: 6px;
background: var(--nova-vlak); color: var(--winkel-accent); font-size: 13.5px; font-weight: 750;
}
.winkel.terra .pdp-download:hover .pdp-download-knop { filter: brightness(.96); }
.winkel.terra .pdp-extra { margin-top: 22px; }
.winkel.terra .pdp-extra-kop { font-size: 14.5px; font-weight: 750; }
.winkel.terra .pdp-extra-tekst, .winkel.terra .pdp-extra-regel { font-size: 14.5px; line-height: 1.62; }
.winkel.terra .shop-pdp-onder + .pdp-beoordelingen,
.winkel.terra .shop-pdp-onder + section { margin-top: 60px; }
@media (max-width: 1023px) {
.winkel.terra .pdp-galerij.strook-links { display: block; }
.winkel.terra .pdp-galerij.strook-links .pdp-strook { flex-direction: row; gap: 9px; margin-top: 14px; overflow-x: auto; }
.winkel.terra .pdp-mini, .winkel.terra .pdp-galerij:not(.strook-links) .pdp-mini { width: 60px; height: 52px; }
.winkel.terra .pdp-fotokaart { min-height: 270px; padding: 20px 56px; }
.winkel.terra .pdp-hoofdfoto { max-height: 230px; }
.winkel.terra .pdp-fotolabels { left: 14px; top: 14px; gap: 8px; }
.winkel.terra .pdp-fotolabel { font-size: 11.5px; padding: 5px 10px; }
.winkel.terra .pdp-pijl { width: 40px; height: 40px; margin-top: -20px; }
.winkel.terra .pdp-pijl.vorig { left: 8px; }
.winkel.terra .pdp-pijl.volgend { right: 8px; }
.winkel.terra .shop-pdp-info h1 { font-size: 23px; }
.winkel.terra .pdp-koopblok-vlak { padding: 16px; }
.winkel.terra .pdp-koopblok-vlak > .pdp-staffeltabel > summary { left: 16px; top: 16px; }
.winkel.terra .pdp-koopblok-vlak .pdp-prijs { font-size: 20px; }
.winkel.terra .pdp-koopblok-vlak .teller.pdp-teller { width: 104px; height: 48px; }
.winkel.terra .pdp-koopblok-vlak .pdp-koop { height: 48px; font-size: 14px; }
.winkel.terra .pdp-koopblok-vlak > .pdp-voorraad .nova-chip { margin-left: 0; width: 100%; }
.winkel.terra .shop-pdp-onder { grid-template-columns: minmax(0, 1fr); gap: 34px; margin-top: 40px; }
.winkel.terra .pdp-onder-links .pdp-verhaal-tekst ul, .winkel.terra .pdp-onder-links .pdp-verhaal-tekst ol { padding-left: 16px; }
}
.winkel.terra .shop-pdp-info > .pdp-koopblok { order: 6; }
.winkel.terra .shop-pdp-info > .shop-usp-lijst { order: 7; }
.winkel.terra .shop-pdp-info > .pdp-kenmerken { order: 8; }
.winkel.terra .shop-pdp-info > .pdp-bezorg { order: 9; }
.winkel.terra .shop-pdp-info > .pdp-knoppenrij { order: 10; }
.winkel.terra .shop-pdp-info > form { order: 11; }
.winkel.terra .shop-pdp-info > .pdp-hulp { order: 20; }
.winkel.terra .shop-pdp-info > .pdp-kenmerken {
display: block; border: 1px solid var(--nova-lijn); border-radius: var(--hoek, 12px);
background: var(--card, #fff); margin: 12px 0 0; padding: 0;
}
.winkel.terra .shop-pdp-info > .pdp-kenmerken .pdp-kenmerk {
display: flex; align-items: center; gap: 12px; min-height: 59px; padding: 0 20px;
border-top: 1px solid var(--nova-lijn); font-size: 14.5px; color: var(--nova-inkt); text-decoration: none; margin: 0;
}
.winkel.terra .shop-pdp-info > .pdp-kenmerken .pdp-kenmerk:first-child { border-top: 0; }
.winkel.terra .shop-pdp-info > .pdp-kenmerken dt { font-weight: 500; margin: 0; }
.winkel.terra .shop-pdp-info > .pdp-kenmerken dd { margin: 0 0 0 auto; font-weight: 750; display: flex; align-items: center; gap: 16px; text-align: right; }
.winkel.terra .shop-pdp-info > .pdp-kenmerken dd svg {
width: 22px; height: 22px; padding: 6px; box-sizing: border-box; border: 1px solid var(--nova-lijn); border-radius: 50%; flex: none;
}
.winkel.terra .shop-pdp-info > .pdp-kenmerken .pdp-kenmerk.klikbaar:hover dd svg { border-color: var(--winkel-accent); color: var(--winkel-accent); }
.winkel.terra .pdp-fotoknop, .winkel.terra .pdp-fotokaart .pdp-hoofdfoto {
border: 0; padding: 0; box-shadow: none; background: none; border-radius: 0;
}
@media (min-width: 1024px) {
.winkel.terra .shop-lijst { grid-template-columns: 311px minmax(0, 1fr); gap: 0 36px; align-items: start; }
.winkel.terra .shop-lijst.filters-boven, .winkel.terra .shop-lijst.filters-knop { grid-template-columns: minmax(0, 1fr); }
.winkel.terra .shop-filterknop { display: none; }
.winkel.terra .shop-lijst.filters-knop .shop-filterknop { display: inline-flex; }
}
.winkel.terra .shop-filterkaart { border: 0; background: none; padding: 0; box-shadow: none; }
.winkel.terra .shop-catgroep {
background: var(--nova-vlak); border-radius: var(--hoek, 12px); padding: 20px; border: 0; margin: 0 0 22px;
}
.winkel.terra .shop-filtervorm {
background: var(--card, #fff); border: 1px solid var(--nova-lijn); border-radius: var(--hoek, 12px); padding: 3px 19px; margin: 0;
}
.winkel.terra .shop-filtergroep { padding: 18px 0; border: 0; border-bottom: 1px solid var(--nova-lijn); margin: 0; }
.winkel.terra .shop-filtergroep:last-of-type { border-bottom: 0; }
.winkel.terra .shop-catgroep-kop {
display: flex; align-items: center; font-size: 15px; font-weight: 750; color: var(--nova-inkt); margin: 0 0 14px; padding: 0; cursor: pointer; list-style: none;
}
.winkel.terra .shop-catgroep-kop::-webkit-details-marker { display: none; }
.winkel.terra .shop-catgroep-kop svg { margin-left: auto; width: 12px; height: 12px; }
.winkel.terra .shop-catgroep[open] > .shop-catgroep-kop svg, .winkel.terra .shop-filtergroep[open] > .shop-catgroep-kop svg { transform: rotate(180deg); }
.winkel.terra .shop-filtereenheid { font-weight: 500; color: var(--nova-gedempt); margin-left: 4px; }
.winkel.terra .shop-filterregel, .winkel.terra .shop-cat a, .winkel.terra .shop-catregel {
display: flex; align-items: center; gap: 11px; font-size: 13.5px; font-weight: 600; color: var(--nova-inkt); margin: 9px 0; padding: 0; text-decoration: none;
}
.winkel.terra .shop-filteraantal { color: var(--nova-gedempt); font-weight: 500; margin-left: 4px; }
.winkel.terra .shop-catvak {
width: 17px; height: 17px; border: 1.6px solid var(--nova-lijn); border-radius: 4px; background: var(--card, #fff); flex: none; position: relative; box-sizing: border-box;
}
.winkel.terra .shop-filterregel input:checked + .shop-catvak { background: var(--winkel-accent); border-color: var(--winkel-accent); }
.winkel.terra .shop-filterregel input:checked + .shop-catvak::after {
content: ""; position: absolute; left: 4.5px; top: 1.5px; width: 4px; height: 8px;
border-right: 2px solid var(--winkel-accent-ink, #fff); border-bottom: 2px solid var(--winkel-accent-ink, #fff); transform: rotate(40deg);
}
.winkel.terra .shop-filtermeer > summary { color: var(--winkel-accent); font-weight: 700; font-size: 13.5px; cursor: pointer; list-style: none; margin-top: 8px; }
.winkel.terra .shop-filtermeer > summary::-webkit-details-marker { display: none; }
.winkel.terra .shop-filterknoppen { padding: 18px 0 14px; display: flex; gap: 10px; align-items: center; }
.winkel.terra .shop-filterknoppen .btn-primary { height: 42px; border-radius: 6px; font-weight: 700; padding: 0 18px; }
.winkel.terra .shop-filterbereik { display: none; }
.winkel.terra .shop-filterschuif { display: block; position: relative; height: 40px; margin: 22px 0 0; --van: 0%; --tot: 100%; }
.winkel.terra .shop-schuif-bel {
position: absolute; top: -8px; background: var(--winkel-accent); color: var(--winkel-accent-ink, #fff);
font-size: 11.5px; font-weight: 700; border-radius: 4px; padding: 3px 7px; white-space: nowrap; pointer-events: none;
}
.winkel.terra .shop-schuif-bel.van { left: 0; }
.winkel.terra .shop-schuif-bel.tot { right: 0; }
.winkel.terra .shop-schuif-baan {
position: absolute; left: 8px; right: 8px; top: 26px; height: 4px; border-radius: 2px;
background: linear-gradient(90deg, var(--nova-lijn) var(--van), var(--winkel-accent) var(--van), var(--winkel-accent) var(--tot), var(--nova-lijn) var(--tot));
}
.winkel.terra .shop-filterschuif input[type="range"] {
position: absolute; left: 0; right: 0; top: 18px; width: 100%; height: 20px; margin: 0; background: none; -webkit-appearance: none; appearance: none; pointer-events: none;
}
.winkel.terra .shop-filterschuif input[type="range"]::-webkit-slider-thumb {
-webkit-appearance: none; width: 14px; height: 14px; border-radius: 50%; background: var(--winkel-accent); border: 2px solid var(--card, #fff);
box-shadow: 0 0 0 1px var(--winkel-accent); pointer-events: auto; cursor: pointer;
}
.winkel.terra .shop-filterschuif input[type="range"]::-moz-range-thumb {
width: 10px; height: 10px; border-radius: 50%; background: var(--winkel-accent); border: 2px solid var(--card, #fff); pointer-events: auto; cursor: pointer;
}
.winkel.terra .shop-filterschuif input[type="range"]::-moz-range-track { background: none; }
.winkel.terra .shop-filterrand { display: none; }
.winkel.terra .shop-filterkeuze { height: 40px; border-color: var(--nova-lijn); font-size: 13.5px; color: var(--nova-inkt); }
.winkel.terra .shop-kleurbol { width: 22px; height: 22px; border-color: var(--nova-lijn); }
.winkel.terra .shop-filterkleur { width: 22px; height: 22px; }
.winkel.terra .shop-filterkleuren { gap: 9px; max-width: 230px; }
.winkel.terra .shop-lijstkolom > .shop-kruimels { margin: 0 0 14px; }
.winkel.terra .shop-catkop {
height: 205px; min-height: 0; border-radius: 10px; overflow: hidden; position: relative; margin: 0 0 24px; background: var(--nova-vlak);
}
.winkel.terra .shop-catkop-foto { width: 100%; height: 100%; object-fit: cover; display: block; }
.winkel.terra .shop-catkop-waas { display: none; }
.winkel.terra .shop-alles-over {
display: flex; align-items: center; gap: 10px; position: absolute; right: 26px; bottom: 18px;
color: #fff; font-size: 15px; font-weight: 800; text-shadow: 0 1px 6px rgba(0, 0, 0, .4);
}
.winkel.terra .shop-cattitelrij { align-items: flex-end; margin: 0 0 14px; }
.winkel.terra .shop-lijsttitel { font-size: 33px; font-weight: 800; letter-spacing: -.7px; line-height: 1.15; margin: 0; }
.winkel.terra .shop-alles-over-link { margin-left: auto; font-size: 13.5px; font-weight: 700; color: var(--nova-inkt); display: flex; align-items: center; gap: 9px; }
.winkel.terra .shop-cattekst { margin: 0 0 10px; }
.winkel.terra .shop-cattekst-in { font-size: 14.5px; line-height: 1.62; max-width: 1050px; }
.winkel.terra .shop-cattekst .pdp-meer { color: var(--winkel-accent); font-weight: 700; font-size: 14px; }
.winkel.terra .shop-subtegels { display: flex; gap: 8px; margin: 22px 0 0; overflow-x: auto; scrollbar-width: none; padding: 0; }
.winkel.terra .shop-subtegels::-webkit-scrollbar { display: none; }
.winkel.terra .shop-subtegel {
flex: none; height: 63px; background: var(--nova-vlak); border: 0; border-radius: 8px; display: flex; align-items: center; gap: 16px;
padding: 0 26px; font-size: 14.5px; font-weight: 650; color: var(--nova-inkt); white-space: nowrap; text-decoration: none; box-shadow: none;
}
.winkel.terra .shop-subtegel-beeld { width: 44px; height: 30px; flex: none; display: flex; align-items: center; justify-content: center; }
.winkel.terra .shop-subtegel-beeld img { max-width: 44px; max-height: 30px; object-fit: contain; }
.winkel.terra .shop-subtegel b { font-weight: 650; }
.winkel.terra .shop-lijstbalk {
display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin: 26px 0 22px; padding: 22px 0 0; border-top: 1px solid var(--nova-lijn); background: none; box-shadow: none;
}
.winkel.terra .shop-telling { font-size: 14px; color: var(--nova-gedempt); }
.winkel.terra .shop-filterchips { gap: 8px 14px; }
.winkel.terra .shop-filterchip { height: 34px; border: 0; border-radius: 6px; background: var(--nova-vlak); font-size: 13.5px; font-weight: 600; color: var(--nova-inkt); padding: 0 14px; gap: 12px; }
.winkel.terra .shop-filterchip span { font-size: 15px; color: var(--nova-gedempt); }
.winkel.terra .shop-wisalles { font-size: 13.5px; font-weight: 650; color: var(--nova-inkt); }
.winkel.terra .shop-inveld { display: none; }
.winkel.terra .shop-lijstbalk .shop-select[name="per"] { display: none; }
.winkel.terra .shop-weergave { margin-left: auto; display: flex; gap: 10px; }
.winkel.terra .shop-weergave button {
width: 42px; height: 42px; border: 1px solid var(--nova-lijn); border-radius: 6px; background: var(--card, #fff); color: var(--nova-inkt);
display: flex; align-items: center; justify-content: center; cursor: pointer; padding: 0;
}
.winkel.terra .shop-weergave button.aan { background: var(--nova-vlak); }
.winkel.terra .shop-weergave svg { width: 17px; height: 17px; }
.winkel.terra .shop-lijstbalk .shop-select[name="sorteer"] {
height: 42px; min-width: 140px; border: 1px solid var(--nova-lijn); border-radius: 6px; background: var(--card, #fff); color: var(--nova-inkt);
font-size: 14px; font-weight: 600; padding: 0 36px 0 16px;
}
.winkel.terra .shop-tegels { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.winkel.terra .shop-tegels[data-per-rij="2"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.winkel.terra .shop-tegels[data-per-rij="4"] { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.winkel.terra .shop-tegels[data-per-rij="5"] { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.winkel.terra .shop-tegels[data-per-rij="6"] { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.winkel.terra .shop-tegels.als-lijst { grid-template-columns: minmax(0, 1fr); }
.winkel.terra .shop-kaart {
display: flex; flex-direction: column; position: relative; border: 1px solid var(--nova-lijn); border-radius: 10px; padding: 22px;
background: var(--card, #fff); box-shadow: none; gap: 0;
}
.winkel.terra .shop-kaart > img, .winkel.terra .shop-kaart .foto-leeg {
width: 100%; height: 196px; object-fit: contain; margin: -6px 0 14px; border: 0; border-radius: 6px; background: none; order: 1;
}
.winkel.terra .kaart-tand { display: flex; position: absolute; right: 22px; top: 16px; z-index: 3; color: var(--nova-gedempt); }
.winkel.terra .kaart-labels { left: 22px; top: 16px; }
.winkel.terra .kaart-label { font-size: 12.5px; font-weight: 750; padding: 5px 12px; border-radius: 5px; border: 0; background: var(--nova-inkt); color: var(--card, #fff); }
.winkel.terra .kaart-korting {
font-size: 12.5px; font-weight: 750; padding: 5px 12px; border-radius: 5px; border: 0;
background: color-mix(in srgb, var(--neg) 14%, var(--card, #fff)); color: var(--neg);
}
.winkel.terra .shop-kaart .nova-sterren { order: 2; display: flex; align-items: center; gap: 6px; font-size: 12.5px; margin: 0 0 6px; }
.winkel.terra .shop-kaart .nova-titel { order: 3; font-size: 15.5px; font-weight: 800; margin: 0 0 5px; color: var(--nova-inkt); }
.winkel.terra .shop-kaart .nova-code { order: 4; display: none; }
.winkel.terra .shop-kaart .nova-specs { order: 5; display: flex; flex-direction: column; gap: 5px; margin: 6px 0 0; }
.winkel.terra .shop-kaart .nova-spec { display: flex; align-items: center; gap: 9px; font-size: 13px; font-weight: 700; color: var(--nova-inkt); background: none; border: 0; padding: 0; }
.winkel.terra .shop-kaart .nova-spec::before {
content: ""; width: 6px; height: 9px; flex: none; background: currentColor;
-webkit-mask: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 6 9'%3E%3Cpath d='M1.4 1.3 4.6 4.5 1.4 7.7' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
mask: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 6 9'%3E%3Cpath d='M1.4 1.3 4.6 4.5 1.4 7.7' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
}
.winkel.terra .shop-kaart .nova-chiprij { order: 6; display: flex; gap: 12px; margin: 14px 0 0; }
.winkel.terra .shop-kaart .nova-chiprij .nova-chip {
height: 26px; border-radius: 5px; background: color-mix(in srgb, var(--nova-groen) 16%, var(--card, #fff)); color: var(--nova-groen);
display: inline-flex; align-items: center; gap: 7px; padding: 0 10px; font-size: 12.5px; font-weight: 700; border: 0;
}
.winkel.terra .shop-kaart .nova-chiprij .nova-chip--bijna { background: color-mix(in srgb, var(--neg) 12%, var(--card, #fff)); color: var(--neg); }
.winkel.terra .shop-kaart .nova-chiprij .nova-chip--nee, .winkel.terra .shop-kaart .nova-chiprij .nova-chip--wacht { background: var(--nova-vlak); color: var(--nova-gedempt); }
.winkel.terra .shop-kaart .nova-voet { order: 7; display: flex; align-items: flex-end; gap: 9px; margin-top: auto; padding-top: 14px; border: 0; }
.winkel.terra .shop-kaart .nova-prijsvak { flex: 1; min-width: 0; }
.winkel.terra .shop-kaart .nova-prijs { display: flex; align-items: baseline; flex-wrap: wrap; gap: 7px; font-size: 19px; font-weight: 800; color: var(--nova-inkt); white-space: nowrap; }
.winkel.terra .shop-kaart .nova-prijs:has(s) { color: var(--neg); }
.winkel.terra .shop-kaart .nova-prijs s { order: 5; width: 100%; font-size: 12.5px; font-weight: 500; color: var(--nova-gedempt); }
.winkel.terra .shop-kaart .nova-prijs .btw-inline { font-size: 12.5px; font-weight: 650; color: var(--nova-inkt); }
.winkel.terra .shop-kaart .nova-tweedeprijs { font-size: 12.5px; color: var(--nova-gedempt); margin-top: 2px; }
.winkel.terra .shop-kaart .nova-hart, .winkel.terra .shop-kaart .nova-inwagen {
width: 44px; height: 44px; border-radius: 7px; display: flex; align-items: center; justify-content: center; cursor: pointer; flex: none; padding: 0;
}
.winkel.terra .shop-kaart .nova-hart { border: 1px solid var(--nova-lijn); background: var(--card, #fff); color: var(--nova-groen); }
.winkel.terra .shop-kaart .nova-hartvorm { margin-left: auto; }
.winkel.terra .shop-kaart .nova-inwagen { border: 0; background: var(--winkel-accent); color: var(--winkel-accent-ink, #fff); position: relative; }
.winkel.terra .shop-kaart .nova-inwagen svg { display: none; }
.winkel.terra .shop-kaart .nova-inwagen::before, .winkel.terra .shop-kaart .nova-inwagen::after { content: ""; position: absolute; background: currentColor; border-radius: 1px; }
.winkel.terra .shop-kaart .nova-inwagen::before { left: 13px; top: 20.5px; width: 18px; height: 3px; }
.winkel.terra .shop-kaart .nova-inwagen::after { left: 20.5px; top: 13px; width: 3px; height: 18px; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart { display: grid; grid-template-columns: 160px minmax(0, 1fr) 210px; grid-template-rows: auto; gap: 0 20px; padding: 18px; align-items: start; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart > img, .winkel.terra .shop-tegels.als-lijst .shop-kaart .foto-leeg { grid-column: 1; grid-row: 1 / span 6; width: 160px; height: 130px; margin: 0; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-sterren, .winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-titel,
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-specs, .winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-chiprij { grid-column: 2; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-voet { grid-column: 3; grid-row: 1 / span 6; flex-direction: column; align-items: flex-end; justify-content: center; border-left: 1px solid var(--nova-lijn); padding: 0 0 0 20px; margin: 0; text-align: right; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-prijs { justify-content: flex-end; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-hartvorm { margin: 12px 0 0; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-knoppen { margin: 0; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-hartvorm + .nova-knoppen { margin-top: -44px; margin-right: 53px; }
.winkel.terra .shop-tegels.als-lijst .kaart-labels { left: 18px; top: 18px; }
.winkel.terra .shop-tegels.als-lijst .kaart-tand { right: 18px; top: 18px; }
@media (max-width: 1023px) {
.winkel.terra .shop-lijst { display: block; }
.winkel.terra .shop-catkop { height: 160px; border-radius: 0; margin: 0 -16px 18px; }
.winkel.terra .shop-alles-over { right: 14px; bottom: 12px; font-size: 13.5px; }
.winkel.terra .shop-lijsttitel { font-size: 23px; }
.winkel.terra .shop-alles-over-link { display: none; }
.winkel.terra .shop-subtegel { height: 56px; padding: 0 18px; font-size: 13.5px; gap: 12px; }
.winkel.terra .shop-filterknop {
display: inline-flex; align-items: center; gap: 9px; height: 42px; border: 1px solid var(--nova-lijn); border-radius: 6px;
background: var(--card, #fff); color: var(--nova-inkt); font-size: 14px; font-weight: 700; padding: 0 16px; margin: 14px 0 0;
}
.winkel.terra .shop-lijstbalk { margin: 14px 0 14px; padding: 0; border: 0; gap: 10px; }
.winkel.terra .shop-weergave { margin-left: auto; }
.winkel.terra .shop-tegels, .winkel.terra .shop-tegels[data-per-rij] { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.winkel.terra .shop-tegels.als-lijst { grid-template-columns: minmax(0, 1fr); }
.winkel.terra .shop-kaart { padding: 14px; }
.winkel.terra .shop-kaart > img, .winkel.terra .shop-kaart .foto-leeg { height: 118px; margin: 0 0 10px; }
.winkel.terra .kaart-labels { left: 14px; top: 14px; }
.winkel.terra .kaart-tand { right: 14px; top: 12px; }
.winkel.terra .kaart-label { background: var(--nova-groen); }
.winkel.terra .shop-kaart .nova-titel { font-size: 14px; }
.winkel.terra .shop-kaart .nova-specs, .winkel.terra .shop-kaart .nova-sterren { display: none; }
.winkel.terra .shop-kaart .nova-prijs { font-size: 15px; color: var(--nova-inkt); }
.winkel.terra .shop-kaart .nova-hart, .winkel.terra .shop-kaart .nova-inwagen { width: 38px; height: 38px; }
.winkel.terra .shop-kaart .nova-inwagen::before { left: 11px; top: 17.5px; width: 16px; }
.winkel.terra .shop-kaart .nova-inwagen::after { left: 17.5px; top: 11px; height: 16px; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart { grid-template-columns: 96px minmax(0, 1fr); padding: 14px; gap: 0 16px; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart > img, .winkel.terra .shop-tegels.als-lijst .shop-kaart .foto-leeg { width: 96px; height: 86px; grid-row: 1 / span 4; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-voet { grid-column: 2; grid-row: auto; flex-direction: row; align-items: center; border: 0; padding: 10px 0 0; text-align: left; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-prijs { justify-content: flex-start; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-hartvorm { margin: 0 0 0 auto; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-hartvorm + .nova-knoppen { margin: 0; }
}
.winkel.terra .shop-lijst > .shop-filterknop { grid-column: 1 / -1; justify-self: start; }
@media (min-width: 1024px) {
.winkel.terra .shop-lijst:not(.filters-knop) > .shop-filterknop { display: none; }
}
@media (max-width: 1023px) {
.winkel.terra .shop-tegels .shop-kaart .nova-hart, .winkel.terra .shop-tegels .shop-kaart .nova-inwagen { width: 38px; height: 38px; }
}
.winkel.terra .shop-kruimels > .shop-kruimel-scheiding,
.winkel.terra .shop-kruimels > span[aria-hidden="true"] {
width: auto; height: auto; font-size: 13.5px; background: none; clip-path: none;
color: var(--nova-gedempt); opacity: .6;
}
.winkel.terra .shop-kaart .nova-voet { flex-wrap: wrap; row-gap: 10px; }
.winkel.terra .shop-kaart .nova-prijs .nova-vanaf { width: 100%; font-size: 12.5px; font-weight: 700; color: var(--nova-inkt); }
.winkel.terra .shop-kaart .nova-prijsvak { flex: 1 1 120px; }
@media (max-width: 1023px) {
.winkel.terra .shop-header-in { display: flex; align-items: center; flex-wrap: nowrap; gap: 10px; height: 62px; padding-block: 0; }
.winkel.terra .shop-lade-knop, .winkel.terra .shop-zoek-knop,
.winkel.terra .shop-header .kop-account, .winkel.terra .shop-header .shop-wagen {
display: flex; align-items: center; justify-content: center; flex: none; width: 42px; height: 42px; padding: 0; margin: 0;
border: 1px solid var(--nova-lijn); border-radius: 6px; background: var(--card, #fff); color: var(--nova-inkt); box-shadow: none;
}
.winkel.terra .shop-lade-knop { background: var(--winkel-accent); color: var(--winkel-accent-ink, #fff); border-color: var(--winkel-accent); }
.winkel.terra .shop-zoek-knop { display: flex; }
.winkel.terra .shop-header-in > a[href$="/shop"] { flex: 1; display: flex; justify-content: center; min-width: 0; }
.winkel.terra .shop-header-in img.logo-beeld { max-height: 32px; width: auto; }
.winkel.terra .shop-kop-rechts { display: flex; align-items: center; gap: 10px; margin: 0; flex: none; }
.winkel.terra .shop-header .shop-paneel-knop, .winkel.terra .shop-header .shop-kopknop, .winkel.terra .shop-header .shop-koptel,
.winkel.terra .shop-header .shop-btw, .winkel.terra .shop-header .kop-huur, .winkel.terra .shop-header .kop-hulp,
.winkel.terra .shop-header .shop-taalkiezer, .winkel.terra .shop-header .kop-woord, .winkel.terra .shop-header .wagen-woord { display: none; }
.winkel.terra .shop-header .shop-wagen .topbar-badge {
position: absolute; top: -6px; right: -6px; min-width: 18px; height: 16px; border-radius: 8px; padding: 0 4px;
background: var(--neg) !important; color: #fff; font-size: 10px; font-weight: 800; display: flex; align-items: center; justify-content: center;
}
.winkel.terra .shop-header .shop-wagen { position: relative; }
.winkel.terra .shop-header .shop-zoek {
position: absolute; left: 16px; right: 16px; top: 10px; height: 42px; margin: 0; z-index: 4;
opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-4px); transition: opacity .15s, transform .15s;
display: flex; align-items: center; border: 1px solid var(--winkel-accent); border-radius: 6px; background: var(--card, #fff); padding: 0 10px;
}
.winkel.terra .shop-header.zoek-open .shop-zoek { opacity: 1; visibility: visible; pointer-events: auto; transform: none; }
.winkel.terra .shop-header.zoek-open .shop-header-in > :not(.shop-zoek) { opacity: 0; pointer-events: none; }
.winkel.terra .shop-header .shop-zoek > svg { display: none; }
.winkel.terra .shop-header .shop-zoek-terug, .winkel.terra .shop-header .shop-zoek-ga {
display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border: 0; background: none; color: var(--nova-inkt); padding: 0; flex: none;
}
.winkel.terra .shop-header .shop-zoek input { flex: 1; min-width: 0; border: 0; background: none; font-size: 15px; color: var(--nova-inkt); }
.winkel.terra .shop-header .shop-zoek input:focus { outline: none; }
.winkel.terra .shop-header { position: relative; }
.winkel.terra .shop-zoek-waas { position: fixed; inset: 0; background: rgba(10, 9, 77, .35); opacity: 0; pointer-events: none; transition: opacity .15s; z-index: 3; }
.winkel.terra:has(.shop-header.zoek-open) .shop-zoek-waas { opacity: 1; pointer-events: auto; }
.winkel.terra .shop-menu { display: none; }
}
.winkel.terra .shop-lijstkolom .shop-kruimels .kruimel-terug, .winkel.terra .shop-kruimels .kruimel-terug { margin-left: 0; }
@media (max-width: 1023px) {
.winkel.terra .shop-header .shop-header-in { height: 62px; min-height: 0; padding: 0; box-sizing: border-box; }
.winkel.terra .shop-header .shop-header-in .shop-lade-knop { background: var(--winkel-accent); color: var(--winkel-accent-ink, #fff); border-color: var(--winkel-accent); width: 42px; height: 42px; }
.winkel.terra .shop-header .shop-kop-rechts .kop-account, .winkel.terra .shop-header .shop-kop-rechts .shop-wagen {
width: 42px; height: 42px; min-height: 0; padding: 0; background: var(--card, #fff); color: var(--nova-inkt); border: 1px solid var(--nova-lijn); border-radius: 6px; font-size: 0;
}
.winkel.terra .shop-header .shop-kop-rechts .shop-wagen svg, .winkel.terra .shop-header .shop-kop-rechts .kop-account svg { width: 18px; height: 18px; }
}
@media (max-width: 1023px) {
.winkel.terra .shop-header.vorm-terra .shop-header-in { height: 62px; min-height: 62px; padding: 10px 16px; box-sizing: border-box; }
}
@media (min-width: 1024px) {
.winkel.terra .shop-zoek-knop, .winkel.terra .shop-zoek-terug, .winkel.terra .shop-zoek-ga, .winkel.terra .shop-zoek-waas { display: none; }
}
.winkel.terra .shop-kaart { container-type: inline-size; }
@container (max-width: 300px) {
.winkel.terra .shop-kaart .nova-voet { flex-wrap: nowrap; }
.winkel.terra .shop-kaart .nova-prijs { font-size: 16px; }
.winkel.terra .shop-kaart .nova-hart, .winkel.terra .shop-kaart .nova-inwagen { width: 38px; height: 38px; }
.winkel.terra .shop-kaart .nova-inwagen::before { left: 11px; top: 17.5px; width: 16px; }
.winkel.terra .shop-kaart .nova-inwagen::after { left: 17.5px; top: 11px; height: 16px; }
.winkel.terra .shop-kaart .nova-tweedeprijs { display: none; }
}
.winkel.terra .shop-kaart .nova-chiprij .nova-chip svg { display: none; }
.winkel.terra .pdp-onder-links .pdp-verhaal-tekst > :is(h2, h3, h4):first-child { font-size: 25px; font-weight: 800; letter-spacing: -.4px; margin: 0 0 16px; }
.winkel.terra .pdp-onder-links .pdp-verhaal-tekst h2:not(:first-child) { font-size: 14.5px; font-weight: 750; margin: 22px 0 7px; }
.winkel.terra .pdp-punten-titel, .winkel.terra .pdp-downloads-kop, .winkel.terra .pdp-onder-rechts .pdp-specblok h2 { line-height: 1.3; margin: 0 0 16px; padding: 0; }
@media (max-width: 1023px) {
.winkel.terra .shop-header.vorm-terra .shop-zoek input,
.winkel.terra .shop-header.vorm-terra .shop-zoek input:focus,
.winkel.terra .shop-header.vorm-terra .shop-zoek input:focus-visible {
border: 0; outline: 0; box-shadow: none; background: none; height: 40px; padding: 0 8px; margin: 0; border-radius: 0; font-size: 15px;
}
.winkel.terra .shop-header.vorm-terra .shop-zoek .shop-zoek-dicht { display: none; }
.winkel.terra .shop-header.vorm-terra .shop-zoek #shop-sug { left: -1px; right: -1px; top: 46px; }
}
.winkel.terra .shop-balk-filterknop {
display: none; align-items: center; gap: 9px; height: 42px; padding: 0 16px; flex: none;
border: 1px solid var(--nova-lijn); border-radius: 6px; background: var(--card, #fff); color: var(--nova-inkt);
font: inherit; font-size: 14px; font-weight: 700; cursor: pointer;
}
.winkel.terra .shop-lijst.filters-knop .shop-balk-filterknop { display: inline-flex; }
@media (min-width: 1024px) {
.winkel.terra .shop-lijst.filters-knop .shop-zijbalk { display: none; }
.winkel.terra .shop-lijst.filters-knop.filters-open .shop-zijbalk { display: block; grid-column: 1 / -1; }
}
@media (max-width: 1023px) {
.winkel.terra .shop-balk-filterknop { display: inline-flex; }
.winkel.terra .shop-lijst .shop-zijbalk { display: none; }
.winkel.terra .shop-lijst.filters-open .shop-zijbalk {
display: block; position: fixed; inset: 0; z-index: 60; overflow-y: auto; background: var(--card, #fff); padding: 0 16px 24px; margin: 0;
}
.winkel.terra .shop-filterblad-kop {
display: flex; align-items: center; height: 62px; margin: 0 -16px 16px; padding: 0 16px; border-bottom: 1px solid var(--nova-lijn);
font-size: 17px; font-weight: 800; color: var(--nova-inkt); position: sticky; top: 0; background: var(--card, #fff); z-index: 1;
}
.winkel.terra .shop-filterblad-sluit {
margin-left: auto; width: 42px; height: 42px; border: 1px solid var(--nova-lijn); border-radius: 6px; background: var(--card, #fff); color: var(--nova-inkt);
display: flex; align-items: center; justify-content: center; cursor: pointer; padding: 0;
}
html.filters-vast { overflow: hidden; }
.winkel.terra .shop-lijstbalk { flex-wrap: nowrap; gap: 10px; }
.winkel.terra .shop-telling { flex: 1; text-align: center; font-size: 13.5px; white-space: nowrap; }
.winkel.terra .shop-filterchips { width: 100%; order: 9; }
.winkel.terra .shop-lijstbalk .shop-select[name="sorteer"] { min-width: 0; flex: 0 1 150px; padding: 0 30px 0 12px; }
.winkel.terra .shop-weergave { margin-left: 0; gap: 6px; }
.winkel.terra .shop-weergave button { width: 38px; height: 38px; }
.winkel.terra .shop-lijstkolom > .shop-kruimels { margin: 14px 0 8px; }
}
@media (max-width: 1023px) {
.winkel.terra .shop-zijbalk .shop-filterregel, .winkel.terra .shop-zijbalk .shop-cat a, .winkel.terra .shop-zijbalk .shop-catregel {
border: 0; background: none; padding: 0; margin: 9px 0; box-shadow: none; border-radius: 0;
}
}
.winkel.terra .shop-catkop::after {
content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 90px; pointer-events: none;
background: linear-gradient(180deg, rgba(10, 9, 77, 0), rgba(10, 9, 77, .45));
}
.winkel.terra .shop-alles-over { z-index: 1; }
.winkel.terra .shop-cattekst { margin: 0 0 22px; }
.winkel.terra .shop-subtegels { margin: 0 0 4px; }
@media (max-width: 1023px) {
.winkel.terra .shop-lijstkolom .shop-subtegels { display: flex; flex-wrap: nowrap; overflow-x: auto; gap: 12px; margin: 0 -16px 4px; padding: 0 16px; scrollbar-width: none; }
.winkel.terra .shop-lijstkolom .shop-subtegel { flex: none; width: auto; height: 56px; margin: 0; padding: 0 18px; font-size: 13.5px; gap: 12px; }
.winkel.terra .shop-catkop { margin: 0 -16px 18px; }
}
@media (max-width: 1023px) {
.winkel.terra .shop-lijst .shop-lijstkolom .shop-subtegels .shop-subtegel { background: var(--nova-vlak); border-radius: 8px; box-shadow: none; }
}
@media (max-width: 1023px) {
.winkel.terra .shop-lijstkolom > .shop-kruimels, .winkel.terra .shop-lijstkolom > .shop-cattitelrij,
.winkel.terra .shop-lijstkolom > .shop-cattekst, .winkel.terra .shop-lijstkolom > .shop-subtegels,
.winkel.terra .shop-lijstkolom > .shop-lijsttitel {
background: var(--card, #fff); margin-inline: -16px; padding-inline: 16px;
}
.winkel.terra .shop-lijstkolom > .shop-kruimels { padding-top: 14px; margin-top: 0; }
.winkel.terra .shop-lijstkolom > .shop-subtegels { padding-bottom: 18px; margin-bottom: 0; }
.winkel.terra .shop-lijstkolom > .shop-catkop { margin-bottom: 0; }
.winkel.terra .shop-lijstkolom > .shop-cattitelrij { padding-top: 18px; }
.winkel.terra .shop-lijst .shop-lijstkolom .shop-subtegels .shop-subtegel { height: 56px; min-height: 0; padding: 0 18px; box-sizing: border-box; }
.winkel.terra .shop-lijstbalk { padding-top: 14px; }
}
.winkel.terra {
--terra-lijn-licht: color-mix(in srgb, var(--nova-lijn) 60%, var(--card, #fff));
--terra-tekst-zacht: color-mix(in srgb, var(--nova-inkt) 75%, var(--card, #fff));
}
.winkel.terra .wagen-titel { font-size: 33px; font-weight: 800; letter-spacing: -.7px; line-height: 1.2; margin: 0 0 26px; display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.winkel.terra .wagen-titel .wagen-aantal { font-size: 14.5px; font-weight: 400; color: var(--nova-gedempt); letter-spacing: 0; }
.winkel.terra .wagen-vlak { display: grid; grid-template-columns: minmax(0, 1fr) 420px; gap: 46px; align-items: start; }
.winkel.terra .wagen-regels { display: flex; flex-direction: column; }
.winkel.terra .wagen-kopregel,
.winkel.terra .wagen-regel {
display: grid; grid-template-columns: 110px minmax(0, 1fr) 170px 130px 50px; gap: 0; align-items: center;
padding: 18px 0; border: 0; border-top: 1px solid var(--terra-lijn-licht); border-radius: 0; background: transparent;
}
.winkel.terra .wagen-kopregel { padding: 0 0 12px; border-top: 0; font-size: 12.5px; font-weight: 650; color: var(--nova-gedempt); }
.winkel.terra .wagen-kopregel span:nth-child(4) { text-align: right; }
.winkel.terra .wagen-foto { width: 86px; height: 74px; object-fit: contain; border: 1px solid var(--terra-lijn-licht); border-radius: 7px; background: var(--card, #fff); padding: 2px; box-sizing: border-box; }
.winkel.terra .wagen-foto.leeg { background: var(--nova-vlak); }
.winkel.terra .wagen-naam { font-size: 14.5px; font-weight: 700; line-height: 1.35; }
.winkel.terra .wagen-regel .cell-sub { font-size: 12.5px; color: var(--nova-gedempt); margin-top: 4px; }
.winkel.terra .wagen-stuk { display: none; }
.winkel.terra .wagen-aantalvorm { display: inline-flex; margin: 0; }
.winkel.terra .wagen-aantalvorm [data-wagen-knop] { display: none; }
.winkel.terra .wagen-aantalvorm .teller {
width: 136px; height: 44px; flex: none; border: 1px solid var(--nova-lijn); border-radius: 8px; background: var(--card, #fff);
display: flex; align-items: center; justify-content: space-between; padding: 0 6px; box-sizing: border-box;
}
.winkel.terra .wagen-aantalvorm .teller button { width: 30px; height: 100%; border: 0; background: none; font-size: 16px; color: var(--nova-inkt); cursor: pointer; padding: 0; }
.winkel.terra .wagen-aantalvorm .teller input { width: 40px; min-width: 0; height: 100%; border: 0; background: none; text-align: center; font-size: 14px; font-weight: 650; color: var(--nova-inkt); -moz-appearance: textfield; padding: 0; }
.winkel.terra .wagen-aantalvorm .teller input::-webkit-outer-spin-button,
.winkel.terra .wagen-aantalvorm .teller input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.winkel.terra .wagen-totaal { font-size: 16px; font-weight: 800; text-align: right; white-space: nowrap; }
.winkel.terra .wagen-wegvorm { margin: 0; justify-self: end; }
.winkel.terra .wagen-weg { width: 28px; height: 28px; border: 1px solid var(--nova-lijn); border-radius: 50%; background: var(--card, #fff); color: var(--nova-gedempt); font-size: 16px; line-height: 1; display: grid; place-items: center; cursor: pointer; padding: 0; }
.winkel.terra .wagen-weg:hover { border-color: var(--nova-inkt); color: var(--nova-inkt); background: var(--card, #fff); }
.winkel.terra .wagen-telling { position: static; border: 0; box-shadow: none; overflow: visible; background: var(--nova-vlak); border-radius: var(--hoek, 12px); padding: 22px; display: flex; flex-direction: column; gap: 0; }
.winkel.terra .wagen-telling-kop { display: none; }
.winkel.terra .wagen-telling-lijf { padding: 0; gap: 0; display: flex; flex-direction: column; }
.winkel.terra .wagen-rij { display: flex; justify-content: space-between; gap: 14px; font-size: 14px; padding: 0; margin: 10px 0; }
.winkel.terra .wagen-rij:first-child { margin-top: 0; }
.winkel.terra .wagen-rij small { font-size: 12.5px; color: var(--nova-gedempt); margin-left: 4px; }
.winkel.terra .wagen-rij.wagen-korting-rij { color: var(--nova-groen); }
.winkel.terra .wagen-rij.wagen-totaalrij { font-size: 19px; font-weight: 800; border-top: 1px solid var(--nova-lijn); padding-top: 14px; margin-top: 16px; }
.winkel.terra .wagen-gratis { font-size: 12.5px; color: var(--nova-gedempt); padding: 0; margin-top: 4px; }
.winkel.terra .wagen-telling-voet { background: transparent; border: 0; padding: 0; margin-top: 18px; display: flex; flex-direction: column; align-items: stretch; gap: 0; }
.winkel.terra .wagen-afrekenen {
width: 100%; height: 62px; margin: 0; border: 0; border-radius: 8px; background: var(--winkel-accent); color: var(--winkel-accent-ink, #fff) !important;
font-size: 15px; font-weight: 750; display: flex; align-items: center; justify-content: center; text-decoration: none !important;
}
.winkel.terra .wagen-afrekenen:hover { filter: brightness(.94); }
.winkel.terra .wagen-betaallogos { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 16px; min-height: 34px; margin-top: 14px; }
.winkel.terra .wagen-betaallogos img { height: 22px; width: auto; display: block; }
.winkel.terra .wagen-vraag { display: inline-flex; align-items: center; gap: 6px; color: var(--winkel-accent); font-weight: 700; font-size: 13.5px; margin-top: 12px; text-decoration: none; }
.winkel.terra .wagen-vraag:hover { text-decoration: underline; }
.winkel.terra .wagen-veilig { display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px; color: var(--nova-gedempt); margin-top: 12px; }
.winkel.terra .wagen-telling > .wagen-korting { display: flex; gap: 8px; margin: 14px 0 0; }
.winkel.terra .wagen-telling > .wagen-korting input {
flex: 1; min-width: 0; height: 44px; border: 1px solid var(--nova-lijn); border-radius: 6px; background: var(--card, #fff); padding: 0 14px; font-size: 14px; color: var(--nova-inkt); text-transform: none;
}
.winkel.terra .wagen-telling > .wagen-korting input::placeholder { color: var(--nova-gedempt); }
.winkel.terra .wagen-telling > .wagen-korting .ghost.small { height: 44px; padding: 0 16px; border: 1px solid var(--nova-lijn); border-radius: 6px; background: var(--card, #fff); color: var(--nova-inkt); font-size: 13.5px; font-weight: 700; cursor: pointer; }
.winkel.terra .wagen-telling > .wagen-korting:has(input:placeholder-shown) #sc-korting-wis { display: none; }
.winkel.terra #sc-korting-fout { margin-top: 8px; }
.winkel.terra .wagen-usps { display: none; }
.winkel.terra .wagen-leegstand { text-align: center; padding: 80px 0; }
.winkel.terra .wagen-leeg-cirkel, .winkel.terra .shop-leeg-cirkel { width: 96px; height: 96px; border-radius: 50%; background: var(--nova-vlak); margin: 0 auto 22px; display: flex; align-items: center; justify-content: center; color: var(--winkel-accent); }
.winkel.terra .wagen-leeg-cirkel svg, .winkel.terra .shop-leeg-cirkel svg { width: 40px; height: 40px; }
.winkel.terra .wagen-leeg-kop { display: block; font-size: 22px; font-weight: 800; margin: 0 0 10px; color: var(--nova-inkt); }
.winkel.terra .wagen-leegstand p { font-size: 14.5px; color: var(--terra-tekst-zacht); margin: 0 0 22px; }
.winkel.terra .wagen-leeg-knop, .winkel.terra .shop-leeg-knoppen .btn-primary, .winkel.terra .shop-niet-gevonden-zoek .btn-primary, .winkel.terra .inlog-knoppen .inlog-knop {
display: inline-flex; align-items: center; justify-content: center; gap: 10px; height: 48px; padding: 0 22px; border: 0; border-radius: 6px;
background: var(--winkel-accent); color: var(--winkel-accent-ink, #fff) !important; font-size: 14px; font-weight: 700; text-decoration: none !important; cursor: pointer; box-sizing: border-box;
}
.winkel.terra .shop-leeg-knoppen .ghost, .winkel.terra .inlog-knoppen .inlog-knop-wit {
display: inline-flex; align-items: center; justify-content: center; gap: 10px; height: 48px; padding: 0 22px; border: 1px solid var(--nova-lijn); border-radius: 6px;
background: var(--card, #fff); color: var(--nova-inkt) !important; font-size: 14px; font-weight: 700; text-decoration: none !important; cursor: pointer; box-sizing: border-box;
}
.winkel.terra .afr-kop { background: var(--card, #fff); border-bottom: 1px solid var(--nova-lijn); }
.winkel.terra .afr-kop-in { max-width: var(--site-breedte); margin: 0 auto; padding: 0 var(--nova-zij); height: 66px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px; }
.winkel.terra .afr-logo { display: inline-flex; align-items: center; color: var(--nova-inkt); font-weight: 800; font-size: 20px; text-decoration: none; }
.winkel.terra .afr-logo .logo-beeld { height: 40px; width: auto; display: block; }
.winkel.terra .afr-stappen { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 14px; font-size: 13.5px; font-weight: 700; }
.winkel.terra .afr-stappen li { display: flex; align-items: center; gap: 9px; color: var(--nova-gedempt); white-space: nowrap; font-size: 13.5px; }
.winkel.terra .afr-stappen li a { display: flex; align-items: center; gap: 9px; color: inherit; text-decoration: none; }
.winkel.terra .afr-stappen li + li::before { content: ""; width: 6px; height: 10px; margin: 0 2px; background: currentColor; opacity: .3; clip-path: polygon(0 0, 1.8px 0, 6px 5px, 1.8px 10px, 0 10px, 4.2px 5px); }
.winkel.terra .afr-stappen li i { font-style: normal; display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; border: 0; background: color-mix(in srgb, var(--nova-inkt) 10%, var(--card, #fff)); color: var(--nova-gedempt); font-size: 12px; font-weight: 800; }
.winkel.terra .afr-stappen li.aan { color: var(--nova-inkt); }
.winkel.terra .afr-stappen li.aan i { background: var(--winkel-accent); color: var(--winkel-accent-ink, #fff); }
.winkel.terra .afr-stappen li.klaar { color: var(--nova-inkt); }
.winkel.terra .afr-stappen li.klaar i { background: var(--nova-groen); color: #fff; border: 0; }
.winkel.terra .afr-hulp { text-align: right; display: flex; flex-direction: column; font-size: 13px; color: var(--nova-gedempt); line-height: 1.4; }
.winkel.terra .afr-hulp b { color: var(--nova-inkt); }
.winkel.terra.afrekenen .shop-main { max-width: var(--site-breedte); padding: 26px var(--nova-zij) 64px; background: var(--card, #fff); }
.winkel.terra .afr { display: flex; flex-direction: column; gap: 0; }
.winkel.terra .afr-intro { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin: 0 0 30px; }
.winkel.terra .afr-intro h1 { margin: 0; font-size: 33px; font-weight: 800; letter-spacing: -.7px; line-height: 1.2; }
.winkel.terra .afr-intro span { color: var(--nova-gedempt); font-size: 14.5px; }
.winkel.terra .afr a { color: var(--winkel-accent); font-weight: 700; text-decoration: none; }
.winkel.terra .afr-fout { margin: 0 0 20px; }
.winkel.terra .afr-vorm { display: grid; grid-template-columns: minmax(0, 1fr) 420px; gap: 46px; align-items: start; }
.winkel.terra .afr-links { display: flex; flex-direction: column; gap: 34px; min-width: 0; }
.winkel.terra .afr-sectie { background: transparent; border: 0; border-radius: 0; padding: 0; }
.winkel.terra .afr-sectie > header { display: flex; align-items: flex-start; gap: 0; margin: 0 0 16px; }
.winkel.terra .afr-sectie > header i { display: none; }
.winkel.terra .afr-sectie h2 { margin: 0; font-size: 20px; font-weight: 800; line-height: 1.3; }
.winkel.terra .afr-sectie > header p { margin: 6px 0 0; color: var(--nova-gedempt); font-size: 14px; }
.winkel.terra .afr-seg { display: inline-flex; border: 1px solid var(--nova-lijn); border-radius: 6px; overflow: hidden; margin: 0 0 16px; height: 44px; }
.winkel.terra .afr-seg span { display: flex; align-items: center; height: 100%; padding: 0 22px; font-weight: 700; font-size: 14px; color: var(--nova-inkt); }
.winkel.terra .afr-seg input:checked + span { background: var(--winkel-accent); color: var(--winkel-accent-ink, #fff); }
.winkel.terra .afr-raster { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.winkel.terra .afr-raster.adres { grid-template-columns: 1fr 1fr; max-width: 640px; }
.winkel.terra .afr-raster.adres .afr-veld:has(#land), .winkel.terra .afr-raster.adres .afr-veld:has(#factuur_land) { grid-column: 1 / -1; }
.winkel.terra .afr-veld { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.winkel.terra .afr-label { font-size: 12.5px; color: var(--nova-gedempt); font-weight: 650; }
.winkel.terra .afr-veld input, .winkel.terra .afr-veld select, .winkel.terra .afr-veld textarea, .winkel.terra .afr-sub input[type="text"] {
height: 44px; border: 1px solid var(--nova-lijn); border-radius: 6px; padding: 0 14px; background: var(--card, #fff); color: var(--nova-inkt); font-size: 14px; box-sizing: border-box;
}
.winkel.terra .afr-veld textarea { height: auto; min-height: 110px; padding: 12px 14px; line-height: 1.6; }
.winkel.terra .afr-veld input:focus, .winkel.terra .afr-veld select:focus, .winkel.terra .afr-veld textarea:focus { outline: 0; border-color: var(--winkel-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--winkel-accent) 14%, transparent); }
.winkel.terra .afr-hint { color: var(--nova-gedempt); font-size: 12.5px; line-height: 1.4; }
.winkel.terra .afr-herinnering { font-size: 14px; }
.winkel.terra .afr-tussenkop { margin: 34px 0 16px; font-size: 20px; font-weight: 800; }
.winkel.terra .afr-tussenkop small { color: var(--nova-gedempt); font-weight: 400; font-size: 13px; margin-left: 8px; }
.winkel.terra .afr-keuzes { display: grid; grid-template-columns: 1fr; gap: 12px; }
.winkel.terra .afr-keuze {
display: grid; grid-template-columns: 18px 1fr auto; gap: 13px; align-items: center;
border: 1px solid var(--nova-lijn); border-radius: 10px; padding: 14px 18px; background: var(--card, #fff); cursor: pointer; min-height: 62px; box-sizing: border-box;
}
.winkel.terra .afr-keuze:has(input:checked), .winkel.terra .afr-pm:has(input:checked) { border-color: var(--nova-lijn); box-shadow: none; background: var(--card, #fff); }
.winkel.terra .afr-keuze:has(input:focus-visible), .winkel.terra .afr-pm:has(input:focus-visible) { box-shadow: 0 0 0 3px color-mix(in srgb, var(--winkel-accent) 20%, transparent); }
.winkel.terra .afr-radio { width: 18px; height: 18px; border: 1px solid var(--nova-lijn); background: var(--card, #fff); margin-top: 0; }
.winkel.terra :is(.afr-keuze, .afr-pm):has(input:checked) .afr-radio { background: var(--winkel-accent); border-color: var(--winkel-accent); }
.winkel.terra :is(.afr-keuze, .afr-pm):has(input:checked) .afr-radio::after { content: none; }
.winkel.terra .afr-keuze-in { display: flex; flex-direction: column; gap: 3px; }
.winkel.terra .afr-keuze b { font-size: 14.5px; font-weight: 700; }
.winkel.terra .afr-keuze small { color: var(--terra-tekst-zacht); font-size: 13px; font-weight: 600; line-height: 1.45; }
.winkel.terra .afr-keuze em { font-style: normal; font-weight: 700; font-size: 14.5px; white-space: nowrap; }
.winkel.terra .afr-sub { border: 1px solid var(--nova-lijn); border-radius: 10px; padding: 14px 18px; }
.winkel.terra .afr-sub-lbl { font-size: 12.5px; color: var(--nova-gedempt); font-weight: 650; }
.winkel.terra .afr-vink { display: flex; align-items: center; gap: 11px; margin: 16px 0 0; font-size: 13.5px; font-weight: 600; cursor: pointer; }
.winkel.terra .afr-vink input[type="checkbox"] { width: 17px; height: 17px; margin: 0; accent-color: var(--winkel-accent); }
.winkel.terra .afr-factuur { margin-top: 0; }
.winkel.terra .afr-betaal { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0 0 16px; }
.winkel.terra .afr-pm {
display: grid; grid-template-columns: 18px 76px 1fr; gap: 0 13px; align-items: center; min-height: 62px;
border: 1px solid var(--nova-lijn); border-radius: 10px; padding: 12px 18px; background: var(--card, #fff); cursor: pointer; box-sizing: border-box;
}
.winkel.terra .afr-pm.uit { opacity: .6; border-style: dashed; cursor: default; }
.winkel.terra .afr-pm .afr-radio { margin-top: 0; }
.winkel.terra .afr-pm-logo { margin-top: 0; }
.winkel.terra .afr-pm b { font-size: 14.5px; font-weight: 700; }
.winkel.terra .afr-pm small { color: var(--terra-tekst-zacht); font-size: 12.5px; }
.winkel.terra .afr-pm-hint { margin: 0 0 16px; }
.winkel.terra .afr-opmerking summary { color: var(--winkel-accent); font-weight: 700; font-size: 13.5px; cursor: pointer; list-style: none; }
.winkel.terra .afr-opmerking .afr-veld { margin-top: 12px; }
.winkel.terra .afr-onder { color: var(--nova-gedempt); font-size: 12.5px; line-height: 1.5; margin: 0; }
.winkel.terra .afr-bestelling { background: var(--nova-vlak); border: 0; border-radius: var(--hoek, 12px); padding: 22px; position: sticky; top: 24px; display: flex; flex-direction: column; gap: 0; }
.winkel.terra .afr-bestelling h3 { margin: 0 0 14px; font-size: 15px; font-weight: 800; display: flex; align-items: baseline; gap: 8px; }
.winkel.terra .afr-bestelling h3 span { color: var(--nova-gedempt); font-weight: 400; font-size: 13px; }
.winkel.terra .afr-bestelling h3 a { margin-left: auto; font-size: 13px; }
.winkel.terra .afr-regels { display: flex; flex-direction: column; gap: 0; max-height: 340px; overflow: auto; }
.winkel.terra .afr-regel { display: grid; grid-template-columns: 46px minmax(0, 1fr) auto auto; gap: 14px; align-items: center; padding: 8px 0; }
.winkel.terra .afr-regel img, .winkel.terra .afr-geenfoto { width: 46px; height: 42px; object-fit: contain; border-radius: 6px; border: 1px solid var(--terra-lijn-licht); background: var(--card, #fff); display: block; box-sizing: border-box; }
.winkel.terra .afr-regel b { display: block; font-size: 13px; font-weight: 700; line-height: 1.35; }
.winkel.terra .afr-regel small { color: var(--nova-gedempt); font-size: 12.5px; }
.winkel.terra .afr-aantal { color: var(--nova-gedempt); font-size: 13px; white-space: nowrap; }
.winkel.terra .afr-prijs { font-weight: 800; font-size: 13px; min-width: 0; text-align: right; }
.winkel.terra .afr-totalen { display: grid; grid-template-columns: 1fr auto; gap: 0 12px; margin: 8px 0 0; border-top: 0; padding-top: 0; font-size: 14px; }
.winkel.terra .afr-totalen dt, .winkel.terra .afr-totalen dd { margin: 10px 0 0; color: var(--nova-inkt); }
.winkel.terra .afr-totalen dd { text-align: right; font-weight: 700; }
.winkel.terra .afr-totalen .tot { font-size: 19px; font-weight: 800; border-top: 1px solid var(--nova-lijn); padding-top: 14px; margin-top: 16px; }
.winkel.terra .afr-totalen .tot small { font-size: 12.5px; color: var(--nova-gedempt); font-weight: 400; }
.winkel.terra .afr-bestelling .afr-knop { margin: 18px 0 0; height: 62px; padding: 0 18px; border-radius: 8px; font-size: 15px; font-weight: 750; background: var(--winkel-accent); color: var(--winkel-accent-ink, #fff); gap: 12px; width: 100%; display: flex; align-items: center; justify-content: center; }
.winkel.terra .afr-bestelling .afr-knop span { opacity: 1; font-weight: 700; }
.winkel.terra .afr-veilig { margin: 14px 0 0; display: flex; justify-content: center; align-items: center; gap: 7px; color: var(--nova-gedempt); font-size: 12.5px; text-align: center; }
.winkel.terra .afr-trust { list-style: none; margin: 14px 0 0; padding: 0; border: 0; display: flex; flex-direction: column; gap: 0; font-size: 14.5px; font-weight: 600; color: var(--nova-inkt); }
.winkel.terra .afr-trust li { position: relative; padding-left: 30px; margin: 0 0 14px; line-height: 17px; min-height: 17px; }
.winkel.terra .afr-trust li::before { content: ""; position: absolute; left: 0; top: 0; width: 17px; height: 17px; border-radius: 50%; background: var(--nova-groen); margin: 0; }
.winkel.terra .afr-trust li::after { content: ""; position: absolute; left: 6px; top: 3.5px; width: 4px; height: 8px; border-right: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(40deg); }
.winkel.terra .afr-logos { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 16px; margin-top: 4px; min-height: 34px; }
.winkel.terra .afr-logos img { height: 22px; width: auto; padding: 0; border: 0; border-radius: 0; background: transparent; }
.winkel.terra .afr-voet { max-width: var(--site-breedte); margin: 0 auto; padding: 20px var(--nova-zij) 28px; display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; color: var(--nova-gedempt); font-size: 13px; border-top: 1px solid var(--nova-lijn); }
.winkel.terra .afr-voet-links a { color: var(--nova-gedempt); text-decoration: none; }
.winkel.terra .inlog { display: grid; grid-template-columns: 1fr 1fr; gap: 46px; max-width: 1100px; margin: 0 auto; min-height: 0; padding: 0; align-items: start; }
.winkel.terra .inlog-links { padding: 0; display: block; }
.winkel.terra .inlog-vorm { max-width: 420px; }
.winkel.terra .inlog-vorm h1 { font-size: 26px; font-weight: 800; letter-spacing: -.5px; line-height: 1.2; margin: 0 0 8px; }
.winkel.terra .inlog-uitleg { font-size: 14.5px; line-height: 1.62; margin: 0 0 22px; color: var(--terra-tekst-zacht); }
.winkel.terra .inlog-velden { display: grid; gap: 12px; margin: 0; }
.winkel.terra .inlog-velden .klant-veld { margin: 0; }
.winkel.terra .inlog-velden .klant-veld > label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.winkel.terra .inlog-velden .klant-veld input {
width: 100%; height: 44px; min-height: 0; border: 1px solid var(--nova-lijn); border-radius: 6px; background: var(--card, #fff); padding: 0 14px; font-size: 14px; color: var(--nova-inkt); box-sizing: border-box;
}
.winkel.terra .inlog-velden .klant-veld input::placeholder { color: var(--nova-gedempt); opacity: 1; }
.winkel.terra .inlog-velden .klant-veld input:focus { outline: 0; border-color: var(--winkel-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--winkel-accent) 14%, transparent); }
.winkel.terra .inlog-rij { display: flex; flex-direction: column-reverse; align-items: stretch; gap: 0; margin: 0; }
.winkel.terra .inlog-rij .inlog-knop { width: 100%; height: 52px; border: 0; border-radius: 6px; background: var(--winkel-accent); color: var(--winkel-accent-ink, #fff); font-size: 14px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; gap: 10px; cursor: pointer; }
.winkel.terra .inlog-vergeten { display: inline-flex; align-items: center; color: var(--winkel-accent); font-weight: 700; font-size: 13.5px; margin-top: 12px; text-decoration: none; }
.winkel.terra .inlog-vergeten:hover { text-decoration: underline; }
.winkel.terra .inlog-rechts { background: var(--nova-vlak); border-radius: var(--hoek, 12px); padding: 30px; margin: 0; overflow: visible; min-height: 0; }
.winkel.terra .inlog-rechts h2 { font-size: 20px; font-weight: 800; line-height: 1.3; margin: 0 0 12px; }
.winkel.terra .inlog-rechts p { font-size: 14.5px; line-height: 1.62; margin: 0 0 20px; max-width: 520px; color: var(--terra-tekst-zacht); }
.winkel.terra .inlog-usps { list-style: none; margin: 0; padding: 0; }
.winkel.terra .inlog-usps li { position: relative; padding-left: 30px; margin: 14px 0; font-size: 14.5px; font-weight: 600; line-height: 17px; color: var(--nova-inkt); }
.winkel.terra .inlog-usps li::before { content: ""; position: absolute; left: 0; top: 0; width: 17px; height: 17px; border-radius: 50%; background: var(--nova-groen); }
.winkel.terra .inlog-usps li::after { content: ""; position: absolute; left: 6px; top: 3.5px; width: 4px; height: 8px; border-right: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(40deg); }
.winkel.terra .inlog-knoppen { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 18px; }
.winkel.terra .inlog-foto { display: block; width: 100%; height: auto; border-radius: 8px; margin-top: 22px; position: static; }
.winkel.terra .shop-leeg-pagina { max-width: none; margin: 0; padding: 80px 0 0; text-align: center; }
.winkel.terra .shop-leeg-pagina h1 { font-size: 26px; font-weight: 800; letter-spacing: -.5px; margin: 0 0 10px; }
.winkel.terra .shop-leeg-pagina p { font-size: 14.5px; line-height: 1.62; color: var(--terra-tekst-zacht); max-width: 520px; margin: 0 auto 24px; }
.winkel.terra .shop-niet-gevonden-zoek { display: flex; gap: 12px; justify-content: center; align-items: center; margin: 0 0 22px; }
.winkel.terra .shop-niet-gevonden-zoek input { flex: 0 1 360px; min-width: 0; height: 44px; border: 1px solid var(--nova-lijn); border-radius: 6px; padding: 0 14px; font-size: 14px; color: var(--nova-inkt); background: var(--card, #fff); box-sizing: border-box; }
.winkel.terra .shop-niet-gevonden-zoek .btn-primary { height: 44px; }
.winkel.terra .shop-niet-gevonden-links { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin: 0 0 22px; }
.winkel.terra .shop-niet-gevonden-links a { height: 44px; display: inline-flex; align-items: center; padding: 0 22px; background: var(--nova-vlak); border: 0; border-radius: 8px; font-size: 14.5px; font-weight: 650; color: var(--nova-inkt); text-decoration: none; }
.winkel.terra .shop-leeg-pagina .shop-leeg-knoppen { display: flex; gap: 12px; justify-content: center; margin: 0; }
.winkel.terra .shop-leeg-pagina + .shop-rij { margin-top: 56px; }
.winkel.terra .shop-leeg-pagina + .shop-rij h2 { font-size: 25px; font-weight: 800; letter-spacing: -.5px; margin: 0 0 20px; }
.winkel.terra .shop-footer { background: var(--nova-vlak); border-top: 0; margin-top: 70px; padding: 48px 0 0; }
.winkel.terra .shop-footer .shop-voet-naam { display: none; }
.winkel.terra .shop-footer .shop-footer-in {
max-width: var(--site-breedte); margin: 0 auto; padding: 0 var(--nova-zij) 40px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; align-items: start;
font-size: 13.5px; line-height: 1.6;
}
.winkel.terra .shop-footer .shop-footer-in > div > div:first-child, .winkel.terra .shop-footer .shop-voet-kop { font-size: 14.5px; font-weight: 800; color: var(--nova-inkt); margin: 0 0 14px; line-height: 1.4; }
.winkel.terra .shop-footer .shop-footer-in > div:first-child > div:first-child { font-size: 20px; font-weight: 800; }
.winkel.terra .shop-footer .shop-footer-in > div:first-child > div + div { max-width: 300px; }
.winkel.terra .shop-footer .shop-footer-in > div > div > a { display: block; font-size: 13.5px; line-height: 2.05; padding: 0; font-weight: 400; color: var(--nova-inkt); text-decoration: none; }
.winkel.terra .shop-footer .shop-footer-in > div > div > a::after { content: none; }
.winkel.terra .shop-footer .shop-footer-in > div > div > a:hover { text-decoration: underline; }
.winkel.terra .shop-footer .shop-footer-in > div > div { gap: 0 !important; }
.winkel.terra .shop-footer .shop-voet-strook { max-width: var(--site-breedte); margin: 0 auto; padding: 0 var(--nova-zij) 40px; display: flex; gap: 24px; flex-wrap: wrap; align-items: flex-start; border: 0; }
.winkel.terra .shop-footer .shop-voet-onder { max-width: var(--site-breedte); margin: 0 auto; padding: 0 var(--nova-zij); border-top: 1px solid var(--nova-lijn); background: none; }
.winkel.terra .shop-footer .shop-voet-onder-in { max-width: none; padding: 20px 0; display: flex; align-items: center; gap: 18px; font-size: 13px; color: var(--nova-inkt); flex-wrap: wrap; justify-content: space-between; }
.winkel.terra .shop-footer .shop-voet-onder-in > a { color: var(--nova-inkt); text-decoration: none; }
.winkel.terra .shop-footer .shop-betaallogos { display: flex; align-items: center; justify-content: center; gap: 16px; margin: 0 auto; min-height: 34px; flex-wrap: wrap; }
.winkel.terra .shop-footer .shop-betaallogos .shop-betaallogo-beeld { height: 22px; width: auto; max-width: none; padding: 0; border: 0; border-radius: 0; background: transparent; }
@media (max-width: 1023px) {
.winkel.terra .wagen-vlak { grid-template-columns: minmax(0, 1fr); gap: 24px; }
.winkel.terra .afr-vorm { grid-template-columns: minmax(0, 1fr); gap: 34px; }
.winkel.terra .afr-bestelling { position: static; }
.winkel.terra .afr-kop-in { grid-template-columns: auto 1fr; gap: 16px; }
.winkel.terra .afr-hulp { display: none; }
.winkel.terra .inlog { grid-template-columns: minmax(0, 1fr); gap: 24px; }
.winkel.terra .shop-footer .shop-footer-in { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
.winkel.terra .afr-kop-in { height: 62px; padding: 0 16px; }
.winkel.terra .afr-stappen { gap: 10px; }
.winkel.terra .afr-stappen li span { display: none; }
.winkel.terra .afr-stappen li.aan span { display: inline; }
.winkel.terra .afr-raster, .winkel.terra .afr-raster.adres, .winkel.terra .afr-betaal { grid-template-columns: minmax(0, 1fr); }
.winkel.terra .afr-raster.adres .afr-veld:has(.afr-kort) { grid-column: auto; }
.winkel.terra .afr-intro h1 { font-size: 26px; }
.winkel.terra .shop-niet-gevonden-zoek { flex-wrap: wrap; }
.winkel.terra .shop-niet-gevonden-zoek input { flex: 1 1 100%; }
.winkel.terra .shop-niet-gevonden-zoek .btn-primary { width: 100%; }
.winkel.terra .shop-footer .shop-footer-in { grid-template-columns: minmax(0, 1fr); gap: 28px; }
.winkel.terra .shop-footer .shop-voet-onder-in { flex-direction: column; text-align: center; gap: 12px; }
}
@media (max-width: 559px) {
.winkel.terra .shop-main > .shop-kruimels, .winkel.terra .wagen-titel, .winkel.terra .wagen-regels, .winkel.terra .wagen-leegstand,
.winkel.terra .inlog, .winkel.terra .shop-leeg-pagina, .winkel.terra .afr {
background: var(--card, #fff); margin-inline: -16px; padding-inline: 16px;
}
.winkel.terra .shop-main > .shop-kruimels { padding-top: 14px; margin-top: 0; margin-bottom: 0; }
.winkel.terra .wagen-titel { font-size: 23px; letter-spacing: -.5px; padding-top: 18px; margin: 0; padding-bottom: 10px; }
.winkel.terra .wagen-regels { padding-bottom: 8px; }
.winkel.terra .wagen-kopregel { display: none; }
.winkel.terra .wagen-regel { grid-template-columns: 80px minmax(0, 1fr) auto; padding: 14px 0; }
.winkel.terra .wagen-foto { width: 66px; height: 58px; }
.winkel.terra .wagen-aantalvorm { grid-column: 2; grid-row: 2; margin-top: 8px; }
.winkel.terra .wagen-aantalvorm .teller { width: 110px; height: 38px; }
.winkel.terra .wagen-totaal { grid-column: 3; grid-row: 1; align-self: start; font-size: 15px; }
.winkel.terra .wagen-wegvorm { grid-column: 3; grid-row: 2; align-self: end; }
.winkel.terra .wagen-telling { background: var(--card, #fff); border-radius: 0; margin-inline: -16px; padding: 18px 16px; margin-top: 10px; }
.winkel.terra .inlog { padding-top: 18px; padding-bottom: 24px; }
.winkel.terra .inlog-rechts { padding: 22px 18px; }
.winkel.terra .shop-leeg-pagina { padding-top: 40px; padding-bottom: 24px; }
.winkel.terra .shop-leeg-pagina + .shop-rij { margin-top: 24px; }
.winkel.terra .afr-intro { margin-bottom: 20px; }
.winkel.terra .afr-bestelling { border-radius: 0; margin-inline: -16px; padding: 18px 16px; }
.winkel.terra .afr-links { gap: 26px; padding-bottom: 8px; }
}
.winkel.terra .wagen-betaallogos, .winkel.terra .afr-logos { gap: 10px 12px; }
.winkel.terra .wagen-betaallogos img, .winkel.terra .afr-logos img { height: 17px; }
.winkel.terra .inlog-vorm { margin: 0; width: 100%; max-width: 420px; }
.winkel.terra .shop-leeg-pagina .shop-leeg-knoppen { max-width: none; margin: 0; }
.winkel.terra .shop-main:has(> .klant-tabs) { display: grid; grid-template-columns: 342px minmax(0, 1fr); gap: 24px; align-items: start; }
.winkel.terra .klant-kop { grid-column: 1 / -1; display: flex; align-items: center; gap: 18px; margin: 0 0 8px; }
.winkel.terra .klant-kaart { width: 56px; height: 56px; }
.winkel.terra .klant-wie h1 { font-size: 33px; font-weight: 800; letter-spacing: -.7px; line-height: 1.2; margin: 0; }
.winkel.terra .klant-wie p { margin: 4px 0 0; font-size: 14.5px; color: var(--nova-gedempt); }
.winkel.terra .klant-uit { margin-left: auto; }
.winkel.terra .klant-uit .ghost { height: 48px; padding: 0 22px; border: 1px solid var(--nova-lijn); border-radius: 6px; background: var(--card, #fff); color: var(--nova-inkt); font-size: 14px; font-weight: 700; }
.winkel.terra .klant-tabs-knop { display: none; }
.winkel.terra .klant-tabs { grid-column: 1; display: flex; flex-direction: column; gap: 0; margin: 0; padding: 0; border: 0; overflow: visible; }
.winkel.terra .klant-tabs a {
display: flex; align-items: center; height: 44px; padding: 0 16px; border: 0; border-radius: 7px; background: transparent;
font-size: 14px; font-weight: 650; color: var(--nova-inkt); text-decoration: none; white-space: nowrap;
}
.winkel.terra .klant-tabs a::after { content: ""; margin-left: auto; width: 6px; height: 10px; background: currentColor; opacity: .5; clip-path: polygon(0 0, 1.8px 0, 6px 5px, 1.8px 10px, 0 10px, 4.2px 5px); flex: none; }
.winkel.terra .klant-tabs a.aan, .winkel.terra .klant-tabs a:hover { background: var(--nova-vlak); color: var(--nova-inkt); }
.winkel.terra .klant-teller { margin-left: 8px; }
.winkel.terra .klant-band { grid-column: 2; min-width: 0; }
.winkel.terra .klant-melding { background: var(--nova-vlak); border: 0; border-radius: var(--hoek, 12px); padding: 16px 22px; font-size: 14.5px; margin: 0 0 24px; }
.winkel.terra .klant-aandacht { border: 0; border-radius: var(--hoek, 12px); background: color-mix(in srgb, var(--winkel-accent) 8%, var(--card, #fff)); padding: 14px 22px; margin: 0 0 24px; }
.winkel.terra .klant-twee { display: grid; grid-template-columns: minmax(0, 1fr) 420px; gap: 46px; align-items: start; }
.winkel.terra .klant-twee > div { display: flex; flex-direction: column; gap: 34px; }
.winkel.terra .klant-tegels { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 24px; }
.winkel.terra .klant-tegel { border: 0; border-radius: var(--hoek, 12px); background: var(--nova-vlak); padding: 22px; min-height: 0; display: flex; flex-direction: column; gap: 2px; }
.winkel.terra .klant-tegel small { font-size: 12.5px; font-weight: 400; color: var(--nova-gedempt); }
.winkel.terra .klant-tegel b { font-size: 28px; font-weight: 800; line-height: 1.2; }
.winkel.terra .klant-tegel span { font-size: 12.5px; color: var(--nova-gedempt); }
.winkel.terra .klant-tegel .klant-knop { margin-top: 14px; }
.winkel.terra .klant-knop { height: 40px; padding: 0 16px; border-radius: 6px; font-size: 13.5px; font-weight: 700; background: var(--winkel-accent); color: var(--winkel-accent-ink, #fff); }
.winkel.terra .klant-knop.licht { background: var(--card, #fff); color: var(--nova-inkt); border: 1px solid var(--nova-lijn); }
.winkel.terra .klant-kaart-blok { border: 0; border-radius: 0; padding: 0; background: transparent; box-shadow: none; margin: 0; }
.winkel.terra .klant-kaart-blok > h2 { font-size: 20px; font-weight: 800; margin: 0 0 14px; }
.winkel.terra .klant-twee > div:last-child .klant-kaart-blok { background: var(--nova-vlak); border-radius: var(--hoek, 12px); padding: 22px; }
.winkel.terra .klant-twee > div:last-child .klant-kaart-blok > h2 { font-size: 16px; margin: 0 0 10px; }
.winkel.terra .klant-band table { width: 100%; border-collapse: collapse; font-size: 14px; }
.winkel.terra .klant-band table th { text-align: left; font-size: 12.5px; color: var(--nova-gedempt); font-weight: 650; padding: 0 12px 12px 0; border: 0; background: transparent; text-transform: none; letter-spacing: 0; }
.winkel.terra .klant-band table td { padding: 18px 12px 18px 0; border: 0; border-top: 1px solid var(--terra-lijn-licht); vertical-align: middle; background: transparent; }
.winkel.terra .klant-band table th:last-child, .winkel.terra .klant-band table td:last-child { padding-right: 0; }
@media (max-width: 1023px) {
.winkel.terra .shop-main:has(> .klant-tabs) { display: block; }
.winkel.terra .klant-kop { flex-wrap: wrap; gap: 12px 16px; }
.winkel.terra .klant-wie h1 { font-size: 23px; letter-spacing: -.5px; }
.winkel.terra .klant-tabs { flex-direction: row; flex-wrap: nowrap; gap: 6px; margin: 0 -16px 16px; padding: 0 16px 4px; overflow-x: auto; scrollbar-width: none; }
.winkel.terra .klant-tabs a { height: 40px; border: 1px solid var(--nova-lijn); flex: none; }
.winkel.terra .klant-tabs a::after { display: none; }
.winkel.terra .klant-twee { grid-template-columns: minmax(0, 1fr); gap: 24px; }
.winkel.terra .klant-tegels { gap: 12px; }
}
.winkel.terra .shop-paneel { background: var(--card, #fff); border-top: 1px solid var(--terra-lijn-licht); box-shadow: 0 18px 40px color-mix(in srgb, var(--nova-inkt) 12%, transparent); }
.winkel.terra .shop-paneel-in { max-width: var(--site-breedte); margin: 0 auto; padding: 28px var(--nova-zij) 32px; display: flex; gap: 36px; }
.winkel.terra .shop-paneel-links { width: 311px; flex: none; border: 0; padding: 0; }
.winkel.terra .shop-paneel-cat {
width: 100%; height: 44px; padding: 0 16px; border: 0; border-radius: 7px; background: transparent; font: inherit; font-size: 14px; font-weight: 650; color: var(--nova-inkt);
display: flex; align-items: center; justify-content: space-between; cursor: pointer; text-align: left;
}
.winkel.terra .shop-paneel-cat:hover, .winkel.terra .shop-paneel-cat.actief { background: var(--nova-vlak); }
.winkel.terra .shop-paneel-pijl { color: var(--nova-gedempt); }
.winkel.terra .shop-paneel-rechts { flex: 1; padding: 0; min-width: 0; }
.winkel.terra .shop-paneel-kolommen { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; }
.winkel.terra .shop-paneel-kop, .winkel.terra .shop-paneel-alles-kop { display: block; font-size: 14.5px; font-weight: 800; color: var(--nova-inkt); margin: 0 0 12px; text-decoration: none; }
.winkel.terra .shop-paneel-artikel, .winkel.terra .shop-paneel-sub { display: flex; align-items: center; gap: 10px; padding: 0; font-size: 13.5px; line-height: 2.05; color: var(--nova-inkt); text-decoration: none; }
.winkel.terra .shop-paneel-artikel:hover, .winkel.terra .shop-paneel-sub:hover { color: var(--winkel-accent); }
.winkel.terra .shop-paneel-artikel img { width: 24px; height: 24px; border-radius: 4px; object-fit: cover; }
.winkel.terra .shop-paneel-alles { display: inline-flex; margin-top: 10px; font-size: 13.5px; font-weight: 700; color: var(--winkel-accent); text-decoration: none; }
.winkel.terra .shop-paneel-meer { padding: 8px 16px; font-size: 12.5px; color: var(--nova-gedempt); }
.winkel.terra .shop-sug {
position: fixed; left: 0; right: 0; top: 66px; width: auto; max-height: calc(100vh - 66px); overflow: auto;
border: 0; border-top: 1px solid var(--terra-lijn-licht); border-radius: 0; background: var(--card, #fff);
box-shadow: 0 18px 40px color-mix(in srgb, var(--nova-inkt) 12%, transparent); padding: 0;
}
.winkel.terra .shop-sug-kolommen { max-width: var(--site-breedte); margin: 0 auto; padding: 28px var(--nova-zij) 32px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 46px; }
.winkel.terra .shop-sug-kolommen.een { grid-template-columns: minmax(0, 1fr); }
.winkel.terra .shop-sug-kol { padding: 0; }
.winkel.terra .shop-sug-kol.links { border: 0; background: transparent; }
.winkel.terra .shop-sug-kop { font-size: 14.5px; font-weight: 800; color: var(--nova-inkt); text-transform: none; letter-spacing: 0; padding: 0; margin: 0 0 8px; }
.winkel.terra .shop-sug-kop:not(:first-child) { margin-top: 22px; }
.winkel.terra .shop-sug-regel { padding: 0; font-size: 13.5px; line-height: 2.05; color: var(--nova-inkt); border-radius: 0; background: transparent; }
.winkel.terra .shop-sug-regel:hover, .winkel.terra .shop-sug a.sug-aan { background: transparent; color: var(--winkel-accent); }
.winkel.terra .shop-sug-artikel { display: flex; align-items: center; gap: 14px; padding: 9px 0; font-size: 13.5px; border-radius: 0; background: transparent; }
.winkel.terra .shop-sug-artikel:hover { background: transparent; }
.winkel.terra .shop-sug-artikel:hover .shop-sug-naam { color: var(--winkel-accent); }
.winkel.terra .shop-sug-artikel img, .winkel.terra .shop-sug-geenfoto { width: 52px; height: 46px; border: 1px solid var(--terra-lijn-licht); border-radius: 6px; object-fit: contain; background: var(--card, #fff); }
.winkel.terra .shop-sug-naam { font-weight: 700; white-space: normal; }
.winkel.terra .shop-sug-sub { font-size: 12.5px; color: var(--nova-gedempt); }
.winkel.terra .shop-sug-prijs { margin-left: auto; font-weight: 800; color: var(--nova-inkt); white-space: nowrap; }
.winkel.terra .shop-sug-alles { border: 0; padding: 12px 0 0; font-size: 13.5px; font-weight: 700; color: var(--winkel-accent); background: transparent; }
.winkel.terra .shop-sug-alles::after { content: ""; display: inline-block; margin-left: 8px; width: 6px; height: 10px; background: currentColor; clip-path: polygon(0 0, 1.8px 0, 6px 5px, 1.8px 10px, 0 10px, 4.2px 5px); }
.winkel.terra .shop-sug-leeg { padding: 28px var(--nova-zij) 32px; max-width: var(--site-breedte); margin: 0 auto; }
.winkel.terra .shop-sug-opties a { border-radius: 8px; background: var(--nova-vlak); border: 0; height: 36px; display: inline-flex; align-items: center; padding: 0 16px; font-size: 13.5px; font-weight: 650; }
.winkel.terra .shop-sug-opties a.aan { background: var(--winkel-accent); color: var(--winkel-accent-ink, #fff); }
@media (max-width: 1023px) {
.winkel.terra .shop-sug { top: 62px; max-height: calc(100vh - 62px); left: 0 !important; right: 0; }
.winkel.terra .shop-sug-kolommen { grid-template-columns: minmax(0, 1fr); gap: 22px; padding: 18px 16px 24px; }
}
.winkel.terra .site-pagina { display: flex; flex-direction: column; gap: 56px; padding-top: 22px; }
.winkel.terra .site-pagina > .site-blok { margin: 0; padding: 0; }
.winkel.terra .site-hero { border-radius: var(--hoek, 12px); overflow: hidden; }
.winkel.terra .site-hero-foto { height: 360px; }
.winkel.terra .site-hero-dia.metfoto:not(.kaart) .site-hero-in { padding: 0 60px; max-width: 640px; justify-content: center; }
.winkel.terra .site-hero-dia.metfoto:not(.kaart) h1, .winkel.terra .site-hero-dia.metfoto:not(.kaart) .site-hero-kop { font-size: 40px; font-weight: 800; letter-spacing: -.9px; line-height: 1.15; margin: 0 0 14px; text-shadow: 0 2px 12px rgba(0, 0, 0, .35); }
.winkel.terra .site-hero-dia.metfoto:not(.kaart) .site-hero-tekst { font-size: 16px; line-height: 1.5; margin: 0 0 22px; max-width: 480px; text-shadow: 0 1px 8px rgba(0, 0, 0, .35); }
.winkel.terra .site-hero-knop { height: 48px; padding: 0 22px; border: 0; border-radius: 6px; background: var(--winkel-accent); color: var(--winkel-accent-ink, #fff) !important; font-size: 14px; font-weight: 700; display: inline-flex; align-items: center; margin: 0; text-decoration: none !important; }
.winkel.terra .site-rijkop { display: flex; align-items: flex-end; margin: 0 0 20px; gap: 16px; }
.winkel.terra .site-rijkop h2, .winkel.terra .site-berichten > h2 { font-size: 25px; font-weight: 800; letter-spacing: -.5px; line-height: 1.2; margin: 0; }
.winkel.terra .site-berichten > h2 { margin: 0 0 20px; }
.winkel.terra .site-rijknop { margin-left: auto; height: auto; padding: 0; border: 0; background: none; font-size: 13.5px; font-weight: 700; color: var(--nova-inkt); display: inline-flex; align-items: center; gap: 9px; text-decoration: none; }
.winkel.terra .site-rijknop::after { content: ""; width: 6px; height: 10px; background: currentColor; clip-path: polygon(0 0, 1.8px 0, 6px 5px, 1.8px 10px, 0 10px, 4.2px 5px); }
.winkel.terra .site-rijzin { font-size: 14.5px; color: var(--terra-tekst-zacht); margin: -10px 0 20px; }
.winkel.terra .site-categorien-in { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.winkel.terra .site-categorie { position: relative; display: flex; flex-direction: column; padding: 0; border: 1px solid var(--terra-lijn-licht); border-radius: 10px; overflow: hidden; background: var(--card, #fff); color: var(--nova-inkt); text-decoration: none; aspect-ratio: auto; min-height: 0; }
.winkel.terra .site-categoriefoto { display: block; position: static; height: 150px; aspect-ratio: auto; background: var(--nova-vlak); overflow: hidden; }
.winkel.terra .site-categoriefoto::after { content: none; }
.winkel.terra .site-categoriefoto img { width: 100%; height: 100%; object-fit: cover; display: block; }
.winkel.terra .site-categorienaam { position: static; padding: 14px 16px; font-size: 14.5px; font-weight: 700; color: var(--nova-inkt); background: transparent; display: flex; flex-direction: column; gap: 2px; }
.winkel.terra .site-categorienaam b { color: var(--nova-inkt); font-weight: 700; }
.winkel.terra .site-categorienaam small { font-size: 12.5px; color: var(--nova-gedempt); padding: 0; }
.winkel.terra .site-categoriepijl, .winkel.terra .site-categorieknop-pijl { display: none; }
.winkel.terra .site-producten-in { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.winkel.terra .site-berichten-in { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.winkel.terra .site-bericht { border: 1px solid var(--terra-lijn-licht); border-radius: 10px; overflow: hidden; gap: 0; background: var(--card, #fff); }
.winkel.terra .site-bericht img { height: 150px; aspect-ratio: auto; border-radius: 0; }
.winkel.terra .site-bericht-naam { padding: 16px 18px 6px; font-size: 16.5px; font-weight: 800; line-height: 1.35; color: var(--nova-inkt); }
.winkel.terra .site-bericht .cell-sub { padding: 0 18px 20px; font-size: 12.5px; color: var(--nova-gedempt); }
.winkel.terra .site-blok.soort-cta > section, .winkel.terra .site-cta { background: var(--nova-vlak); border-radius: var(--hoek, 12px); padding: 26px 30px; }
.winkel.terra .site-blok.soort-cta h2 { font-size: 20px; font-weight: 800; margin: 0 0 8px; }
.winkel.terra .site-blok.soort-cta .btn-primary, .winkel.terra .site-blok.soort-cta .site-knop { height: 48px; padding: 0 22px; border-radius: 6px; font-size: 14px; font-weight: 700; display: inline-flex; align-items: center; }
.winkel.terra .site-blok.soort-banner > section { border-radius: var(--hoek, 12px); }
@media (max-width: 1023px) {
.winkel.terra .site-pagina { gap: 34px; padding-top: 16px; }
.winkel.terra .site-hero-foto { height: 260px; }
.winkel.terra .site-hero-dia.metfoto:not(.kaart) .site-hero-in { padding: 0 22px; }
.winkel.terra .site-hero-dia.metfoto:not(.kaart) h1, .winkel.terra .site-hero-dia.metfoto:not(.kaart) .site-hero-kop { font-size: 26px; letter-spacing: -.5px; }
.winkel.terra .site-categorien-in, .winkel.terra .site-producten-in, .winkel.terra .site-berichten-in { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.winkel.terra .site-rijkop h2, .winkel.terra .site-berichten > h2 { font-size: 21px; }
}
.winkel.terra .shop-main.site-main:has(> .site-inhoud) { display: grid; grid-template-columns: minmax(0, 846fr) minmax(0, 548fr); gap: 0 46px; align-items: start; }
.winkel.terra .shop-main.site-main:has(> .site-inhoud) > * { grid-column: 1; }
.winkel.terra .shop-main.site-main:has(> .site-inhoud) > .site-inhoud { grid-column: 2; grid-row: 2 / span 3; position: sticky; top: 90px; }
.winkel.terra .site-boom { padding-top: 20px; margin: 0 0 32px; gap: 11px; }
.winkel.terra .site-boom-terug { color: var(--nova-inkt); font-size: 14px; font-weight: 400; }
.winkel.terra .site-boom-link { border: 0; padding: 0; font-size: 14px; color: color-mix(in srgb, var(--nova-inkt) 50%, transparent); }
.winkel.terra .site-boom-link.aan { background: transparent; color: color-mix(in srgb, var(--nova-inkt) 80%, transparent); }
.winkel.terra .site-berichtkop { padding: 0; margin: 0 0 34px; }
.winkel.terra .site-berichtkop h1 { font-size: 29px; font-weight: 800; letter-spacing: -.6px; line-height: 1.2; margin: 0 0 14px; }
.winkel.terra .site-rubrieken { display: flex; gap: 10px; margin: 0 0 14px; }
.winkel.terra .site-rubriek { background: var(--winkel-accent); color: var(--winkel-accent-ink, #fff); font-size: 12.5px; font-weight: 750; border-radius: 5px; padding: 5px 12px; }
.winkel.terra .site-berichtkop .cell-sub { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; font-size: 13.5px; font-weight: 650; color: var(--nova-inkt); margin: 0; }
.winkel.terra .site-berichtkop .cell-sub time { background: var(--nova-vlak); border-radius: 5px; padding: 7px 14px; }
.winkel.terra .site-auteur { display: flex; align-items: center; gap: 12px; margin: 16px 0 0; }
.winkel.terra .site-auteurfoto { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; }
.winkel.terra .site-auteurwie b { display: block; font-size: 14px; font-weight: 800; }
.winkel.terra .site-auteurrol { font-size: 12.5px; color: var(--nova-gedempt); }
.winkel.terra .site-berichtfoto { border-radius: var(--hoek, 12px); margin-top: 22px; }
.winkel.terra .site-inhoud { background: var(--card, #fff); border-radius: 14px; box-shadow: 0 10px 34px color-mix(in srgb, var(--nova-inkt) 10%, transparent); padding: 22px 26px; margin: 0; }
.winkel.terra .site-inhoud-kop { display: block; font-size: 15px; font-weight: 800; margin: 0 0 12px; }
.winkel.terra .site-inhoud ol { list-style: none; margin: 0; padding: 0; columns: auto; }
.winkel.terra .site-inhoud-regel { font-size: 13.5px; line-height: 1.5; padding: 7px 0; display: flex; gap: 9px; align-items: baseline; }
.winkel.terra .site-inhoud-regel::before { content: ""; flex: none; width: 6px; height: 10px; background: var(--nova-gedempt); clip-path: polygon(0 0, 1.8px 0, 6px 5px, 1.8px 10px, 0 10px, 4.2px 5px); transform: translateY(1px); }
.winkel.terra .site-inhoud-regel.diep { padding-left: 15px; }
.winkel.terra .site-inhoud-regel a { color: var(--nova-inkt); text-decoration: none; font-weight: 600; }
.winkel.terra .site-inhoud-regel a:hover { color: var(--winkel-accent); }
.winkel.terra .site-main .site-tekst h2, .winkel.terra .site-main .site-tekst h2:first-child { font-size: 26px; font-weight: 800; letter-spacing: -.5px; line-height: 1.25; margin: 40px 0 14px; }
.winkel.terra .site-main .site-tekst > h2:first-child, .winkel.terra .site-main .site-blok:first-child .site-tekst h2:first-child { margin-top: 0; }
.winkel.terra .site-main .site-tekst h3 { font-size: 18px; font-weight: 800; margin: 0 0 14px; }
.winkel.terra .site-main .site-tekst p { font-size: 14.5px; line-height: 1.66; margin: 0 0 16px; max-width: none; }
.winkel.terra .site-main .site-tekst ul, .winkel.terra .site-main .site-tekst ol { font-size: 14.5px; line-height: 1.85; padding-left: 26px; margin: 0 0 16px; }
.winkel.terra .site-main .site-tekst hr { border: 0; border-top: 1px solid var(--terra-lijn-licht); margin: 34px 0; }
.winkel.terra .site-main:has(> .site-berichtkop) .site-pagina { gap: 0; padding-top: 0; }
.winkel.terra .site-reacties { padding: 34px 0 0; margin-top: 34px; border-top: 1px solid var(--terra-lijn-licht); }
.winkel.terra .site-reacties h2 { font-size: 20px; font-weight: 800; margin: 0 0 14px; }
.winkel.terra .site-reactie-form input, .winkel.terra .site-reactie-form textarea { border: 1px solid var(--nova-lijn); border-radius: 6px; padding: 10px 14px; font-size: 14px; }
.winkel.terra .site-reactie-form .btn-primary { height: 48px; padding: 0 22px; border-radius: 6px; font-size: 14px; font-weight: 700; }
@media (max-width: 1023px) {
.winkel.terra .shop-main.site-main:has(> .site-inhoud) { display: block; }
.winkel.terra .shop-main.site-main:has(> .site-inhoud) > .site-inhoud { position: static; margin: 0 0 24px; }
.winkel.terra .site-berichtkop h1 { font-size: 24px; }
}
.winkel.terra .site-pagina .site-hero { background: transparent; }
.winkel.terra .site-hero-dia { border-radius: var(--hoek, 12px); overflow: hidden; }
.winkel.terra .site-paginakop { font-size: 33px; font-weight: 800; letter-spacing: -.7px; line-height: 1.2; margin: 0 0 10px; }
.winkel.terra .shop-main.site-main:has(> .site-inhoud) { max-width: var(--site-breedte); margin-inline: auto; padding-inline: var(--nova-zij); box-sizing: border-box; }
.winkel.terra .shop-main.site-main:has(> .site-inhoud) > * { max-width: none; margin-inline: 0; padding-inline: 0; }
.winkel.terra .shop-main.site-main:has(> .site-inhoud) > .site-inhoud { grid-row: 1 / span 4; align-self: start; }
.winkel.terra .site-berichtkop { display: flex; flex-direction: column; background: var(--nova-vlak); border-radius: var(--hoek, 12px); overflow: hidden; padding: 0 0 26px; margin: 0 0 34px; }
.winkel.terra .site-berichtkop > * { margin-inline: 30px; }
.winkel.terra .site-berichtkop > .site-berichtfoto { order: -1; margin: 0 0 22px; width: 100%; height: 320px; object-fit: cover; border-radius: 0; }
.winkel.terra .site-berichtkop > .site-rubrieken { margin-top: 0; }
.winkel.terra .site-berichtkop h1 { margin: 0 30px 14px; }
.winkel.terra .site-berichtkop > .site-auteur { margin-top: 0; }
.winkel.terra .shop-main.site-main:has(> .site-inhoud) > .site-reacties { padding: 34px 0 0; }
.winkel.terra .klant-tabs { align-items: stretch; }
.winkel.terra .klant-band { border-top: 0; padding-top: 0; }
.winkel.terra .shop-sug { left: 0 !important; right: 0 !important; width: auto !important; }
@media (max-width: 1023px) {
.winkel.terra .site-berichtkop > * { margin-inline: 18px; }
.winkel.terra .site-berichtkop h1 { margin: 0 18px 12px; }
.winkel.terra .site-berichtkop > .site-berichtfoto { height: 200px; margin: 0 0 16px; }
}
.winkel.terra .shop-main.site-main:has(> .site-inhoud) .site-pagina .site-blok > * { padding-inline: 0; max-width: none; margin-inline: 0; }
.winkel.terra .shop-main.site-main:has(> .site-inhoud) > .site-inhoud { padding: 22px 26px; width: auto; max-width: none; }
.winkel.terra .shop-sug > .shop-sug-alles { display: block; max-width: var(--site-breedte); margin: 0 auto; padding: 0 var(--nova-zij) 28px; box-sizing: border-box; }
.winkel.terra .shop-sug-alles::after { content: none; }
@media (max-width: 1023px) {
.winkel.terra .shop-sug > .shop-sug-alles { padding: 0 16px 20px; }
}
@media (max-width: 1023px) {
.winkel.terra .shop-lade { inset: 62px 0 0; top: 62px; background: var(--card, #fff); z-index: 45; }
.winkel.terra .shop-lade-vlak { background: var(--card, #fff); padding: 16px 16px 36px; }
.winkel.terra .shop-lade-vlak[data-verdieping="0"] > .shop-lade-kop { display: none; }
.winkel.terra .shop-lade-kop { height: 52px; padding: 0; margin: -6px 0 10px; border-bottom: 1px solid var(--terra-lijn-licht); background: var(--card, #fff); display: flex; align-items: center; gap: 10px; }
.winkel.terra .shop-lade-titel { flex: 1; text-align: left; font-size: 15.5px; font-weight: 800; color: var(--nova-inkt); }
.winkel.terra .shop-lade-kop .shop-lade-sluit { display: none; }
.winkel.terra .shop-lade-terug { width: 42px; height: 42px; margin-left: -8px; border: 0; }
.winkel.terra .shop-lade-kopje { font-size: 12.5px; font-weight: 800; color: var(--nova-gedempt); text-transform: uppercase; letter-spacing: .04em; margin: 6px 0 10px; }
.winkel.terra .shop-lade-scheiding + .shop-lade-kopje { margin-top: 22px; }
.winkel.terra .shop-lade-scheiding { display: none; }
.winkel.terra .shop-lade-lijst { padding: 0; }
.winkel.terra .shop-lade-regel {
display: flex; align-items: center; width: 100%; height: 52px; padding: 0; margin: 0; border: 0; border-bottom: 1px solid var(--terra-lijn-licht); border-radius: 0;
background: transparent; font: inherit; font-size: 15.5px; font-weight: 650; color: var(--nova-inkt); text-align: left; text-decoration: none; cursor: pointer;
}
.winkel.terra .shop-lade-regel:hover { background: transparent; color: var(--winkel-accent); }
.winkel.terra .shop-lade-tweede .shop-lade-regel { font-weight: 500; }
.winkel.terra .shop-lade-regel::after { content: ""; margin-left: auto; width: 6px; height: 10px; background: currentColor; opacity: .6; clip-path: polygon(0 0, 1.8px 0, 6px 5px, 1.8px 10px, 0 10px, 4.2px 5px); flex: none; }
.winkel.terra .shop-lade-pijl { display: none; }
.winkel.terra .shop-lade-sectiekop { display: block; font-size: 12.5px; font-weight: 800; color: var(--nova-gedempt); text-transform: uppercase; letter-spacing: .04em; margin: 22px 0 10px; text-decoration: none; }
.winkel.terra .shop-header .shop-lade-knop { position: relative; }
.winkel.terra .shop-header .shop-lade-knop[aria-expanded="true"] svg { visibility: hidden; }
.winkel.terra .shop-header .shop-lade-knop[aria-expanded="true"]::before,
.winkel.terra .shop-header .shop-lade-knop[aria-expanded="true"]::after {
content: ""; position: absolute; left: 50%; top: 50%; width: 18px; height: 2px; margin: -1px 0 0 -9px; background: var(--winkel-accent-ink, #fff); border-radius: 1px;
}
.winkel.terra .shop-header .shop-lade-knop[aria-expanded="true"]::before { transform: rotate(45deg); }
.winkel.terra .shop-header .shop-lade-knop[aria-expanded="true"]::after { transform: rotate(-45deg); }
}
.winkel.terra { --site-breedte: calc(var(--thema-breedte, 1440px) + 2 * var(--nova-zij, 32px)); }
.winkel.terra .pdp-onder-links .pdp-verhaal { border-top: 0; margin-top: 0; padding-top: 0; }
.winkel.terra .pdp-onder-links .pdp-punten + .pdp-verhaal { border-top: 1px solid var(--nova-lijn); margin-top: 26px; padding-top: 26px; }
.winkel.terra .wagen-voorraad { display: inline-flex; align-items: center; height: 26px; margin-top: 6px; padding: 0 10px; border-radius: 5px; font-size: 12.5px; font-weight: 700; background: color-mix(in srgb, var(--nova-groen) 18%, var(--card, #fff)); color: color-mix(in srgb, var(--nova-groen) 70%, var(--nova-inkt)); }
.winkel.terra .wagen-voorraad.bijna { background: color-mix(in srgb, var(--warn, #f59e0b) 20%, var(--card, #fff)); color: color-mix(in srgb, var(--warn, #f59e0b) 60%, var(--nova-inkt)); }
.winkel.terra .wagen-voorraad.nee, .winkel.terra .wagen-voorraad.wacht { background: color-mix(in srgb, var(--neg) 12%, var(--card, #fff)); color: var(--neg); }
.winkel.terra .shop-footer .shop-voet-merk { display: flex; flex-direction: column; align-items: flex-start; }
.winkel.terra .shop-footer .shop-voet-merknaam { font-size: 20px; font-weight: 800; color: var(--nova-inkt); margin: 0 0 14px; line-height: 1.3; }
.winkel.terra .shop-footer .shop-voet-merkregel { font-size: 13.5px; line-height: 1.6; max-width: 300px; margin: 0; color: var(--nova-inkt); }
.winkel.terra .shop-footer .shop-voet-merkcontact { display: flex; flex-direction: column; margin-top: 12px; font-size: 13.5px; line-height: 1.8; }
.winkel.terra .shop-footer .shop-voet-merkcontact a { color: var(--nova-inkt); font-weight: 700; text-decoration: none; }
.winkel.terra .shop-footer .shop-voet-merksocials { display: flex; gap: 8px; margin-top: 16px; }
.winkel.terra .shop-footer .shop-voet-merksocials .shop-social { width: 38px; height: 38px; border-radius: 50%; background: var(--card, #fff); color: var(--nova-inkt); display: inline-flex; align-items: center; justify-content: center; text-decoration: none; font-size: 13px; font-weight: 800; }
.winkel.terra .shop-footer .shop-voet-merksocials .shop-social svg { width: 19px; height: 19px; fill: currentColor; }
.winkel.terra .shop-footer .shop-voet-merksocials .shop-social:hover { background: var(--winkel-accent); color: var(--winkel-accent-ink, #fff); }
.winkel.terra .shop-footer .shop-voet-dubbel { display: none; }
.winkel.terra .shop-header.vorm-terra .shop-koptel { width: 43px; min-width: 43px; padding: 0; justify-content: center; }
.winkel.terra .shop-header.vorm-terra .shop-koptel .shop-koptel-tekst { display: none; }
@media (min-width: 1024px) {
.winkel.terra .shop-filtervorm[data-filter-direct] .shop-filterknoppen .btn-primary { display: none; }
}
@media (min-width: 1024px) {
.winkel.terra .shop-header.vorm-terra .shop-header-in { gap: 8px; }
.winkel.terra .shop-header.vorm-terra .shop-paneel-knop { margin-left: 13px; }
.winkel.terra .shop-header.vorm-terra .shop-kop-rechts { flex: 1 1 auto; min-width: 0; margin-left: 0; gap: 8px; }
.winkel.terra .shop-header.vorm-terra .shop-kop-rechts > * + * { border-left: 0; padding-left: 0; margin-left: 0; }
.winkel.terra .shop-header.vorm-terra .shop-kop-rechts > .shop-koptel + *,
.winkel.terra .shop-header.vorm-terra .shop-kop-rechts > .shop-kopknop + :not(.shop-koptel),
.winkel.terra .shop-header.vorm-terra .shop-kop-rechts > :first-child:not(.shop-kopknop):not(.shop-koptel) { margin-left: auto; }
.winkel.terra .shop-header.vorm-terra .shop-kop-rechts > .shop-koptel + * ~ *,
.winkel.terra .shop-header.vorm-terra .shop-kop-rechts > .shop-kopknop + :not(.shop-koptel) ~ * { margin-left: 5px; }
.winkel.terra .shop-header.vorm-terra .shop-wagen { position: relative; overflow: visible; }
.winkel.terra .shop-header.vorm-terra .shop-wagen .topbar-badge {
position: absolute; left: 26px; top: 3px; min-width: 18px; height: 18px; margin: 0; padding: 0 5px; border-radius: 9px; box-sizing: border-box;
background: var(--neg) !important; color: #fff; font-size: 10.5px; font-weight: 800; line-height: 1; display: flex; align-items: center; justify-content: center;
}
.winkel.terra .shop-menu2.vorm-terra { margin-right: max(0px, calc((100% - var(--site-breedte)) / 2 + var(--nova-zij))); }
.winkel.terra:not(.afrekenen) .shop-main { padding-top: 0; }
.winkel.terra .shop-kruimels { padding-top: 21px; margin-bottom: 31px; }
.winkel.terra .shop-pdp-info > .shop-usp-lijst span { margin: 0 0 12px; }
}
@media (min-width: 1504px) {
.winkel.terra .shop-pdp { grid-template-columns: 766px 604px; column-gap: 46px; justify-content: start; }
}
.winkel.terra:not(.afrekenen) .shop-main { padding-top: 0; }
@media (min-width: 1024px) {
.winkel.terra .shop-lijstkolom > .shop-kruimels { padding-top: 21px; margin: 0 0 19px; }
.winkel.terra .shop-zijbalk { margin-top: 61px; }
.winkel.terra .shop-lijstkolom > .shop-catkop { height: 200px; min-height: 200px; margin: 0 0 21px; }
.winkel.terra .shop-lijstkolom > .shop-cattitelrij { margin: 0 0 20px; padding: 0; }
.winkel.terra .shop-lijstkolom > .shop-cattekst { font-size: var(--terra-lees, 16px); line-height: var(--terra-lees-steek, 28px); margin: 0 0 33px; }
.winkel.terra .shop-cattekst.gevouwen .shop-cattekst-in { max-height: calc(2 * var(--terra-lees-steek, 28px)); }
.winkel.terra .shop-cattekst .pdp-meer { margin-top: 9px; }
.winkel.terra .shop-lijstkolom > .shop-subtegels { margin: 0 0 23px; }
.winkel.terra .shop-subtegel { height: 65px; }
.winkel.terra .shop-lijstbalk { padding: 27px 0 0; margin: 0 0 33px; }
.winkel.terra .shop-kaart img { height: 227px; object-fit: contain; }
.winkel.terra .shop-kaart .nova-specs { gap: 0; }
.winkel.terra .shop-kaart .nova-spec { line-height: 22px; }
}
@media (max-width: 559px) {
.winkel.terra .shop-lijstkolom > .shop-kruimels { display: none; }
.winkel.terra .shop-lijstkolom > .shop-catkop { height: 175px; min-height: 175px; margin: 0 -16px 0; }
.winkel.terra .shop-lijstkolom > .shop-cattitelrij { padding-top: 22px; margin-bottom: 14px; }
.winkel.terra .shop-lijstkolom > .shop-cattekst { font-size: 14.5px; line-height: 24px; margin: 0 0 22px; }
.winkel.terra .shop-cattekst.gevouwen .shop-cattekst-in { max-height: 48px; }
.winkel.terra .shop-lijst .shop-lijstkolom .shop-subtegels .shop-subtegel { height: 58px; }
.winkel.terra .shop-lijstkolom > .shop-subtegels { padding-bottom: 21px; }
.winkel.terra .shop-lijstbalk { padding: 13px 0 0; margin: 0 0 16px; }
.winkel.terra .shop-balk-filterknop, .winkel.terra .shop-lijstbalk select, .winkel.terra .shop-weergave button { height: 44px; }
.winkel.terra .shop-kaart { padding: 8px; }
.winkel.terra .shop-kaart .nova-hart, .winkel.terra .shop-kaart .nova-inwagen { width: 40px; height: 40px; }
.winkel.terra .pdp-fotokaart { border: 0; padding: 0; background: transparent; }
}
@media (min-width: 1024px) {
.winkel.terra .shop-header.vorm-terra .shop-wagen { padding: 0 14px 0 16px; }
.winkel.terra .shop-header.vorm-terra .shop-wagen .topbar-badge { left: 30px; top: 3px; }
.winkel.terra .shop-cattekst-in > :first-child { margin-top: 0; }
}
@media (max-width: 559px) {
.winkel.terra .shop-lijstkolom > .shop-cattekst { margin: 0 -16px 18px; }
.winkel.terra .shop-lijstkolom > .shop-cattitelrij { margin-bottom: 8px; }
.winkel.terra .shop-cattekst-in > :first-child { margin-top: 0; }
.winkel.terra .pdp-galerij.strook-links.met-strook { display: flex; flex-direction: column; gap: 16px; }
.winkel.terra .pdp-galerij .pdp-fotokaart { order: 1; width: 100%; }
.winkel.terra .pdp-galerij .pdp-strook { order: 2; display: flex; flex-direction: row; flex-wrap: nowrap; gap: 12px; width: auto; overflow-x: auto; scrollbar-width: none; margin: 0; }
.winkel.terra .pdp-galerij .pdp-mini { width: 56px; height: 56px; flex: none; }
.winkel.terra .pdp-galerij .pdp-pijl { display: none; }
}
@container (max-width: 300px) {
.winkel.terra .shop-tegels .shop-kaart .nova-hart, .winkel.terra .shop-tegels .shop-kaart .nova-inwagen { width: 40px; height: 40px; }
}
.winkel.terra .shop-cattekst-in, .winkel.terra .shop-cattekst-in p { line-height: inherit; }
.winkel.terra .shop-cattekst-in p { margin: 0 0 16px; }
.winkel.terra .shop-cattekst.gevouwen .shop-cattekst-in {
display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; max-height: none;
}
.winkel.terra .shop-cattekst.gevouwen .shop-cattekst-in p { margin: 0; }
@media (min-width: 1024px) {
.winkel.terra .shop-lijstkolom > .shop-cattekst { margin-bottom: 30px; }
.winkel.terra .shop-lijstbalk { padding-top: 26px; }
}
@media (min-width: 1024px) {
.winkel.terra .shop-pdp-info > .pdp-kort { font-size: 15px; line-height: 24px; margin: 18px 0 0; }
.winkel.terra .shop-pdp-info > .pdp-bovenregel { margin-top: 30px; }
.winkel.terra .shop-pdp-info > .pdp-koopblok { margin-top: 25px; }
.winkel.terra .pdp-koopblok-vlak { padding: 20px 20px 30px; }
.winkel.terra .pdp-koopblok-vlak .pdp-koopvorm > .field { margin-top: 24px; }
.winkel.terra .pdp-koopblok-vlak .pdp-koopvorm > .pdp-aantal-kop { margin: 32px 0 12px; }
.winkel.terra .pdp-koopblok-vlak > .pdp-voorraad { margin: 22px 0 0; justify-content: flex-end; }
.winkel.terra .pdp-koopblok-vlak .pdp-koopvorm > .pdp-betalen { margin: 28px 0 0; }
.winkel.terra .shop-pdp-info > .shop-usp-lijst { margin-top: 34px; }
.winkel.terra .shop-pdp-info > .pdp-bezorg { margin-top: 30px; }
.winkel.terra .shop-pdp-info > .pdp-knoppenrij { margin-top: 16px; }
.winkel.terra .shop-pdp-info > .pdp-knoppenrij .pdp-knop-licht {
display: inline-flex; align-items: center; gap: 8px; width: auto; height: auto; min-height: 0; padding: 0; border: 0; background: transparent; box-shadow: none;
color: var(--winkel-accent); font-size: 13.5px; font-weight: 700; text-decoration: none;
}
.winkel.terra .shop-pdp-info > .pdp-knoppenrij .pdp-knop-licht::before { content: ""; flex: none; width: 6px; height: 10px; background: currentColor; clip-path: polygon(0 0, 1.8px 0, 6px 5px, 1.8px 10px, 0 10px, 4.2px 5px); }
.winkel.terra .shop-pdp-info > .pdp-knoppenrij .pdp-knop-licht:hover { text-decoration: underline; background: transparent; }
.winkel.terra .shop-pdp-info > .pdp-hulp { display: none; }
.winkel.terra .pdp-fotokaart { padding: 24px 40px; }
.winkel.terra .pdp-fotokaart .pdp-hoofdfoto { max-height: 700px; }
.winkel.terra .pdp-pijl { top: 242px; transform: none; }
.winkel.terra .shop-pdp-onder { margin-top: 97px; }
.winkel.terra .pdp-punten-titel, .winkel.terra .pdp-specblok h2 { font-size: 16px; line-height: 21px; margin: 0 0 21px; }
.winkel.terra .pdp-punt { font-size: 14px; line-height: 28px; margin: 0; }
.winkel.terra .pdp-punt-teken { width: 14px; height: 14px; font-size: 11px; }
.winkel.terra .pdp-specregel { padding: 7px 0; }
.winkel.terra .pdp-specregel dt { font-weight: 400; font-size: 14px; }
.winkel.terra .pdp-specregel dd { font-weight: 700; font-size: 14px; }
}
@media (min-width: 1024px) {
.winkel.terra .pdp-koopblok-vlak .pdp-koopvorm > .pdp-aantal-kop { margin-top: 10px; }
.winkel.terra .pdp-punten-kolom { gap: 0; }
.winkel.terra .pdp-punten-kop { margin-bottom: 6px; }
.winkel.terra .shop-pdp-info > .pdp-bezorg { margin-top: 18px; }
}
@media (min-width: 1024px) {
.winkel.terra .pdp-koopblok-vlak .pdp-koopvorm > .field { margin: 0; }
.winkel.terra .pdp-koopblok-vlak .pdp-koopvorm > .field > label { margin-bottom: 6px; font-size: 13px; }
.winkel.terra .pdp-koopblok-vlak .pdp-koopvorm > .field select { height: 48px; }
.winkel.terra .pdp-koopblok-vlak .pdp-koopvorm > .field + .pdp-aantal-kop { margin-top: 0; }
}
@media (min-width: 1024px) {
.winkel.terra .pdp-punten-blok .pdp-punt { margin: 0; line-height: 28px; }
}
@media (min-width: 1024px) {
.winkel.terra .shop-header.vorm-terra .shop-paneel-knop,
.winkel.terra .shop-header.vorm-terra .shop-kopknop,
.winkel.terra .shop-header.vorm-terra .shop-wagen,
.winkel.terra .shop-header.vorm-terra .kop-huur,
.winkel.terra .shop-header.vorm-terra .kop-hulp { font-size: 14px; font-weight: 700; }
.winkel.terra .shop-header.vorm-terra .shop-koptel { background: var(--nova-vlak); border: 0; }
.winkel.terra .shop-menu.vorm-terra .shop-menu-kop { font-size: 14px; font-weight: 600; }
.winkel.terra .shop-menu2.vorm-terra a { font-size: 14px; font-weight: 500; }
.winkel.terra .shop-pdp-info > .pdp-kort { font-weight: 500; color: color-mix(in srgb, var(--nova-inkt) 88%, var(--card, #fff)); }
.winkel.terra .shop-pdp-info > .pdp-bovenregel { font-size: 13.5px; }
.winkel.terra .shop-pdp-info > .pdp-bovenregel a { font-weight: 600; }
.winkel.terra .shop-pdp-info > .pdp-bovenregel .pdp-artikelnummer, .winkel.terra .shop-pdp-info > .pdp-bovenregel > span:last-child { color: var(--nova-gedempt); font-size: 13px; }
.winkel.terra .pdp-koopblok-vlak .teller.pdp-teller button { color: var(--terra-teller-gedempt, var(--nova-gedempt)); font-size: 20px; }
.winkel.terra .pdp-koopblok-vlak .pdp-koop svg { width: 22px; height: 22px; }
.winkel.terra .pdp-titelregel .pdp-hart, .winkel.terra .shop-pdp-info .pdp-hart { width: 42px; height: 42px; border-radius: 6px; }
.winkel.terra .shop-pdp-info .pdp-hart svg { width: 18px; height: 18px; }
.winkel.terra .shop-lijst.filters-knop.filters-open::before { content: ""; position: fixed; inset: 0; background: color-mix(in srgb, var(--nova-inkt) 35%, transparent); z-index: 59; }
.winkel.terra .shop-lijst.filters-knop.filters-open .shop-zijbalk {
display: block; position: fixed; inset: 0 auto 0 0; width: 420px; max-width: calc(100vw - 32px); z-index: 60; overflow-y: auto;
background: var(--card, #fff); padding: 0 24px 24px; margin: 0; box-shadow: 0 0 48px color-mix(in srgb, var(--nova-inkt) 20%, transparent);
}
.winkel.terra .shop-lijst.filters-knop.filters-open .shop-filterblad-kop {
display: flex; align-items: center; height: 66px; margin: 0 -24px 18px; padding: 0 24px; border-bottom: 1px solid var(--nova-lijn);
font-size: 17px; font-weight: 800; color: var(--nova-inkt); position: sticky; top: 0; background: var(--card, #fff); z-index: 1;
}
.winkel.terra .shop-lijst.filters-knop.filters-open .shop-filterblad-sluit {
margin-left: auto; width: 42px; height: 42px; border: 1px solid var(--nova-lijn); border-radius: 6px; background: var(--card, #fff); color: var(--nova-inkt);
display: flex; align-items: center; justify-content: center; cursor: pointer; padding: 0;
}
.winkel.terra .shop-lijst.filters-knop .shop-zijbalk .shop-filterknoppen .btn-primary { display: inline-flex; }
.winkel.terra .shop-lijst.filters-knop .shop-tegels { gap: 12px; }
}
@media (min-width: 1024px) {
.winkel.terra .pdp-koopblok-vlak > .pdp-voorraad { justify-content: space-between; }
.winkel.terra .pdp-koopblok-vlak > .pdp-voorraad .pdp-levering { display: inline-flex; align-items: center; gap: 8px; margin-right: auto; color: var(--nova-groen); font-size: 13px; font-weight: 700; }
.winkel.terra .pdp-koopblok-vlak > .pdp-voorraad .pdp-levering svg { flex: none; }
.winkel.terra .shop-pdp-info .pdp-wensvorm button { width: 42px; height: 42px; border-radius: 6px; }
.winkel.terra .shop-pdp-info .pdp-wensvorm button svg { width: 18px; height: 18px; }
.winkel.terra .shop-pdp-info > .pdp-bovenregel .pdp-artikelnr { color: var(--nova-gedempt); font-size: 13px; }
.winkel.terra .shop-pdp-info > .pdp-bovenregel .pdp-artikelnr b { font-weight: 600; color: var(--nova-inkt); }
}
@media (min-width: 1024px) {
.winkel.terra .shop-lijst.filters-knop > .shop-filterknop { display: none; }
}
.winkel.terra .shop-lijst.filters-knop > .shop-filterknop { display: none; }
@media (min-width: 1024px) {
.winkel.terra .shop-pdp-info .pdp-wens { width: 42px; height: 42px; min-width: 0; padding: 0; border-radius: 6px; }
.winkel.terra .shop-pdp-info .pdp-wens svg { width: 18px; height: 18px; }
}
.winkel.terra .inlog-vorm h1 { margin: 0 0 11px; }
.winkel.terra .inlog-vorm .inlog-uitleg { margin: 0 0 23px; }
.winkel.terra .inlog-velden .inlog-blijf { display: flex; align-items: center; gap: 15px; margin: 10px 0 9px; font-size: 14px; font-weight: 600; line-height: 18px; color: var(--nova-inkt); cursor: pointer; }
.winkel.terra .inlog-velden .inlog-blijf input { width: 18px; height: 18px; margin: 0 0 0 11px; flex: 0 0 18px; accent-color: var(--winkel-accent); cursor: pointer; }
.winkel.terra .inlog-vorm .inlog-rij { display: flex; flex-direction: column; align-items: stretch; gap: 0; margin: 0; }
.winkel.terra .inlog-vorm .inlog-rij .inlog-knop { width: 100%; height: 52px; margin: 0; padding: 0 20px; border: 0; border-radius: 6px; background: var(--winkel-accent); color: var(--winkel-accent-ink, #fff); font-size: 14px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.winkel.terra .inlog-vorm .inlog-rij .inlog-vergeten { align-self: flex-start; margin: 19px 0 0; font-size: 14px; font-weight: 700; line-height: 20px; }
.winkel.terra .inlog-rechts { padding: 30px 30px 33px; }
.winkel.terra .inlog-rechts h2 { font-size: 22px; line-height: 28px; margin: 0 0 12px; }
.winkel.terra .inlog-rechts p { font-size: 14.5px; line-height: 23px; margin: 0 0 22px; }
.winkel.terra .inlog-rechts .inlog-usps li { margin: 0 0 15px; padding-left: 31px; font-size: 14.5px; font-weight: 600; line-height: 20px; }
.winkel.terra .inlog-rechts .inlog-usps li::before { width: 18px; height: 18px; top: 1px; }
.winkel.terra .inlog-rechts .inlog-usps li::after { left: 6.5px; top: 5px; width: 4px; height: 8px; }
.winkel.terra .inlog-rechts .inlog-knoppen { margin-top: 17px; gap: 12px; }
.winkel.terra .inlog-rechts .inlog-knoppen .inlog-knop-wit { height: 50px; padding: 0 24px; font-size: 14px; }
.winkel.terra .inlog-rechts .inlog-anders { display: block; margin: 14px 0 0; font-size: 13.5px; color: var(--terra-tekst-zacht); }
.winkel.terra .inlog-rechts .inlog-anders a { color: var(--winkel-accent); font-weight: 700; }
@media (max-width: 559px) {
.winkel.terra .inlog-rechts { padding: 22px 18px 24px; }
}
@media (min-width: 1024px) {
.winkel.terra .shop-lijst:not(.filters-knop) .shop-tegels[data-per-rij="4"] .shop-kaart > img,
.winkel.terra .shop-lijst:not(.filters-knop) .shop-tegels[data-per-rij="5"] .shop-kaart > img,
.winkel.terra .shop-lijst:not(.filters-knop) .shop-tegels[data-per-rij="6"] .shop-kaart > img,
.winkel.terra .shop-lijst:not(.filters-knop) .shop-tegels[data-per-rij="4"] .shop-kaart .foto-leeg,
.winkel.terra .shop-lijst:not(.filters-knop) .shop-tegels[data-per-rij="5"] .shop-kaart .foto-leeg,
.winkel.terra .shop-lijst:not(.filters-knop) .shop-tegels[data-per-rij="6"] .shop-kaart .foto-leeg { height: auto; aspect-ratio: 4 / 3; }
.winkel.terra .shop-lijst:not(.filters-knop) .shop-tegels { gap: 12px; }
}
.winkel.terra .inlog-vorm .inlog-velden { grid-template-columns: minmax(0, 1fr); align-items: stretch; }
.winkel.terra .shop-tegels .shop-kaart .kaart-labels { position: absolute; left: 22px; top: 16px; z-index: 2; margin: 0; padding: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; pointer-events: none; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .kaart-labels { left: 18px; top: 18px; }
@media (max-width: 559px) {
.winkel.terra .shop-tegels .shop-kaart .kaart-labels { left: 14px; top: 14px; }
}
@media (min-width: 560px) {
.winkel.terra .shop-lijst .shop-tegels:not(.als-lijst),
.winkel.terra .shop-lijst:not(.filters-knop) .shop-tegels:not(.als-lijst),
.winkel.terra .shop-lijst.filters-knop .shop-tegels:not(.als-lijst) { gap: 44px 32px; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart { border: 0; border-radius: 0; padding: 0; background: transparent; box-shadow: none; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart:hover { box-shadow: none; border-color: transparent; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart > img,
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .foto-leeg { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: contain; margin: 0 0 22px; border-radius: 0; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .kaart-labels { left: 0; top: 10px; gap: 6px; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .kaart-labels > * { height: 32px; padding: 0 10px; border-radius: 4px; font-size: 13px; font-weight: 700; line-height: 32px; }
.winkel.terra .shop-tegels:not(.als-lijst) .kaart-tand { right: 0; top: 4px; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-sterren { font-size: 12px; line-height: 16px; gap: 8px; margin: 0 0 8px; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-sterren .sterren svg { width: 11px; height: 11px; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-titel { font-size: 15px; line-height: 20px; font-weight: 700; margin: 0 0 14px; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-specs { gap: 0; margin: 0; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-spec { font-size: 12.5px; line-height: 21.5px; font-weight: 700; gap: 8px; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-chiprij { margin: 14px 0 0; gap: 8px; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-chiprij .nova-chip { height: 28px; padding: 0 10px; border-radius: 4px; font-size: 12px; font-weight: 700; line-height: 28px; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-voet { padding-top: 20px; gap: 8px; align-items: flex-end; flex-wrap: nowrap; row-gap: 0; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-prijsvak { flex: 1 1 auto; min-width: 0; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-prijs { font-size: 20px; line-height: 24px; gap: 6px; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-prijs .btw-inline { font-size: 12px; font-weight: 700; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-prijs .nova-vanaf { font-size: 12px; line-height: 16px; margin-bottom: 2px; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-prijs s { font-size: 12px; line-height: 16px; margin-top: 2px; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-tweedeprijs { display: none; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-hart,
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-inwagen { width: 44px; height: 44px; border-radius: 6px; flex: 0 0 44px; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-hart svg { width: 18px; height: 18px; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-inwagen::before { left: 13px; top: 20.5px; width: 18px; height: 3px; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-inwagen::after { left: 20.5px; top: 13px; width: 3px; height: 18px; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-hartvorm { margin: 0 0 0 auto; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-knoppen { margin: 0; }
.winkel.terra .shop-lijst .shop-tegels.als-lijst,
.winkel.terra .shop-lijst:not(.filters-knop) .shop-tegels.als-lijst,
.winkel.terra .shop-lijst.filters-knop .shop-tegels.als-lijst { gap: 0; grid-template-columns: minmax(0, 1fr); border-top: 1px solid var(--nova-lijn); }
.winkel.terra .shop-tegels.als-lijst .shop-kaart { display: grid; grid-template-columns: 168px minmax(0, 1fr) 200px; grid-template-rows: auto auto auto 1fr; gap: 0 28px; padding: 22px 0; border: 0; border-bottom: 1px solid var(--nova-lijn); border-radius: 0; background: transparent; box-shadow: none; align-items: start; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart:hover { box-shadow: none; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart > img,
.winkel.terra .shop-tegels.als-lijst .shop-kaart .foto-leeg { grid-column: 1; grid-row: 1 / span 4; width: 168px; height: auto; aspect-ratio: 4 / 3; object-fit: contain; margin: 0; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .kaart-labels { left: 0; top: 30px; }
.winkel.terra .shop-tegels.als-lijst .kaart-tand { display: none; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-sterren { grid-column: 2; grid-row: 1; font-size: 12px; line-height: 16px; gap: 8px; margin: 2px 0 8px; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-sterren .sterren svg { width: 11px; height: 11px; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-titel { grid-column: 2; grid-row: 2; font-size: 16px; line-height: 22px; font-weight: 700; margin: 0 0 10px; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-code { display: none; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-specs { grid-column: 2; grid-row: 3; flex-direction: row; flex-wrap: wrap; gap: 4px 22px; margin: 0; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-spec { font-size: 12.5px; line-height: 21.5px; font-weight: 700; gap: 8px; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-chiprij { grid-column: 2; grid-row: 4; align-self: start; margin: 14px 0 0; gap: 8px; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-chiprij .nova-chip { height: 28px; padding: 0 10px; border-radius: 4px; font-size: 12px; font-weight: 700; line-height: 28px; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-voet { grid-column: 3; grid-row: 1 / span 4; align-self: stretch; display: grid; grid-template-columns: auto auto; grid-template-rows: 1fr auto; justify-content: end; align-content: space-between; column-gap: 8px; row-gap: 16px; border: 0; padding: 0; margin: 0; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-prijsvak { grid-column: 1 / span 2; grid-row: 1; justify-self: end; flex: none; text-align: right; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-prijs { justify-content: flex-end; font-size: 20px; line-height: 24px; gap: 6px; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-prijs .btw-inline { font-size: 12px; font-weight: 700; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-prijs .nova-vanaf { width: 100%; text-align: right; font-size: 12px; line-height: 16px; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-prijs s { font-size: 12px; text-align: right; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-tweedeprijs { display: block; font-size: 12.5px; margin-top: 4px; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-hartvorm { grid-column: 1; grid-row: 2; margin: 0; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-knoppen,
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-hartvorm + .nova-knoppen { grid-column: 2; grid-row: 2; margin: 0; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-hart,
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-inwagen { width: 44px; height: 44px; border-radius: 6px; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-hart svg { width: 18px; height: 18px; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-inwagen::before { left: 13px; top: 20.5px; width: 18px; height: 3px; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-inwagen::after { left: 20.5px; top: 13px; width: 3px; height: 18px; }
}
@media (min-width: 1024px) {
.winkel.terra .shop-zijbalk .shop-filterkaart { padding: 0; }
.winkel.terra .shop-zijbalk .shop-catgroep { background: var(--nova-vlak); border: 0; border-radius: 6px; padding: 22px 20px 16px; margin: 0; }
.winkel.terra .shop-zijbalk .shop-catgroep:not([open]) { padding: 20px 20px; }
.winkel.terra .shop-zijbalk .shop-catgroep-kop { display: flex; align-items: center; min-height: 20px; padding: 0; margin: 0; font-size: 15px; line-height: 20px; font-weight: 700; color: var(--nova-inkt); }
.winkel.terra .shop-zijbalk .shop-catgroep-kop svg { width: 12px; height: 12px; margin-left: auto; }
.winkel.terra .shop-zijbalk .shop-catgroep > .shop-cat { margin: 13px 0 0; }
.winkel.terra .shop-zijbalk .shop-catregel,
.winkel.terra .shop-zijbalk .shop-filterregel { display: flex; align-items: center; gap: 12px; height: 31px; padding: 0; margin: 0; font-size: 12.5px; font-weight: 600; line-height: 20px; color: var(--nova-inkt); }
.winkel.terra .shop-zijbalk .shop-catvak { width: 20px; height: 20px; flex: 0 0 20px; border-radius: 4px; border: 1px solid var(--nova-lijn); background: var(--card, #fff); margin: 0; }
.winkel.terra .shop-zijbalk .shop-filterregel input:checked + .shop-catvak::after { left: 6px; top: 2px; width: 5px; height: 10px; }
.winkel.terra .shop-zijbalk .shop-filteraantal { font-size: 12.5px; font-weight: 500; color: var(--nova-gedempt); margin-left: 2px; }
.winkel.terra .shop-zijbalk .shop-filtervorm { display: block; margin: 24px 0 0; padding: 0 20px; border: 1px solid var(--nova-lijn); border-radius: 6px; background: var(--card, #fff); box-shadow: 0 2px 10px color-mix(in srgb, var(--nova-inkt) 5%, transparent); }
.winkel.terra .shop-zijbalk .shop-filtervorm .shop-filtergroep { padding: 22px 0 20px; margin: 0; border: 0; border-top: 1px solid var(--terra-lijn-licht, var(--nova-lijn)); }
.winkel.terra .shop-zijbalk .shop-filtervorm .shop-filtergroep:first-of-type { border-top: 0; }
.winkel.terra .shop-zijbalk .shop-filtervorm .shop-filtergroep:not([open]) { padding: 22px 0 20px; }
.winkel.terra .shop-zijbalk .shop-filtergroep > .shop-catgroep-kop + * { margin-top: 13px; }
.winkel.terra .shop-zijbalk .shop-filterkeuze { height: 41px; border-radius: 4px; border: 1px solid var(--nova-lijn); font-size: 12.5px; padding: 0 30px 0 12px; }
.winkel.terra .shop-zijbalk .shop-filterkleuren { gap: 9px; }
.winkel.terra .shop-zijbalk .shop-filterkleur { width: 24px; height: 24px; }
.winkel.terra .shop-zijbalk .shop-kleurbol { width: 24px; height: 24px; }
.winkel.terra .shop-zijbalk .shop-filterschuif { height: 44px; margin: 13px 0 0; }
.winkel.terra .shop-zijbalk .shop-schuif-bel { top: 0; height: 21px; line-height: 21px; padding: 0 7px; border-radius: 4px; font-size: 11px; font-weight: 700; }
.winkel.terra .shop-zijbalk .shop-schuif-baan { top: 33px; height: 4px; left: 6px; right: 6px; }
.winkel.terra .shop-zijbalk .shop-filterschuif input[type="range"] { top: 25px; height: 20px; }
.winkel.terra .shop-zijbalk .shop-filterknoppen { padding: 0 0 18px; }
.winkel.terra .shop-zijbalk .shop-filtervorm .shop-filterknoppen:last-child { border-top: 1px solid var(--terra-lijn-licht, var(--nova-lijn)); padding: 14px 0 16px; }
}
@media (min-width: 560px) {
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart > img,
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .foto-leeg { aspect-ratio: 1 / 1; margin: 0 0 18px; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-titel { font-size: 17px; line-height: 22px; font-weight: 700; margin: 0 0 12px; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-sterren { font-size: 12px; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-spec,
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-spec { height: auto; min-height: 0; line-height: 21.5px; font-size: 12.5px; font-weight: 700; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-spec::before,
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-spec::before { width: 5px; height: 8px; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-prijs { font-size: 21px; line-height: 26px; font-weight: 700; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-prijs .btw-inline { font-size: 12px; font-weight: 700; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-hart,
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-inwagen { width: 46px; height: 46px; flex-basis: 46px; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-inwagen::before { left: 14px; top: 21.5px; }
.winkel.terra .shop-tegels:not(.als-lijst) .shop-kaart .nova-inwagen::after { left: 21.5px; top: 14px; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart > img,
.winkel.terra .shop-tegels.als-lijst .shop-kaart .foto-leeg { aspect-ratio: 1 / 1; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-voet { align-items: start; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-titel { font-size: 17px; }
.winkel.terra .shop-tegels.als-lijst .shop-kaart .nova-prijs { font-size: 21px; line-height: 26px; font-weight: 700; }
}
@media (min-width: 1024px) {
.winkel.terra .shop-zijbalk .shop-catgroep-kop { font-size: 16px; font-weight: 700; }
.winkel.terra .shop-zijbalk .shop-catgroep > .shop-cat { display: grid; gap: 0; padding: 0; margin: 13px 0 0; }
.winkel.terra .shop-zijbalk .shop-catregel,
.winkel.terra .shop-zijbalk .shop-filterregel { font-size: 13px; font-weight: 400; }
.winkel.terra .shop-zijbalk .shop-filternaam { font-weight: 400; }
.winkel.terra .shop-zijbalk .shop-filteraantal { margin-left: 0; font-size: 13px; }
.winkel.terra .shop-zijbalk .shop-filteraantal::before { content: "("; }
.winkel.terra .shop-zijbalk .shop-filteraantal::after { content: ")"; }
.winkel.terra .shop-zijbalk .shop-catgroep[open] > .shop-catgroep-kop svg,
.winkel.terra .shop-zijbalk .shop-filtergroep[open] > .shop-catgroep-kop svg { transform: none; }
.winkel.terra .shop-zijbalk .shop-catgroep:not([open]) > .shop-catgroep-kop svg,
.winkel.terra .shop-zijbalk .shop-filtergroep:not([open]) > .shop-catgroep-kop svg { transform: rotate(-90deg); }
.winkel.terra .shop-zijbalk .shop-filtervorm[data-filter-direct] .shop-filterknoppen,
.winkel.terra .shop-zijbalk .shop-filtervorm[data-filter-direct] .shop-filterknoppen:last-child { display: none; }
.winkel.terra .shop-zijbalk .shop-filterschuif { height: 46px; margin: 13px 0 0; }
.winkel.terra .shop-zijbalk .shop-filterschuif::before { content: ""; position: absolute; left: 0; right: 0; top: 10px; height: 34px; border: 1px solid var(--nova-lijn); border-radius: 4px; box-sizing: border-box; }
.winkel.terra .shop-zijbalk .shop-schuif-bel { top: 0; }
.winkel.terra .shop-zijbalk .shop-schuif-bel.van { left: 6px; }
.winkel.terra .shop-zijbalk .shop-schuif-bel.tot { right: 6px; }
.winkel.terra .shop-zijbalk .shop-schuif-baan { top: 25px; left: 12px; right: 12px; }
.winkel.terra .shop-zijbalk .shop-filterschuif input[type="range"] { top: 17px; left: 6px; right: 6px; width: calc(100% - 12px); }
.winkel.terra .shop-lijstbalk .shop-telling { font-size: 13px; }
}
@media (min-width: 560px) {
.winkel.terra .shop-lijst:not(.filters-knop) .shop-tegels:not(.als-lijst)[data-per-rij] .shop-kaart > img,
.winkel.terra .shop-lijst.filters-knop .shop-tegels:not(.als-lijst)[data-per-rij] .shop-kaart > img,
.winkel.terra .shop-lijst:not(.filters-knop) .shop-tegels:not(.als-lijst)[data-per-rij] .shop-kaart .foto-leeg,
.winkel.terra .shop-lijst.filters-knop .shop-tegels:not(.als-lijst)[data-per-rij] .shop-kaart .foto-leeg { height: auto; aspect-ratio: 1 / 1; }
.winkel.terra .site-producten-in { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 44px 32px; }
.winkel.terra .site-producten-in .shop-kaart { border: 0; border-radius: 0; padding: 0; background: transparent; box-shadow: none; }
.winkel.terra .site-producten-in .shop-kaart:hover { box-shadow: none; }
.winkel.terra .site-producten-in .shop-kaart > img,
.winkel.terra .site-producten-in .shop-kaart .foto-leeg { width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: contain; margin: 0 0 18px; border-radius: 0; }
.winkel.terra .site-producten-in .shop-kaart .kaart-labels { position: absolute; left: 0; top: 10px; z-index: 2; margin: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; pointer-events: none; }
.winkel.terra .site-producten-in .shop-kaart .kaart-labels > * { height: 32px; padding: 0 10px; border-radius: 4px; font-size: 13px; font-weight: 700; line-height: 32px; }
.winkel.terra .site-producten-in .kaart-tand { right: 0; top: 4px; }
.winkel.terra .site-producten-in .shop-kaart .nova-sterren { font-size: 12px; line-height: 16px; gap: 8px; margin: 0 0 8px; }
.winkel.terra .site-producten-in .shop-kaart .nova-sterren .sterren svg { width: 11px; height: 11px; }
.winkel.terra .site-producten-in .shop-kaart .nova-titel { font-size: 17px; line-height: 22px; font-weight: 700; margin: 0 0 12px; }
.winkel.terra .site-producten-in .shop-kaart .nova-specs { gap: 0; margin: 0; }
.winkel.terra .site-producten-in .shop-kaart .nova-spec { height: auto; min-height: 0; font-size: 12.5px; line-height: 21.5px; font-weight: 700; gap: 8px; }
.winkel.terra .site-producten-in .shop-kaart .nova-spec::before { width: 5px; height: 8px; }
.winkel.terra .site-producten-in .shop-kaart .nova-chiprij { margin: 14px 0 0; gap: 8px; }
.winkel.terra .site-producten-in .shop-kaart .nova-chiprij .nova-chip { height: 28px; padding: 0 10px; border-radius: 4px; font-size: 12px; font-weight: 700; line-height: 28px; }
.winkel.terra .site-producten-in .shop-kaart .nova-voet { padding-top: 20px; gap: 8px; align-items: flex-end; flex-wrap: nowrap; row-gap: 0; }
.winkel.terra .site-producten-in .shop-kaart .nova-prijsvak { flex: 1 1 auto; min-width: 0; }
.winkel.terra .site-producten-in .shop-kaart .nova-prijs { font-size: 21px; line-height: 26px; font-weight: 700; gap: 6px; }
.winkel.terra .site-producten-in .shop-kaart .nova-prijs .btw-inline { font-size: 12px; font-weight: 700; }
.winkel.terra .site-producten-in .shop-kaart .nova-tweedeprijs { display: none; }
.winkel.terra .site-producten-in .shop-kaart .nova-hart,
.winkel.terra .site-producten-in .shop-kaart .nova-inwagen { width: 46px; height: 46px; border-radius: 6px; flex: 0 0 46px; }
.winkel.terra .site-producten-in .shop-kaart .nova-hart svg { width: 18px; height: 18px; }
.winkel.terra .site-producten-in .shop-kaart .nova-inwagen::before { left: 14px; top: 21.5px; width: 18px; height: 3px; }
.winkel.terra .site-producten-in .shop-kaart .nova-inwagen::after { left: 21.5px; top: 14px; width: 3px; height: 18px; }
.winkel.terra .site-producten-in .shop-kaart .nova-hartvorm { margin: 0 0 0 auto; }
.winkel.terra .site-producten-in .shop-kaart .nova-knoppen { margin: 0; }
}
@media (max-width: 559px) {
.winkel.terra .site-producten-in { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
}
@media (min-width: 1024px) {
.winkel.terra .shop-pdp-info .pdp-sterren, .winkel.terra .shop-pdp-info > .nova-sterren, .winkel.terra .shop-pdp-info .pdp-beoordeling { font-size: 12.5px; font-weight: 700; }
.winkel.terra .shop-pdp-info h1 { font-size: 28px; line-height: 34px; font-weight: 700; letter-spacing: -.2px; }
.winkel.terra .shop-pdp-info > .pdp-kort { font-size: 14.5px; line-height: 24px; font-weight: 400; color: var(--terra-tekst-zacht, #3d4081); }
.winkel.terra .shop-pdp-info > .pdp-bovenregel { font-size: 12.5px; }
.winkel.terra .shop-pdp-info > .pdp-bovenregel a { font-weight: 700; }
.winkel.terra .shop-pdp-info > .pdp-bovenregel .pdp-artikelnr { font-size: 12.5px; }
.winkel.terra .pdp-koopblok-vlak { padding: 19px 20px 20px; }
.winkel.terra .pdp-koopblok-vlak .pdp-prijs { font-size: 21px; line-height: 25px; font-weight: 700; color: var(--nova-inkt); gap: 6px; }
.winkel.terra .pdp-koopblok-vlak .pdp-prijs .klein { font-size: 12.5px; font-weight: 400; }
.winkel.terra .pdp-koopblok-vlak .pdp-prijs s { font-size: 12.5px; }
.winkel.terra .pdp-koopblok-vlak .pdp-tweedeprijs { font-size: 12.5px; line-height: 16px; margin-top: 6px; color: var(--nova-gedempt); }
.winkel.terra .pdp-koopblok-vlak .pdp-aantal-kop { font-size: 12.5px; line-height: 16px; margin: 28px 0 10px; }
.winkel.terra .pdp-koopblok-vlak .teller.pdp-teller { width: 132px; height: 62px; }
.winkel.terra .pdp-koopblok-vlak .teller.pdp-teller input { font-size: 15px; font-weight: 700; }
.winkel.terra .pdp-koopblok-vlak .teller.pdp-teller button { font-size: 18px; }
.winkel.terra .pdp-koopblok-vlak .pdp-koop { height: 62px; font-size: 15px; font-weight: 700; gap: 12px; }
.winkel.terra .pdp-koopblok-vlak .pdp-koop svg { width: 20px; height: 20px; }
.winkel.terra .pdp-koopblok-vlak > .pdp-voorraad { margin: 11px 0 0; font-size: 12.5px; }
.winkel.terra .pdp-koopblok-vlak > .pdp-voorraad .pdp-levering { font-size: 12.5px; }
.winkel.terra .pdp-koopblok-vlak .pdp-koopvorm > .pdp-betalen { margin: 30px 0 0; min-height: 24px; gap: 18px; }
.winkel.terra .pdp-koopblok-vlak .pdp-betalen img, .winkel.terra .pdp-koopblok-vlak .pdp-betalen svg { height: 20px; width: auto; }
.winkel.terra .shop-pdp-info > .shop-usp-lijst { margin-top: 30px; }
.winkel.terra .shop-pdp-info > .shop-usp-lijst span { font-size: 14.5px; font-weight: 700; }
.winkel.terra .shop-pdp-info .pdp-wens { width: 40px; height: 40px; }
.winkel.terra .pdp-fotokaart { padding: 24px; }
.winkel.terra .pdp-fotokaart .pdp-hoofdfoto { width: 100%; height: auto; aspect-ratio: 1 / 1; max-height: none; object-fit: contain; }
.winkel.terra .pdp-galerij .pdp-mini, .winkel.terra .pdp-strook .pdp-mini { aspect-ratio: 1 / 1; }
.winkel.terra .pdp-galerij .pdp-mini img, .winkel.terra .pdp-strook .pdp-mini img { object-fit: contain; }
}
@media (min-width: 1024px) {
.winkel.terra .shop-zijbalk .shop-catregel.diep { margin-left: 0; padding-left: 18px; }
.winkel.terra .shop-zijbalk .shop-catregel.actief { font-weight: 700; }
.winkel.terra .shop-zijbalk .shop-catregel.leeg { color: #a8abc4; opacity: 1; }
.winkel.terra .shop-zijbalk .shop-catregel.leeg .shop-cataantal { color: #c3c5d5; }
.winkel.terra .shop-zijbalk .shop-cataantal { font-size: 13px; margin-left: 2px; }
.winkel.terra .shop-zijbalk .shop-cat-meer { margin: 8px 0 0; }
.winkel.terra .shop-zijbalk .shop-cat-meer > summary { padding: 0; font-size: 13px; font-weight: 700; gap: 8px; }
.winkel.terra .shop-zijbalk .shop-cat-meer[open] > summary { margin-bottom: 4px; }
.winkel.terra .shop-kruimels .shop-terugnaar { height: 34px; padding: 0 14px; border: 1px solid var(--nova-lijn); border-radius: 6px; background: var(--card, #fff); color: var(--nova-inkt); font-size: 13px; font-weight: 700; gap: 8px; }
.winkel.terra .shop-populair .shop-blokkop { margin: 33px 0 22px; }
.winkel.terra .shop-populair .shop-blokkop h2 { font-size: 22px; font-weight: 700; }
.winkel.terra .shop-populair .shop-blokkop-lijst { margin: 48px 0 0; }
.winkel.terra .shop-populair + .shop-lijstbalk { padding-top: 26px; }
}
@media (min-width: 1024px) {
.winkel.terra .pdp-koopblok-vlak { border-radius: 6px; }
.winkel.terra .pdp-koopblok-vlak .teller.pdp-teller { border-radius: 6px; border: 1px solid var(--nova-lijn); }
.winkel.terra .pdp-koopblok-vlak .pdp-koop { border-radius: 6px; }
.winkel.terra .pdp-koopblok-vlak .pdp-aantal-kop { font-size: 13px; color: var(--terra-tekst-zacht, #3d4081); }
.winkel.terra .pdp-koopblok-vlak .pdp-koopvorm > .pdp-betalen { gap: 24px; min-height: 20px; margin: 30px 0 2px; }
.winkel.terra .pdp-koopblok-vlak .pdp-betalen img, .winkel.terra .pdp-koopblok-vlak .pdp-betalen svg { height: 16px; max-width: 60px; width: auto; object-fit: contain; }
.winkel.terra .pdp-koopblok-vlak .pdp-prijsrij { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.winkel.terra .pdp-koopblok-vlak .pdp-staffellink { display: inline-flex; align-items: center; gap: 8px; margin-top: 4px; font-size: 14px; font-weight: 700; color: var(--nova-inkt); text-decoration: none; }
.winkel.terra .pdp-koopblok-vlak .pdp-staffellink svg { width: 10px; height: 10px; }
.winkel.terra .pdp-koopblok-vlak .pdp-prijsrij > .pdp-prijsblok { margin-left: auto; text-align: right; }
}
@media (min-width: 1024px) {
.winkel.terra .pdp-koopblok-vlak { position: relative; }
.winkel.terra .pdp-koopblok-vlak > .pdp-staffeltabel { margin: 0; }
.winkel.terra .pdp-koopblok-vlak > .pdp-staffeltabel > summary { position: absolute; left: 20px; top: 23px; margin: 0; padding: 0; font-size: 14px; font-weight: 700; color: var(--nova-inkt); display: inline-flex; align-items: center; gap: 8px; }
.winkel.terra .pdp-koopblok-vlak > .pdp-staffeltabel > summary svg { transform: rotate(-90deg); }
.winkel.terra .pdp-koopblok-vlak > .pdp-staffeltabel[open] > summary svg { transform: none; }
.winkel.terra .pdp-koopblok-vlak > .pdp-staffeltabel[open] > table { margin: 6px 0 4px; }
}