.banner-slider-container { width: 100%; position: relative; overflow: hidden; background: #000; font-family: 'Poppins', sans-serif; }
.slider-wrapper { position: relative; width: 100%; aspect-ratio: 1464 / 600; }
.slider-track { display: flex; transition: transform 0.5s ease-in-out; height: 100%; }
.slider-track img { width: 100%; flex-shrink: 0; object-fit: cover; }
.slider-arrow { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(0, 0, 0, 0.3); color: white; border: none; padding: 15px 10px; cursor: pointer; font-size: 24px; z-index: 10; transition: background 0.3s; }
.slider-arrow:hover { background: rgba(0, 0, 0, 0.7); }
.slider-arrow.prev { left: 10px; border-radius: 0 5px 5px 0; }
.slider-arrow.next { right: 10px; border-radius: 5px 0 0 5px; }
.slider-dots { position: absolute; bottom: 15px; left: 50%; transform: translateX(-50%); display: flex; gap: 8px; z-index: 10; }
.dot { width: 10px; height: 10px; background: rgba(255, 255, 255, 0.5); border-radius: 50%; cursor: pointer; transition: 0.3s; }
.dot.active { background: #fff; width: 25px; border-radius: 5px; }