/* XPerf-preserving event strip: DESIGN_VARIANCE 4 / MOTION_INTENSITY 2 /
   VISUAL_DENSITY 5. Uses the site's real typefaces and #488cfe brand blue.
   The existing header owns z-index 1200; this component adds no new layer. */

:root {
  --xperf-sc26-height: 96px;
}

html.xperf-sc26-visible body {
  padding-top: var(--xperf-sc26-height);
}

/* Fill the fixed header's outer inset without changing the banner layout. */
html.xperf-sc26-visible #xperf-site-nav::after {
  position: fixed;
  z-index: -1;
  top: 0;
  right: 0;
  left: 0;
  height: calc(var(--xperf-sc26-height) + 8px);
  background: #050505;
  content: "";
  pointer-events: none;
}

#xperf-sc26-banner {
  box-sizing: border-box;
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr) auto 44px;
  align-items: center;
  column-gap: clamp(20px, 2.8vw, 48px);
  width: 100%;
  min-height: 96px;
  padding: 16px 20px 16px 28px;
  background: var(--xperf-nav-accent, #488cfe);
  color: #081529;
  border: 1px solid transparent;
  /* Keep the separator inside the measured height so mobile menus stay aligned. */
  border-bottom: 8px solid #050505;
  border-radius: 0;
  pointer-events: auto;
  isolation: isolate;
}

#xperf-sc26-banner p { margin: 0; }

#xperf-sc26-banner .xperf-sc26__event {
  display: grid;
  align-content: center;
  border-right: 1px solid rgb(8 21 41 / 28%);
  min-height: 56px;
}

#xperf-sc26-banner .xperf-sc26__mark,
#xperf-sc26-banner .xperf-sc26__mark span {
  font-family: var(--xperf-heading-font) !important;
  font-size: 43px;
  font-weight: 600;
  line-height: .95;
  letter-spacing: -.06em;
}

#xperf-sc26-banner .xperf-sc26__mark span { font-weight: 400; }

#xperf-sc26-banner .xperf-sc26__city {
  margin-top: 7px;
  font-size: 11px;
  line-height: 1;
  letter-spacing: .28em;
}

#xperf-sc26-banner .xperf-sc26__copy { min-width: 0; }

#xperf-sc26-banner .xperf-sc26__title {
  font-size: clamp(23px, 2vw, 30px);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -.02em;
}

#xperf-sc26-banner .xperf-sc26__details {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 3px 12px;
  margin-top: 7px;
  font-size: 17px;
  line-height: 1.25;
}

#xperf-sc26-banner .xperf-sc26__cta {
  display: inline-flex;
  justify-content: space-between;
  align-items: center;
  gap: 22px;
  min-height: 48px;
  padding: 0 18px;
  background: #081529;
  color: #f7f7f5;
  border: 1px solid #081529;
  border-radius: 0;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
  white-space: nowrap;
  transition: background-color 160ms ease;
}

#xperf-sc26-banner .xperf-sc26__arrow {
  display: inline-block;
  font-size: 25px;
  font-weight: 400;
  line-height: 1;
  transition: transform 160ms ease;
}

#xperf-sc26-banner .xperf-sc26__cta:hover { background: #182b47; }
#xperf-sc26-banner .xperf-sc26__cta:hover .xperf-sc26__arrow { transform: translate(2px, -2px); }
#xperf-sc26-banner .xperf-sc26__cta:active { transform: translateY(1px); }

#xperf-sc26-banner .xperf-sc26__close {
  display: inline-grid;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: inherit;
  background: transparent;
  font-size: 28px;
  font-weight: 400;
  line-height: 1;
  cursor: pointer;
}

#xperf-sc26-banner .xperf-sc26__close:hover { background: rgb(8 21 41 / 10%); }
#xperf-sc26-banner :is(a, button):focus-visible { outline: 2px solid #081529; outline-offset: 4px; }

/* The original mobile panel is fixed independently from its header. */
@media (max-width: 1099px) {
  html.xperf-sc26-visible #xperf-site-nav .xperf-nav__mobile-panel {
    top: calc(74px + var(--xperf-sc26-height));
  }
  #xperf-sc26-banner {
    grid-template-columns: 115px minmax(0, 1fr) auto 40px;
    column-gap: 18px;
    padding-inline: 20px 12px;
  }
  #xperf-sc26-banner .xperf-sc26__venue { display: none; }
}

@media (max-width: 767px) {
  #xperf-sc26-banner {
    position: relative;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px 14px;
    min-height: 126px;
    padding: 16px 20px;
  }
  #xperf-sc26-banner .xperf-sc26__event { display: none; }
  #xperf-sc26-banner .xperf-sc26__copy { grid-column: 1 / -1; padding-right: 34px; }
  #xperf-sc26-banner .xperf-sc26__title { font-size: 23px; }
  #xperf-sc26-banner .xperf-sc26__details { gap: 3px 8px; font-size: 15px; margin-top: 5px; }
  #xperf-sc26-banner .xperf-sc26__cta { min-height: 40px; width: max-content; padding: 0 13px; font-size: 16px; gap: 22px; }
  #xperf-sc26-banner .xperf-sc26__arrow { font-size: 22px; }
  #xperf-sc26-banner .xperf-sc26__close { position: absolute; top: 4px; right: 4px; }
}

@media (max-width: 480px) {
  html.xperf-sc26-visible #xperf-site-nav::after {
    height: calc(var(--xperf-sc26-height) + 4px);
  }

  html.xperf-sc26-visible #xperf-site-nav .xperf-nav__mobile-panel {
    top: calc(66px + var(--xperf-sc26-height));
  }
}

@media (prefers-reduced-motion: reduce) {
  #xperf-sc26-banner *,
  #xperf-sc26-banner :is(.xperf-sc26__cta:active, .xperf-sc26__cta:hover .xperf-sc26__arrow) {
    transition: none;
    transform: none;
  }
}

@media print {
  #xperf-sc26-banner { display: none; }
  html.xperf-sc26-visible #xperf-site-nav::after { display: none; }
  html.xperf-sc26-visible body { padding-top: 0; }
}