:root{--bg:#2a1650;--bg2:#341c63;--vlak:#3f2575;--tekst:#fff8ee;--tekst2:#e3d4f5;--accent:#ffb43b;--accent2:#7be0c3;--lijn:#5a3a96;--lijn2:#7a58b8;--kop-bg:rgba(42,22,80,.9);--hero-veil:linear-gradient(180deg,rgba(42,22,80,.25),rgba(42,22,80,.55) 55%,#2a1650);--hero-tekst:#fff1dc;--knop-tekst:#2a1650;--nummer-bg:linear-gradient(135deg,#4a2a8a,#2f1a5e);--volg-bg:linear-gradient(135deg,#4a2a8a,#341c63);--font-kop:'Trebuchet MS','Segoe UI Rounded','Arial Rounded MT Bold',system-ui,sans-serif;--font-tekst:'Trebuchet MS',system-ui,-apple-system,'Segoe UI',sans-serif;--radius:26px;--fs:18px}
*{box-sizing:border-box;margin:0}
html,body{min-height:100%}
body{background:var(--bg);color:var(--tekst);font-family:var(--font-tekst);overflow-x:hidden}
.stage{position:relative;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;align-items:center;padding:8px 12px 10px;isolation:isolate;gap:6px}
.bg{position:absolute;inset:0;z-index:-3;background-size:cover;background-position:center;filter:blur(28px) saturate(1.2);transform:scale(1.15);opacity:.9}
.veil{position:absolute;inset:0;z-index:-2;background:var(--hero-veil)}
.fx{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.top{width:100%;max-width:760px;display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:42px}
.merk{display:flex;align-items:center;gap:9px;min-width:0}
.soc{display:flex;gap:6px;flex:none}
.soc a{width:32px;height:32px;border-radius:10px;border:1px solid var(--lijn2);background:rgba(0,0,0,.45);color:var(--tekst);display:flex;align-items:center;justify-content:center}
.soc a:hover,.soc a:focus-visible{background:var(--accent);color:var(--knop-tekst);outline:none}
.soc svg{width:17px;height:17px}
.top .merk img{width:34px;height:34px;border-radius:10px;box-shadow:0 6px 20px rgba(0,0,0,.5)}
.top .naam{font-family:var(--font-kop);font-size:clamp(15px,4.4vw,26px);letter-spacing:var(--ls,.02em);font-weight:800;line-height:1}
.top b{color:var(--accent);font-weight:900}
.s18{display:inline-block;padding:3px 9px;border-radius:999px;background:var(--accent);color:var(--knop-tekst);font-weight:800;font-size:11px;letter-spacing:.1em}
.poster{flex:1 1 0;min-height:150px;width:100%;max-width:760px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:0}
.poster .vlak{flex:1 1 0;min-height:0;width:100%;display:flex;align-items:center;justify-content:center}
.poster img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;min-height:0;border-radius:var(--radius);box-shadow:0 14px 50px rgba(0,0,0,.55);aspect-ratio:12/11}
.cast{font-size:12px;color:var(--tekst2);text-align:center;line-height:1.35;text-shadow:0 1px 8px rgba(0,0,0,.8)}
.onder{width:100%;max-width:560px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:7px}
h1{font-family:var(--font-kop);font-size:clamp(26px,6.4vw,44px);line-height:1.03;letter-spacing:var(--ls,0);text-shadow:0 3px 22px rgba(0,0,0,.6)}
.sub{font-size:clamp(14px,3.4vw,18px);color:var(--hero-tekst)}
.tag{color:var(--tekst2);font-size:13px;min-height:1.2em}
.open{display:flex;align-items:center;justify-content:center;gap:12px;padding:8px 16px;border-radius:var(--radius);background:rgba(0,0,0,.45);border:1px solid var(--lijn2);backdrop-filter:blur(6px);width:100%}
.open small{display:block;color:var(--accent2);letter-spacing:.14em;text-transform:uppercase;font-weight:700;font-size:11px}
.open strong{display:block;font-size:clamp(14px,3.8vw,19px);line-height:1.2}
.open em{display:block;font-style:normal;color:var(--tekst2);font-size:12px}
.knop{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:10px 18px;border-radius:var(--radius-knop,999px);background:var(--accent);color:var(--knop-tekst);font-weight:800;text-decoration:none;font-size:15px}
.knop:hover,.knop:focus-visible{filter:brightness(1.12);outline:3px solid var(--accent2);outline-offset:3px}
.knop svg{width:26px;height:18px;flex:none}
.ouders{font-size:11px;color:var(--tekst2)}
.vlaggen{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;list-style:none;padding:0;width:100%}
.vlaggen li{display:block}
.vlaggen button{width:100%;height:38px;display:flex;align-items:center;justify-content:center;gap:7px;border-radius:12px;border:1px solid var(--lijn2);background:rgba(0,0,0,.45);color:var(--tekst);font:inherit;font-size:12px;font-weight:800;letter-spacing:.04em;cursor:pointer;padding:0 4px}
.vlaggen button[aria-pressed=true]{background:var(--accent);color:var(--knop-tekst);border-color:var(--accent)}
.vlaggen img{width:24px;height:16px;border-radius:3px;display:block;flex:none}
.vlaggen button:focus-visible{outline:3px solid var(--accent2);outline-offset:2px}
.poort{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(10,5,14,.96)}
.poort .doos{width:min(420px,100%);text-align:center;background:var(--vlak);border:1px solid var(--lijn2);border-radius:var(--radius);padding:26px 22px}
.poort h2{font-family:var(--font-kop);font-size:28px;line-height:1.1;margin:10px 0}
.poort p{color:var(--tekst2);font-size:14px;margin-bottom:16px}
.poort .rij{display:flex;gap:10px;justify-content:center}
.poort button{padding:12px 22px;border-radius:999px;border:1px solid var(--lijn2);font:inherit;font-weight:800;cursor:pointer;background:transparent;color:var(--tekst)}
.poort button.ja{background:var(--accent);color:var(--knop-tekst);border-color:var(--accent)}
.poort button:focus-visible{outline:3px solid var(--accent2);outline-offset:3px}
html.ok18 .poort{display:none}
.poster img:not([src]){visibility:hidden}
html.ok18 .bg.g{background-image:url("assets/affiche.webp")}
.p-one-night-one-dare .fx{background:radial-gradient(520px 520px at 20% 30%,rgba(255,60,110,.3),transparent 60%),radial-gradient(480px 480px at 80% 70%,rgba(255,193,107,.2),transparent 60%);animation:glim 7s ease-in-out infinite alternate}
.p-blueprint-legends .fx{background-image:linear-gradient(rgba(95,208,255,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(95,208,255,.14) 1px,transparent 1px),linear-gradient(rgba(95,208,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(95,208,255,.07) 1px,transparent 1px);background-size:120px 120px,120px 120px,24px 24px,24px 24px}
.p-nl-kids-feest .fx{background-image:radial-gradient(circle,#ffb43b 0 4px,transparent 5px),radial-gradient(circle,#7be0c3 0 4px,transparent 5px),radial-gradient(circle,#ff7ab6 0 4px,transparent 5px);background-size:140px 140px,190px 190px,230px 230px;background-position:0 0,60px 80px,120px 30px;animation:val 14s linear infinite;opacity:.55}
.p-nl-bouw-team .fx::after,.p-nl-bouw-team .fx::before{content:"";position:absolute;left:0;right:0;height:14px;background:repeating-linear-gradient(135deg,#ffcc1a 0 22px,#14181f 22px 44px)}
.p-nl-bouw-team .fx::after{bottom:0}.p-nl-bouw-team .fx::before{top:0}
@keyframes glim{to{opacity:.55;transform:scale(1.05)}}
@keyframes val{to{background-position:0 400px,60px 480px,120px 430px}}
@media (prefers-reduced-motion:reduce){.fx{animation:none!important}}
html.nofx .fx{animation:none!important}
@media (min-width:900px){.stage{padding:16px 24px}.poster{max-width:900px}.onder{max-width:640px}}
.bg{background-image:url("assets/affiche.webp")}