/* The event title spans the complete editorial layout on desktop. */
@media(min-width:901px){
  .app-shell .detail-hero{grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);column-gap:clamp(24px,3vw,48px);row-gap:24px;align-items:start;padding-block:36px 64px}
  .detail-header{grid-column:1/-1;max-width:100%}
  .detail-header h1{font:600 clamp(2.8rem,4.6vw,5.2rem)/1.04 Oswald,sans-serif;text-transform:uppercase;max-width:100%;margin:12px 0 16px;text-wrap:balance}
  .detail-header .event-state,.detail-header .claim{margin:8px 0}
  .detail-media-column{grid-column:1;min-width:0}
  .detail-copy{grid-column:2;min-width:0}
  .detail-copy .detail-list{margin:0 0 20px;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch}
  .detail-copy .actions{display:flex;flex-wrap:wrap;gap:10px}
  .detail-media-actions{display:flex;flex-wrap:wrap;align-items:flex-start;gap:12px;margin-top:18px}
  .detail-media-actions .detail-item{flex:1 1 220px}
  .detail-media-actions .event-ticket{flex:1 1 220px;margin:0}
  .detail-media-actions>.btn{align-self:center}
}
@media(max-width:900px){
  .app-shell .detail-hero{display:grid;grid-template-columns:minmax(0,1fr);gap:22px;align-items:start}
  .detail-header,.detail-media-column,.detail-copy{min-width:0}
  .detail-header h1{font:600 clamp(2rem,9vw,3.4rem)/1.06 Oswald,sans-serif;text-transform:uppercase;margin:12px 0}
  .detail-media-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
  .detail-media-actions .detail-item{flex:1 1 100%}
  .detail-copy .detail-list{margin:0 0 16px}
}
.detail-header .claim{overflow-wrap:anywhere}