/* ═══════════════════════════════════════════════════════════
   NICKEL THEME — Animations (Light)
   ═══════════════════════════════════════════════════════════ */

/* ─── Reveal on scroll ─────────────────────────────────────── */

[data-reveal] {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
[data-reveal].is-visible { opacity: 1; transform: translateY(0); }

[data-reveal="fade"] { transform: none; }
[data-reveal="slide-left"] { transform: translateX(-30px); }
[data-reveal="slide-left"].is-visible { transform: translateX(0); }
[data-reveal="slide-right"] { transform: translateX(30px); }
[data-reveal="slide-right"].is-visible { transform: translateX(0); }
[data-reveal="scale"] { transform: scale(0.96); }
[data-reveal="scale"].is-visible { transform: scale(1); }

/* Stagger delays */
[data-delay="1"] { transition-delay: 0.1s; }
[data-delay="2"] { transition-delay: 0.2s; }
[data-delay="3"] { transition-delay: 0.3s; }
[data-delay="4"] { transition-delay: 0.4s; }
[data-delay="5"] { transition-delay: 0.5s; }
[data-delay="6"] { transition-delay: 0.6s; }

/* ─── Page transition ──────────────────────────────────────── */

.page-transition {
    animation: pageIn 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}

@keyframes pageIn {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ─── Hover effects ────────────────────────────────────────── */

.hover-lift {
    transition: transform var(--t-normal) var(--ease-out),
                box-shadow var(--t-normal) var(--ease-out);
}
.hover-lift:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
}

/* ─── Loading skeleton ─────────────────────────────────────── */

.skeleton {
    position: relative;
    overflow: hidden;
    background: var(--c-bg-elevated);
    border-radius: var(--r-md);
}
.skeleton::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent, rgba(0,0,0,0.03), transparent);
    animation: skeleton-shimmer 1.5s infinite;
}

@keyframes skeleton-shimmer {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(100%); }
}

/* ─── Prefers 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-reveal] { opacity: 1; transform: none; }
    .marquee__track { animation: none; }
}

@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}