/* ==========================================================================
   EventVault — event page
   Same tokens as ev-cards.css. The page answers "should I go?" then "how?" —
   everything above the description exists to settle the first question.
   ========================================================================== */

.ev-event{padding-top:20px}
.ev-event__grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(280px,1fr);gap:34px;align-items:start}

/* The image is NOT cropped to a ratio here: an event page is where someone
   wants to see the poster or photo as it was made, not a 16:10 slice of it.
   Capped by height so a tall poster cannot push everything below the fold. */
.ev-event__media{background:var(--ev-paper);border:1px solid var(--ev-line);
  border-radius:var(--ev-radius);overflow:hidden;margin-bottom:20px}
.ev-event__media img{display:block;width:100%;height:auto;min-height:120px;max-height:620px;
  object-fit:contain;margin:0 auto}

.ev-event__kicker{font:700 11.5px/1.3 var(--ev-ui);letter-spacing:.13em;text-transform:uppercase;
  color:var(--ev-coral-ink);margin-bottom:6px}
.ev-event__kicker a{color:inherit;text-decoration:none}
.ev-event__kicker a:hover{text-decoration:underline}
.ev-event__title{font:400 clamp(28px,4vw,42px)/1.12 var(--ev-display);letter-spacing:-.01em;
  color:var(--ev-ink);margin:0 0 10px;text-wrap:balance}
.ev-event__sub{font:400 16px/1.5 var(--ev-ui);color:var(--ev-ink-2);margin:0 0 18px}
.ev-event__sub a{color:var(--ev-ink);text-decoration:none;border-bottom:1px solid var(--ev-line)}
.ev-event__sub a:hover{border-bottom-color:var(--ev-coral)}

.ev-event__body{font:400 16.5px/1.65 var(--ev-ui);color:var(--ev-ink-2);max-width:68ch}
.ev-event__body h2,.ev-event__body h3{font-family:var(--ev-ui);font-weight:700;color:var(--ev-ink);
  font-size:19px;margin:26px 0 8px;letter-spacing:-.01em}
.ev-event__body p{margin:0 0 15px}
.ev-event__body a{color:var(--ev-coral-ink)}
.ev-event__body ul,.ev-event__body ol{margin:0 0 15px;padding-left:22px}

/* ---------- when ------------------------------------------------------- */
.ev-when-block{border:1px solid var(--ev-line);border-radius:var(--ev-radius);
  background:var(--ev-surface);overflow:hidden;margin-bottom:16px}
.ev-when-block__head{padding:12px 16px;border-bottom:1px solid var(--ev-line);background:var(--ev-paper);
  font:700 11px/1 var(--ev-ui);letter-spacing:.1em;text-transform:uppercase;color:var(--ev-ink-3)}
.ev-date{display:flex;align-items:center;gap:14px;padding:11px 16px;border-bottom:1px solid var(--ev-line)}
.ev-date:last-child{border-bottom:0}
.ev-date--next{background:var(--ev-coral-soft)}
.ev-date__cal{flex:none;width:46px;text-align:center;font-family:var(--ev-mono);line-height:1.15}
.ev-date__m{font:700 10px/1 var(--ev-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ev-coral-ink)}
.ev-date__d{font-size:20px;font-weight:700;color:var(--ev-ink)}
.ev-date__meta{min-width:0;flex:1}
.ev-date__t{font:600 14px/1.35 var(--ev-ui);color:var(--ev-ink)}
.ev-date__n{font:400 12.5px/1.35 var(--ev-ui);color:var(--ev-ink-3)}
.ev-date__flag{margin-left:auto;font:700 10px/1 var(--ev-ui);letter-spacing:.09em;text-transform:uppercase;
  color:var(--ev-coral-ink);white-space:nowrap}

/* ---------- actions ---------------------------------------------------- */
.ev-actions{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:18px}
.ev-actions .ev-btn{padding:12px 20px;font-size:14.5px}
.ev-btn--wide{flex:1;min-width:150px;text-align:center}

/* ---------- follow rail ------------------------------------------------ */
.ev-follows{border:1px solid var(--ev-line);border-radius:var(--ev-radius);background:var(--ev-surface);
  padding:16px;margin-bottom:16px}
.ev-follows h3{font:700 11px/1 var(--ev-ui);letter-spacing:.1em;text-transform:uppercase;
  color:var(--ev-ink-3);margin:0 0 4px}
.ev-follows .ev-follows__why{font:400 13px/1.45 var(--ev-ui);color:var(--ev-ink-3);margin:0 0 12px}
.ev-follow{display:flex;align-items:center;gap:11px;padding:9px 0;border-top:1px solid var(--ev-line)}
.ev-follow:first-of-type{border-top:0}
.ev-follow__meta{min-width:0;flex:1}
.ev-follow__name{font:600 14.5px/1.3 var(--ev-ui);color:var(--ev-ink);text-decoration:none;display:block;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ev-follow__name:hover{color:var(--ev-coral-ink)}
.ev-follow__role{font:400 12px/1.3 var(--ev-ui);color:var(--ev-ink-3)}
.ev-follow__btn{flex:none;font:600 12.5px/1 var(--ev-ui);padding:8px 14px;border-radius:20px;cursor:pointer;
  border:1px solid var(--ev-line);background:var(--ev-surface);color:var(--ev-ink);white-space:nowrap}
.ev-follow__btn:hover{border-color:var(--ev-coral);color:var(--ev-coral-ink)}
.ev-follow__btn[aria-pressed="true"]{background:var(--ev-coral-deep);border-color:var(--ev-coral-deep);color:#fff}
.ev-follow__btn:focus-visible{outline:2px solid var(--ev-coral-deep);outline-offset:2px}

/* ---------- facts ------------------------------------------------------ */
.ev-facts{border:1px solid var(--ev-line);border-radius:var(--ev-radius);background:var(--ev-surface);padding:4px 16px}
.ev-fact{display:flex;gap:12px;padding:11px 0;border-top:1px solid var(--ev-line);font:400 14px/1.45 var(--ev-ui)}
.ev-fact:first-child{border-top:0}
.ev-fact__k{flex:none;width:78px;color:var(--ev-ink-3);font-weight:600;font-size:12.5px}
.ev-fact__v{min-width:0;color:var(--ev-ink-2);word-break:break-word}
.ev-fact__v a{color:var(--ev-coral-ink);text-decoration:none}
.ev-fact__v a:hover{text-decoration:underline}

.ev-event__aside{position:sticky;top:140px;display:flex;flex-direction:column;gap:0}
@media (max-width:900px){
  .ev-event__grid{grid-template-columns:1fr;gap:24px}
  .ev-event__aside{position:static}
}
