
.pm-static-slider {
  position: relative;
  width: 100%;
  aspect-ratio: 4.55 / 1;
  background: #111;
  overflow: hidden;
}
.pm-slide {
  position: absolute;
  inset: 0;
  display: none;
}
.pm-slide.active { display: block; }
.pm-slide video, .pm-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.pm-slide-title {
  position: absolute;
  left: 4%;
  bottom: 18%;
  color: white;
  font: 28px Arial, sans-serif;
}
.pm-prev, .pm-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: transparent;
  color: #aaa;
  border: 0;
  font-size: 28px;
  cursor: pointer;
  padding: 12px;
}
.pm-prev { left: 1%; }
.pm-next { right: 1%; }
.pm-dots {
  position: absolute;
  bottom: 9%;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 10px;
}
.pm-dots button {
  width: 9px;
  height: 9px;
  border: 0;
  border-radius: 50%;
  background: #aaa;
  cursor: pointer;
}
.pm-dots button.active { background: #168aff; }
@media(max-width:767px) {
  .pm-static-slider { aspect-ratio: 2 / 1; }
  .pm-slide-title { font-size: 16px; }
}


/* HERO BANNER ARROWS AND DOTS FIX */

/* Keep arrow buttons inside the banner */
.pm-static-slider {
    position: relative !important;
}

/* Arrow appearance */
.pm-static-slider .pm-slider-prev,
.pm-static-slider .pm-slider-next {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: #999 !important;
    font-size: 0 !important;
    width: 36px !important;
    height: 44px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 10 !important;
}

/* Left arrow points outward */
.pm-static-slider .pm-slider-prev {
    left: 12px !important;
}

.pm-static-slider .pm-slider-prev::after {
    content: "\276E" !important;
    font-size: 28px !important;
}

/* Right arrow points outward */
.pm-static-slider .pm-slider-next {
    right: 12px !important;
}

.pm-static-slider .pm-slider-next::after {
    content: "\276F" !important;
    font-size: 28px !important;
}

/* Small round pagination dots */
.pm-static-slider .pm-slider-dot {
    width: 10px !important;
    height: 10px !important;
    min-width: 10px !important;
    min-height: 10px !important;
    padding: 0 !important;
    margin: 0 4px !important;
    border: none !important;
    border-radius: 50% !important;
    box-shadow: none !important;
    aspect-ratio: 1 / 1 !important;
}

/* Mobile */
@media (max-width: 767px) {
    .pm-static-slider .pm-slider-prev {
        left: 5px !important;
    }

    .pm-static-slider .pm-slider-next {
        right: 5px !important;
    }

    .pm-static-slider .pm-slider-prev::after,
    .pm-static-slider .pm-slider-next::after {
        font-size: 22px !important;
    }

    .pm-static-slider .pm-slider-dot {
        width: 8px !important;
        height: 8px !important;
        min-width: 8px !important;
        min-height: 8px !important;
    }
}


/* FINAL HERO CONTROLS */

/* Keep original banner dimensions */
.pm-static-slider {
    position: relative !important;
}

/* Arrow buttons */
.pm-static-slider .pm-prev,
.pm-static-slider .pm-next {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    height: 44px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    color: #aaa !important;
    font-size: 0 !important;
    cursor: pointer !important;
    z-index: 20 !important;
}

/* Left arrow points outward */
.pm-static-slider .pm-prev {
    left: 12px !important;
}

.pm-static-slider .pm-prev::after {
    content: "\276E" !important;
    font-size: 28px !important;
}

/* Right arrow points outward */
.pm-static-slider .pm-next {
    right: 12px !important;
}

.pm-static-slider .pm-next::after {
    content: "\276F" !important;
    font-size: 28px !important;
}

/* Small circular pagination buttons */
.pm-static-slider .pm-dots {
    gap: 8px !important;
}

.pm-static-slider .pm-dots button {
    display: block !important;
    box-sizing: border-box !important;
    flex: 0 0 10px !important;
    width: 10px !important;
    height: 10px !important;
    min-width: 10px !important;
    min-height: 10px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: #aaa !important;
}

.pm-static-slider .pm-dots button.active {
    background: #168aff !important;
}

@media (max-width: 767px) {
    .pm-static-slider .pm-prev {
        left: 5px !important;
    }

    .pm-static-slider .pm-next {
        right: 5px !important;
    }

    .pm-static-slider .pm-prev::after,
    .pm-static-slider .pm-next::after {
        font-size: 22px !important;
    }

    .pm-static-slider .pm-dots button {
        flex-basis: 8px !important;
        width: 8px !important;
        height: 8px !important;
        min-width: 8px !important;
        min-height: 8px !important;
    }
}


/* HERO ARROW DIRECTION CORRECTION */

/* Hide existing arrow text */
.pm-static-slider .pm-prev,
.pm-static-slider .pm-next {
    font-size: 0 !important;
    line-height: 1 !important;
}

/* Left arrow points left */
.pm-static-slider .pm-prev::after {
    content: "\276E" !important;
    display: block !important;
    font-family: Arial, sans-serif !important;
    font-size: 30px !important;
    font-weight: bold !important;
    color: #aaa !important;
    line-height: 1 !important;
}

/* Right arrow points right */
.pm-static-slider .pm-next::after {
    content: "\276F" !important;
    display: block !important;
    font-family: Arial, sans-serif !important;
    font-size: 30px !important;
    font-weight: bold !important;
    color: #aaa !important;
    line-height: 1 !important;
}


/* HERO ARROWS RTL FINAL FIX */
.pm-static-slider .pm-prev,
.pm-static-slider .pm-next {
    direction: ltr !important;
    unicode-bidi: isolate !important;
    font-family: Arial, sans-serif !important;
    font-size: 28px !important;
    line-height: 1 !important;
    color: #aaa !important;
    background: transparent !important;
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    appearance: none !important;
}

.pm-static-slider .pm-prev::before,
.pm-static-slider .pm-prev::after,
.pm-static-slider .pm-next::before,
.pm-static-slider .pm-next::after {
    content: none !important;
    display: none !important;
}
