:root { --bg:#111; --fg:#eee; --accent:#e63946; }
* { box-sizing: border-box; }
body { margin:0; font:16px/1.6 system-ui, sans-serif; background:var(--bg); color:var(--fg); }
main { max-width: 46rem; margin: 0 auto; padding: 2rem 1rem 4rem; }
.site-head { display:flex; flex-wrap:wrap; gap:1rem; justify-content:space-between;
  align-items:center; padding:1rem; border-bottom:1px solid #333; }
.logo { font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--fg); text-decoration:none; }
nav a { color:var(--fg); text-decoration:none; margin-left:1rem; }
nav a:hover, a:hover { color:var(--accent); }
a { color:var(--accent); }
.hero { padding:3rem 0; }
.hero h1 { font-size:clamp(2rem,7vw,3.5rem); margin:0; }
.events { list-style:none; padding:0; }
.events li { display:grid; gap:.2rem; padding:.9rem 0; border-bottom:1px solid #2a2a2a; }
.events time { font-size:.85rem; text-transform:uppercase; letter-spacing:.05em; opacity:.7; }
.events span { font-size:.9rem; opacity:.7; }
.archive { list-style:none; padding:0; font-size:.95rem; opacity:.85; }
img { max-width:100%; height:auto; }
footer { border-top:1px solid #333; padding:1.5rem 1rem; font-size:.85rem; text-align:center; opacity:.8; }
.logo img { display: block; height: 28px; width: auto; filter: brightness(0) invert(1); }
.hero { display:grid; place-items:center; gap:1rem; text-align:center; padding:3rem 1rem; }
.hero__bg {filter:invert(1); max-width:420px; width:70%; height:auto; }

.year h2 { margin-top: 2.5rem; border-bottom: 1px solid #333; padding-bottom: .3rem; }
.cards { list-style: none; padding: 0; display: grid; gap: 1rem;
  grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); }
.card a { display: flex; flex-direction: column; height: 100%; text-decoration: none;
  color: inherit; background: #1a1a1a; border: 1px solid #2a2a2a; border-radius: 8px; overflow: hidden; }
.card a:hover { border-color: var(--accent); }
.card img { aspect-ratio: 16/9; object-fit: cover; width: 100%; }
.card__body { padding: .8rem; display: grid; gap: .25rem; }
.card__cat { font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; color: var(--accent); }
.card__lineup, .card__meta { font-size: .8rem; opacity: .65; }
.card--festival a { border-color: #444; background: #211d1d; }
.lineup { padding-left: 1.1rem; }
