/* -------------- Carousel container ----------- */
  .carousel {
    position: relative;
    width: 100%;
    overflow: hidden;
    user-select:none;               /* avoid accidental image selection */
    touch-action: pan-y;            /* allow horizontal swipes only */
  }

  /* -------------- Slides wrapper --------------- */
  .slides {
    display:flex;
    transition:transform .5s ease-in-out;
  }

  .slide {
    min-width:100%;
  }

  .slide .image-wrap  {
    height: 100dvh;
  }

  .slide  .image-wrap img {
    width:100%;
    display:block;
    height: 100%;
    object-fit: contain;
    object-position: center center;
  }

  /* -------------- Navigation arrows ------------- */
  .nav {
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:48rem;
    height:48rem;
    background:rgba(0,0,0,.5);
    border-radius:50%;
    color:#fff;
    font-size:24rem;
    line-height:48rem;
    text-align:center;
    cursor:pointer;
    z-index:10;
    user-select:none;
  }
  .nav:hover { background:rgba(0,0,0,.8); }
  .nav.prev { left:12rem; }
  .nav.next { right:12rem; }

  /* -------------- Pagination dots --------------- */
  .dots {
    position:absolute;
    bottom:12rem;
    left:50%;
    transform:translateX(-50%);
    display:flex;
    gap:8rem;
    z-index:10;
  }
  .dot {
    width:18rem;
    height:18rem;
    border-radius:50%;
    background:rgba(0,0,0,.4);
    cursor:pointer;
  }
  .dot.active { background:rgba(0,0,0,.9); }


  /* Custom */
  .module-carousel .carousel-wrap {
    padding: 0;
}
    .nav {
    display: none;
  }

    .slide .image-wrap  {
    height: 135rem;
  }

    .dots {
        bottom: -40rem;
    }
.dot {
    background:transparent;
    border: 1rem solid var(--navy);
  }


  .dot.active {
    background-color: var(--navy);
}