/* Homepage-only artwork; city pages retain their current banners. */
body .city-grid-graphic > a,
body .city-grid-graphic > a:last-child {
  container-type: inline-size;
  aspect-ratio: 16 / 9;
  background-size: 100% 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-color: #09090b;
  border-color: color-mix(in srgb, var(--led-color) 48%, #16161a);
  box-shadow: none;
}
body .city-grid-graphic > .dallas { background-image: url('/city-graphics/dallas.webp'); }
body .city-grid-graphic > .austin { background-image: url('/city-graphics/austin.webp'); }
body .city-grid-graphic > .houston { background-image: url('/city-graphics/houston.webp'); --city-label-size: 10.3cqw; }
body .city-grid-graphic > .san-antonio { background-image: url('/city-graphics/san-antonio.webp'); --city-label-size: 8.1cqw; }
body .city-grid-graphic > a > strong {
  position: absolute;
  inset: auto 4% 5%;
  display: block;
  width: 92%;
  height: auto;
  padding: 0;
  margin: 0;
  overflow: visible;
  clip-path: none;
  color: #fafafa;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 900;
  font-size: var(--city-label-size, 11.5cqw);
  line-height: 1.08;
  letter-spacing: -.045em;
  text-align: center;
  white-space: nowrap;
  text-shadow: none;
}
body .city-grid-graphic > a > strong > em {
  color: var(--led-color);
  font: inherit;
  letter-spacing: inherit;
  font-style: normal;
}
body .city-grid-graphic > a::after { opacity: .4; }
body .city-grid-graphic > a:hover,
body .city-grid-graphic > a:focus-visible {
  border-color: var(--led-color);
  box-shadow: 0 0 18px color-mix(in srgb, var(--led-color) 18%, transparent);
}
