/* ============================================================
   /events/ — Level 1 events hub ("The Broadsheet")
   Self-contained page system. Only brand colour values and the
   Plus Jakarta Sans family are shared with theme.css; no theme
   component classes are reused. Everything is scoped under
   .ev-a so nothing collides with shared chrome.
   Static-only: no JS, no transitions, no hover/focus states.
   ============================================================ */

.ev-a{
    /* brand tokens — colour + type only */
    --ink:#120F64;
    --gold:#cea800;
    --yellow:#FFE100;
    --paper:#FEFDF6;
    --sand:#E6E1C1;
    --body:#1f2937;
    --muted:#4b5563;

    /* broadsheet rule system */
    --rule:rgba(18,15,100,.14);
    --rule-mid:rgba(18,15,100,.30);

    /* gutter + escape geometry */
    --gut:clamp(18px,4vw,56px);
    --edge:calc(max((100vw - 1520px)/2,0px) + var(--gut));

    /* row grid */
    --datecol:clamp(112px,13vw,190px);
    --platecol:clamp(190px,25vw,430px);
    --rowgap:clamp(20px,3vw,52px);

    font-family:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    display:block;
    background:var(--paper);
    color:var(--body);
    overflow-x:clip;
}

/* ── resets written with :where() so component rules always win ── */
.ev-a :where(h1,h2,h3,h4,p,ul,ol,li,figure,img,a,time,span,div,section){margin:0;padding:0}
.ev-a :where(ul,ol){list-style:none}
.ev-a :where(a){color:inherit;text-decoration:none}
.ev-a :where(img){display:block;max-width:100%;height:auto;border-radius:0}
.ev-a :where(h1,h2,h3,h4){font-family:inherit;color:var(--ink);font-weight:700;line-height:1.1;letter-spacing:-.02em}
.ev-a :where(time){display:inline}

/* ── shared type atoms ── */
.ev-a .eva-kicker{
    font-size:.7rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;
    color:var(--gold);
}
.ev-a .eva-h2{
    font-size:clamp(1.45rem,2.6vw,2.3rem);line-height:1.1;letter-spacing:-.028em;color:var(--ink);
    max-width:26ch;
}
.ev-a .eva-link{
    display:inline-block;
    font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
    color:var(--ink);
    border-bottom:1px solid var(--gold);
    padding-bottom:4px;
}
.ev-a .eva-link--sm{font-size:.66rem;letter-spacing:.14em}
.ev-a .eva-link--rev{color:var(--paper);border-bottom-color:var(--gold)}

/* ── section head: ruled newspaper band ── */
.ev-a .eva-sechead{
    display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:10px 40px;
    padding:clamp(14px,1.6vw,20px) var(--edge) clamp(12px,1.4vw,18px);
    border-top:1px solid var(--rule);
    border-bottom:2px solid var(--ink);
}
.ev-a .eva-sechead .eva-h2{margin-top:10px}
.ev-a .eva-sechead-note{
    font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
    color:var(--muted);text-align:right;padding-bottom:6px;
}

/* ══ 1 · MASTHEAD ═════════════════════════════════════════════════ */
.ev-a .eva-mast{
    position:relative;overflow:hidden;background:var(--ink);
    min-height:clamp(500px,70vh,700px);
    display:flex;flex-direction:column;justify-content:space-between;
    padding:clamp(20px,2.6vw,32px) var(--edge) clamp(24px,3.2vw,40px);
}
.ev-a .eva-mast img{
    position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:52% 48%;
}
.ev-a .eva-mast-scrim{
    position:absolute;inset:0;z-index:1;
    background:
        linear-gradient(to bottom,rgba(18,15,100,.66),rgba(18,15,100,.14) 34%,rgba(18,15,100,.30) 56%,rgba(18,15,100,.86));
}
.ev-a .eva-mast-strip,
.ev-a .eva-mast-mid,
.ev-a .eva-dateline{position:relative;z-index:2}

