/* ==========================================================================
   Kurumsal — Blok giriş animasyonları (scroll-reveal)
   animate.css tarzı efekt seti + hafif IntersectionObserver tetikleyici
   (public/js/widgets.js içindeki başlatıcı). Bağımlılık yok, öz-barındırılan.

   Sözleşme:
   - Her blok, page-builder "Gelişmiş" sekmesinden animasyon seçilirse
     .wg-reveal[data-anim="<efekt>"] ile sarılır (bkz. frontend/blocks/_render).
   - JS, ekrana girince .is-in ekler → animasyon oynar (bir kez).
   - Erişilebilirlik: prefers-reduced-motion: reduce → animasyon YOK, içerik görünür.
   - JS yoksa (.wg-js gövdede yoksa) içerik gizlenmez → her koşulda okunur.
   ========================================================================== */

@media (prefers-reduced-motion: no-preference) {
    /* Yalnız JS aktifken (.wg-js) başlangıçta gizle — aksi halde daima görünür. */
    .wg-js .wg-reveal {
        opacity: 0;
        will-change: transform, opacity;
    }

    .wg-js .wg-reveal.is-in {
        opacity: 1;
        animation-duration: var(--wg-anim-dur, .7s);
        animation-timing-function: cubic-bezier(.22, 1, .36, 1);
        animation-fill-mode: both;
        animation-delay: var(--wg-anim-delay, 0ms);
    }

    .wg-js .wg-reveal[data-anim="fade"].is-in       { animation-name: wgFade; }
    .wg-js .wg-reveal[data-anim="fade-up"].is-in    { animation-name: wgFadeUp; }
    .wg-js .wg-reveal[data-anim="fade-down"].is-in  { animation-name: wgFadeDown; }
    .wg-js .wg-reveal[data-anim="fade-left"].is-in  { animation-name: wgFadeLeft; }
    .wg-js .wg-reveal[data-anim="fade-right"].is-in { animation-name: wgFadeRight; }
    .wg-js .wg-reveal[data-anim="zoom-in"].is-in    { animation-name: wgZoomIn; }
    .wg-js .wg-reveal[data-anim="zoom-out"].is-in   { animation-name: wgZoomOut; }
    .wg-js .wg-reveal[data-anim="slide-up"].is-in   { animation-name: wgSlideUp; }
    .wg-js .wg-reveal[data-anim="flip-up"].is-in    { animation-name: wgFlipUp; }
    .wg-js .wg-reveal[data-anim="blur-in"].is-in    { animation-name: wgBlurIn; }
}

@keyframes wgFade      { from { opacity: 0; } to { opacity: 1; } }
@keyframes wgFadeUp    { from { opacity: 0; transform: translate3d(0, 34px, 0); }  to { opacity: 1; transform: none; } }
@keyframes wgFadeDown  { from { opacity: 0; transform: translate3d(0, -34px, 0); } to { opacity: 1; transform: none; } }
@keyframes wgFadeLeft  { from { opacity: 0; transform: translate3d(46px, 0, 0); }  to { opacity: 1; transform: none; } }
@keyframes wgFadeRight { from { opacity: 0; transform: translate3d(-46px, 0, 0); } to { opacity: 1; transform: none; } }
@keyframes wgZoomIn    { from { opacity: 0; transform: scale(.9); }  to { opacity: 1; transform: none; } }
@keyframes wgZoomOut   { from { opacity: 0; transform: scale(1.08); } to { opacity: 1; transform: none; } }
@keyframes wgSlideUp   { from { transform: translate3d(0, 60px, 0); } to { transform: none; } }
@keyframes wgFlipUp    { from { opacity: 0; transform: perspective(800px) rotateX(28deg); transform-origin: top center; } to { opacity: 1; transform: none; } }
@keyframes wgBlurIn    { from { opacity: 0; filter: blur(12px); } to { opacity: 1; filter: blur(0); } }