/* The event poster is scoped to the landing page. */
.event-home {
  background: #080a09;
  color: #f4f4ed;
}

.event-home .topbar {
  position: absolute;
  z-index: 5;
  inset: 0 0 auto;
  height: 80px;
  padding-inline: max(28px, calc((100vw - 1280px) / 2));
  background: linear-gradient(180deg, #080a09dd, #080a091a);
  border-bottom-color: #ffffff1c;
}

.event-home .topbar nav a {
  color: #ededeb;
}

.event-home .event-poster {
  position: relative;
  isolation: isolate;
  min-height: 890px;
  min-height: max(890px, 100svh);
  overflow: hidden;
  background: #080a09;
}

.event-home .event-scene,
.event-home .event-scene::after,
.event-home .event-grain {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.event-home .event-scene {
  z-index: -1;
  overflow: hidden;
}

.event-home .event-stadium {
  position: absolute;
  top: 76px;
  right: 0;
  width: 90%;
  height: calc(100% - 76px);
  object-fit: cover;
  object-position: 46% 28%;
  filter: saturate(.64) contrast(1.12);
  opacity: .88;
}

.event-home .event-scene::after {
  content: '';
  background:
    linear-gradient(90deg, #080a09 0%, #080a09e8 14%, #080a098c 44%, #080a0914 76%, #080a0940),
    linear-gradient(0deg, #080a09 0%, #080a09f0 10%, #080a095c 40%, #080a0900 73%, #080a0970);
}

.event-home .event-spotlight {
  position: absolute;
  z-index: 1;
  top: -20%;
  width: 200px;
  height: 1000px;
  background: linear-gradient(180deg, #e1f5ca22, #bdecaa09 58%, transparent);
  filter: blur(25px);
  transform-origin: top center;
}

.event-home .event-spotlight-left {
  left: 51%;
  transform: rotate(-29deg);
}

.event-home .event-spotlight-right {
  left: 82%;
  transform: rotate(28deg);
  opacity: .65;
}

.event-home .event-haze {
  position: absolute;
  z-index: 1;
  inset: 33% -20% -22% 20%;
  background: radial-gradient(ellipse at 72% 52%, #cae3b01b, transparent 49%);
  filter: blur(25px);
}

.event-home .event-grain {
  z-index: 2;
  opacity: .13;
  background-image: repeating-linear-gradient(0deg, #ffffff09 0 1px, transparent 1px 3px);
}

.event-home .event-content {
  position: relative;
  width: min(100%, 1280px);
  margin: 0 auto;
  padding: 126px 28px 118px;
}

.event-home .event-kicker {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 29px;
  color: #dcdfd7;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 2.6px;
  line-height: 1.7;
  text-transform: uppercase;
}

.event-home .event-kicker > span {
  width: 28px;
  height: 2px;
  flex-shrink: 0;
  background: #bef264;
}

.event-home .event-title {
  width: fit-content;
  margin: 0 0 22px;
  color: #f4f4ed;
  font-family: 'Barlow Condensed', Impact, sans-serif;
  font-weight: 800;
  letter-spacing: -.035em;
  text-transform: uppercase;
  text-shadow: 0 6px 42px #0006;
}

.event-home .event-title-first {
  display: flex;
  align-items: baseline;
  font-size: clamp(142px, 16.6vw, 224px);
  line-height: .75;
}

.event-home .event-title-amp {
  margin-left: 15px;
  color: #bef264;
  font-size: .47em;
  line-height: 1;
}

.event-home .event-title-second {
  display: block;
  margin-top: 5px;
  font-size: clamp(90px, 10.4vw, 140px);
  line-height: .92;
}

.event-home .event-tagline {
  margin: 0 0 30px;
  color: #d8dad4;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.65;
}

.event-home .event-details {
  display: flex;
  width: fit-content;
  gap: 28px;
  margin-bottom: 28px;
  padding-block: 20px;
  border-block: 1px solid #ffffff32;
}

.event-home .event-detail-label {
  display: block;
  margin-bottom: 6px;
  color: #bfc5b8;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.event-home .event-detail time,
.event-home .event-detail strong {
  display: block;
  color: #f4f4ed;
  font-family: 'Barlow Condensed', Impact, sans-serif;
  font-size: 32px;
  font-weight: 700;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}

.event-home .event-detail time > span[aria-hidden] {
  color: #bef264;
}

.event-home .event-location {
  padding-left: 28px;
  border-left: 1px solid #ffffff32;
}

.event-home .event-location strong span {
  color: #bef264;
}

.event-home .event-registration {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  scroll-margin-top: 24px;
}

.event-home .event-cta {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  min-width: 312px;
  min-height: 62px;
  padding: 17px 25px;
  border: 1px solid #d5ff9b;
  border-radius: 6px;
  background: #bef264;
  color: #11170a;
  box-shadow: 0 0 36px #bef26418, 0 12px 30px #0004;
  font-size: 16px;
  font-weight: 800;
  text-decoration: none;
  transition: background-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.event-home .event-cta:hover {
  background: #d0ff87;
  box-shadow: 0 0 42px #bef2642e, 0 12px 30px #0004;
  transform: translateY(-2px);
}

.event-home .event-cta:active {
  transform: translateY(0);
}

.event-home .event-profile-link {
  min-height: 32px;
  color: #b7bdb3;
  font-size: 11px;
  line-height: 1.6;
  text-decoration: none;
}

.event-home .event-profile-link span {
  color: #ebeee5;
  text-decoration: underline;
  text-underline-offset: 4px;
}

.event-home .event-profile-link:hover span {
  color: #bef264;
}

.event-home a:focus-visible {
  outline: 3px solid #bef264;
  outline-offset: 5px;
}

.event-home .event-cta:focus-visible {
  outline-color: #fff;
}

.event-home .event-poster-caption {
  position: absolute;
  inset: auto max(28px, calc((100vw - 1224px) / 2)) 33px;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding-top: 17px;
  border-top: 1px solid #ffffff23;
  color: #bdc2b7;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.event-home .event-poster-caption > span:last-child {
  display: flex;
  align-items: center;
  gap: 16px;
}

.event-home .event-poster-caption i {
  display: block;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: #bef264;
}

.event-home .footer {
  max-width: none;
  gap: 16px;
  margin: 0;
  padding: 23px max(28px, calc((100vw - 1224px) / 2));
  border-top-color: #ffffff16;
  background: #080a09;
  color: #9ba293;
  font-size: 10px;
  line-height: 1.6;
}

.event-home .event-sr-only,
.event-home .event-skip-link:not(:focus) {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.event-home .event-skip-link:focus {
  position: fixed;
  z-index: 20;
  top: 12px;
  left: 12px;
  padding: 14px 18px;
  border-radius: 6px;
  background: #bef264;
  color: #111;
  font-weight: 800;
}

@media (min-width: 1600px) {
  .event-home .event-content {
    padding-top: 154px;
  }

  .event-home .event-stadium {
    object-position: 50% 33%;
  }
}

@media (min-width: 901px) and (max-height: 800px) {
  .event-home .event-poster {
    min-height: 700px;
    min-height: max(700px, 100svh);
  }

  .event-home .event-content {
    padding-top: 102px;
    padding-bottom: 68px;
  }

  .event-home .event-kicker {
    margin-bottom: 18px;
  }

  .event-home .event-title {
    margin-bottom: 16px;
  }

  .event-home .event-title-first {
    font-size: 166px;
  }

  .event-home .event-title-second {
    font-size: 108px;
  }

  .event-home .event-tagline {
    margin-bottom: 18px;
    font-size: 14px;
    line-height: 1.55;
  }

  .event-home .event-details {
    margin-bottom: 20px;
    padding-block: 16px;
  }

  .event-home .event-registration {
    gap: 10px;
  }

  .event-home .event-poster-caption {
    bottom: 18px;
    padding-top: 12px;
  }
}

@media (max-width: 760px) {
  .event-home .topbar {
    height: 80px;
    min-height: 80px;
    padding: 16px 24px;
  }

  .event-home .event-poster {
    min-height: 980px;
  }

  .event-home .event-stadium {
    top: 74px;
    right: -22%;
    width: 136%;
    height: 470px;
    object-position: 56% 0;
    opacity: .85;
  }

  .event-home .event-scene::after {
    background:
      linear-gradient(0deg, #080a09 0%, #080a09 44%, #080a09b8 62%, #080a090d 83%, #080a0990),
      linear-gradient(90deg, #080a095e, #080a0900 60%, #080a0930);
  }

  .event-home .event-content {
    padding: 118px 24px 110px;
  }

  .event-home .event-kicker {
    gap: 9px;
    margin-bottom: 173px;
    font-size: 8px;
    letter-spacing: 1.4px;
  }

  .event-home .event-kicker > span {
    width: 18px;
  }

  .event-home .event-title {
    margin-bottom: 20px;
  }

  .event-home .event-title-first {
    font-size: clamp(144px, 34vw, 194px);
  }

  .event-home .event-title-second {
    font-size: clamp(88px, 21.2vw, 120px);
  }

  .event-home .event-tagline {
    margin-bottom: 23px;
    font-size: 14px;
  }

  .event-home .event-details {
    gap: 21px;
    margin-bottom: 23px;
    padding-block: 18px;
  }

  .event-home .event-location {
    padding-left: 21px;
  }

  .event-home .event-detail time,
  .event-home .event-detail strong {
    font-size: 29px;
  }

  .event-home .event-detail-label {
    font-size: 8px;
    letter-spacing: 1.5px;
  }

  .event-home .event-registration {
    gap: 13px;
  }

  .event-home .event-cta {
    width: 100%;
    min-width: 0;
    min-height: 60px;
    padding-inline: 22px;
  }

  .event-home .event-profile-link {
    align-self: center;
    font-size: 11px;
  }

  .event-home .event-poster-caption {
    right: 24px;
    bottom: 27px;
    left: 24px;
    font-size: 8px;
    letter-spacing: 1.2px;
  }

  .event-home .event-poster-caption > span:last-child {
    gap: 8px;
  }

  .event-home .footer {
    flex-direction: column;
    gap: 5px;
    padding: 20px 24px;
    font-size: 9px;
  }
}

@media (max-width: 359px) {
  .event-home .event-content {
    padding-inline: 20px;
  }

  .event-home .event-kicker {
    font-size: 7px;
    letter-spacing: 1px;
  }

  .event-home .event-title-first {
    font-size: 136px;
  }

  .event-home .event-title-second {
    font-size: 83px;
  }

  .event-home .event-details {
    gap: 16px;
  }

  .event-home .event-location {
    padding-left: 16px;
  }

  .event-home .event-detail time,
  .event-home .event-detail strong {
    font-size: 25px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .event-home .event-cta {
    transition: none;
  }

  .event-home .event-cta:hover,
  .event-home .event-cta:active {
    transform: none;
  }
}

/* Current athlete artwork complements the event poster. */
.event-home .event-content.has-gallery { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.94fr); align-items:center; gap:clamp(40px,6vw,90px); }
.event-gallery { min-width:0; width:100%; max-width:440px; justify-self:end; }
.event-gallery-heading { display:flex; align-items:center; gap:10px; margin:0 0 18px; color:#d2d8c8; font-size:9px; font-weight:800; letter-spacing:2px; }
.event-gallery-dot { width:6px; height:6px; background:#bef264; border-radius:50%; box-shadow:0 0 16px #bef26480; flex-shrink:0; }
.event-gallery-stage { position:relative; width:100%; aspect-ratio:2/3; border:1px solid #ffffff40; border-radius:18px; background:#151a16; box-shadow:0 22px 80px #0009,0 0 80px #bef2640c; overflow:hidden; isolation:isolate; touch-action:pan-y; }
.event-gallery-slide { position:absolute; inset:0; margin:0; opacity:0; visibility:hidden; }
.event-gallery-slide.is-active { opacity:1; visibility:visible; z-index:2; }
.event-gallery-slide.is-leaving { opacity:1; visibility:visible; z-index:1; }
.event-gallery-slide img { width:100%; height:100%; object-fit:cover; object-position:50% 30%; }
.event-gallery-slide figcaption { position:absolute; inset:auto 0 0; padding:80px 28px 25px; background:linear-gradient(transparent,#050805dc 55%,#050805); color:#fff; }
.event-gallery-slide figcaption>span { display:block; margin-bottom:6px; color:#bef264; font-size:12px; font-weight:800; letter-spacing:1.5px; }
.event-gallery-slide figcaption strong { display:block; font-family:'Barlow Condensed',Impact,sans-serif; font-size:clamp(34px,4vw,56px); font-weight:800; text-transform:uppercase; line-height:1; overflow-wrap:anywhere; }
.event-gallery-slide figcaption small { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-top:14px; color:#c4cbbd; font-size:8px; letter-spacing:2px; }
.event-gallery-slide figcaption b { color:#fff; font-size:18px; letter-spacing:0; }
.event-gallery-controls { display:flex; align-items:center; gap:10px; margin-top:18px; }
.event-gallery-controls button { display:inline-flex; justify-content:center; align-items:center; min-width:42px; height:42px; padding:0 13px; border:1px solid #ffffff32; border-radius:50%; color:#eff4e8; background:#ffffff08; cursor:pointer; font:inherit; font-size:21px; }
.event-gallery-controls button:hover { background:#bef264; border-color:#bef264; color:#10160b; }
.event-gallery-controls button:focus-visible { outline:3px solid #bef264; outline-offset:4px; }
.event-gallery-counter { color:#e2e7da; font-size:11px; font-variant-numeric:tabular-nums; letter-spacing:1px; }
.event-gallery-counter i { margin-inline:3px; font-style:normal; color:#66715e; }
.event-gallery-controls [data-carousel-pause] { margin-left:auto; border-radius:7px; gap:10px; font-size:10px; }
.event-gallery-note { margin:15px 0 0; color:#a6b09e; font-size:11px; text-align:center; }
@media(min-width:901px) and (max-height:800px) { .event-gallery { max-width:330px; } }
@media(max-width:1000px) and (min-width:761px) { .event-home .event-content.has-gallery { gap:30px; } .event-home .has-gallery .event-title-first {font-size:164px;} .event-home .has-gallery .event-title-second {font-size:102px;} .event-home .has-gallery .event-details {gap:16px;} .event-home .has-gallery .event-location {padding-left:16px;} .event-home .has-gallery .event-detail strong,.event-home .has-gallery .event-detail time {font-size:26px;} }
@media(max-width:760px) { .event-home .event-content.has-gallery { grid-template-columns:1fr; gap:50px; padding-bottom:115px; } .event-gallery { max-width:400px; justify-self:center; } .event-home .has-gallery .event-kicker { margin-bottom:130px; } .event-gallery-heading { font-size:8px; letter-spacing:1.7px; } .event-gallery-slide figcaption { padding-inline:23px; } .event-gallery-slide figcaption strong { font-size:44px; } }
@media(prefers-reduced-motion:reduce) { .event-gallery-slide { transition:none; } }

/* Transparent artwork blends into the existing event scene. */
.event-gallery-stage { transition:background-color .65s ease,border-color .65s ease,box-shadow .65s ease; }
.event-gallery-stage.has-cutout { background:transparent; border-color:transparent; box-shadow:none; }
.event-gallery-slide.is-cutout img { object-fit:contain; object-position:center bottom; mask-image:linear-gradient(#000 87%,transparent 100%); }
.event-gallery-slide.is-cutout figcaption { background:none; text-shadow:0 2px 16px #000,0 1px 4px #000; }
@media(prefers-reduced-motion:reduce) { .event-gallery-stage { transition:none; } }

/* Only the two moving portraits get compositing hints during a transition. */
.event-gallery.is-transitioning .event-gallery-slide:is(.is-active,.is-leaving) img { will-change:transform,filter,opacity; }
.event-gallery.is-transitioning .event-gallery-slide:is(.is-active,.is-leaving) figcaption { will-change:transform,opacity; }