:root {
    --cream: #f1d4aa;
    --paper: #fffaf0;
    --ink: #0b0b0b;
    --red: #ef1b25;
    --blue: #214c74;
    --mustard: #efb33b;
    --line: 3px solid var(--ink);
    --shadow: 8px 8px 0 var(--ink);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Arial,Helvetica,sans-serif; }
img { display:block; max-width:100%; }
a { color:inherit; }
.site-header {
    position:sticky; top:0; z-index:20; display:flex; align-items:center; justify-content:space-between;
    min-height:68px; padding:10px clamp(16px,4vw,50px); background:rgba(255,250,240,.97); border-bottom:var(--line);
}
.brand { display:inline-flex; align-items:center; gap:12px; text-decoration:none; font-size:clamp(1.55rem,2.2vw,2.15rem); font-weight:900; letter-spacing:-.08em; white-space:nowrap; }
.brand-word { display:inline-block; }
.brand-red,.brand-dot { color:var(--red); }
.brand-symbol { display:flex; align-items:center; gap:5px; flex:0 0 auto; transform:translateY(-1px); }
.brand-triangle { width:0; height:0; display:block; }
.brand-triangle--red-up { border-left:7px solid transparent; border-right:7px solid transparent; border-bottom:12px solid var(--red); }
.brand-triangle--black-tilted { border-left:7px solid transparent; border-right:7px solid transparent; border-top:12px solid var(--ink); transform:rotate(-38deg); }
.brand-triangle--red-down { border-left:7px solid transparent; border-right:7px solid transparent; border-top:12px solid var(--red); }
.menu-toggle { width:43px; height:40px; display:grid; place-content:center; gap:5px; border:2px solid var(--ink); background:var(--red); cursor:pointer; }
.menu-toggle span { width:21px; height:2px; background:var(--ink); }
.main-menu {
    position:absolute; top:calc(100% + 3px); right:clamp(16px,4vw,50px); width:min(250px,calc(100vw - 32px));
    display:none; padding:9px 16px; background:var(--cream); border:2px solid var(--ink); box-shadow:5px 5px 0 var(--ink);
}
.main-menu.is-open { display:grid; }
.main-menu a { padding:11px 2px; text-decoration:none; text-transform:uppercase; font-size:.95rem; letter-spacing:.06em; font-weight:900; border-bottom:1px solid var(--ink); }
.main-menu a:last-child { border-bottom:0; }
.hero { padding:clamp(16px,3vw,42px); background:var(--cream); border-bottom:var(--line); }
.hero img { width:100%; max-height:72vh; object-fit:cover; border:var(--line); box-shadow:var(--shadow); }
.section-wrap { width:min(1180px,calc(100% - 36px)); margin:0 auto; padding:clamp(54px,7vw,90px) 0; }
.section-heading { margin-bottom:28px; }
.section-heading h1,.section-heading h2 { margin:7px 0 0; max-width:980px; font-size:clamp(2.25rem,5.8vw,5.2rem); line-height:.95; letter-spacing:-.055em; text-transform:uppercase; }
.events-section .section-heading h2,.archive-section .section-heading h2 { font-size:clamp(2rem,4.4vw,3.9rem); }
.eyebrow,.event-date,.event-place { text-transform:uppercase; font-weight:900; letter-spacing:.07em; }
.eyebrow { display:inline-block; padding:7px 10px; background:var(--red); border:2px solid var(--ink); font-size:.78rem; }
.featured { border-bottom:var(--line); }
.featured-grid { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr); gap:clamp(28px,5vw,70px); align-items:center; }
.poster-frame { position:relative; min-height:400px; display:grid; place-items:center; padding:18px; margin:0; overflow:hidden; background:var(--cream); border:var(--line); box-shadow:var(--shadow); }
.poster-frame img { width:100%; height:100%; max-height:680px; object-fit:contain; }
.poster-frame--featured { min-height:610px; }
.featured-copy { padding:10px 0; }
.event-date { display:flex; flex-direction:column; gap:4px; margin:0 0 12px; font-size:.88rem; line-height:1.25; }
.event-date--split { gap:8px; font-size:clamp(1.05rem,1.7vw,1.45rem); }
.event-place { color:var(--red); font-size:.9rem; }
.event-description { font-size:clamp(1.12rem,1.8vw,1.55rem); line-height:1.4; }
.button { display:inline-block; margin-top:14px; padding:13px 19px; background:var(--mustard); border:var(--line); box-shadow:5px 5px 0 var(--ink); text-decoration:none; text-transform:uppercase; font-size:.9rem; font-weight:900; }
.button:hover { transform:translate(3px,3px); box-shadow:2px 2px 0 var(--ink); }
.events-section { border-bottom:var(--line); }
.event-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; }
.event-card { display:flex; flex-direction:column; }
.event-card .poster-frame { min-height:400px; box-shadow:6px 6px 0 var(--ink); }
.event-card__body { padding-top:18px; }
.event-card__body h3 { margin:7px 0; font-size:clamp(1.35rem,2vw,2rem); line-height:1.05; text-transform:uppercase; }
.event-card__body p { line-height:1.45; font-size:.96rem; }
.text-link { font-size:.87rem; font-weight:900; text-transform:uppercase; }
.archive-section { padding-bottom:110px; }
.event-card--past { opacity:.95; }
.event-card--past .poster-frame { background:#e7dfd0; }
.status-badge { position:absolute; top:14px; right:14px; padding:6px 9px; background:var(--ink); color:white; text-transform:uppercase; font-size:.7rem; font-weight:900; }
.site-footer { display:flex; justify-content:space-between; gap:30px; padding:40px clamp(18px,4vw,56px); background:var(--ink); color:white; border-top:8px solid var(--red); }
.site-footer strong { font-size:2.15rem; }
@media (max-width:900px) { .featured-grid{grid-template-columns:1fr;} .poster-frame--featured{min-height:520px;} .event-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:620px) {
    .site-header{min-height:62px;} .main-menu{right:14px;} .hero{padding:13px;} .hero img{min-height:240px;object-fit:cover;}
    .section-wrap{width:min(100% - 28px,1180px);padding:52px 0;} .featured-grid{gap:26px;}
    .poster-frame,.poster-frame--featured,.event-card .poster-frame{min-height:380px;padding:10px;}
    .event-grid{grid-template-columns:1fr;} .event-grid--archive{grid-template-columns:1fr 1fr;gap:17px;}
    .event-grid--archive .poster-frame{min-height:250px;} .event-grid--archive .event-card__body p:not(.event-date){display:none;}
    .site-footer{flex-direction:column;}
}

@media (max-width:420px) { .brand { gap:8px; font-size:1.42rem; } .brand-symbol { gap:3px; transform:translateY(-1px) scale(.88); transform-origin:left center; margin-right:-5px; } }
