.slider-grid {
    position: relative;
    height: 72.5rem;
    overflow: hidden;
    perspective: 200rem;
    perspective-origin: center center;
}

.slider-track {
    display: flex;
    height: 100%;
    transition: transform 0.8s cubic-bezier(0.4, 0.0, 0.2, 1);
    will-change: transform;
    transform-style: preserve-3d;
}

.slider-track.no-transition {
    transition: none !important;
}

.slide-item {
    height: 100%;
    overflow: hidden;
    position: relative;
    flex-shrink: 0;
    transition: all 0.8s cubic-bezier(0.4, 0.0, 0.2, 1);
    will-change: transform, filter, opacity;
    transform-origin: center center;
    transform: scale(1) translateY(0) rotateY(0deg);
    opacity: 1;
    filter: blur(0px) brightness(1);
    z-index: 10;
}

.slide-item.no-transition {
    transition: none !important;
}

.slider2 .slide-item.small {
    transform: scaleY(0.85) translateY(2rem);
    z-index: 5;
}

.slider2 .slide-item.small.left {
    transform: scaleY(0.9) translateY(3rem);
}

.slider2 .slide-item.small.right {
    transform: scaleY(0.9) translateY(3rem);
}

.slider2 .slide-item.small.far-left {
    transform: scaleY(0.9) translateY(3rem);
}

.slider2 .slide-item.small.far-right {
    transform: scaleY(0.8) translateY(6rem);
}

.slide-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* .slide-item.small img {
    width: auto;
    max-width: unset;
} */

/* Slide content wrapper */
.slide-link-wrapper,
.slide-content-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    display: block;
    text-decoration: none;
    color: inherit;
}
  
.big-slide, .small-slides {
    display: none;
}

.slider2 .slide-item.small.right {
    transform: scaleY(0.9) translateX(calc(-100% + 15rem)) translateY(3rem);
    z-index: -1;
}

.slider2 .slide-item.small.far-right {
    transform: scaleY(0.8) translateX(calc(-200% + 30rem)) translateY(6rem);
    z-index: -2;
}

