/* Mobile first: the base layout is designed for narrow screens. */
:root { --cream:#faf5e9; --green:#153e31; --red:#a91524; --gold:#f6d36b; --muted:#58675d; --line:#dcded0; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:100px; }
body { margin:0; background:var(--cream); color:var(--green); font-family:'DM Sans',sans-serif; font-size:16px; line-height:1.75; }
a { color:inherit; text-decoration:none; }
button { font:inherit; cursor:pointer; }
img { max-width:100%; height:auto; display:block; }
svg { width:24px; height:24px; flex-shrink:0; }
p { margin:0 0 1.25em; }
h1,h2,h3 { font-family:'Playfair Display',Georgia,serif; line-height:1.14; font-weight:500; letter-spacing:-.045em; margin:0 0 .55em; text-wrap:balance; }
h1 { font-size:clamp(36px,10vw,49px); }
h2 { font-size:34px; }
h3 { font-size:28px; }
em { font-weight:500; color:var(--red); }
.wrap { width:min(1240px,calc(100% - 40px)); margin-inline:auto; }
.announcement { background:var(--green); color:var(--gold); text-align:center; padding:8px 10px; letter-spacing:.06em; text-transform:uppercase; font-size:9px; font-weight:600; display:flex; align-items:center; justify-content:center; gap:10px; }
.announcement svg { display:none; }
.announcement span { color:#c29453; }
header { background:rgba(250,245,233,.98); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:20; }
.header-inner { display:flex; align-items:center; gap:10px; min-height:80px; position:relative; }
.brand { display:flex; align-items:center; gap:12px; font-size:11px; line-height:1.15; font-weight:500; min-height:44px; }
.brand strong { display:block; font-family:'Playfair Display',Georgia,serif; font-size:22px; font-weight:600; letter-spacing:-1px; }
.brand-dot { color:var(--red); }
.brand-icon { display:none; }
.brand-charity { display:block; color:var(--red); font-size:8px; text-transform:uppercase; letter-spacing:.09em; margin:3px 0; }
.menu-toggle { display:flex; align-items:center; justify-content:center; background:transparent; border:1px solid #c9ccbd; border-radius:4px; width:44px; height:44px; margin-left:auto; font-size:0; order:3; flex-shrink:0; color:var(--green); }
.menu-toggle span { font-size:22px; }
nav { display:none; position:absolute; top:100%; left:-20px; right:-20px; background:var(--cream); padding:16px 20px 22px; border-bottom:1px solid var(--line); box-shadow:0 14px 22px #153e3114; font-size:16px; }
nav.is-open { display:grid; gap:2px; }
nav a { min-height:48px; display:flex; align-items:center; padding:10px 14px; border-radius:4px; }
nav a[aria-current] { color:var(--red); background:#a915240c; }
.header-help { display:flex; align-items:center; justify-content:center; gap:8px; background:var(--red); color:white; border-radius:4px; min-height:44px; padding:10px 12px; font-size:11px; font-weight:700; margin-left:auto; white-space:nowrap; }
.header-help svg { width:15px; height:15px; }
.hero { display:grid; gap:40px; padding-block:34px 65px; }
.hero-copy { min-width:0; }
.eyebrow { text-transform:uppercase; letter-spacing:.13em; font-size:10px; font-weight:700; margin-bottom:18px; display:flex; align-items:center; gap:10px; }
.dot { height:6px; width:6px; background:var(--red); border-radius:50%; flex-shrink:0; }
.hero h1 { margin-bottom:22px; font-size:clamp(38px,11vw,58px); line-height:1.12; }
.hero-title>span { display:block; }
.hero-title .title-highlight { display:table; position:relative; isolation:isolate; font-size:.72em; font-style:italic; line-height:1.35; color:var(--gold); letter-spacing:-.025em; padding:1px 15px 5px; margin:9px 0 8px; }
.title-highlight:before { content:''; position:absolute; inset:0 -2px; z-index:-1; background:var(--red); transform:rotate(-2deg); clip-path:polygon(1% 8%,98% 0,100% 86%,3% 100%,0 63%); }
.hero .lead { font-size:18px; font-weight:600; margin-bottom:12px; color:var(--green); }
.lead { font-size:17px; color:var(--muted); max-width:650px; line-height:1.7; }
.hero-description { color:var(--muted); font-size:15px; max-width:460px; }
.actions { display:flex; flex-wrap:wrap; gap:15px; align-items:center; margin-top:24px; }
.button { display:inline-flex; align-items:center; justify-content:space-between; min-height:48px; gap:20px; padding:13px 20px; font-size:14px; font-weight:600; border-radius:4px; transition:background .2s,transform .2s; }
.button.primary { color:white; background:var(--red); }
.button.text { padding:12px 0; border-bottom:1px solid #9eaa95; border-radius:0; }
.button.light { background:#f6edda; color:var(--green); }
.hero-note { display:flex; gap:14px; align-items:center; border-top:1px solid var(--line); margin-top:26px; padding-top:20px; }
.hero-note svg { color:var(--red); width:30px; height:30px; }
.hero-note p { font-size:12px; color:var(--muted); margin:0; }
.hero-note strong { color:var(--green); font-size:13px; }
.hero-art { position:relative; isolation:isolate; display:flex; justify-content:center; width:100%; max-width:340px; justify-self:center; padding-inline:20px; margin-bottom:16px; }
.hero-art:before { content:''; position:absolute; inset:5% 0 6%; background:#e4e6d2; border-radius:50% 50% 45% 40%; z-index:-1; }
.poster-frame { width:235px; transform:rotate(3deg); padding:7px; background:white; box-shadow:0 20px 45px #273e3226; }
.poster-frame img { width:100%; border-radius:1px; }
.poster-link { display:block; }
.poster-link:focus-visible { outline-offset:10px; }
.round-stamp { position:absolute; bottom:25px; left:0; width:108px; height:108px; background:var(--green); color:#f8edd6; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-direction:column; font-size:9px; line-height:1.6; transform:rotate(-10deg); box-shadow:0 0 0 5px var(--cream); pointer-events:none; }
.round-stamp strong { font-family:'Playfair Display',Georgia,serif; font-size:18px; font-weight:500; line-height:1.1; text-align:center; margin:4px; }
.round-stamp svg { height:15px; width:15px; color:var(--gold); }
.art-label { position:absolute; bottom:-34px; right:10px; font-size:10px; color:var(--muted); min-height:24px; }
.facts { border-block:1px solid var(--line); background:#eeefdf; }
.facts-grid { display:grid; padding-block:12px; }
.facts-grid>div { display:flex; flex-direction:column; padding-block:16px; border-bottom:1px solid #d2d7c4; }
.facts-grid>div:last-child { border:0; }
.facts span,.facts small { font-size:12px; color:var(--muted); }
.facts span { text-transform:uppercase; letter-spacing:.1em; font-size:10px; margin-bottom:5px; }
.facts strong { font-family:'Playfair Display',Georgia,serif; font-size:25px; font-weight:500; }
.section { padding-block:55px; }
.split,.gallery-teaser,.story,.contact-grid,.donate-grid { display:grid; gap:28px; }
.split p:not(.eyebrow),.gallery-teaser p:not(.eyebrow),.story article p:not(.eyebrow) { font-size:16px; color:var(--muted); }
.program { background:var(--green); color:var(--cream); }
.program .eyebrow { color:var(--gold); }
.section-top { margin-bottom:25px; }
.section-top>p { color:#c4d1c4; font-size:14px; }
.schedule { border-top:1px solid #ffffff30; }
.schedule>div { display:grid; grid-template-columns:72px 1fr; gap:4px 12px; align-items:center; border-bottom:1px solid #ffffff30; padding:18px 0; }
.schedule time { font-size:28px; color:var(--gold); font-family:'Playfair Display',Georgia,serif; grid-row:span 2; }
.schedule span { font-size:17px; }
.schedule small { color:#c3cec5; font-size:12px; grid-column:2; }
.music { display:grid; gap:15px; margin-top:30px; }
.music p { margin:0; font-size:13px; }
.music .eyebrow { font-size:10px; }
.music h3 { font-size:30px; margin-bottom:12px; }
.music h3 span { color:var(--gold); margin-inline:6px; }
.tombola { border:1px solid #ffffff50; padding:8px 16px; border-radius:100px; font-size:12px; justify-self:start; }
.gallery-empty { background:#e9ebdf; min-height:250px; border:1px solid #d4d8c8; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:10px; border-radius:50% 50% 3px 3px; padding:30px 15px; text-align:center; }
.gallery-empty strong { font-family:'Playfair Display',Georgia,serif; font-size:27px; font-weight:500; }
.gallery-empty>span:last-child { font-size:12px; color:var(--muted); }
.line-art { font-size:60px; line-height:1; color:#798768; }
.cta { background:#e8e6d5; padding:30px 24px; display:grid; gap:24px; border-radius:5px; margin-block:25px 45px; }
.cta h2 { font-size:31px; }
.cta .eyebrow { margin-bottom:14px; }
.cta p:last-child { font-size:14px; color:var(--muted); margin:0; }
.cta .button { justify-self:start; }
footer { padding-bottom:25px; }
.footer-top { display:flex; flex-wrap:wrap; gap:24px; align-items:start; padding-block:15px 30px; }
.footer-top .brand { width:100%; }
.footer-top .brand>svg { width:35px; height:35px; color:var(--red); }
.footer-top>p,.footer-top>a:last-child { font-size:13px; color:var(--muted); margin:0; }
.footer-top strong { color:var(--green); }
.footer-bottom { display:grid; gap:10px; border-top:1px solid var(--line); padding-top:20px; font-size:11px; color:var(--muted); }
.footer-bottom a { min-height:44px; display:flex; align-items:center; }
.page-intro { padding-block:40px 30px; border-bottom:1px solid var(--line); }
.page-intro h1 { font-size:clamp(35px,9vw,48px); }
.page-intro .lead { font-size:16px; }
.page-intro .eyebrow { color:var(--red); }
.story figure { margin:0; }
.story img { width:100%; max-height:400px; object-fit:cover; border-radius:4px 4px 65px 4px; }
.story figcaption { font-size:11px; color:var(--muted); margin-top:12px; }
.source { font-size:13px!important; line-height:1.7; }
.support-strip { border-block:1px solid var(--line); padding-block:30px; margin-bottom:45px; }
.support-strip>div { display:grid; gap:12px; }
.support-strip h3 { font-size:26px; margin-bottom:10px; }
.gallery-section { padding-block:45px 65px; }
.gallery-header { display:grid; gap:16px; margin-bottom:25px; }
.gallery-header h2 { font-size:30px; margin:0; }
.tag { border:1px solid #bac2ae; padding:6px 14px; border-radius:30px; font-size:11px; width:fit-content; }
.gallery-placeholder { text-align:center; background:#e9ebdf; border:1px solid #d5d9cc; padding:55px 20px; }
.gallery-placeholder .line-art { display:block; margin-bottom:22px; }
.gallery-placeholder h3 { font-size:30px; }
.gallery-placeholder p { font-size:15px; color:var(--muted); }
.photo-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.photo-grid figure { margin:0; }
.photo-button { border:0; padding:0; background:none; width:100%; display:block; }
.photo-grid img { aspect-ratio:4/3; object-fit:cover; width:100%; cursor:zoom-in; border-radius:4px; }
.photo-grid figcaption { font-size:13px; margin-top:8px; }
.partner-placeholder { border:1px dashed #a0ae91; text-align:center; padding:35px 20px; margin-bottom:45px; }
.partner-placeholder .eyebrow { justify-content:center; }
.partner-placeholder p { font-size:15px; color:var(--muted); }
.contact-card,.venue-card { padding:30px 24px; background:#edeee3; border-radius:5px; }
.venue-card { background:#ede4d4; }
.contact-card p,.venue-card p { font-size:15px; color:var(--muted); }
.big-phone { font-size:clamp(23px,6.8vw,30px); font-weight:600; display:block; margin-block:20px; color:var(--red); min-height:48px; }
hr { border:0; border-top:1px solid #aab19e70; margin-block:30px; }
.organizer { margin-bottom:40px; }
.organizer .eyebrow { margin-bottom:10px; }
.donate-main>p { font-size:16px; color:var(--muted); }
.donate-main .source { margin-top:20px; }
.qr-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:30px; }
.qr-pair figure { margin:0; background:white; border:1px solid var(--line); text-align:center; padding:9px; }
.qr-pair img { margin:auto; width:180px; }
.qr-pair figcaption { font-size:12px; font-weight:600; }
.qr-pair a { font-size:12px; text-decoration:underline; color:var(--red); min-height:44px; display:flex; justify-content:center; align-items:center; }
.qr-note { font-size:13px!important; margin-top:16px; }
.donate-aside { padding:30px; background:var(--green); color:var(--cream); border-radius:5px; align-self:start; }
.donate-aside h2 { font-size:34px; }
.donate-aside p { font-size:15px; color:#c8d2c7; }
.donate-aside .eyebrow { color:var(--gold); font-size:10px; }
.skip { position:fixed; top:-100px; z-index:100; background:white; padding:10px; }
.skip:focus { top:0; }
a:focus-visible,button:focus-visible { outline:3px solid #c79528; outline-offset:5px; }
.lightbox { border:0; background:var(--cream); padding:50px 20px 20px; max-width:94vw; max-height:92dvh; }
.lightbox::backdrop { background:#102a25df; }
.lightbox img { max-height:72dvh; object-fit:contain; }
.lightbox button { position:absolute; right:5px; top:2px; border:0; background:none; width:44px; height:44px; font-size:28px; }
.lightbox-open { overflow:hidden; }
a,button { -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
[hidden] { display:none!important; }
@media (min-width:600px) {
 h2 { font-size:40px; }
 .hero { grid-template-columns:1.15fr 1fr; align-items:center; gap:30px; padding-block:50px 65px; }
 .hero h1 { font-size:clamp(42px,6.8vw,65px); }
 .hero-art { max-width:none; }
 .poster-frame { width:240px; }
 .round-stamp { left:-10px; }
 .facts-grid { grid-template-columns:1fr 1.4fr 1fr; padding-block:28px; }
 .facts-grid>div { padding:0 18px; border:0; border-left:1px solid #cdd2c4; }
 .facts-grid>div:first-child { padding-left:0; border:0; }
 .facts-grid>div:last-child { border-left:1px solid #cdd2c4; }
 .facts strong { font-size:21px; }
 .section { padding-block:70px; }
 .split,.gallery-teaser,.contact-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:40px; }
 .section-top,.gallery-header { display:flex; justify-content:space-between; align-items:center; gap:25px; }
 .schedule>div { grid-template-columns:100px 1fr 1fr; gap:20px; padding-block:22px; }
 .schedule time { grid-row:auto; font-size:32px; }
 .schedule small { grid-column:auto; text-align:right; }
 .music { grid-template-columns:1fr 2fr; gap:25px; }
 .music .tombola { grid-column:2; }
 .cta { padding:40px; grid-template-columns:1fr auto; align-items:center; margin-bottom:65px; }
 .cta h2 { font-size:36px; }
 .footer-top { flex-wrap:nowrap; justify-content:space-between; align-items:center; }
 .footer-top .brand { width:auto; }
 .footer-bottom { display:flex; justify-content:space-between; align-items:center; }
 .page-intro { padding-block:60px 40px; }
 .page-intro h1 { font-size:60px; }
 .support-strip>div { display:flex; justify-content:space-between; gap:20px; }
 .support-strip h3 { font-size:23px; }
 .gallery-placeholder { padding:70px 30px; }
 .gallery-placeholder h3 { font-size:35px; }
 .photo-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
 .qr-pair { gap:20px; }
 .qr-pair figure { padding:15px; }
 .lightbox { padding:50px 35px 30px; }
}
@media (min-width:1000px) {
 .wrap { width:min(1240px,calc(100% - 96px)); }
 .header-inner { gap:24px; min-height:104px; }
 .brand-icon { border:1px solid var(--green); width:40px; height:46px; border-radius:45% 45% 12px 12px; display:grid; place-items:center; }
 .brand strong { font-size:25px; }
 .brand-charity { font-size:9px; }
 .menu-toggle { display:none; }
 nav { display:flex; gap:15px; position:static; padding:0; border:0; box-shadow:none; margin-left:auto; font-size:12px; }
 nav a { padding:10px 0; border-radius:0; position:relative; }
 nav a[aria-current] { background:none; }
 nav a[aria-current]:after { content:''; height:2px; background:var(--red); position:absolute; bottom:3px; left:0; right:0; }
 .header-help { margin-left:0; padding-inline:18px; font-size:12px; }
 .hero { grid-template-columns:1.2fr 1fr; gap:70px; padding-block:65px 80px; }
 .hero h1 { font-size:clamp(64px,6.6vw,90px); }
 .hero .lead { font-size:21px; }
 .hero-description { font-size:16px; }
 .hero-note { max-width:440px; margin-top:32px; padding-top:24px; }
 .hero-art { padding-inline:35px; }
 .poster-frame { width:310px; padding:9px; }
 .round-stamp { width:132px; height:132px; left:-15px; font-size:10px; }
 .round-stamp strong { font-size:22px; }
 .art-label { right:35px; }
 .facts strong { font-size:24px; }
 .facts-grid>div { padding-left:34px; }
 .section { padding-block:90px; }
 h2 { font-size:48px; }
 .split { gap:90px; }
 .gallery-teaser { gap:75px; }
 .music { grid-template-columns:1fr 2fr auto; margin-top:40px; }
 .music .tombola { grid-column:auto; }
 .music h3 { font-size:33px; }
 .gallery-empty { min-height:300px; }
 .page-intro { padding-top:80px; }
 .page-intro h1 { font-size:68px; }
 .story { grid-template-columns:.9fr 1.1fr; gap:70px; }
 .story figure { position:sticky; top:135px; }
 .story img { max-height:530px; }
 .support-strip { margin-bottom:70px; }
 .support-strip h3 { font-size:27px; }
 .contact-card,.venue-card { padding:45px; }
 .organizer { margin-top:-35px; margin-bottom:65px; }
 .donate-grid { grid-template-columns:1.3fr 1fr; gap:60px; }
 .donate-aside { padding:40px; }
}
@media (hover:hover) {
 .button:hover,.header-help:hover { transform:translateY(-2px); }
 nav a:hover,.button.text:hover,.footer-bottom a:hover { color:var(--red); }
 .button.primary:hover,.header-help:hover { background:#86121e; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { transition:none!important; } }

/* Approved red cauldron / yellow lettering logo on contrasting evergreen. */
header { background:#153e31; color:var(--cream); border-bottom-color:#ffffff20; }
.header-inner { min-height:94px; gap:10px; }
.brand { flex-shrink:0; }
.brand-logo { display:block; width:clamp(108px,35vw,160px); height:auto; }
.menu-toggle { margin-left:0; border-color:#ffffff65; color:var(--cream); }
nav { color:var(--cream); background:#153e31; border-color:#ffffff30; }
nav a[aria-current] { color:var(--gold); background:#ffffff10; }
.header-help { padding-inline:10px; font-size:11px; }
.footer-top { background:#153e31; color:var(--cream); border-radius:6px; padding:28px 22px; margin-bottom:24px; }
.footer-top .brand-logo { width:200px; }
.footer-top>p,.footer-top>a:last-child { color:#d4ddce; }
.footer-top strong { color:var(--gold); }
@media (min-width:600px) {
 .header-inner { min-height:108px; }
 .brand-logo { width:190px; }
 .footer-top { padding:32px; gap:30px; }
 .footer-top .brand-logo { width:210px; }
}
@media (min-width:1000px) {
 .header-inner { min-height:125px; gap:22px; }
 .brand-logo { width:215px; }
 nav { gap:15px; }
 nav a[aria-current] { color:var(--gold); background:none; }
 nav a[aria-current]:after { background:var(--gold); }
 .header-help { padding-inline:18px; font-size:12px; }
}
@media (hover:hover) { nav a:hover { color:var(--gold); } }
@media (max-width:359px) {
 .header-help { font-size:10px; padding-inline:8px; }
 .header-help svg { display:none; }
}
