:root{--navy:#0c2940;--cream:#f3ead8;--red:#d4472f;--ink:#17120d;--gold:#d0a447;--line:#bbaa8d}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit}.topbar{height:86px;padding:0 4.5vw;background:var(--cream);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--ink);position:relative;z-index:20}.wordmark{display:flex;flex-direction:column;font-size:18px;font-weight:900;line-height:.72;letter-spacing:-.05em}.wordmark span{font-family:Georgia,serif;font-style:italic;color:var(--red);font-weight:400}.topbar nav{display:flex;gap:36px;font-size:10px;text-transform:uppercase;letter-spacing:.14em;font-weight:800}.topbar nav a:hover{color:var(--red)}.topMeta{display:flex;gap:25px;font-size:9px;letter-spacing:.13em;font-weight:800}.menu{display:none}.hero{height:calc(100svh - 86px);min-height:660px;position:relative;color:var(--cream);background:linear-gradient(90deg,#17120df5 0%,#17120dc9 42%,#17120d28 78%),url("https://images.ed.nl/MTIyNTdkZmEwNTQxOTM3NDI5NDcvZGlvLzI2MTQ3NjgyOC9maXQtd2lkdGgvODAw/blue-square-festival-is-voor-jong-en-oud") center/cover;overflow:hidden}.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#17120d66,transparent 35%);pointer-events:none}.heroCopy{position:relative;z-index:2;padding:10vh 0 0 8vw}.pretitle,.label{font-size:10px;letter-spacing:.18em;font-weight:900;text-transform:uppercase}.pretitle{display:flex;gap:12px;align-items:center}.pretitle span{width:32px;height:2px;background:var(--red)}h1{margin:3vh 0 0;font-size:clamp(95px,15vw,215px);line-height:.65;letter-spacing:-.095em;text-transform:uppercase}h1 em,h1 strong{display:block}h1 em{font-family:Georgia,serif;font-weight:400;color:var(--red)}h1 strong{margin-left:8vw}.lead{font-family:Georgia,serif;font-size:clamp(17px,1.5vw,24px);line-height:1.5;margin:6vh 0 4vh 8vw}.heroButtons{margin-left:8vw;display:flex;gap:30px;align-items:center}.primary{display:inline-flex;align-items:center;justify-content:space-between;gap:45px;min-width:240px;background:var(--red);color:white;border:1px solid var(--cream);padding:17px 20px;text-transform:uppercase;font-size:10px;letter-spacing:.13em;font-weight:900;box-shadow:5px 5px 0 var(--cream);transition:.18s;cursor:pointer}.primary:hover{transform:translate(3px,3px);box-shadow:2px 2px 0 var(--cream)}.free{font-size:11px;letter-spacing:.12em;font-weight:900;line-height:1.35;transform:rotate(-7deg);border-bottom:2px solid var(--red)}.dateCard{position:absolute;z-index:3;right:5vw;top:7vh;width:180px;background:var(--cream);color:var(--ink);padding:18px;display:grid;grid-template-columns:1fr 25px 1fr;align-items:end;border:1px solid var(--ink);box-shadow:8px 8px 0 var(--red)}.dateCard small,.dateCard span{grid-column:1/-1;font-size:9px;letter-spacing:.15em;font-weight:900}.dateCard b{font-size:54px;letter-spacing:-.08em}.dateCard i{font-family:Georgia,serif;font-size:30px;color:var(--red);align-self:center}.photoCredit{position:absolute;right:4vw;bottom:3vh;z-index:3;font-size:8px;letter-spacing:.18em}.marquee{height:42px;background:var(--red);color:#fff;display:flex;align-items:center;overflow:hidden;white-space:nowrap;font-size:10px;letter-spacing:.22em;font-weight:900}.marquee div{animation:roll 22s linear infinite}@keyframes roll{to{transform:translateX(-50%)}}
.introSection{padding:120px 8vw;display:grid;grid-template-columns:140px 1fr .7fr;gap:6vw;align-items:end}.number{font-size:11px;line-height:1.5;letter-spacing:.18em;border-left:3px solid var(--red);padding-left:15px}.introSection h2,.lineup h2,.weekend h2,.practical h2,.closing h2{font-size:clamp(60px,8vw,118px);line-height:.78;letter-spacing:-.075em;margin:20px 0 0}.introSection h2 em,.lineup h2 em,.weekend h2 em,.practical h2 em,.closing h2 em{font-family:Georgia,serif;font-weight:400;color:var(--red)}.bodyCopy{font-family:Georgia,serif;font-size:18px;line-height:1.65;margin:0}
.lineup{background:var(--navy);color:var(--cream);padding:105px 8vw}.sectionTop{display:flex;justify-content:space-between;align-items:end}.label.light{color:var(--gold)}.lineup h2 em{color:var(--gold)}.filter{display:flex;gap:8px}.filter button{padding:11px 16px;border:1px solid #f3ead888;color:var(--cream);background:transparent;text-transform:uppercase;font-size:9px;letter-spacing:.12em;font-weight:900;cursor:pointer}.filter button.active,.filter button:hover{background:var(--red);border-color:var(--red)}.actList{margin-top:70px;border-top:1px solid #f3ead866}.actList article{display:grid;grid-template-columns:55px 1fr 180px 120px 30px;align-items:center;border-bottom:1px solid #f3ead866;padding:22px 0}.actList article:hover{color:var(--gold);padding-left:14px}.actList span,.actList p,.actList b{font-size:9px;text-transform:uppercase;letter-spacing:.13em}.actList h3{font-size:clamp(25px,3vw,46px);letter-spacing:-.055em;margin:0}.actList p,.actList b{margin:0}.actList i{font-size:22px}.programNote{font-family:Georgia,serif;font-style:italic;font-size:13px;margin:24px 0 0;color:#f3ead8aa}
.weekend{display:grid;grid-template-columns:.82fr 1.18fr;min-height:780px}.poster{background:var(--red);padding:6vw;display:grid;place-items:center;overflow:hidden}.poster img{width:100%;max-width:530px;aspect-ratio:1;object-fit:cover;filter:sepia(.25) contrast(1.05);box-shadow:15px 15px 0 var(--ink);transform:rotate(-2deg)}.weekendCopy{padding:105px 6vw}.dayCards{margin-top:70px;border-top:1px solid var(--ink)}.dayCards article{display:grid;grid-template-columns:80px 90px 1fr;gap:25px;padding:28px 0;border-bottom:1px solid var(--ink);align-items:start}.dayCards b{font-size:36px;color:var(--red)}.dayCards span{font-size:10px;letter-spacing:.13em;font-weight:900;padding-top:12px}.dayCards p{font-family:Georgia,serif;line-height:1.55;margin:5px 0 0}
.practical{padding:110px 8vw;background:#ddcfb8}.practicalHead{display:grid;grid-template-columns:240px 1fr}.location{display:flex;justify-content:space-between;align-items:end;margin:70px 0 50px;padding:30px 0;border-top:3px solid var(--ink);border-bottom:1px solid var(--ink)}.location p{font-size:24px;font-weight:900;line-height:1.25}.primary.outline{background:transparent;color:var(--ink);border-color:var(--ink);box-shadow:5px 5px 0 var(--ink)}.faq{margin-left:30%;border-top:1px solid var(--ink)}.faq article{border-bottom:1px solid var(--ink)}.faq button{width:100%;display:grid;grid-template-columns:50px 1fr 30px;text-align:left;align-items:center;padding:23px 0;background:transparent;border:0;cursor:pointer}.faq button span{font-size:9px}.faq button b{font-size:18px}.faq button i{font-size:25px}.faq article>p{font-family:Georgia,serif;font-size:16px;line-height:1.6;margin:0;padding:0 40px 25px 50px;max-width:760px}
.closing{background:var(--red);color:#fff;padding:100px 8vw;position:relative;overflow:hidden}.closing:after{content:"B";position:absolute;right:-3vw;bottom:-16vw;font-family:Georgia,serif;font-size:48vw;line-height:1;color:#ffffff0d}.closing>p{font-size:10px;letter-spacing:.18em;font-weight:900}.closing h2{font-size:clamp(70px,11vw,160px);position:relative;z-index:2}.closing h2 em{color:var(--cream)}.closing .primary{margin-top:50px;background:var(--navy);position:relative;z-index:2}footer{padding:50px 8vw;display:flex;align-items:center;justify-content:space-between;background:var(--ink);color:var(--cream)}footer p,footer div{font-size:9px;line-height:1.6;letter-spacing:.12em;text-transform:uppercase}footer div{display:flex;gap:25px}
@media(max-width:900px){.topbar nav{display:none}.topbar nav.open{display:flex;position:absolute;top:86px;left:0;right:0;background:var(--cream);flex-direction:column;padding:30px;border-bottom:1px solid var(--ink)}.menu{display:flex;flex-direction:column;gap:5px;border:0;background:transparent}.menu i{width:22px;height:2px;background:var(--ink)}.topMeta{display:none}.heroCopy{padding-left:5vw}.introSection{grid-template-columns:100px 1fr}.bodyCopy{grid-column:2}.weekend{grid-template-columns:1fr}.poster{padding:12vw}.practicalHead{grid-template-columns:1fr}.practicalHead .label{margin-bottom:25px}.faq{margin-left:0}}
@media(max-width:650px){.topbar{height:70px;padding:0 20px}.topbar nav.open{top:70px}.hero{height:auto;min-height:780px;background-position:62% center}.heroCopy{padding:80px 20px 0}h1{font-size:24vw;line-height:.68}h1 strong{margin-left:0}.lead,.heroButtons{margin-left:0}.lead{margin-top:70px}.heroButtons{align-items:flex-start;flex-direction:column}.dateCard{top:auto;bottom:65px;right:20px;width:155px}.dateCard b{font-size:43px}.photoCredit{display:none}.introSection{padding:80px 20px;display:block}.number{margin-bottom:45px}.introSection h2,.lineup h2,.weekend h2,.practical h2{font-size:55px}.bodyCopy{margin-top:40px}.lineup{padding:80px 20px}.sectionTop{display:block}.filter{margin-top:45px;overflow:auto}.actList{margin-top:35px}.actList article{grid-template-columns:30px 1fr 25px;padding:18px 0}.actList p,.actList b{display:none}.actList h3{font-size:24px}.weekendCopy{padding:80px 20px}.dayCards article{grid-template-columns:55px 65px 1fr;gap:10px}.practical{padding:80px 20px}.location{align-items:flex-start;flex-direction:column}.location .primary{margin-top:25px}.faq button{grid-template-columns:35px 1fr 25px}.faq article>p{padding-left:35px;padding-right:10px}.closing{padding:80px 20px}.closing h2{font-size:65px}footer{padding:45px 20px;align-items:flex-start;flex-direction:column;gap:35px}.marquee div{animation-duration:16s}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.marquee div{animation:none}.primary{transition:none}}

/* 1960s soul record-sleeve layer */
:root{--navy:#29201b;--cream:#f5dfb8;--red:#d94b27;--ink:#241711;--gold:#e8ab2e;--line:#b58d60}
body{background-color:var(--cream);background-image:radial-gradient(#6f3e2412 1px,transparent 1px);background-size:5px 5px}
.topbar{background:#f5dfb8}.wordmark{font-family:"Arial Black",Arial,sans-serif;font-size:20px;transform:skew(-4deg)}.wordmark span{font-family:Georgia,serif;color:var(--red)}.topbar nav a{position:relative}.topbar nav a:after{content:"";position:absolute;left:0;right:100%;bottom:-7px;height:3px;background:var(--gold);transition:.2s}.topbar nav a:hover:after{right:0}
.hero{background:linear-gradient(90deg,#241711f2 0%,#241711c2 44%,#24171125 80%),url("https://images.ed.nl/MTIyNTdkZmEwNTQxOTM3NDI5NDcvZGlvLzI2MTQ3NjgyOC9maXQtd2lkdGgvODAw/blue-square-festival-is-voor-jong-en-oud") center/cover}.hero:before{content:"";position:absolute;width:38vw;height:38vw;border:9vw solid #e8ab2e22;border-radius:50%;right:-5vw;top:-7vw;z-index:1}.heroCopy h1{font-family:"Arial Black",Arial,sans-serif;transform:rotate(-1.5deg)}h1 em{font-family:Georgia,serif;color:var(--gold);text-shadow:5px 5px 0 var(--red)}h1 strong{letter-spacing:-.11em}.lead{font-size:clamp(19px,1.65vw,27px);color:#fff0d2}.primary{border:0;border-radius:999px;background:var(--red);box-shadow:5px 5px 0 var(--gold);padding-left:27px;padding-right:27px}.primary:hover{box-shadow:2px 2px 0 var(--gold)}.free{border:2px solid var(--gold);border-radius:50%;padding:13px 16px;background:var(--ink);color:var(--cream)}.dateCard{border-radius:50% 50% 45% 45%;width:205px;padding:28px 22px 22px;background:var(--gold);transform:rotate(4deg);box-shadow:9px 9px 0 var(--red);border:3px solid var(--ink)}.dateCard small,.dateCard span{text-align:center}.dateCard b{font-family:"Arial Black",Arial,sans-serif}.dateCard i{color:var(--red)}.marquee{background:var(--gold);color:var(--ink);height:50px;border-top:4px solid var(--ink);border-bottom:4px solid var(--ink)}
.introSection{position:relative;overflow:hidden}.introSection:after{content:"45";position:absolute;right:-3vw;top:20px;width:260px;height:260px;background:var(--ink);color:var(--cream);border:26px solid #3a2a22;border-radius:50%;display:grid;place-items:center;font:bold 74px Georgia,serif;z-index:-1;opacity:.1}.introSection h2,.lineup h2,.weekend h2,.practical h2,.closing h2{font-family:"Arial Black",Arial,sans-serif;letter-spacing:-.08em}.introSection h2 em,.lineup h2 em,.weekend h2 em,.practical h2 em,.closing h2 em{font-family:Georgia,serif;font-style:italic}.number{border-left:0;background:var(--red);color:#fff;border-radius:50%;width:84px;height:84px;display:grid;place-items:center;text-align:center;padding:0;transform:rotate(-8deg)}
.lineup{background:#2c211b;position:relative;overflow:hidden}.lineup:before{content:"";position:absolute;width:480px;height:480px;border-radius:50%;background:repeating-radial-gradient(circle,#3e3028 0 9px,#17100d 10px 15px);right:-220px;top:110px;opacity:.65}.label.light,.lineup h2 em{color:var(--gold)}.filter{position:relative;z-index:2}.filter button{border-radius:999px;border:2px solid var(--cream)}.filter button.active,.filter button:hover{background:var(--gold);border-color:var(--gold);color:var(--ink)}.actList{position:relative;z-index:2}.actList article{transition:.18s}.actList article:hover{background:var(--red);color:#fff;padding-left:18px;padding-right:18px}.actList h3{font-family:"Arial Black",Arial,sans-serif}.actList span{display:grid;place-items:center;width:30px;height:30px;background:var(--gold);color:var(--ink);border-radius:50%}
.poster{background:var(--gold)}.poster img{border-radius:50% 50% 8px 8px;box-shadow:18px 18px 0 var(--red);filter:sepia(.5) saturate(.8) contrast(1.08)}.dayCards b{font-family:"Arial Black",Arial,sans-serif;color:var(--red)}.dayCards article:hover{background:#e8ab2e33;padding-left:12px}.practical{background:#e7c98e}.faq button i{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--red);color:#fff}.closing{background:var(--red)}.closing:before{content:"";position:absolute;right:4vw;top:50%;width:310px;height:310px;transform:translateY(-50%);border-radius:50%;background:repeating-radial-gradient(circle,#2c211b 0 8px,#17100d 9px 14px);box-shadow:0 0 0 18px var(--gold)}.closing:after{content:"SOUL";right:-1vw;bottom:-7vw;font-family:"Arial Black",Arial,sans-serif;font-size:24vw}.closing .primary{background:var(--ink)}footer{background:#241711}
@media(max-width:650px){.dateCard{width:165px}.hero:before{width:80vw;height:80vw;border-width:18vw}.closing:before{width:180px;height:180px;right:-70px;top:30%}.introSection:after{width:170px;height:170px;right:-80px}.number{margin-bottom:45px}}

/* Tighter concert photography: stage energy, no market-square feel */
.hero{background:linear-gradient(90deg,#241711f5 0%,#241711c4 42%,#24171119 78%),linear-gradient(0deg,#d94b2730,#e8ab2e18),url("https://storage.pubble.nl/96897487/content/2023/3/6899a2bc-961a-4658-b28b-9405b8b0745e_thumb1920.jpg") center 28%/cover}

/* Full two-stage timetable */
.actList article{grid-template-columns:90px 1fr 230px 110px 30px}
.actList article>span{width:auto;height:auto;border-radius:999px;padding:8px 10px;font-family:"Arial Black",Arial,sans-serif;font-size:13px}
.actList article.curfew{opacity:.52}.actList article.curfew h3{font-family:Arial,sans-serif;font-size:18px;letter-spacing:.12em}.actList article.curfew>span{background:transparent;color:var(--cream);border:1px solid #f5dfb877}
.actList article>p{text-align:left}
@media(max-width:650px){.actList article{grid-template-columns:66px 1fr 24px}.actList article>span{font-size:11px}.actList article>p,.actList article>b{display:none}.lineup h2{font-size:49px}}

/* Standalone asset paths */
.hero{background:linear-gradient(90deg,#241711f5 0%,#241711c4 42%,#24171119 78%),linear-gradient(0deg,#d94b2730,#e8ab2e18),url("assets/hero.jpg") center 28%/cover}
[hidden]{display:none!important}
.posterCard{position:relative;width:min(100%,530px);aspect-ratio:1;box-sizing:border-box;padding:clamp(30px,5vw,64px);display:flex;flex-direction:column;justify-content:center;background:var(--ink);color:var(--cream);border-radius:50% 50% 8px 8px;box-shadow:18px 18px 0 var(--red);transform:rotate(-2deg);overflow:hidden}.posterCard:before{content:"";position:absolute;width:58%;aspect-ratio:1;border:clamp(18px,3vw,34px) solid var(--red);border-radius:50%;right:-18%;top:-12%;opacity:.9}.posterCard:after{content:"♪";position:absolute;right:8%;bottom:7%;font-size:clamp(70px,10vw,150px);line-height:1;color:var(--gold);transform:rotate(8deg)}.posterCard>*{position:relative;z-index:1}.posterKicker,.posterDates,.posterSound{font-size:clamp(10px,1.05vw,15px);font-weight:900;letter-spacing:.16em}.posterCard strong{margin:clamp(25px,4vw,48px) 0;font-family:"Arial Black",Arial,sans-serif;font-size:clamp(38px,5.3vw,76px);line-height:.84;letter-spacing:-.06em}.posterCard strong em{color:var(--gold);font-style:normal}.posterDates{font-size:clamp(16px,1.6vw,24px);color:var(--gold)}.posterSound{max-width:62%;margin-top:14px;line-height:1.6}
