/* /live/events: the landing page for the free group sessions (web_events.py). Tokens from style.css. */
.ev-hero { position: relative; border-radius: 12px; overflow: hidden; margin: 8px 0 16px; background: linear-gradient(135deg, #20624f 0%, #1b2a3a 100%); min-height: 220px; display: flex; align-items: flex-end; }
.ev-hero-art { position: absolute; inset: 0; display: block; overflow: hidden; }
.ev-hero-art img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ev-hero-text { position: relative; width: 100%; padding: 56px 20px 20px; color: #fff; background: linear-gradient(transparent, rgba(8, 12, 22, .86)); }
.ev-hero:not(.has-art) .ev-hero-text { background: none; }
.ev-hero h1 { margin: 0 0 6px; color: #fff; } .ev-hero .lead { color: #e9eef4; margin: 0 0 14px; }
.ev-cta { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; margin: 0; }
.ev-next { background: rgba(15, 20, 32, .78); color: #fff; border-color: transparent; font-variant-numeric: tabular-nums; }
.ev-benefits, .ev-how ol { list-style: none; padding: 0; margin: 0 0 20px; display: grid; gap: 12px; }
.ev-benefits li, .ev-how li { display: grid; gap: 2px; padding: 12px 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.ev-benefits span, .ev-how span { color: var(--muted); }
.ev-how ol { counter-reset: step; } .ev-how li { counter-increment: step; position: relative; padding-left: 52px; }
.ev-how li::before { content: counter(step); position: absolute; left: 16px; top: 12px; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: var(--accent-fill); color: var(--accent-text); font-weight: 700; }
.ev-h { margin-top: 24px; scroll-margin-top: 16px; }
.ev-filters { display: flex; gap: 12px 16px; flex-wrap: wrap; align-items: end; margin: 8px 0 16px; }
.ev-filters label { display: grid; gap: 2px; font-size: .9rem; } .ev-filters label.check { display: flex; gap: 6px; align-items: center; min-height: 44px; }
.ev-list { list-style: none; padding: 0; margin: 0 0 16px; display: grid; gap: 12px; }
.ev-day { margin: 18px 0 4px; font-size: 1.05rem; position: sticky; top: 0; background: var(--bg); padding: 4px 0; z-index: 1; }
.ev-row { display: grid; grid-template-columns: 112px 1fr; gap: 6px 14px; padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.ev-row.is-live { border-color: #d8473b; }
.ev-art { grid-row: span 2; display: block; } .ev-thumb, .ev-thumb img { display: block; width: 112px; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 8px; }
.ev-thumb-fallback { background: linear-gradient(135deg, #20624f 0%, #1b2a3a 100%); }
.ev-main { min-width: 0; } .ev-tags { margin: 0 0 4px; display: flex; gap: 6px; flex-wrap: wrap; align-items: center; font-size: .85rem; }
.ev-free { color: var(--muted); } .ev-title { margin: 0 0 2px; font-size: 1.08rem; } .ev-title a { color: inherit; text-decoration: none; }
.ev-meta { margin: 0; color: var(--muted); font-size: .92rem; font-variant-numeric: tabular-nums; }
.ev-actions { grid-column: 1 / -1; display: flex; gap: 8px; flex-wrap: wrap; }
.ev-actions .btn { min-height: 44px; display: inline-flex; align-items: center; }
.pill-live { background: #d8473b; color: #fff; border-color: transparent; }
.ev-more { margin: 24px 0; padding: 16px; border: 1px solid var(--line); border-radius: 12px; } .ev-more h2 { margin-top: 0; font-size: 1.15rem; }
@media (min-width: 720px) {
  .ev-benefits { grid-template-columns: repeat(3, 1fr); } .ev-how ol { grid-template-columns: repeat(3, 1fr); }
  .ev-hero { min-height: 300px; } .ev-hero-text { padding: 80px 28px 28px; }
  .ev-row { grid-template-columns: 176px 1fr auto; align-items: center; } .ev-art { grid-row: auto; }
  .ev-thumb, .ev-thumb img { width: 176px; } .ev-actions { grid-column: auto; flex-direction: column; align-items: stretch; }
}
.ev-note { grid-column: 1 / -1; } .ev-note p, .together-signup { margin: 0; }
.ev-banner { margin: 0 0 12px; padding: 10px 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.ev-paths { display: grid; gap: 14px; } .ev-path .ev-cta { margin: 0 0 4px; } .ev-sub { margin: 0; color: #e9eef4; } .ev-sub a { color: #fff; }
.ev-hero .btn.ev-start { background: rgba(15, 20, 32, .55); color: #fff; border-color: rgba(255, 255, 255, .8); opacity: 1; }
@media (min-width: 720px) { .ev-paths { grid-template-columns: auto auto; justify-content: start; gap: 36px; } }
.pill-community { background: transparent; border: 1px solid var(--line); color: var(--muted); } .ev-host { margin: 0 0 4px; }