.slider-variant-subtle .slide-item {
    border-radius: 15px;
    transition: all 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
  
.slider-variant-subtle .slide-item.small {
    transform: scale(0.9) translateY(10px);
    opacity: 0.8;
    filter: blur(0.5px) brightness(0.9);
}
  
.slider-variant-subtle .slide-item.small.left,
.slider-variant-subtle .slide-item.small.right {
    transform: scale(0.85) translateY(15px);
    opacity: 0.7;
}
  
  
/* ========================================
    VARIANT 2: Dramatic 3D
    ======================================== */
.slider-variant-dramatic .slider-grid {
    perspective: 1500px;
}

.slider-variant-dramatic .slide-item {
    transition: all 0.8s cubic-bezier(0.4, 0.0, 0.2, 1);
}

.slider-variant-dramatic .slide-item.small {
    transform: scale(0.7) translateY(3rem) translateZ(-20rem);
}

.slider-variant-dramatic .slide-item.small.left {
    transform: scale(0.65) translateY(4rem) rotateY(15deg) translateZ(-30rem);
}

.slider-variant-dramatic .slide-item.small.right {
    transform: scaleY(0.9) translateY(4rem);
}

.slider-variant-dramatic .slide-item.small.far-left {
    transform: scale(0.5) translateY(6rem) rotateY(25deg) translateZ(-40rem);
}

.slider-variant-dramatic .slide-item.small.far-right {
    transform: scaleY(0.8) translateY(9rem);
}

/* ========================================
    VARIANT 4: Parallax Depth
    ======================================== */
.slider-variant-parallax .slider-grid {
    perspective: 2500px;
    perspective-origin: 50% 50%;
}

.slider-variant-parallax .slide-item {
    transition: all 0.9s cubic-bezier(0.23, 1, 0.32, 1);
    transform-style: preserve-3d;
}

.slider-variant-parallax .slide-item.small {
    transform: scale(0.85) translateY(2.5rem) translateZ(-15rem);
}

.slider-variant-parallax .slide-item.small.left {
    transform: scale(0.75) translateY(3.5rem) translateZ(-25rem) rotateY(10deg);
}

.slider-variant-parallax .slide-item.small.right {
    transform: scale(0.75) translateY(3.5rem) translateZ(-25rem) rotateY(-10deg);
}

.slider-variant-parallax .slide-item.small.far-left {
    transform: scale(0.6) translateY(5rem) translateZ(-40rem) rotateY(15deg);
}

.slider-variant-parallax .slide-item.small.far-right {
    transform: scale(0.6) translateY(5rem) translateZ(-40rem) rotateY(-15deg);
}


/* ========================================
    VARIANT 5: Flat Carousel
    ======================================== */
.slider-variant-flat .slide-item {
    transition: all 0.5s ease-out;
}

.slider-variant-flat .slide-item.small {
    transform: scale(0.88);
    opacity: 0.85;
    filter: brightness(0.9);
}

.slider-variant-flat .slide-item.small.left,
.slider-variant-flat .slide-item.small.right {
    transform: scale(0.88);
    opacity: 0.7;
}

.slider-variant-flat .slide-item.small.far-left,
.slider-variant-flat .slide-item.small.far-right {
    opacity: 0.5;
}

.slider-variant-flat .slide-item:hover {
    transform: scale(0.92) !important;
}


/* ========================================
    VARIANT 6: Bounce Effect
    ======================================== */
.slider-variant-bounce .slide-item {
    border-radius: 18px;
    transition: all 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.slider-variant-bounce .slide-item.small {
    transform: scale(0.82) translateY(1.5rem);
    opacity: 0.75;
    filter: blur(1px);
}

.slider-variant-bounce .slide-item.small.left {
    transform: scale(0.75) translateY(2.5rem) rotateZ(-3deg);
    opacity: 0.65;
}

.slider-variant-bounce .slide-item.small.right {
    transform: scale(0.75) translateY(2.5rem) rotateZ(3deg);
    opacity: 0.65;
}

.slider-variant-bounce .slide-item.small:hover {
    transform: scale(0.88) translateY(.5rem) !important;
    transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}


/* ========================================
    VARIANT 7: Glassmorphism
    ======================================== */
.slider-variant-glass .slide-item {
    transition: all 0.7s ease;
    backdrop-filter: blur(1rem);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.slider-variant-glass .slide-item.small {
    transform: scale(0.85) translateY(2rem);
    opacity: 0.7;
    filter: blur(2px) brightness(0.8);
    backdrop-filter: blur(1.5rem);
}

.slider-variant-glass .slide-item.small.left {
    transform: scale(0.78) translateY(3rem) rotateY(8deg);
    opacity: 0.6;
    filter: blur(3px) brightness(0.7);
}

.slider-variant-glass .slide-item.small.right {
    transform: scale(0.78) translateY(3rem) rotateY(-8deg);
    opacity: 0.6;
    filter: blur(3px) brightness(0.7);
}

.slider-variant-glass .slide-item img {
    border-radius: 20px;
}


/* ========================================
    VARIANT 8: Cinema Mode
    ======================================== */
.slider-variant-cinema .slider-grid {
    perspective: 180rem;
}

.slider-variant-cinema .slide-item {
    transition: all 0.8s cubic-bezier(0.4, 0.0, 0.2, 1);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.5);
}

.slider-variant-cinema .slide-item.small {
    transform: scale(0.75) translateY(4rem) translateZ(-10rem);
    opacity: 0.5;
    filter: blur(2px) brightness(0.6) contrast(0.9);
}

.slider-variant-cinema .slide-item.small.left {
    transform: scale(0.7) translateY(5rem) translateZ(-20rem) rotateY(12deg);
    opacity: 0.4;
    filter: blur(3px) brightness(0.5) contrast(0.8);
}

.slider-variant-cinema .slide-item.small.right {
    transform: scale(0.7) translateY(5rem) translateZ(-20rem) rotateY(-12deg);
    opacity: 0.4;
    filter: blur(3px) brightness(0.5) contrast(0.8);
}

.slider-variant-cinema .slide-item.small.far-left,
.slider-variant-cinema .slide-item.small.far-right {
    opacity: 0.2;
    filter: blur(5px) brightness(0.4);
}


/* ========================================
    Hover Enhancements for All Variants
    ======================================== */
.slide-item.small:hover {
    cursor: pointer;
    transition-duration: 0.3s;
}

/* Disable hover effects during animation */
.slider-track.animating .slide-item.small:hover {
    transform: inherit !important;
}