.ev-a .eva-mast-strip{
    display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;
    border-top:1px solid rgba(254,253,246,.48);
    border-bottom:1px solid rgba(254,253,246,.48);
    padding:9px 0;
    font-size:.68rem;font-weight:700;letter-spacing:.24em;text-transform:uppercase;
    color:var(--paper);
}
.ev-a .eva-mast-mid{padding-top:clamp(30px,5vw,68px)}
.ev-a .eva-d1{
    font-size:clamp(2.1rem,5.5vw,4.5rem);
    line-height:1.02;letter-spacing:-.038em;font-weight:700;
    color:var(--paper);
    max-width:16ch;
}
.ev-a .eva-mast-stand{
    margin-top:clamp(16px,1.8vw,24px);
    font-size:clamp(.98rem,1.15vw,1.15rem);line-height:1.55;
    color:rgba(254,253,246,.92);
    max-width:60ch;
}
.ev-a .eva-dateline{
    display:flex;align-items:baseline;gap:clamp(12px,2vw,26px);flex-wrap:wrap;
    border-top:1px solid rgba(254,253,246,.52);
    padding-top:14px;
}
.ev-a .eva-dateline-k{
    font-size:.68rem;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);
}
.ev-a .eva-dateline-m{
    font-size:clamp(.86rem,1.05vw,1.02rem);font-weight:600;letter-spacing:.01em;
    color:var(--paper);
}

/* ══ 2 · FEATURED SPREAD ══════════════════════════════════════════ */
.ev-a .eva-feat{
    border-top:3px solid var(--ink);      /* the heavy rule under the masthead */
    /* Shares the right rail with the rows below (and the archive) rather than
       bleeding off-viewport — otherwise the feature steps out past six plates
       that all stop at the gutter, which reads as a mistake. It stays the
       flagship by being larger, not by breaking the grid. */
    padding-left:var(--edge);padding-right:var(--edge);
}
.ev-a .eva-feat-grid{
    display:grid;
    grid-template-columns:minmax(0,1fr) clamp(300px,38vw,600px);
    gap:clamp(28px,4vw,64px);
    align-items:start;
    padding:clamp(30px,3.4vw,50px) 0 clamp(52px,6.4vw,104px);
}
.ev-a .eva-feat-h{
    margin-top:14px;
    font-size:clamp(1.9rem,3.6vw,3.15rem);line-height:1.04;letter-spacing:-.035em;color:var(--ink);
    max-width:17ch;
}
.ev-a .eva-feat-meta{
    margin-top:18px;
    font-size:.76rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);
}
.ev-a .eva-tag{
    display:inline-block;vertical-align:middle;margin-left:12px;
    background:var(--yellow);color:var(--ink);
    font-size:.64rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
    padding:5px 10px;
}
.ev-a .eva-feat-stand{
    margin-top:20px;
    font-size:clamp(1rem,1.15vw,1.12rem);line-height:1.62;color:var(--body);
    max-width:56ch;
}
.ev-a .eva-tourlabel{
    margin-top:34px;
    font-size:.68rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);
}
.ev-a .eva-tour{margin-top:12px;border-top:1px solid var(--rule-mid)}
.ev-a .eva-tour li{
    display:flex;justify-content:space-between;align-items:baseline;gap:20px;
    padding:12px 0;border-bottom:1px solid var(--rule);
}
.ev-a .eva-tour-city{font-size:1.04rem;font-weight:700;letter-spacing:-.015em;color:var(--ink)}
.ev-a .eva-tour-date{
    font-size:.74rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);
}
.ev-a .eva-feat-cta{margin-top:30px}
.ev-a .eva-feat-fig{
    position:relative;aspect-ratio:1/1;overflow:hidden;background:var(--sand);
}
.ev-a .eva-feat-fig img{
    position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:52% 50%;
}

/* ══ 3 · UPCOMING — ruled rows with enormous date numerals ════════ */
.ev-a .eva-up{padding-top:clamp(10px,1vw,16px)}

/* ONE rail for every row — date | copy | plate — so the date numerals form a
   single scannable column and the plates share one right edge with the section
   heads, the archive grid and the closing panel. An earlier draft alternated
   the plate side per row; that moved the date 347px between rows and destroyed
   the column, which is the whole point of a calendar. Full-bleed drama lives in
   the masthead, the feature plate and the quiet band instead. */
