/* ═══════════════ هيكل سلايدر البنرات (يحل محل Bootstrap Carousel) ═══════════════ */
.hero-slider-root { position: relative; overflow: hidden; }
.hero-slide-wrap { position: absolute; inset: 0; visibility: hidden; }
.hero-slide-wrap .hero-slide-bg,
.hero-slide-wrap .hero-slide-body { will-change: transform, opacity; }
.hero-dots { position: absolute; bottom: 18px; left: 0; right: 0; display: flex; justify-content: center; gap: 8px; z-index: 5; }
.hero-dots button { width: 8px; height: 8px; border-radius: 50%; border: none; background: rgba(255,255,255,.45); padding: 0; cursor: pointer; transition: .25s; }
.hero-dots button.active { background: #fff; width: 22px; border-radius: 5px; }

/* ═══════════════ دخول البنرات الثابتة (Triple / Hero Left / Hero Right) ═══════════════ */
.static-entrance-fade { animation: bannerStaticFadeIn var(--entrance-duration, 600ms) ease-out both; }
.static-entrance-zoom { animation: bannerStaticZoomIn var(--entrance-duration, 600ms) ease-out both; }
@keyframes bannerStaticFadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes bannerStaticZoomIn { from { opacity: 0; transform: scale(.94); } to { opacity: 1; transform: none; } }

/* ═══════════════ البنر المستقل (Standalone) — ظهور عند التمرير ═══════════════ */
.sab-wrap { position: relative; overflow: hidden; }
.sab-effect-fade { opacity: 0; transition: opacity var(--sab-duration, 800ms) ease-out; }
.sab-effect-fade.in-view { opacity: 1; }

.sab-effect-zoom { opacity: 0; transform: scale(.92); transition: opacity var(--sab-duration, 800ms) ease-out, transform var(--sab-duration, 800ms) ease-out; }
.sab-effect-zoom.in-view { opacity: 1; transform: none; }

.sab-effect-parallax { opacity: 0; transition: opacity var(--sab-duration, 800ms) ease-out; }
.sab-effect-parallax.in-view { opacity: 1; }
.sab-effect-parallax .sab-bg { position: absolute; inset: -40px 0; will-change: transform; }

.sab-effect-staggered [data-sab-part] { opacity: 0; transform: translateY(18px); transition: opacity .6s ease-out, transform .6s ease-out; }
.sab-effect-staggered.in-view [data-sab-part] { opacity: 1; transform: none; }

/* ═══════════════ تأثيرات Hover (مشتركة لكل أنواع البنر) ═══════════════ */
.hb-zoom { overflow: hidden; }
.hb-zoom img, .hb-zoom .sab-bg, .hb-zoom .hero-slide-bg { transition: transform .5s ease-out; }
.hb-zoom:hover img, .hb-zoom:hover .sab-bg, .hb-zoom:hover .hero-slide-bg { transform: scale(1.06); }

.hb-lift .hb-content { transition: transform .35s ease-out; }
.hb-lift:hover .hb-content { transform: translateY(-6px); }

.hb-light-sweep { position: relative; overflow: hidden; }
.hb-light-sweep::after {
    content: ''; position: absolute; top: 0; bottom: 0; left: -60%; width: 40%;
    background: linear-gradient(75deg, transparent, rgba(255,255,255,.35), transparent);
    transform: skewX(-20deg); transition: left .9s ease; pointer-events: none; z-index: 5;
}
.hb-light-sweep:hover::after, .hb-light-sweep.sweep-active::after { left: 130%; }

/* ═══════════════ احترام تفضيل تقليل الحركة (Accessibility) ═══════════════ */
@media (prefers-reduced-motion: reduce) {
    .sab-effect-fade, .sab-effect-zoom, .sab-effect-parallax,
    .sab-effect-staggered [data-sab-part] { transition-duration: .01ms !important; }
    .hero-slide-wrap * { transition-duration: .01ms !important; animation-duration: .01ms !important; }
    .hb-zoom img, .hb-zoom .sab-bg, .hb-zoom .hero-slide-bg, .hb-lift .hb-content { transition: none !important; }
    .static-entrance-fade, .static-entrance-zoom { animation-duration: .01ms !important; }
}