/* =====================================================
   BEYKÖY ET – ANIMATIONS
   Soft, Premium, Micro-interactions
   ===================================================== */

/* -------------------- Base Animation States -------------------- */
[data-animate] {
    opacity: 0;
    transition: opacity 0.7s var(--ease), transform 0.7s var(--ease);
}

[data-animate="fade-up"] {
    transform: translateY(32px);
}

[data-animate="fade-left"] {
    transform: translateX(40px);
}

[data-animate="fade-right"] {
    transform: translateX(-40px);
}

[data-animate].is-visible {
    opacity: 1;
    transform: translate(0, 0);
}

/* Stagger delays */
[data-delay="100"] { transition-delay: 0.1s; }
[data-delay="200"] { transition-delay: 0.2s; }
[data-delay="300"] { transition-delay: 0.3s; }
[data-delay="400"] { transition-delay: 0.4s; }

/* -------------------- Hover Micro Interactions -------------------- */
.neden-card,
.urun-card,
.kalite-card,
.timeline-item {
    will-change: transform;
}

/* -------------------- Image Zoom -------------------- */
.urun-img-wrap,
.galeri-item,
.hakkimizda-img-wrap {
    overflow: hidden;
}

/* -------------------- Smooth Header Transition -------------------- */
.header {
    transition: background 0.35s var(--ease),
                box-shadow 0.35s var(--ease),
                backdrop-filter 0.35s var(--ease);
}

/* -------------------- Button Press Feedback -------------------- */
.btn:active {
    transform: scale(0.97);
}

/* -------------------- Focus Visible (Accessibility) -------------------- */
a:focus-visible,
button:focus-visible {
    outline: 2px solid var(--color-accent);
    outline-offset: 3px;
}

/* -------------------- Counter Animation Helper -------------------- */
.badge-num {
    transition: none;
}

/* -------------------- Reduced Motion -------------------- */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    
    [data-animate] {
        opacity: 1;
        transform: none;
    }
    
    html {
        scroll-behavior: auto;
    }
}