.ev-a .eva-row{
    display:grid;
    grid-template-columns:var(--datecol) minmax(0,1fr) var(--platecol);
    gap:var(--rowgap);
    align-items:start;
    border-bottom:1px solid var(--rule);
    padding:clamp(26px,3.1vw,46px) var(--edge);
}

.ev-a .eva-row-date{display:block;padding-top:2px}
.ev-a .eva-day{
    display:block;
    font-size:clamp(3.8rem,6.4vw,6rem);
    font-weight:700;line-height:.82;letter-spacing:-.055em;color:var(--ink);
    font-variant-numeric:lining-nums tabular-nums;
}
.ev-a .eva-mon{
    display:block;margin-top:12px;
    font-size:.68rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);
}
.ev-a .eva-row-h{
    font-size:clamp(1.28rem,2vw,1.9rem);line-height:1.14;letter-spacing:-.028em;color:var(--ink);
    max-width:25ch;
}
.ev-a .eva-row-stand{
    margin-top:13px;
    font-size:clamp(.96rem,1.02vw,1.03rem);line-height:1.6;color:var(--body);
    max-width:54ch;
}
.ev-a .eva-row-meta{
    margin-top:15px;
    font-size:.7rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);
}
.ev-a .eva-row-cta{margin-top:18px}
.ev-a .eva-row-fig{
    position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--sand);
}
.ev-a .eva-row-fig img{
    position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
}
.ev-a .eva-row-fig--podium img{object-position:50% 46%}
.ev-a .eva-row-fig--hall img{object-position:50% 40%}

/* ══ 4 · QUIET BAND ═══════════════════════════════════════════════ */
.ev-a .eva-band{
    position:relative;overflow:hidden;background:#5f7c92;
    min-height:clamp(320px,34vw,460px);
    display:flex;align-items:center;
    padding:clamp(44px,5.2vw,78px) var(--edge);
}
/* the image is set 126% wide and anchored left so the calendar slides off the
   right edge and the empty dusty-blue field widens under the type */
.ev-a .eva-band img{
    position:absolute;top:0;left:0;width:126%;height:100%;object-fit:cover;object-position:0% 50%;
}
.ev-a .eva-band-scrim{
    position:absolute;inset:0;z-index:1;
    background:linear-gradient(to right,rgba(11,20,34,.72),rgba(11,20,34,.58) 46%,rgba(11,20,34,.22) 68%,rgba(11,20,34,0) 84%);
}
.ev-a .eva-band-copy{position:relative;z-index:2;max-width:520px}
.ev-a .eva-band-kicker{
    font-size:.68rem;font-weight:700;letter-spacing:.24em;text-transform:uppercase;
    color:rgba(254,253,246,.86);
}
.ev-a .eva-band-line{
    margin-top:18px;
    font-size:clamp(1.1rem,1.85vw,1.62rem);line-height:1.4;letter-spacing:-.02em;font-weight:600;
    color:#FEFDF6;
}

/* ══ 5 · PREVIOUSLY — contact sheet ═══════════════════════════════ */
.ev-a .eva-prev{padding-top:clamp(56px,6.6vw,104px)}
.ev-a .eva-sheet{
    display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
    padding:0 var(--edge);
}
.ev-a .eva-cell{
    padding:clamp(22px,2.3vw,32px) clamp(20px,2.2vw,34px) clamp(26px,2.7vw,38px);
    border-bottom:1px solid var(--rule);
    border-right:1px solid var(--rule);
}
.ev-a .eva-cell:nth-child(3n+1){padding-left:0}
.ev-a .eva-cell:nth-child(3n){padding-right:0;border-right:0}
.ev-a .eva-cell-date{
    display:block;
    font-size:.7rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);
}
.ev-a .eva-cell-h{
    margin-top:12px;
    font-size:1.04rem;line-height:1.3;letter-spacing:-.018em;color:var(--ink);
    max-width:24ch;
}
.ev-a .eva-cell-meta{
    margin-top:9px;
    font-size:.74rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:var(--muted);
}
.ev-a .eva-cell-note{
    margin-top:11px;
    font-size:.92rem;line-height:1.55;color:var(--body);
    max-width:38ch;
}
.ev-a .eva-cell-cta{margin-top:16px}

