.rotateslider-container {
    position: relative;
    width: 100%;
    height: 500px;
    margin: 0px auto 0;
    border-radius: 0px;
    overflow: hidden;
}
.rotateslider-container .item:after {
  content: "";
  position: absolute;
  width: 100%;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.92) 0%, rgba(0, 0, 0, 0) 100%, rgba(0, 0, 0, 0.39) 100%);
  bottom: 0;
  left: 0;
  height: 128px;
}
.rotateslider-container .item {
    position: relative;
    border-radius: 15px;
    overflow: hidden;
}
.testmonialDes {
    position: absolute;
    bottom: 20px;
    padding: 0 20px 0;
    color: #FFF;
    z-index: 1;
    font-size: 19px;
    line-height: 26px;
    opacity: 0;
}
.rotateslider-container .rotateslider-item.now .testmonialDes {opacity: 1;}


  .rotateslider-container .rotateslider-item {
    position: absolute;
    left: 50%; top: 50%;
    transform: translateY(-50%) translateX(-50%) scale(0.6);
    opacity: 0;
    transition: all 0.5s ease;
  }
  .rotateslider-container .rotateslider-item img {
    width: min(550px, 37vw);
    height: min(450px, 51vw);
    object-fit: cover;
    border-radius: 0px;
    display: block;
  }
 .rotateslider-container .rotateslider-item.next {
    left: 65%;
    opacity: 0.45;
    transform: translateY(-50%) translateX(0%) scale(0.6);
}
  .rotateslider-container .rotateslider-item.prev { left: 19%; opacity: 0.45; }
  .rotateslider-container .rotateslider-item.now {
    opacity: 1; filter: blur(0);
    transform: translateY(-50%) translateX(-50%) scale(1);
    z-index: 11;
  }

  .rotateslider-container .arrow {
    display: flex; align-items: center; justify-content: center;
    width: 40px; height: 40px;
    background: rgb(74 73 73);
    border-radius: 50%;
    position: absolute; top: 50%; margin-top: -20px;
    cursor: pointer; color: #fff; font-size: 20px;
    transition: background 0.2s;
    z-index: 10; user-select: none;
  }
  .rotateslider-container .arrow:hover { background: rgb(219 168 115); }
  .rotateslider-container .arrow.left  { left: 10px; }
  .rotateslider-container .arrow.right { right: 33px; }

  /* ── Dots ── */
  .dots {
    margin: 14px auto 24px;
    display: flex; gap: 12px; justify-content: center;
  }
  .dot {
    width: 22px; height: 22px;
    position: relative; cursor: pointer;
    flex-shrink: 0;
  }
  .dot svg {
    width: 22px; height: 22px;
    transform: rotate(-90deg);
  }
  .dot .track { fill: none; stroke: #555; stroke-width: 2.5; }
  .dot .fill {
    fill: none; stroke: #e74c3c; stroke-width: 2.5;
    stroke-linecap: round;
    stroke-dasharray: 53.4;
    stroke-dashoffset: 53.4;
    transition: stroke-dashoffset linear;
  }
  .dot .inner { fill: #555; transition: fill 0.3s; }
  .dot.active .inner { fill: #e74c3c; }

  /* ── Mobile: single item fullwidth ── */
  @media (max-width: 480px) {
    .rotateslider-container {
      width: 100vw;
      height: 75vw;
      border-radius: 0;
      margin-top: 16px;
    }
    /* hide side items */
    .rotateslider-container .rotateslider-item.next,
    .rotateslider-container .rotateslider-item.prev {
      opacity: 0 !important;
      pointer-events: none;
    }
    /* active image fills container */
    .rotateslider-container .rotateslider-item img {
      width: 100vw;
      height: 75vw;
      border-radius: 0;
    }
    .dot { width: 18px; height: 18px; }
    .dot svg { width: 18px; height: 18px; }
  }