/* ---------------------------- */
/* UNIVERSAL SLIDER CONTAINER  */
/* ---------------------------- */
.home-contain {
    position: relative;
    overflow: hidden;
}

/* ---------------------------- */
/* SLIDER 1 (LEFT MAIN) BLUR   */
/* ---------------------------- */
.blur-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 48%;
    height: 100%;

    background: linear-gradient(
        to right,
        rgba(255, 255, 255, 0.80) 0%,
        rgba(255, 255, 255, 0.60) 40%,
        rgba(255, 255, 255, 0.20) 100%
    );

    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);

    border-top-right-radius: 50px;
    border-bottom-right-radius: 50px;

    z-index: 1;
}

/* ---------------------------- */
/* SLIDER 2 (TOP RIGHT) BLUR   */
/* ---------------------------- */
.blur-small-top {
    position: absolute;
    top: 0;
    left: 0;
    width: 38%;
    height: 100%;

    background: linear-gradient(
        to right,
        rgba(255, 255, 255, 0.90) 0%,
        rgba(255, 255, 255, 0.70) 40%,
        rgba(255, 255, 255, 0.30) 80%,
        rgba(255, 255, 255, 0.05) 100%
    );

    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-top-right-radius: 45px;
    border-bottom-right-radius: 45px;
    z-index: 1;
}

/* ---------------------------- */
/* SLIDER 3 (BOTTOM RIGHT) BLUR*/
/* ---------------------------- */
.blur-small-bottom {
    position: absolute;
    top: 0;
    left: 0;
    width: 38%; /* slightly smaller than slider 2 for balance */
    height: 100%;

    background: linear-gradient(
        to right,
        rgba(255, 255, 255, 0.78) 0%,
        rgba(255, 255, 255, 0.55) 40%,
        rgba(255, 255, 255, 0.10) 100%
    );

    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);

    border-top-right-radius: 50px;
    border-bottom-right-radius: 50px;

    z-index: 1;
}


/* TEXT ALWAYS ABOVE BLUR */
.home-detail {
    position: relative;
    z-index: 2;
}
