/* ============================================================
   Scroll Animate — سیستم یکپارچه‌ی انیمیشن هنگام اسکرول
   جایگزین کامل Animate.css در کل سایت
   ============================================================ */

/* پایه: محو + سرخوردن ملایم از پایین به بالا
   برای ۹۰٪ موارد استفاده کن (کارت‌ها، متن، فرم‌ها، بلوک‌های محتوا) */
.saz {
    opacity: 0;
    transform: translateY(35px);
    transition: opacity 1.2s cubic-bezier(0.34, 1.56, 0.64, 1),
                transform 1.2s cubic-bezier(0.34, 1.56, 0.64, 1);
    will-change: opacity, transform;
}

.saz.saz-in {
    opacity: 1;
    transform: translateY(0);
}

.saz.saz-out {
    opacity: 0;
    transform: translateY(35px);
    transition: opacity 0.4s ease, transform 0.4s ease;
}

/* تاخیرهای پلکانی — برای المان‌های تکرارشونده تو یک @foreach/گرید */
.saz[data-delay="100"] { transition-delay: 0.1s; }
.saz[data-delay="200"] { transition-delay: 0.2s; }
.saz[data-delay="300"] { transition-delay: 0.3s; }
.saz[data-delay="400"] { transition-delay: 0.4s; }
.saz[data-delay="500"] { transition-delay: 0.5s; }

/* ============================================================
   نسخه‌ی تاکیدی: زوم ملایم
   فقط برای المان‌هایی که خودشون «مقصد نگاه» کاربرن:
   - عکس اصلی محصول (کاروسل تک‌محصول)
   - عکس تزئینی/برندینگ کنار فرم لاگین
   - بنر/سکشن تخفیف و پروموشن
   هرگز روی: متن مقاله/دوره، خود فرم‌ها، کارت‌های تکرارشونده تو گرید
   ============================================================ */
.saz-zoom {
    opacity: 0;
    transform: scale(0.85);
    transition: opacity 0.8s ease,
                transform 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);
    will-change: opacity, transform;
}

.saz-zoom.saz-in {
    opacity: 1;
    transform: scale(1);
}

.saz-zoom.saz-out {
    opacity: 0;
    transform: scale(0.85);
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.saz-zoom[data-delay="100"] { transition-delay: 0.1s; }
.saz-zoom[data-delay="200"] { transition-delay: 0.2s; }
.saz-zoom[data-delay="300"] { transition-delay: 0.3s; }
.saz-zoom[data-delay="400"] { transition-delay: 0.4s; }
.saz-zoom[data-delay="500"] { transition-delay: 0.5s; }