/* البنر */
.banner,
.banner-fixed{
    position:relative;
    overflow:hidden;
    border-radius:22px;
    transition:
        transform .45s cubic-bezier(.2,.8,.2,1),
        box-shadow .45s ease;
    box-shadow:0 8px 30px rgba(0,0,0,.08);
}

/* الصورة */
.banner img,
.banner-fixed img{
    display:block;
    width:100%;
    transition:transform 1.6s cubic-bezier(.2,.8,.2,1);
}

/* عند المرور */
.banner:hover,
.banner-fixed:hover{
    transform:translateY(-4px);
    box-shadow:
        0 20px 45px rgba(0,0,0,.12);
}

.banner:hover img,
.banner-fixed:hover img{
    transform:scale(1.04);
}

/* إضاءة خفيفة */
.banner::after,
.banner-fixed::after{
    content:"";
    position:absolute;
    inset:0;
    background:
    radial-gradient(circle at 50% 20%,
    rgba(255,255,255,.18),
    transparent 60%);
    opacity:0;
    transition:.5s;
    pointer-events:none;
}

.banner:hover::after{
    opacity:1;
}
/* =========================
   Premium Logo Preloader
========================= */

body.loading{
    overflow:hidden;
}

body.loading::before{
    content:"";
    position:fixed;
    inset:0;
    background:rgba(255,255,255,.98);
    backdrop-filter:blur(8px);
    z-index:999998;
    transition:.5s;
}

body.loading::after{
    content:"";
    position:fixed;
    top:50%;
    left:50%;
    width:90px;
    height:90px;
    transform:translate(-50%,-50%);
    background:url("https://cdn.salla.sa/cdn-cgi/image/fit=scale-down,width=400,height=400,onerror=redirect,format=auto/LjaJ/stores/logos/fLuFqLAVX7pbRkRHdSMpWHKvouvwtd40UmXAjyXP.jpg") center/contain no-repeat;
    border-radius:50%;
    box-shadow:
        0 0 0 12px rgba(11,94,215,.08),
        0 0 40px rgba(11,94,215,.18);
    animation:
        logoFloat 1.6s ease-in-out infinite,
        logoSpin 2.8s linear infinite;
    z-index:999999;
}

@keyframes logoFloat{
    0%,100%{
        transform:translate(-50%,-50%) scale(1);
    }
    50%{
        transform:translate(-50%,-54%) scale(1.06);
    }
}

@keyframes logoSpin{
    from{
        filter:drop-shadow(0 0 0 rgba(11,94,215,.2));
    }
    50%{
        filter:drop-shadow(0 0 18px rgba(11,94,215,.35));
    }
    to{
        filter:drop-shadow(0 0 0 rgba(11,94,215,.2));
    }
}