:root {
--papier: #e9e6dc;
--inkt: #161514;
--grijs: #4d4a44;
--afdruk: #fbfaf4;
--tape: rgba(222, 205, 150, .84);
--tm-papier: var(--papier);
--tm-inkt: var(--inkt);
--kop: var(--tm-kopletter);
--tekst: var(--tm-lees);
--vet: var(--tm-vet);
--typ: "Courier Prime", "Courier New", Courier, monospace;
--marge: var(--tm-marge);
--goot: 30px; --b-studio: url(//tapeminded.com/wp-content/themes/astra-child/nieuw/img/studio-kleur-licht.webp);
--b-demo: url(//tapeminded.com/wp-content/themes/astra-child/nieuw/img/tapeminded-free-demo.webp);
--b-kick: url(//tapeminded.com/wp-content/themes/astra-child/nieuw/img/kickdrum-sepia-licht.webp);
--wm: url(//tapeminded.com/wp-content/themes/astra-child/nieuw/img/kickuncover-logo-oxide.webp);
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
margin: 0; background: var(--papier); color: var(--inkt);
font: 400 18.5px/1.45 var(--tekst); font-optical-sizing: auto;
-webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
main { overflow-x: clip; padding-bottom: 60px; }
img, svg { display: block; max-width: 100%; }
img { height: auto; }
h1, h2, h3, h4, p, ul, ol, figure { margin: 0; padding: 0; }
main a { color: inherit; text-decoration: none; }
button, input { font: inherit; color: inherit; border-radius: 0; }
.wrap { width: min(1320px, 100% - 2 * var(--marge)); margin-inline: auto; }
.shot *, .shot *::before, .shot *::after { animation: none !important; transition: none !important; } .haak { position: absolute; left: 0; right: 0; pointer-events: none; z-index: -1; } .knop {
display: inline-flex; align-items: center; justify-content: center; gap: 12px;
font: 800 14px/1 var(--vet); letter-spacing: .14em; text-transform: uppercase;
padding: 20px 28px 19px; border: 2px solid var(--fg, var(--inkt)); background: transparent; color: var(--fg, var(--inkt));
cursor: pointer; white-space: nowrap;
transition: background-color .18s ease, color .18s ease, border-color .18s ease;
}
.knop:hover { background: var(--fg, var(--inkt)); color: var(--bg, var(--papier)); }
.knop--vol { background: var(--fg, var(--inkt)); color: var(--bg, var(--papier)); }
.knop--vol:hover { background: transparent; color: var(--fg, var(--inkt)); }
.knop .pijl { width: 22px; height: 10px; flex: none; transition: transform .18s ease; }
.knop:hover .pijl { transform: translateX(4px); } .zet { text-align: justify; hyphens: auto; -webkit-hyphens: auto; hyphenate-limit-chars: 6 3 2; }
.zet p + p { text-indent: 1.3em; }
.kol-2, .kol-3 { column-gap: var(--goot); column-rule: 1px solid var(--inkt); }
.kol-2 { columns: 2; } .kol-3 { columns: 3; }
.initiaal::first-letter { font: 900 4.42em/.74 var(--kop); float: left; padding: .09em .1em 0 0; margin-left: -.02em; } .foto { background: var(--papier); isolation: isolate; }
.raster { position: relative; overflow: hidden; border: 1px solid var(--inkt); filter: contrast(4); mix-blend-mode: multiply; background: #fff; }
.beeld { display: block; background: center / cover no-repeat; }
.b-studio { background-image: var(--b-studio); }
.b-demo { background-image: var(--b-demo); }
.b-apparaat { background-image: var(--b-apparaat); }
.b-kick { background-image: var(--b-kick); }
.raster .beeld { position: absolute; inset: 0; filter: grayscale(1) contrast(1.4) brightness(.9); }
.raster::after {
content: ""; position: absolute; inset: -60%; opacity: .5; pointer-events: none;
background: radial-gradient(circle at center, #000 0, #fff 71%) 0 0 / var(--punt, 4px) var(--punt, 4px);
transform: rotate(45deg);
}
.raster--licht .beeld { filter: grayscale(1) contrast(1.7) brightness(.78); }
.foto figcaption { padding-top: 12px; }
.foto .bijschrift { display: block; font: italic 400 24px/1.18 var(--kop); }
.foto .bron { display: block; margin-top: 9px; font: 800 13px/1.35 var(--vet); letter-spacing: .1em; text-transform: uppercase; color: var(--grijs); } .polaroid {
position: relative; background: var(--afdruk); padding: 16px 16px 20px;
box-shadow: 0 0 0 1px rgba(22, 21, 20, .08), 0 2px 3px rgba(22, 21, 20, .2), 0 22px 30px -18px rgba(22, 21, 20, .5);
transform: rotate(var(--r, -1.5deg)); transition: transform .35s cubic-bezier(.2, .7, .2, 1);
}
.polaroid .beeld { width: 100%; box-shadow: inset 0 0 0 1px rgba(22, 21, 20, .22); }
.tape { position: absolute; z-index: 2; width: 132px; height: 36px; background: var(--tape); box-shadow: 0 1px 1px rgba(22, 21, 20, .14); }
.tape-lb { left: -44px; top: -6px; transform: rotate(-38deg); }
.tape-rb { right: -44px; top: -6px; transform: rotate(38deg); }
.tape-mb { left: 50%; top: -19px; margin-left: -60px; width: 120px; transform: rotate(-3deg); }
.sticker { position: absolute; z-index: 3; display: block; aspect-ratio: 1; background: var(--b-sticker) center / contain no-repeat; filter: drop-shadow(0 1px 1px rgba(22, 21, 20, .4)) drop-shadow(0 9px 9px rgba(22, 21, 20, .2)); transition: transform .35s cubic-bezier(.2, .7, .2, 1); }
.opening-polaroid, .brief-polaroid, .bon-polaroid { display: none; } .reus { font-family: var(--kop); font-weight: 900; letter-spacing: -.025em; white-space: nowrap; }
.rg { display: block; width: max-content; will-change: transform; }
.rg[data-dir="-1"] { margin-left: auto; } .hoofd { padding-top: 16px; }
.hoofd-top { position: relative; }
.hoofdkop { font-size: min(11.7vw, 168px); line-height: 1.01; }
.onderkop { margin-top: 12px; border-top: 1px solid var(--inkt); border-bottom: 1px solid var(--inkt); padding: 12px 0 15px; text-align: center; font: italic 400 36px/1.1 var(--kop); }
.lead { display: grid; grid-template-columns: minmax(0, 2.2fr) minmax(0, 1fr); margin-top: 28px; }
.lead-hoofd { padding-right: var(--goot); }
.lead-zij { padding-left: var(--goot); border-left: 1px solid var(--inkt); }
.opening { position: relative; }
.opening-raster .raster { aspect-ratio: 16 / 8.6; }
.opening-raster .beeld { background-position: 50% 30%; }
.verhaal { position: relative; }
.tussenkop { font: 900 54px/1.02 var(--kop); letter-spacing: -.015em; margin: 26px 0 20px; text-wrap: balance; }
.lead-voet { margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--inkt); display: flex; justify-content: flex-end; }
.zijkop { font: 900 44px/1.02 var(--kop); letter-spacing: -.012em; margin: -4px 0 20px; text-wrap: balance; }
.lead-zij .raster { aspect-ratio: 1 / 1.04; --punt: 3px; }
.kort { margin-top: 22px; border-top: 3px solid var(--inkt); padding-top: 14px; }
.kort + .kort { border-top-width: 1px; margin-top: 18px; }
.kort h3 { font: 800 14px/1.3 var(--vet); letter-spacing: .14em; text-transform: uppercase; margin-bottom: 8px; }
.kort p { font: italic 400 24px/1.24 var(--kop); } .haak-pa { top: -14px; bottom: -14px; }
.haak-pb { top: -14px; height: min(100% + 28px, 890px); }
.haak-kc { top: -90px; bottom: -10px; } .wissel { display: flex; align-items: center; }
.wissel::before, .wissel::after { content: ""; flex: 1; height: 7px; border-top: 3px solid var(--inkt); border-bottom: 1px solid var(--inkt); }
.kubus-plek { display: none; } .artikel { margin-top: 48px; position: relative; }
.artikel-kop { font-size: min(8.6vw, 124px); line-height: 1; margin: 22px 0 30px; }
.artikel-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: var(--goot); }
.artikel-grid .raster { aspect-ratio: 1000 / 520; }
.artikel-grid .raster .beeld { left: -7%; right: -7%; will-change: transform; }
.artikel-tekst { border-left: 1px solid var(--inkt); padding-left: var(--goot); display: flex; flex-direction: column; }
.streamer { margin-top: 22px; border-top: 3px solid var(--inkt); border-bottom: 1px solid var(--inkt); padding: 15px 0 18px; font: italic 400 33px/1.14 var(--kop); text-wrap: balance; }
.artikel-voet { margin-top: 20px; }
.haak-kb { top: -200px; height: 800px; } .adv-sectie { margin-top: 56px; }
.adv-sectie .wissel { margin-bottom: 44px; }
.adv { --fg: var(--inkt); --bg: var(--papier); display: block; border: 3px solid var(--fg); padding: 5px; background: var(--bg); color: var(--fg);
transition: background-color .22s ease, color .22s ease, border-color .22s ease; }
.adv:hover { --fg: var(--papier); --bg: var(--inkt); border-color: var(--inkt); }
.adv-in { border: 1px solid currentColor; display: grid; grid-template-columns: minmax(0, 1fr) 360px minmax(0, 1fr); }
.wm { display: block; aspect-ratio: 640 / 156; background: currentColor;
-webkit-mask: var(--wm) left top / 100% auto no-repeat; mask: var(--wm) left top / 100% auto no-repeat; }
.adv-links { padding: 36px 36px 32px; display: flex; flex-direction: column; }
.adv-links .wm { width: 100%; max-width: 420px; }
.adv-oms { margin-top: 26px; padding-top: 22px; border-top: 1px solid currentColor; font: 400 24px/1.3 var(--tekst); }
.adv-formaat { margin-top: auto; padding-top: 22px; font: 800 13px/1.6 var(--vet); letter-spacing: .1em; text-transform: uppercase; }
.adv-beeld { border-left: 1px solid currentColor; border-right: 1px solid currentColor; padding: 22px; display: flex; align-items: center; }
.adv-beeld img { width: 100%; height: auto; outline: 1px solid var(--inkt); }
.adv-rechts { padding: 30px 36px 32px; display: flex; flex-direction: column; justify-content: space-between; }
.adv-prijs { font: 900 252px/.74 var(--kop); letter-spacing: -.045em; margin-left: -.04em; padding-top: .08em; padding-bottom: .2em; font-variant-numeric: lining-nums; font-feature-settings: "lnum" 1; }
.adv-knoppen { display: grid; gap: 12px; }
.adv-knoppen .knop { padding-top: 23px; padding-bottom: 22px; font-size: 15px; } .bon-blok { margin-top: 56px; }
.bon-blok .wissel { margin-bottom: 44px; }
.bon-sectie { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2.2fr); gap: var(--goot); align-items: stretch; }
.bon-beeld { display: flex; }
.bon-raster { display: flex; width: 100%; }
.bon-raster .raster { width: 100%; min-height: 320px; }
.bon-raster .beeld { background-position: 50% 55%; }
.bon { position: relative; border: 3px dashed var(--inkt); padding: 40px 42px 38px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px 44px; align-items: end; align-content: center; }
.bon-kop { font: 900 76px/.98 var(--kop); letter-spacing: -.018em; grid-column: 1 / -1; text-wrap: balance; }
.bon p { font-size: 21px; line-height: 1.38; max-width: 30em; }
.bon-rechts .knop { padding: 24px 34px 23px; font-size: 15px; }
.schaar-baan { position: absolute; left: 0; right: 0; top: -15px; height: 26px; pointer-events: none; }
.schaar { position: absolute; left: 22px; top: 0; padding: 0 8px; background: var(--papier); transition: left 1.3s cubic-bezier(.45, .05, .3, 1); }
.schaar svg { width: 38px; height: 27px; }
.schaar .blad { transform-origin: 12px 12px; }
.bon.knipt .schaar, .bon:hover .schaar { left: calc(100% - 78px); }
.bon.knipt:hover .schaar { left: 22px; }
.bon.knipt .blad-a, .bon:hover .blad-a { animation: knip-a .28s ease-in-out 4 alternate; }
.bon.knipt .blad-b, .bon:hover .blad-b { animation: knip-b .28s ease-in-out 4 alternate; }
@keyframes knip-a { to { transform: rotate(9deg); } }
@keyframes knip-b { to { transform: rotate(-9deg); } }
.haak-pc { top: -26px; bottom: -72px; } .strook { margin-top: 64px; background: var(--inkt); color: var(--papier); }
.strook-in { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 60px; align-items: end; padding: 50px 0 54px; }
.strook-kop { font: 900 70px/.98 var(--kop); letter-spacing: -.02em; text-wrap: balance; }
.strook-sub { margin-top: 14px; font: italic 400 25px/1.2 var(--kop); }
.strook-form { display: flex; align-items: flex-end; gap: 16px; }
.strook-form label { flex: 1; display: block; font: 800 14px/1 var(--vet); letter-spacing: .14em; text-transform: uppercase; }
.strook-form input { display: block; width: 100%; margin-top: 10px; background: transparent; border: 0; border-bottom: 2px solid var(--papier); padding: 8px 0 10px; font: 400 22px/1.2 var(--tekst); color: var(--papier); outline: none; letter-spacing: 0; text-transform: none; }
.strook-form input:focus { border-bottom-width: 4px; padding-bottom: 8px; }
.strook .knop { --fg: var(--papier); --bg: var(--inkt); }
.strook + .tm-voet, main + .tm-voet { padding-top: 0; }  html[data-kubus="a"] .onderkop { display: flex; align-items: center; justify-content: center; gap: 44px; padding: 20px 0 22px; font-size: 46px; }
html[data-kubus="a"] .onderkop > span:first-child { flex: 1; text-align: right; }
html[data-kubus="a"] .onderkop > span:last-child { flex: 1; text-align: left; }
html[data-kubus="a"] .kubus-plek[data-plek="a"] { display: block; flex: none; }
html[data-kubus="a"] .kubus-plek[data-plek="a"] .tm-mark { width: 186px; height: 214px; } html[data-kubus="b"] .kubus-plek[data-plek="b"] { display: block; flex: none; margin: 0 30px; }
html[data-kubus="b"] .kubus-plek[data-plek="b"] .tm-mark { width: 92px; height: 106px; }
html[data-kubus="b"] .adv-sectie .wissel, html[data-kubus="b"] .bon-blok .wissel { margin-bottom: 30px; }
html[data-kubus="b"] .artikel-kop { margin-top: 8px; } html[data-kubus="c"] .kubus-plek[data-plek="c"] { display: inline-block; vertical-align: -15px; margin: -20px 0 -12px 12px; text-indent: 0; }
html[data-kubus="c"] .kubus-plek[data-plek="c"] .tm-mark { width: 42px; height: 48px; }  html[data-polaroid="a"] .opening-raster { display: none; }
html[data-polaroid="a"] .opening { padding: 26px 50px 44px 36px; }
html[data-polaroid="a"] .opening-polaroid { display: block; padding: 18px 18px 24px; }
.opening-polaroid .beeld { aspect-ratio: 1000 / 571; }
.opening-polaroid .sticker { width: 236px; right: -62px; bottom: -58px; transform: rotate(7deg); }
.opening-polaroid:hover { transform: rotate(-.4deg); }
.opening-polaroid:hover .sticker { transform: rotate(11deg) scale(1.04); }
html[data-polaroid="a"] .tussenkop { margin-top: 8px; }
html[data-polaroid="a"] .haak-pa { top: -24px; bottom: -160px; } html[data-polaroid="b"] .verhaal { padding: 34px 30px 14px 6px; }
html[data-polaroid="b"] .vel {
position: relative; background: #f9f7f0; padding: 52px 56px 46px 60px;
box-shadow: 0 0 0 1px rgba(22, 21, 20, .07), 0 2px 3px rgba(22, 21, 20, .18), 0 24px 34px -20px rgba(22, 21, 20, .5);
transform: rotate(-.9deg);
}
html[data-polaroid="b"] .vel::after { content: ""; display: block; clear: both; }
html[data-polaroid="b"] .brief-polaroid { display: block; float: right; width: 292px; margin: -82px -74px 18px 34px; --r: 4deg; padding: 14px 14px 18px; z-index: 2; }
.brief-polaroid .beeld { aspect-ratio: 1; background-position: 50% 55%; }
.brief-polaroid .clip { position: absolute; z-index: 3; left: 34px; top: -30px; width: 30px; height: 80px; color: #3b3935; transform: rotate(-7deg); filter: drop-shadow(0 1px 1px rgba(22, 21, 20, .35)); }
.brief-polaroid:hover { transform: rotate(1.5deg); }
html[data-polaroid="b"] .tussenkop { font: 700 31px/1.22 var(--typ); letter-spacing: -.01em; margin: 0 0 24px; text-wrap: wrap; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 7px; }
html[data-polaroid="b"] .verhaal .zet { columns: auto; text-align: left; hyphens: manual; -webkit-hyphens: manual; font: 700 17px/1.52 var(--typ); }
html[data-polaroid="b"] .verhaal .zet p + p { text-indent: 0; margin-top: 1.05em; }
html[data-polaroid="b"] .verhaal .initiaal::first-letter { font: inherit; float: none; padding: 0; margin: 0; }
html[data-polaroid="b"] .lead-voet { border-top: 0; padding-top: 6px; justify-content: flex-start; }
html[data-polaroid="b"] .haak-pb { top: -60px; height: min(100% + 70px, 890px); } html[data-polaroid="c"] .bon-raster { display: none; }
html[data-polaroid="c"] .bon-beeld { align-items: center; justify-content: flex-end; position: relative; z-index: 2; }
html[data-polaroid="c"] .bon-polaroid { display: block; width: 348px; flex: none; --r: -4deg; margin: 14px -78px 14px 0; }
.bon-polaroid .beeld { aspect-ratio: 1; background-position: 50% 55%; }
.bon-polaroid .sticker { width: 184px; left: -66px; bottom: -54px; transform: rotate(-9deg); }
.bon-polaroid:hover { transform: rotate(-1.5deg); }
.bon-polaroid:hover .sticker { transform: rotate(-13deg) scale(1.04); }
html[data-polaroid="c"] .bon { padding-left: 100px; }
html[data-polaroid="c"] .schaar { left: 96px; }
html[data-polaroid="c"] .bon.knipt:hover .schaar { left: 96px; } @media (max-width: 1023px) {
:root { --goot: 18px; }
body { font-size: 17px; line-height: 1.46; }
.knop { padding: 20px 20px 19px; } .rg { display: contents; }
.wd { display: block; width: max-content; will-change: transform; }
.wd[data-dir="-1"] { margin-left: auto; }
.hoofd { padding-top: 12px; }
.hoofdkop { font-size: 21.4vw; line-height: .98; }
.onderkop { font-size: 26px; margin-top: 10px; padding: 10px 0 13px; }
.lead { grid-template-columns: 1fr; margin-top: 18px; }
.lead-hoofd { padding-right: 0; }
.opening-raster .raster { aspect-ratio: 4 / 3.4; --punt: 3px; }
.opening-raster .beeld { background-position: 62% 30%; }
.tussenkop { font-size: 37px; margin: 20px 0 16px; }
.kol-2, .kol-3 { columns: 1; }
.zet { hyphenate-limit-chars: 7 3 3; }
.lead-voet { justify-content: stretch; }
.lead-voet .knop { width: 100%; }
.lead-zij { margin-top: 34px; padding: 0; border-left: 0; }
.lead-zij::before { content: ""; display: block; height: 7px; border-top: 3px solid var(--inkt); border-bottom: 1px solid var(--inkt); margin-bottom: 20px; }
.zijkop { font-size: 40px; margin-top: 0; }
.lead-zij .raster { aspect-ratio: 1 / .92; }
.foto .bijschrift { font-size: 23px; }
.kort p { font-size: 23px; }
.artikel { margin-top: 38px; }
.artikel-kop { font-size: 19.6vw; line-height: .98; margin: 18px 0 22px; }
.artikel-grid { grid-template-columns: 1fr; }
.artikel-grid .raster { aspect-ratio: 4 / 3; --punt: 3px; }
.artikel-grid .raster .beeld { left: -14%; right: -14%; }
.artikel-tekst { border-left: 0; padding-left: 0; }
.streamer { font-size: 28px; }
.artikel-voet .knop { width: 100%; }
.haak-kb { top: -150px; height: 790px; }
.adv-sectie { margin-top: 40px; }
.adv-sectie .wissel, .bon-blok .wissel { margin-bottom: 30px; }
.adv { padding: 4px; }
.adv-in { grid-template-columns: 1fr; }
.adv-links { padding: 22px 18px 20px; }
.adv-links .wm { max-width: none; }
.adv-oms { font-size: 20px; margin-top: 18px; padding-top: 16px; }
.adv-formaat { padding-top: 18px; }
.adv-beeld { border: 0; border-top: 1px solid currentColor; border-bottom: 1px solid currentColor; padding: 18px 44px; }
.adv-rechts { padding: 20px 18px 18px; gap: 20px; }
.adv-prijs { font-size: 170px; }
.bon-blok { margin-top: 40px; }
.bon-sectie { grid-template-columns: 1fr; gap: 14px; }
.bon-raster .raster { min-height: 0; aspect-ratio: 4 / 3; --punt: 3px; }
.bon { grid-template-columns: 1fr; padding: 32px 20px 24px; gap: 18px; }
.bon-kop { font-size: 43px; }
.bon p { font-size: 18px; }
.bon-rechts .knop { width: 100%; }
.schaar { left: 12px; }
.bon.knipt .schaar, .bon:hover .schaar { left: calc(100% - 68px); }
.bon.knipt:hover .schaar { left: 12px; }
.haak-pc { top: -10px; bottom: -24px; }
.strook { margin-top: 46px; }
.strook-in { grid-template-columns: 1fr; gap: 28px; padding: 36px 0 40px; }
.strook-kop { font-size: 46px; }
.strook-sub { font-size: 22px; }
.strook-form { flex-direction: column; align-items: stretch; gap: 18px; }
.strook-form input { font-size: 20px; } html[data-kubus="a"] .onderkop { flex-direction: column; gap: 6px; padding: 16px 0 20px; font-size: 30px; }
html[data-kubus="a"] .onderkop > span:first-child, html[data-kubus="a"] .onderkop > span:last-child { flex: none; text-align: center; }
html[data-kubus="a"] .kubus-plek[data-plek="a"] .tm-mark { width: 150px; height: 172px; }
html[data-kubus="b"] .kubus-plek[data-plek="b"] { margin: 0 20px; }
html[data-kubus="b"] .kubus-plek[data-plek="b"] .tm-mark { width: 72px; height: 83px; }
html[data-kubus="c"] .kubus-plek[data-plek="c"] .tm-mark { width: 40px; height: 46px; }
.haak-kc { top: auto; bottom: -10px; height: min(100% + 20px, 820px); } html[data-polaroid="a"] .opening { padding: 14px 12px 34px 8px; }
html[data-polaroid="a"] .opening-polaroid { padding: 10px 10px 14px; }
.tape { width: 84px; height: 26px; }
.tape-lb { left: -28px; top: -4px; }
.tape-rb { right: -28px; top: -4px; }
.opening-polaroid .sticker { width: 128px; right: -22px; bottom: -42px; }
html[data-polaroid="a"] .haak-pa { top: -14px; bottom: -190px; }
html[data-polaroid="b"] .verhaal { padding: 58px 0 10px; }
html[data-polaroid="b"] .vel { padding: 0 20px 30px; transform: rotate(-.5deg); }
html[data-polaroid="b"] .brief-polaroid { float: none; width: 212px; margin: 0 auto 22px; top: -40px; margin-bottom: -18px; padding: 10px 10px 14px; }
.brief-polaroid .clip { left: 24px; top: -28px; }
html[data-polaroid="b"] .tussenkop { font-size: 25px; margin-bottom: 20px; }
html[data-polaroid="b"] .verhaal .zet { font-size: 16.5px; line-height: 1.5; }
html[data-polaroid="b"] .haak-pb { top: 0; height: min(100%, 830px); }
html[data-polaroid="c"] .bon-beeld { justify-content: center; padding: 14px 0 40px; }
html[data-polaroid="c"] .bon-polaroid { width: 264px; margin: 0 0 0 34px; padding: 12px 12px 16px; --r: 3deg; }
.bon-polaroid .sticker { width: 132px; left: -62px; bottom: -30px; }
.tape-mb { width: 96px; margin-left: -48px; top: -14px; }
html[data-polaroid="c"] .bon { padding-left: 20px; }
html[data-polaroid="c"] .schaar, html[data-polaroid="c"] .bon.knipt:hover .schaar { left: 12px; }
}
@media (prefers-reduced-motion: reduce) {
main *, main *::before, main *::after { animation: none !important; transition: none !important; }
} .artikel, .adv-sectie, .bon-blok { margin-top: 120px; }
.strook { margin-top: 128px; }
@media (max-width: 1023px) {
.artikel { margin-top: 76px; }
.adv-sectie, .bon-blok { margin-top: 80px; }
.strook { margin-top: 92px; }
} @media (min-width: 1024px) and (max-width: 1199px) { .adv-in { grid-template-columns: minmax(0, 1fr) 300px minmax(0, 1fr); }
.adv-rechts { container-type: inline-size; padding-inline: 28px; }
.adv-links { padding-inline: 28px; }
.adv-prijs { font-size: min(252px, 60cqi); }
.adv-knoppen .knop { white-space: normal; text-align: center; padding-inline: 12px; }
}
@media (max-width: 1023px) { .hoofdkop { font-size: min(21.4vw, (100vw - 2 * var(--marge)) / 4.45); padding-bottom: .1em; }
.adv-links .wm { max-width: 420px; }
.adv-rechts { container-type: inline-size; }
.adv-prijs { font-size: min(170px, 60cqi); }
.adv-beeld img { width: min(100%, 380px); margin-inline: auto; }
.knop { white-space: normal; text-align: center; }
} @media (min-width: 1200px) and (max-width: 1430px) {
.adv-rechts { container-type: inline-size; }
.adv-prijs { font-size: min(252px, 60cqi); }
}