/* Full-image carousel; the former overlapping promotion card is retired. */
.keyshot-carousel { background: #101112; aspect-ratio: 12 / 5; }
.keyshot-carousel .keyshot-slide > a { display: block; }
.keyshot-carousel .keyshot-slide img { display: block; width: 100%; height: auto; min-height: 0; aspect-ratio: 12 / 5; }
.keyshot-carousel:not(.keyshot-ready) .keyshot-slide:not(:first-child) { display: none; }
.keyshot-carousel .keyshot-controls[hidden] { display: none; }
.keyshot-carousel .keyshot-pagination { bottom: 7%; left: 0; width: 100%; line-height: 24px; pointer-events: none; }
.keyshot-carousel .keyshot-pagination button { padding: 0; margin: 0 5px; cursor: pointer; pointer-events: auto; vertical-align: middle; }
.keyshot-carousel .keyshot-prev, .keyshot-carousel .keyshot-next { top: 50%; padding: 0; font-family: inherit; }
.keyshot-carousel:focus-within .keyshot-prev { left: 60px; opacity: 1; }
.keyshot-carousel:focus-within .keyshot-next { right: 60px; opacity: 1; }
.keyshot-carousel .keyshot-pause { position: absolute; z-index: 11; right: 26px; top: 24px; width: 34px; height: 34px; padding: 0; border: 1px solid #ffffff65; border-radius: 50%; background: #10111280; color: #fff; cursor: pointer; font-size: 14px; line-height: 32px; }
.keyshot-carousel button:focus-visible, .keyshot-carousel a:focus-visible { outline: 3px solid #d79d49; outline-offset: -3px; }
/* Remove the desktop spacing that previously compensated for the promo overlap. */
@media (min-width: 1025px) {
  .keyshot-carousel + .index_ad { padding-top: 50px; }
}
@media (max-width: 768px) {
  .keyshot-carousel .keyshot-pagination { bottom: 7%; }
  .keyshot-carousel .keyshot-pause { top: 8px; right: 8px; width: 28px; height: 28px; line-height: 26px; font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .keyshot-carousel .keyshot-slide img { transition: none; transform: none; }
}