.slider-ctrl { width:48px; height:48px; font-size: 24px; line-height: 1; opacity: 0.7; transition: opacity 0.3s; }
.slider-ctrl:hover { opacity: 1; }
.indicator { width:10px; height:10px; border-radius:50%; background:rgba(255,255,255,.5); border:none; transition: all 0.3s; padding: 0; }
.indicator.active { width:16px; height:16px; background:#fff; }
.badges-stack { position:absolute; top:10px; right:10px; display:flex; flex-direction:column; gap:6px; pointer-events:none; align-items: flex-end; }
.hover-lift { transition: transform 0.2s; }
.hover-lift:hover { transform: translateY(-5px); }
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
.ms-n3 { margin-left: -1rem; }
.me-n3 { margin-right: -1rem; }

/* Анимации для слайдера */
.slide-content { transition: all .6s ease .2s; }
.translate-0 { transform: translateX(0); }
.translate-x-2 { transform: translateX(12px); }

/* Hero Slider Styles */
.hero-slider-container {
    height: 80vh;
    min-height: 500px;
    touch-action: pan-y;
}

.slide-overlay {
    background-color: #0a0a0a;
}

.slide-content-wrapper {
    z-index: 2;
}

.mobile-content {
    z-index: 5;
}

.mobile-image-container {
    height: 180px;
}

.desktop-image {
    max-height: 400px;
}

.slide-controls {
    z-index: 10;
}

.slide-indicators {
    z-index: 10;
}

@media (min-width: 768px) {
    .desktop-indicators-offset {
        padding-bottom: 0 !important;
        margin-bottom: 8rem !important;
    }
}

/* Carousel Styles */
.carousel-nav-btn {
    width: 40px;
    height: 40px;
    z-index: 5;
}

.carousel-item-standard {
    width: 280px;
}

.carousel-item-wide {
    width: 380px;
    max-width: 90vw;
}

/* Tablet adjustments */
@media (min-width: 768px) and (max-width: 991px) {
    .carousel-item-standard {
        width: calc(50% - 16px); /* 2 items per row with 16px gap */
    }
    .carousel-item-wide {
        width: calc(50% - 24px); /* 2 items per row with 24px gap */
    }
}

/* Promo Sections */
.buyout-promo {
    background: linear-gradient(135deg, #000000 0%, #222222 100%);
    color: white;
    border: 1px solid #333;
}

.promo-icon-container {
    height: 100%;
    min-height: 300px;
}

.tradein-promo {
    background: linear-gradient(135deg, #1a1a1a 0%, #333333 100%);
    color: white;
    border: 1px solid #444;
}