/* Original artwork with catalogue-driven dates and accessible event identity. */
.hero.event-banner {
  display:block;
  min-height:0;
  background:transparent;
  color:#000;
  --prose-color:#000;
}
.hero.event-banner::after {display:none}
.event-banner-photo {height:min(52svh,680px);min-height:320px;overflow:hidden;background:#222}
.event-banner-photo img {display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.event-banner-photo--mono img {filter:grayscale(1) sepia(.2) contrast(1.1)}
.hero.event-banner .event-banner-content {max-width:1680px;padding-top:0;padding-bottom:40px}
.event-ticket {
  position:relative;
  display:grid;
  grid-template-columns:64px minmax(0,1fr);
  gap:18px;
  width:min(920px,100%);
  margin-top:-108px;
  padding:22px 26px 40px;
  border-radius:38px;
  background:#f23030;
  color:#fff;
  isolation:isolate;
}
.event-ticket::before {content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:url('/assets/v2-paper-1280.webp') center/900px auto;mix-blend-mode:multiply;opacity:.18;pointer-events:none}
.event-ticket-rail {display:flex;flex-direction:column;align-items:center;gap:12px;min-width:0}
.event-ticket-rail svg {width:64px;height:64px;flex:none}
.hero.event-banner h1 {font:900 92px/.96 Quedora,Arial,sans-serif;text-transform:uppercase;letter-spacing:0;margin:0 0 7px;max-width:none;white-space:nowrap}
.event-ticket-location {display:flex;align-items:center;gap:12px;font:400 18px/1.2 Bootzy,Arial,sans-serif;text-transform:uppercase}
.event-ticket-location i {flex:1;min-width:20px;height:12px;border-radius:8px;background:#fff}
.event-ticket-metrics {display:flex;justify-content:space-between;gap:6px;flex-wrap:wrap;margin:6px 0;font:400 15px/1.3 Bootzy,Arial,sans-serif;text-transform:uppercase}
.event-ticket-metrics b {font-weight:400}
.event-ticket-barcode {display:block;height:16px;background:repeating-linear-gradient(90deg,#fff 0 2px,transparent 2px 4px,#fff 4px 5px,transparent 5px 8px,#fff 8px 12px,transparent 12px 14px,#fff 14px 15px,transparent 15px 19px,#fff 19px 22px,transparent 22px 25px);}
.event-ticket-barcode--vertical {width:48px;flex:1;min-height:70px;background:repeating-linear-gradient(0deg,#fff 0 2px,transparent 2px 4px,#fff 4px 5px,transparent 5px 8px,#fff 8px 12px,transparent 12px 14px,#fff 14px 15px,transparent 15px 19px)}
.event-ticket-date {display:flex;justify-content:space-between;align-items:center;gap:12px;padding:5px 8px 3px;margin-top:8px;background:#fff;color:#f23030;font:900 34px/1.1 Quedora,Arial,sans-serif;text-transform:uppercase}
.event-ticket-logo {width:140px;height:22px;background:currentColor;mask:url('/assets/stratos-logo-black-lossless-v1.webp') center/contain no-repeat;flex:none}
.event-banner-summary {display:grid;grid-template-columns:minmax(0,760px) auto;gap:24px;align-items:start;margin-top:28px}
.hero.event-banner .lede {max-width:65ch;margin:0}
.hero.event-banner .event-dates,.hero.event-banner .waitlist-state {--prose-size:14px;margin:14px 0 0;opacity:1}
.event-banner-summary .ctas {margin:0;justify-self:end}
.event-banner-summary .btn {background:#111;color:#fff;min-height:46px}
.event-banner-summary .btn:hover {background:#333}
@media (max-width:1050px) {
  .event-ticket {width:min(780px,100%);grid-template-columns:50px minmax(0,1fr);gap:14px}
  .event-ticket-rail svg {width:50px;height:50px}
  .hero.event-banner h1 {font-size:54px}
  .event-ticket-date {font-size:28px}
  .event-ticket-logo {width:110px;height:18px}
  .event-ticket-location {font-size:16px}
  .event-ticket-metrics {font-size:13px}
}
@media (max-width:700px) {
  .event-banner-photo {height:320px;min-height:0}
  .hero.event-banner .event-banner-content {padding:0 20px 28px}
  .event-ticket {margin-top:-52px;padding:16px 16px 22px;gap:10px;grid-template-columns:30px minmax(0,1fr);border-radius:22px}
  .event-ticket-rail {gap:8px}
  .event-ticket-rail svg {width:30px;height:30px}
  .event-ticket-barcode--vertical {width:22px;min-height:50px}
  .hero.event-banner h1 {font-size:30px;line-height:1;margin-bottom:8px}
  .event-ticket-location {font-size:11px;line-height:1.3;gap:8px}
  .event-ticket-location i {height:7px;min-width:10px}
  .event-ticket-metrics {justify-content:flex-start;gap:3px 8px;font-size:10px;line-height:1.4;margin:8px 0}
  .event-ticket-main>.event-ticket-barcode {height:10px}
  .event-ticket-date {font-size:20px;gap:8px;padding:6px;margin-top:6px;flex-wrap:wrap}
  .event-ticket-logo {width:66px;height:12px;margin-left:auto}
  .event-banner-summary {display:block;margin-top:22px}
  .event-banner-summary .ctas {margin-top:18px;justify-self:start;justify-content:flex-start}
  .hero.event-banner .event-dates,.hero.event-banner .waitlist-state {--prose-size:13px;line-height:1.5}
}
@media (max-width:420px) {
  .hero.event-banner h1 {font-size:24px}
  .event-ticket-date {font-size:18px}
  .event-ticket-logo {width:53px;height:10px}
}
@media (max-width:360px) {
  .hero.event-banner .event-banner-content {padding-left:14px;padding-right:14px}
  .event-ticket {grid-template-columns:24px minmax(0,1fr);padding-left:12px;padding-right:12px;gap:8px}
  .hero.event-banner h1,body[data-event-id="por-2027-07"] .hero.event-banner h1 {font-size:21px}
  .event-ticket-rail svg {width:24px;height:24px}
  .event-ticket-date {font-size:17px}
}

.event-ticket.event-ticket--artwork {display:block;aspect-ratio:1841/599;padding:0;border-radius:0;overflow:hidden;background:none}
.event-ticket--artwork::before {display:none}
.event-ticket-art {position:absolute;display:block;width:123.1396%;max-width:none;height:auto}
.event-ticket-accessible {position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.event-ticket--artwork .event-ticket-date {position:absolute;left:13.96%;top:62.6%;width:64.5%;height:16%;margin:0;padding:0 1%;display:flex;align-items:center;flex-wrap:nowrap;background:#fff;color:#ed4143;font-size:36px;line-height:1;white-space:nowrap;box-sizing:border-box}
.event-banner:has(.event-ticket--artwork) .event-banner-photo img {object-position:center 65%}
@media(max-width:1050px) {.event-ticket--artwork .event-ticket-date {font-size:28px}}
@media(max-width:700px) {.event-ticket--artwork .event-ticket-date {font-size:18px}}
@media(max-width:360px) {.event-ticket--artwork .event-ticket-date {font-size:15px}}