/* ══ 6 · CLOSING PLATE ════════════════════════════════════════════ */
.ev-a .eva-close{
    margin-top:clamp(56px,6.6vw,104px);
    background:var(--ink);color:var(--paper);
    padding:clamp(54px,6.8vw,108px) var(--edge);
}
.ev-a .eva-close-k{
    font-size:.7rem;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);
}
.ev-a .eva-close-h{
    margin-top:20px;
    font-size:clamp(1.5rem,3.1vw,2.65rem);line-height:1.14;letter-spacing:-.032em;
    color:var(--paper);
    max-width:24ch;
}
.ev-a .eva-close-links{
    display:flex;flex-wrap:wrap;gap:clamp(18px,3vw,48px);
    margin-top:clamp(28px,3.2vw,44px);
    border-top:1px solid rgba(254,253,246,.3);
    padding-top:22px;
}

/* ══ RESPONSIVE ═══════════════════════════════════════════════════ */
@media (max-width:1080px){
    .ev-a .eva-feat-fig{aspect-ratio:4/5}
}

@media (max-width:980px){
    .ev-a .eva-sheet{grid-template-columns:repeat(2,minmax(0,1fr))}
    .ev-a .eva-cell:nth-child(3n+1){padding-left:clamp(20px,2.2vw,34px)}
    .ev-a .eva-cell:nth-child(3n){padding-right:clamp(20px,2.2vw,34px);border-right:1px solid var(--rule)}
    .ev-a .eva-cell:nth-child(2n+1){padding-left:0}
    .ev-a .eva-cell:nth-child(2n){padding-right:0;border-right:0}
}

@media (max-width:1100px){
    .ev-a .eva-band img{width:150%}
    .ev-a .eva-band-scrim{
        background:linear-gradient(to right,rgba(11,20,34,.74),rgba(11,20,34,.58) 46%,rgba(11,20,34,.30) 72%,rgba(11,20,34,.16));
    }
}

@media (max-width:760px){
    .ev-a .eva-band img{width:100%;object-position:20% 50%}
    .ev-a .eva-band-scrim{
        background:linear-gradient(to right,rgba(11,20,34,.78),rgba(11,20,34,.66) 55%,rgba(11,20,34,.5));
    }
    .ev-a .eva-band-copy{max-width:none}
}

@media (max-width:860px){
    .ev-a .eva-feat{padding-right:var(--edge)}
    .ev-a .eva-feat-grid{grid-template-columns:minmax(0,1fr);gap:clamp(26px,4vw,38px)}
    .ev-a .eva-feat-fig{aspect-ratio:3/2}
    .ev-a .eva-feat-h{max-width:none}

    .ev-a .eva-row{
        grid-template-columns:minmax(0,1fr);
        gap:clamp(14px,3vw,22px);
    }
    .ev-a .eva-row-fig{aspect-ratio:12/5;margin-top:8px}
    .ev-a .eva-row-h{max-width:24ch}

    .ev-a .eva-sechead{grid-template-columns:minmax(0,1fr);align-items:start}
    .ev-a .eva-sechead-note{text-align:left;padding-bottom:0;margin-top:6px}
}

@media (max-width:620px){
    .ev-a .eva-sheet{grid-template-columns:minmax(0,1fr)}
    .ev-a .eva-cell,
    .ev-a .eva-cell:nth-child(2n+1),
    .ev-a .eva-cell:nth-child(2n),
    .ev-a .eva-cell:nth-child(3n+1),
    .ev-a .eva-cell:nth-child(3n){
        padding-left:0;padding-right:0;border-right:0;
    }
    .ev-a .eva-mast{min-height:clamp(440px,74vh,560px)}
    .ev-a .eva-d1{max-width:none}
    .ev-a .eva-cell-h,
    .ev-a .eva-cell-note{max-width:none}
    .ev-a .eva-tag{margin-left:0;margin-top:10px}
    .ev-a .eva-feat-meta{line-height:1.5}
}
