:root{--red:#a3131b;--red2:#d12832;--gold:#f4c65d;--cream:#fff9ed;--ink:#211b18;--green:#173d2b}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:var(--cream);line-height:1.6}
a{color:inherit}.top{background:#5e0910;color:#fff;text-align:center;padding:8px 16px;font-weight:700}.top a{color:#fff;text-decoration:none;margin:0 8px}
header{background:linear-gradient(135deg,#8f0e17,#c51c27);color:#fff;position:sticky;top:0;z-index:20;box-shadow:0 3px 12px #0003}
.nav{max-width:1180px;margin:auto;padding:12px 18px;display:flex;gap:16px;align-items:center;justify-content:space-between}.brand{font-size:22px;font-weight:900;text-decoration:none}
nav{display:flex;flex-wrap:wrap;gap:8px}nav a{padding:8px 10px;text-decoration:none;border-radius:999px}nav a:hover{background:#ffffff22}
.hero{background:linear-gradient(#0003,#0005),url('images/kerstfeest-header.png') center/cover;min-height:540px;display:grid;place-items:center;text-align:center;color:#fff;padding:50px 18px}
.hero .inner{max-width:850px}.hero h1{font-size:clamp(38px,7vw,72px);line-height:1.02;margin:0 0 16px;text-shadow:0 3px 12px #000}.hero p{font-size:clamp(18px,2.3vw,25px)}
.btn{display:inline-block;background:var(--gold);color:#301b00;text-decoration:none;font-weight:900;padding:14px 22px;border-radius:999px;margin:6px;box-shadow:0 4px 12px #0003}
.btn.red{background:#fff;color:var(--red)}
main{max-width:1120px;margin:auto;padding:44px 18px}section{margin:0 0 55px}h1,h2,h3{line-height:1.15}h2{font-size:clamp(30px,4vw,45px);color:var(--red);margin-bottom:12px}
.lead{font-size:20px;max-width:850px}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px}
.card{background:#fff;padding:24px;border-radius:18px;box-shadow:0 7px 24px #5b291216;border:1px solid #ecd9c4}.card h3{color:var(--red)}
.gallery img{width:100%;height:270px;object-fit:cover;border-radius:15px;display:block}.gallery a{display:block}
.contact{background:linear-gradient(135deg,#173d2b,#0b2518);color:#fff;padding:34px;border-radius:22px;text-align:center}.contact h2{color:#fff}.contact a{color:#fff}
audio{width:100%;margin-top:8px}video{width:100%;max-width:850px;border-radius:18px;background:#000}
footer{background:#351014;color:#fff;text-align:center;padding:30px 18px}
@media(max-width:780px){header{position:static}.nav{display:block;text-align:center}.brand{display:block;margin-bottom:8px}nav{justify-content:center}.hero{min-height:440px}}