/* Carousel component (assets/js/gc-carousel.js). Dots follow the news slider of the home page (.gc-news__dot). */
.gc-carousel { width: 100%; max-width: 100%; min-width: 0; }
/* The viewport clips sideways only (the slides beside the one shown) and lets the cards' shadow show around it
   (overflow-clip-margin; browsers without it clip the shadow at the sides). contain: the slides' width never widens
   the page. Slides are 64px apart, so the next card's shadow stays out of the clip margin. */
.gc-carousel__viewport { overflow-x: clip; overflow-y: visible; overflow-clip-margin: 28px; contain: inline-size; transition: height .45s ease; }
.gc-carousel__track { display: flex; gap: 64px; align-items: flex-start; transition: transform .6s cubic-bezier(.22, .61, .36, 1); will-change: transform; }
.gc-carousel__slide { flex: 0 0 100%; min-width: 0; }
.gc-carousel__slide > .div-block-17 { width: 100%; box-sizing: border-box; }
.gc-carousel__controls { display: flex; align-items: center; justify-content: center; gap: 1.25rem; margin-top: 1.75rem; }
.gc-carousel__controls[hidden] { display: none; }
.gc-carousel__arrow {
  width: 44px; height: 44px; border-radius: 50%; border: 1px solid #e6e3e3; background: #fff; color: #141518;
  display: inline-flex; align-items: center; justify-content: center; padding: 0; cursor: pointer;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.gc-carousel__arrow:hover { background: #141518; border-color: #141518; color: #fff; }
.gc-carousel__arrow:focus-visible, .gc-carousel__dot:focus-visible { outline: 2px solid #141518; outline-offset: 3px; }
.gc-carousel__arrow svg { width: 18px; height: 18px; }
.gc-carousel__dots { display: flex; justify-content: center; gap: 6px; }
.gc-carousel__dot { width: 20px; height: 10px; border-radius: 99px; background: #c9cdd2; border: 0; padding: 0; cursor: pointer; transition: width .3s ease, background-color .3s ease; }
.gc-carousel__dot.is-active { width: 36px; background: #141414; }
@media (prefers-reduced-motion: reduce) {
  .gc-carousel__viewport, .gc-carousel__track, .gc-carousel__dot { transition: none; }
}
