.wrap{max-width:1240px;margin:0 auto;width:100%}
.head{display:grid;grid-template-columns:minmax(320px,1fr) minmax(420px,560px);gap:40px;align-items:center;margin:6px 0 10px;min-height:min(74vh,720px)}
.head h1{font-family:var(--serif);font-weight:300;font-size:clamp(46px,5.6vw,84px);line-height:0.98;letter-spacing:-0.025em;margin:0}
.head .lede{font-size:19px;line-height:1.65;color:#C9C6BC;max-width:52ch;margin:20px 0 0}
.nowbox{margin:28px 0 0;border-top:1px solid var(--line);padding-top:18px;max-width:440px}
.nowbox .k{font-size:14px;color:var(--haze)}
.nowbox .big{font-family:var(--serif);font-weight:300;font-size:clamp(34px,3.6vw,48px);line-height:1.05;margin:6px 0 0}
.nowbox .big b{font-weight:300;color:var(--c,#7C9FA6)}
.nowbox .sub{font-size:16px;color:var(--haze);margin:10px 0 0}
.head .stage{grid-area:auto;position:relative;aspect-ratio:1/1;width:100%;max-width:560px;justify-self:center}
.rowhead{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin:26px 0 6px;border-top:1px solid var(--line);padding-top:20px}
.rowhead h2{font-family:var(--serif);font-weight:400;font-size:26px;margin:0}
.rowhead span{font-size:14px;color:var(--haze)}
.rows{display:flex;flex-direction:column}
.row2{display:grid;grid-template-columns:190px minmax(220px,1fr) minmax(0,1.1fr) 28px;gap:26px;align-items:baseline;padding:22px 0 20px;border-bottom:1px solid var(--line);transition:background 160ms var(--ease-out)}
.row2:hover{background:rgba(26,33,48,0.45)}
.row2 .dates{font-size:15px;color:var(--haze);font-variant-numeric:tabular-nums}
.row2 .nm{font-family:var(--serif);font-size:clamp(26px,2.4vw,34px);line-height:1.05;color:var(--c)}
.row2 .meta{font-size:14px;color:var(--haze);margin-top:6px}
.row2 .txt{font-size:17px;line-height:1.55;color:#C9C6BC}
.row2 .arr{justify-self:end;color:var(--haze);transition:transform 160ms var(--ease-out),color 160ms var(--ease-out)}
.row2:hover .arr{transform:translateX(5px);color:var(--moonlight)}
.row2.live{border-left:2px solid var(--c);padding-left:18px;margin-left:-20px}
.row2.live .dates b{color:var(--c);font-weight:500}
/* the closing note runs the whole width of the page in two columns, instead of
   stopping halfway and leaving the right half of the line empty */
.foot{border-top:1px solid var(--line);padding-top:18px;margin:34px 0 30px;font-size:15px;color:var(--haze);line-height:1.7;max-width:none}
.foot{columns:2;column-gap:clamp(32px,4vw,64px)}
@media (max-width:1000px){
  .head{grid-template-columns:1fr;gap:18px;min-height:0;margin-bottom:26px}
  .head .stage{order:-1;max-width:380px}
  .row2{grid-template-columns:1fr 28px;gap:6px 18px}
  .row2 .dates{grid-column:1/-1;order:3}
  .row2 .txt{grid-column:1/-1;order:2}
  .row2 .arr{grid-row:1;grid-column:2}
}
@media (max-width:767px){
  .foot{columns:1}
  html{overflow-x:hidden}
  .page{padding-inline:16px}
  .place{min-height:44px}
  .row2.live{margin-left:0;padding-left:14px}
}