@font-face{font-family:Manrope;src:url('assets/manrope.woff2') format('woff2');font-weight:200 800;font-display:swap}
@font-face{font-family:'DM Sans';src:url('assets/dm-sans.woff2') format('woff2');font-weight:100 1000;font-display:swap}

:root{color-scheme:dark;--bg:#0d1b16;--bg2:#12271f;--ivory:#f7f1e6;--gold:#f0cf86;--red:#c9372f;--green:#2f7650;--muted:#b8c4bb;--line:#f0cf8638}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;background:var(--bg);color:var(--ivory);font-family:'DM Sans',Arial,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
a:focus-visible,button:focus-visible{outline:3px solid var(--gold);outline-offset:5px}
::selection{background:var(--gold);color:#102018}
h1,h2,h3{font-family:Manrope,Arial,sans-serif;margin:0;letter-spacing:-.03em}
.skip{position:fixed;top:12px;left:12px;z-index:20;background:var(--ivory);color:var(--bg);padding:12px;transform:translateY(-160%)}
.skip:focus{transform:none}
#snow{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:4}
main,footer,.header{position:relative;z-index:1}

.header{position:absolute;z-index:3;top:0;left:0;width:100%;height:108px;display:flex;align-items:center;justify-content:space-between;padding:0 6%}
.brand img{display:block;width:132px;height:66px;object-fit:contain}
.header-link{font:700 12px Manrope,Arial,sans-serif;text-decoration:none;color:var(--gold);border-bottom:1px solid var(--line);padding-bottom:4px}
.header-link:hover{border-color:var(--gold)}

.eyebrow{margin:0 0 18px;color:var(--gold);font:700 11px/1.5 Manrope,Arial,sans-serif;text-transform:uppercase;letter-spacing:.2em}

/* ---------- hero ---------- */
.hero{position:relative;padding:132px 6% 72px;text-align:center;background:radial-gradient(ellipse 80% 55% at 50% 0,#1d4a37 0,transparent 70%),linear-gradient(180deg,var(--bg2),var(--bg) 90%)}
.hero-glow{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 15% 18%,#f0cf8625 0,transparent 22%),radial-gradient(circle at 86% 30%,#f0cf8620 0,transparent 20%)}
.hero-content{position:relative;max-width:760px;margin:0 auto}
h1{display:flex;flex-direction:column;align-items:center;line-height:.92}
.h1-top{font-size:clamp(22px,3.4vw,38px);font-weight:300;letter-spacing:.42em;text-transform:uppercase;color:var(--gold);padding-left:.42em}
.h1-main{font-size:clamp(54px,12.5vw,148px);font-weight:800;letter-spacing:-.05em;margin-top:.08em;background:linear-gradient(180deg,#fffaf0 30%,#e8dcc4);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
.hero-copy{max-width:560px;margin:26px auto 36px;color:var(--muted);font-size:clamp(15px,1.5vw,18px);line-height:1.8}
.reassurance{margin:18px 0 0;color:var(--muted);font-size:13px}

/* ---------- kerstknop ---------- */
.xmas-button{display:inline-block;max-width:100%;padding:4px;border-radius:999px;text-decoration:none;color:var(--ivory);background:repeating-linear-gradient(-45deg,var(--red) 0 9px,var(--ivory) 9px 18px);box-shadow:0 0 0 1px #00000040,0 10px 34px #c9372f55,0 0 46px #f0cf8622;transition:transform .25s,box-shadow .25s}
.xmas-button:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 0 0 1px #00000040,0 16px 44px #c9372f80,0 0 60px #f0cf8638}
.xmas-button:focus-visible{outline-offset:7px}
.xmas-button-inner{position:relative;overflow:hidden;display:flex;align-items:center;gap:14px;padding:15px 22px 15px 18px;border-radius:999px;background:linear-gradient(180deg,#cf3d34,#9d231d);box-shadow:inset 0 1px 0 #ffffff40,inset 0 -3px 8px #00000030;text-align:left}
.xmas-button-inner::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:30%;background:linear-gradient(100deg,transparent,#ffffff55,transparent);transform:skewX(-18deg);animation:shine 4.5s ease-in-out infinite}
.bauble{flex:none;filter:drop-shadow(0 2px 3px #00000050);animation:sway 3.6s ease-in-out infinite;transform-origin:50% 0}
.xmas-button-text{display:flex;flex-direction:column;gap:3px}
.xmas-button strong{font:800 clamp(14px,3.8vw,17px)/1.25 Manrope,Arial,sans-serif;letter-spacing:-.01em}
.xmas-button small{font-size:12px;color:#ffe2dd}
.xmas-button .arrow{flex:none;font-size:20px;margin-left:4px;transition:transform .25s}
.xmas-button:hover .arrow{transform:translateX(5px)}
@keyframes shine{0%,55%{left:-40%}100%{left:130%}}
@keyframes sway{0%,100%{transform:rotate(-7deg)}50%{transform:rotate(7deg)}}

/* ---------- mockup-kamers ---------- */
.scene-wrap{margin:0}
.hero-scene{position:relative;width:min(1080px,100%);margin:64px auto 0}
.scene-wrap figcaption{display:flex;justify-content:space-between;gap:16px;margin-top:14px;font-size:12px;color:var(--muted);text-align:left}
.scene-wrap figcaption span:first-child{color:var(--ivory);font-weight:700;font-family:Manrope,Arial,sans-serif;letter-spacing:.02em}
.room{position:relative;container-type:inline-size;width:100%;aspect-ratio:16/10;overflow:hidden;border-radius:6px;box-shadow:0 30px 70px #00000070,0 0 0 1px #ffffff12;isolation:isolate;text-align:left}
.room>*,.room .gallery>*{position:absolute}
.room .gallery{position:absolute}
.r-wall{inset:0}
.r-floor{left:0;right:0;bottom:0;height:9cqw;background:repeating-linear-gradient(90deg,#00000000 0 11cqw,#00000030 11cqw 11.2cqw),linear-gradient(180deg,var(--fl1),var(--fl2))}
.r-base{left:0;right:0;bottom:9cqw;height:1.1cqw;background:var(--base);box-shadow:0 .2cqw .4cqw #00000040}

/* kaarsen */
.candle{width:1.3cqw;border-radius:.25cqw .25cqw 0 0;background:linear-gradient(90deg,#d8cfbd,#fbf6ea 45%,#d8cfbd)}
.candle b{position:absolute;bottom:100%;left:50%;width:.9cqw;height:1.9cqw;margin-left:-.45cqw;border-radius:50% 50% 50% 50%/68% 68% 32% 32%;background:radial-gradient(ellipse at 50% 75%,#fff7cf 0,#ffd271 45%,#ff9a3a 100%);box-shadow:0 0 1.8cqw .8cqw #ffb45a77;transform-origin:50% 100%;animation:flicker 2.1s ease-in-out infinite}
.candle:nth-of-type(2n) b{animation-duration:1.7s;animation-delay:-.6s}
@keyframes flicker{0%,100%{transform:scale(1,1) rotate(-2deg)}25%{transform:scale(.92,1.08) rotate(2deg)}50%{transform:scale(1.05,.95) rotate(-1deg)}75%{transform:scale(.95,1.06) rotate(1.5deg)}}

/* lijsten */
.frame{--b:.8cqw;--m:1.9cqw;padding:var(--b);background:#141412;box-shadow:0 1.2cqw 2.4cqw #00000059,0 .15cqw .5cqw #00000066,inset 0 0 0 .12cqw #ffffff22}
.frame .mat{background:#f6f1e7;padding:var(--m);box-shadow:inset 0 .1cqw .5cqw #00000055}
.frame img{display:block;width:100%;height:auto;outline:1px solid #00000030}
.frame::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,#ffffff2b 0 22%,transparent 22.2% 100%)}
.f-black{background:linear-gradient(135deg,#2a2a28,#0e0e0d)}
.f-oak{background:linear-gradient(135deg,#d3a468,#a8733c 55%,#c28f55)}
.f-gold{background:linear-gradient(135deg,#f1d99a,#b78d3b 50%,#e3c273)}
.f-white{background:linear-gradient(135deg,#fffdf8,#e5dfd1)}
.f-white .mat{background:#fbf9f3}

/* planten, boom, cadeaus, kousen */
.plant,.tree,.stocking{overflow:visible}
.gifts svg{position:absolute;bottom:0;filter:drop-shadow(0 .3cqw .4cqw #00000060)}
.gifts{height:6cqw;width:20cqw}

/* ----- kamer 1: haard ----- */
.room-fire{--fl1:#4a3426;--fl2:#2a1d15;--base:#161d1a}
.room-fire .r-wall{background:radial-gradient(ellipse 60% 70% at 50% 85%,#3d4f46,#24322c 75%),#26352f}
.room-fire .r-wall::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,#ffffff06 0 .18cqw,transparent .18cqw 9cqw)}
.r-breast{left:29cqw;width:42cqw;top:0;bottom:32cqw;background:linear-gradient(180deg,#2c3c35,#364840);box-shadow:inset .6cqw 0 1.4cqw #00000040,inset -.6cqw 0 1.4cqw #00000040}
.fire-body{left:28cqw;width:44cqw;bottom:9cqw;height:21cqw;background:linear-gradient(180deg,#1c1a17,#0e0d0b);box-shadow:inset 0 0 2cqw #00000090}
.fire-opening{position:absolute;left:5cqw;right:5cqw;top:3.5cqw;bottom:0;background:radial-gradient(ellipse at 50% 100%,#8a3a12 0,#20120a 55%,#070605);overflow:hidden;box-shadow:inset 0 .6cqw 1.4cqw #000}
.logs i{position:absolute;bottom:.4cqw;height:2.2cqw;border-radius:1.1cqw;background:linear-gradient(180deg,#5a3a24,#2a1a10)}
.logs i:first-child{left:7cqw;width:13cqw;transform:rotate(-4deg)}
.logs i:last-child{left:12cqw;width:14cqw;bottom:1.6cqw;transform:rotate(5deg);background:linear-gradient(180deg,#6a4529,#33200f)}
.flame{position:absolute;bottom:1.4cqw;border-radius:50% 50% 50% 50%/70% 70% 30% 30%;background:radial-gradient(ellipse at 50% 85%,#fff3b8 0,#ffc044 35%,#ff6a1c 75%,#c83a10);filter:blur(.25cqw);transform-origin:50% 100%;animation:blaze 1.5s ease-in-out infinite}
.f1{left:8cqw;width:5cqw;height:9cqw;animation-delay:-.3s}
.f2{left:12.5cqw;width:6.5cqw;height:12cqw;animation-delay:-.9s}
.f3{left:18.5cqw;width:5.5cqw;height:10cqw;animation-delay:-.1s}
.f4{left:23.5cqw;width:4cqw;height:7cqw;animation-delay:-.6s}
@keyframes blaze{0%,100%{transform:scale(1,1) skewX(0)}20%{transform:scale(.9,1.08) skewX(3deg)}45%{transform:scale(1.07,.93) skewX(-3deg)}70%{transform:scale(.94,1.05) skewX(2deg)}}
.mantel{left:25cqw;width:50cqw;bottom:30cqw;height:2.2cqw;background:linear-gradient(180deg,#e3b97c,#b88650);border-radius:.3cqw;box-shadow:0 .8cqw 1.4cqw #00000070}
.garland{left:24cqw;width:52cqw;top:31.6cqw;height:auto;overflow:visible}
.garland path,.lights path{fill:none;stroke-linecap:round}
.g-green{stroke:#2c6c47;stroke-width:4.4;stroke-dasharray:0 3.1;filter:drop-shadow(0 .5px 0 #0b2417)}
.g-red{stroke:#d2403a;stroke-width:2.2;stroke-dasharray:0 15;stroke-dashoffset:-3}
.g-gold{stroke:#f4cf7a;stroke-width:1.4;stroke-dasharray:0 9.5;stroke-dashoffset:-7}
.fire-frame{left:35cqw;width:30cqw;top:6.5cqw}
.room-fire .c1,.room-fire .c2,.room-fire .c3{bottom:32.2cqw}
.c1{left:30.5cqw;height:5cqw}
.c2{left:33cqw;height:7.5cqw}
.c3{left:67cqw;height:6cqw}
.s1,.s2{top:32.2cqw;width:4cqw;height:6.7cqw}
.s1{left:27cqw}
.s2{left:69.8cqw}
.p-left{left:7.5cqw;bottom:9cqw;width:11cqw;height:22cqw}
.t-right{left:78cqw;bottom:9cqw;width:14cqw;height:22.4cqw;filter:drop-shadow(0 0 1.2cqw #f4cf7a40)}
.room-fire .gifts{left:76cqw;bottom:9cqw}
.room-fire .gifts svg:first-child{left:1cqw;width:4.4cqw;height:4.4cqw}
.room-fire .gifts svg:last-child{left:13.2cqw;width:3.4cqw;height:3.4cqw}
.fire-light{inset:0;pointer-events:none;mix-blend-mode:screen;background:radial-gradient(ellipse 45% 60% at 50% 88%,#ff8a3a55,transparent 70%);animation:glow 2.6s ease-in-out infinite}
@keyframes glow{0%,100%{opacity:.85}50%{opacity:1}}

/* ----- kamer 2: bank ----- */
.room-sofa{--fl1:#c79a68;--fl2:#a97b4c;--base:#f4efe5}
.room-sofa .r-wall{background:linear-gradient(180deg,#dfe6d6,#cbd6c0)}
.room-sofa .r-wall::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 55% 60% at 50% 30%,#ffffff55,transparent 70%)}
.lights{left:0;top:0;width:100cqw;height:10cqw;overflow:visible}
.l-wire{stroke:#3a3a36;stroke-width:.25}
.l-dots{stroke:#ffd98a;stroke-width:1.1;stroke-dasharray:0 4.2;stroke-dashoffset:-1;filter:drop-shadow(0 0 1.2px #ffc255) drop-shadow(0 0 2.5px #ffb347)}
.gallery{left:14cqw;width:72cqw;top:9.5cqw;display:flex;align-items:center;justify-content:center;gap:2.2cqw}
.gallery>.frame{position:relative}
.g-side{width:15.5cqw;--b:.7cqw;--m:1.6cqw}
.g-main{width:28cqw;--b:.8cqw;--m:2cqw}
.sofa{left:16cqw;width:68cqw;bottom:8cqw;height:20.5cqw}
.sofa>*{position:absolute}
.sofa-back{left:3.5cqw;right:3.5cqw;top:0;height:13cqw;display:flex;gap:.5cqw;padding:1cqw;background:linear-gradient(180deg,#2d5c44,#244c38);border-radius:2.8cqw 2.8cqw 0 0;box-shadow:inset 0 .3cqw .6cqw #ffffff24}
.sofa-back i{flex:1;border-radius:2cqw 2cqw .6cqw .6cqw;background:linear-gradient(180deg,#3b7358,#2f6048);box-shadow:inset 0 .3cqw .5cqw #ffffff20,0 .2cqw .5cqw #00000040}
.sofa-arm{top:6cqw;bottom:1.5cqw;width:5.6cqw;border-radius:2.4cqw 2.4cqw .8cqw .8cqw;background:linear-gradient(90deg,#1f4231,#2b5841 50%,#1f4231);box-shadow:0 .3cqw .8cqw #00000050}
.sa-l{left:0}.sa-r{right:0}
.sofa-seat{left:4.4cqw;right:4.4cqw;top:11.4cqw;height:7.4cqw;display:flex;gap:.5cqw;padding:0 .5cqw;background:#244c38}
.sofa-seat i{flex:1;border-radius:1.4cqw;background:linear-gradient(180deg,#3d7459,#2e5f47);box-shadow:inset 0 .35cqw .5cqw #ffffff2a,0 .3cqw .6cqw #00000050}
.sofa-legs{left:6cqw;right:6cqw;bottom:0;height:1.5cqw;display:flex;justify-content:space-between}
.sofa-legs i{width:1cqw;background:linear-gradient(90deg,#8a5e38,#c08d58);clip-path:polygon(0 0,100% 0,80% 100%,20% 100%)}
.pillow{border-radius:1.4cqw;box-shadow:0 .4cqw .8cqw #00000050,inset 0 .2cqw .4cqw #ffffff30}
.pl1{left:7cqw;top:6.8cqw;width:6.8cqw;height:6.6cqw;background:linear-gradient(135deg,#c8443a,#98291f);transform:rotate(-9deg)}
.pl2{left:13.5cqw;top:7.6cqw;width:6.2cqw;height:6.2cqw;background:repeating-linear-gradient(90deg,#f6f1e7 0 .9cqw,#e6dcc8 .9cqw 1.2cqw);transform:rotate(7deg)}
.pl3{right:7.5cqw;top:6.4cqw;width:6.8cqw;height:6.4cqw;background:linear-gradient(135deg,#e1ae55,#b98427);transform:rotate(11deg)}
.blanket{right:1cqw;top:6cqw;width:6.6cqw;height:12.4cqw;border-radius:1.2cqw .8cqw 1.8cqw 1.8cqw;background:repeating-linear-gradient(0deg,#f1e9da 0 .8cqw,#e1d6c1 .8cqw 1cqw);box-shadow:0 .4cqw .8cqw #00000050;transform:rotate(2deg)}
.p-left2{left:3.5cqw;bottom:8cqw;width:11cqw;height:22cqw}
.t-right2{right:3.5cqw;bottom:8cqw;width:11.5cqw;height:18.4cqw;filter:drop-shadow(0 0 1.2cqw #f4cf7a40)}

/* ----- kamer 3: dressoir ----- */
.room-board{--fl1:#0f1a19;--fl2:#0a1211}
.room-board .r-wall{z-index:0;background:linear-gradient(180deg,#183230,#10211f 70%,#0d1a19)}
.bokeh{inset:0;z-index:1;pointer-events:none}
.bokeh i{position:absolute;border-radius:50%;filter:blur(.5cqw);animation:twinkle 3.5s ease-in-out infinite}
.bokeh i:nth-child(1){left:6cqw;top:6cqw;width:5cqw;height:5cqw;background:#ffcf7a66}
.bokeh i:nth-child(2){left:16cqw;top:14cqw;width:3cqw;height:3cqw;background:#ff8a6a55;animation-delay:-1s}
.bokeh i:nth-child(3){left:27cqw;top:5cqw;width:4cqw;height:4cqw;background:#ffe3a066;animation-delay:-2s}
.bokeh i:nth-child(4){left:44cqw;top:9cqw;width:6cqw;height:6cqw;background:#ffcf7a4d;animation-delay:-.5s}
.bokeh i:nth-child(5){left:58cqw;top:3cqw;width:3.5cqw;height:3.5cqw;background:#9be0b155;animation-delay:-1.5s}
.bokeh i:nth-child(6){left:70cqw;top:11cqw;width:5cqw;height:5cqw;background:#ffcf7a55;animation-delay:-2.5s}
.bokeh i:nth-child(7){left:82cqw;top:5cqw;width:4cqw;height:4cqw;background:#ff8a6a4d;animation-delay:-3s}
.bokeh i:nth-child(8){left:90cqw;top:17cqw;width:3cqw;height:3cqw;background:#ffe3a066;animation-delay:-.8s}
.bokeh i:nth-child(9){left:2cqw;top:22cqw;width:3.5cqw;height:3.5cqw;background:#9be0b14d;animation-delay:-2.2s}
@keyframes twinkle{0%,100%{opacity:.45}50%{opacity:1}}
.board{left:6cqw;width:88cqw;top:40cqw;height:22.5cqw;z-index:2}
.board>*{position:absolute}
.board-top{left:-.6cqw;right:-.6cqw;top:0;height:1.7cqw;border-radius:.3cqw;background:linear-gradient(180deg,#e0b27b,#b98650);box-shadow:0 .8cqw 1.2cqw #00000070}
.board-body{left:0;right:0;top:1.7cqw;height:14cqw;display:flex;gap:.5cqw;padding:.8cqw;background:linear-gradient(180deg,#a8763f,#8c5f31)}
.board-body i{position:relative;flex:1;border-radius:.3cqw;background:linear-gradient(135deg,#c28f55,#a8763f);box-shadow:inset 0 0 0 .15cqw #00000030}
.board-body i::after{content:"";position:absolute;top:1.2cqw;left:50%;width:3cqw;height:.35cqw;margin-left:-1.5cqw;border-radius:.2cqw;background:#2a2118}
.board-legs{left:5cqw;right:5cqw;bottom:0;height:6.8cqw;display:flex;justify-content:space-between}
.board-legs i{width:1.4cqw;background:linear-gradient(90deg,#7a5230,#b78552);clip-path:polygon(0 0,100% 0,70% 100%,30% 100%)}
.room-board .frame,.room-board .candle,.room-board .tree,.room-board .gifts{z-index:3}
.stand-main{left:12cqw;width:27cqw;bottom:22.5cqw;--b:.8cqw;--m:1.8cqw;transform:rotate(-1.5deg);transform-origin:50% 100%}
.stand-small{left:41cqw;width:16cqw;bottom:22.5cqw;--b:.55cqw;--m:1.3cqw;transform:rotate(2deg);transform-origin:50% 100%}
.bc1,.bc2,.bc3{bottom:22.5cqw;z-index:3}
.bc1{left:61.5cqw;height:6cqw}
.bc2{left:63.7cqw;height:9cqw;width:1.6cqw}
.bc3{left:66.2cqw;height:5cqw}
.t-mini{left:72.5cqw;bottom:22.5cqw;width:10cqw;height:16cqw;filter:drop-shadow(0 0 1.2cqw #f4cf7a55)}
.g-board{left:83.5cqw;bottom:22.5cqw}
.g-board svg:first-child{left:0;width:4.6cqw;height:4.6cqw}
.g-board svg:last-child{left:5cqw;width:3.2cqw;height:3.2cqw}
.board-glow{inset:0;z-index:4;pointer-events:none;mix-blend-mode:screen;background:radial-gradient(ellipse 30% 40% at 66% 62%,#ffa84a40,transparent 70%),radial-gradient(ellipse 50% 40% at 30% 60%,#ffb87a22,transparent 75%);animation:glow 2.8s ease-in-out infinite}

/* ---------- secties ---------- */
.intro{max-width:700px;margin:0 auto;padding:84px 6% 48px;text-align:center}
.intro h2,.steps h2,.final h2{font-size:clamp(28px,4.2vw,50px);line-height:1.1}
.intro>p:last-child{margin:22px auto 0;color:var(--muted);font-size:16px;line-height:1.85}
.showcase{display:grid;gap:64px;grid-template-columns:1fr;width:min(1080px,100% - 12%);margin:0 auto}
.gallery-note{margin:34px auto 0;padding:0 6%;text-align:center;color:var(--muted);font-size:12px}
.steps{max-width:1080px;margin:0 auto;padding:96px 6% 40px;text-align:center}
.steps ol{list-style:none;margin:48px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;text-align:left}
.steps li{position:relative;padding:30px 26px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(180deg,#ffffff0a,#ffffff03)}
.num{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fbe6a8,#d8ac4e);color:#2a1d05;font:800 17px Manrope,Arial,sans-serif;box-shadow:0 4px 14px #00000050}
.steps h3{margin:20px 0 8px;font-size:20px}
.steps li p{margin:0;color:var(--muted);font-size:14px;line-height:1.75}
.final{position:relative;max-width:900px;margin:72px auto 0;padding:72px 6%;text-align:center;border:1px solid var(--line);border-radius:22px;background:radial-gradient(ellipse 70% 90% at 50% 0,#245b41,transparent 75%),#10231b;width:min(900px,100% - 12%)}
.final>p:not(.eyebrow){margin:18px 0 34px;color:var(--muted);font-size:16px}

footer{margin:0 6%;padding:56px 0 96px;display:flex;flex-direction:column;gap:24px;text-align:center;font-size:12px;color:var(--muted)}
footer strong{font:800 15px Manrope,Arial,sans-serif;color:var(--ivory)}
footer strong span{font-weight:400;font-size:11px}
footer p{margin:8px 0 0}
footer .signoff{color:var(--gold);font-size:14px}

/* ---------- muziekknop ---------- */
.sound-control{position:fixed;z-index:6;right:18px;bottom:16px;max-width:calc(100% - 36px)}
#sound-toggle{display:inline-flex;align-items:center;gap:10px;min-height:46px;padding:0 18px;border:1px solid #f0cf8680;border-radius:999px;background:#0d1b16ee;color:var(--ivory);font:700 12px Manrope,Arial,sans-serif;cursor:pointer;backdrop-filter:blur(6px);box-shadow:0 8px 24px #00000070}
#sound-toggle:hover{border-color:var(--gold)}
#sound-status{margin:8px 4px 0;font-size:12px;color:var(--gold);text-align:right}
#sound-status:empty{display:none}

@media(max-width:1000px){.steps ol{grid-template-columns:1fr}}
@media(max-width:600px){.hero{padding-top:112px}.header{height:92px}.brand img{width:110px;height:55px}.xmas-button-inner{padding:13px 16px 13px 14px;gap:10px}.xmas-button small{font-size:11px}.scene-wrap figcaption{flex-direction:column;gap:2px}.final{padding:52px 5%}#sound-toggle span{display:none}#sound-toggle{width:46px;padding:0;justify-content:center}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}#snow{display:none}}