/* Events listing + additions to the event page. Builds on event-styles.css tokens. */
.topnav { display:flex; align-items:center; gap:22px; font-size:12px; font-weight:700; color:#bbb8b0; }
.topnav > a:not(.quiet-button):hover { color:var(--white); }

.ev-hero { padding:56px 4px 28px; }
.ev-hero h1 { font-size:clamp(44px,7vw,84px); }
.ev-lede { max-width:620px; margin:22px 0 0; color:var(--muted); font-size:15px; line-height:1.7; }
.ev-inline-button { display:inline-flex; padding:0 28px; margin-top:30px; }

.ev-filters { position:sticky; top:0; z-index:5; display:flex; justify-content:space-between; gap:12px; padding:14px 0; margin-bottom:12px; background:rgba(5,5,5,.92); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-bottom:1px solid var(--line); }
.chips,.toggles { display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; min-width:0; }
.chips { flex:1 1 auto; }
.toggles { flex:none; }
.chips::-webkit-scrollbar { display:none; }
.chip { flex:none; display:inline-flex; align-items:center; gap:7px; padding:9px 15px; border:1px solid var(--line); border-radius:999px; background:none; color:#bbb8b0; font:700 12px Inter,sans-serif; cursor:pointer; white-space:nowrap; }
.chip i { font-style:normal; color:#6d6b66; font-weight:600; }
.chip:hover { border-color:rgba(255,255,255,.22); color:var(--white); }
.chip.on,.chip[aria-pressed="true"] { border-color:var(--gold); color:var(--gold); }

.ev-month { padding:26px 0 8px; }
.ev-month h2,.ev-related h2 { margin:0 0 18px; font-size:13px; letter-spacing:2px; text-transform:uppercase; color:var(--muted); font-family:Inter,sans-serif; font-weight:800; }
.ev-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:22px; }
.ev-card { display:flex; flex-direction:column; background:var(--card); border:1px solid var(--line); border-radius:22px; overflow:hidden; transition:border-color .2s, transform .2s; }
.ev-card:hover { border-color:rgba(212,175,55,.45); transform:translateY(-2px); }
.ev-art { position:relative; aspect-ratio:4/5; background:#161616; overflow:hidden; }
.ev-art img { width:100%; height:100%; object-fit:cover; display:block; }
.ev-date { position:absolute; top:12px; left:12px; display:flex; flex-direction:column; align-items:center; min-width:48px; padding:7px 8px; background:rgba(5,5,5,.82); border:1px solid var(--line); border-radius:12px; font-size:9px; font-weight:800; letter-spacing:1.2px; color:var(--muted); }
.ev-date b { font-family:Sora,sans-serif; font-size:19px; color:var(--white); letter-spacing:0; line-height:1.1; }
.ev-body { display:flex; flex-direction:column; gap:7px; padding:16px 18px 18px; flex:1; }
.ev-body small { color:var(--gold); font-size:9.5px; font-weight:800; letter-spacing:1.5px; }
.ev-body strong { font-family:Sora,sans-serif; font-size:17px; line-height:1.25; letter-spacing:-.3px; overflow-wrap:anywhere; }
.ev-venue { color:var(--muted); font-size:12.5px; line-height:1.45; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.ev-price { margin-top:auto; padding-top:6px; font-size:12px; font-weight:800; color:#d8d5cc; }
.ev-price.free { color:var(--gold); }
.ev-empty { padding:40px 0 80px; color:var(--muted); font-size:14px; }
.ev-card[hidden],.ev-month[hidden] { display:none; }
.events-page main { padding-bottom:80px; }

.app-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:9px; }
.app-actions a,.secondary-button { display:flex; align-items:center; justify-content:center; padding:13px 12px; border:1px solid rgba(212,175,55,.35); border-radius:999px; color:var(--white); font-size:12px; font-weight:700; text-align:center; }
.secondary-button { margin-top:9px; border-color:var(--line); color:#c1beb7; }
.app-actions a:hover,.secondary-button:hover { border-color:var(--gold); }

.ev-related { padding:10px 0 90px; border-top:1px solid var(--line); }
.ev-related-head { display:flex; justify-content:space-between; align-items:baseline; padding-top:40px; }
.ev-related-head a { color:var(--gold); font-size:12px; font-weight:700; }

@media(max-width:520px){
  .ev-hero { padding-top:34px; }
  .ev-grid { grid-template-columns:1fr 1fr; gap:12px; }
  .ev-card { border-radius:16px; }
  .ev-body { padding:12px 12px 14px; }
  .ev-body strong { font-size:14px; }
  .ev-venue { font-size:11.5px; }
  .ev-filters { display:grid; grid-template-columns:minmax(0,1fr); gap:8px; }
  .topnav { gap:14px; }
  .app-actions { grid-template-columns:1fr; }
}

.ev-season-link { display:inline-block; margin-top:18px; color:var(--gold); font-size:13px; font-weight:700; }
.ev-season-link:hover { text-decoration:underline; }
.ev-empty a { color:var(--gold); }
.ev-guide { padding:56px 0 8px; border-top:1px solid var(--line); margin-top:40px; }
.ev-guide h2 { margin:0 0 24px; font-size:clamp(26px,3.4vw,36px); letter-spacing:-.8px; }
.ev-guide-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.ev-guide-grid div { padding:24px; background:var(--card); border:1px solid var(--line); border-radius:22px; }
.ev-guide h3 { margin:0 0 10px; font-size:17px; font-family:Sora,sans-serif; }
.ev-guide p { margin:0; color:var(--muted); font-size:14px; line-height:1.7; }
.ev-faq details { border-bottom:1px solid var(--line); padding:18px 0; }
.ev-faq summary { cursor:pointer; font-weight:700; font-size:15px; list-style:none; }
.ev-faq summary::-webkit-details-marker { display:none; }
.ev-faq summary::after { content:'+'; float:right; color:var(--gold); }
.ev-faq details[open] summary::after { content:'–'; }
.ev-faq details p { margin-top:12px; max-width:760px; }
@media(max-width:820px){ .ev-guide-grid { grid-template-columns:1fr; } }
@media(max-width:520px){ .topnav > a:not(.quiet-button):nth-child(2) { display:none; } }

.ev-search-row { margin:4px 0 0; }
.ev-search { width:100%; padding:15px 18px; background:#0d0d0d; border:1px solid var(--line); border-radius:999px; color:var(--white); font:500 15px Inter,sans-serif; }
.ev-search:focus { outline:none; border-color:rgba(212,175,55,.6); }
.ev-search::placeholder { color:#6d6b66; }
footer nav { flex-wrap:wrap; row-gap:10px; }
@media(max-width:720px){ footer { grid-template-columns:minmax(0,1fr); } }
