/* ============================================================
   Andy Jost Music – Motion Layer
   Einbinden im <head> NACH styles.css:
   <link href="assets/css/motion.css" rel="stylesheet">
   ============================================================ */

:root {
    /* Eine Kurve für alles. Stark genug, dass Motion nicht schlapp wirkt. */
    --aj-ease: cubic-bezier(.2, 0, 0, 1);
    --aj-fast: 120ms;
    --aj-base: 180ms;
    --aj-slow: 260ms;
}

/* ------------------------------------------------------------
   1. Links & Buttons – Press-Feedback
   Feedback beim Drücken, nicht erst beim Loslassen.
------------------------------------------------------------ */
.btn,
.andyjost-link,
button,
a.btn {
    transition:
        transform var(--aj-fast) var(--aj-ease),
        opacity   var(--aj-base) var(--aj-ease),
        background-color var(--aj-base) var(--aj-ease),
        border-color var(--aj-base) var(--aj-ease),
        color var(--aj-base) var(--aj-ease);
}

.btn:active,
button:active,
a.btn:active {
    transform: scale(.97);
    transition-duration: 80ms;
}

/* ------------------------------------------------------------
   2. Hover nur auf echten Zeigergeräten
   Verhindert Sticky-Hover auf Touch.
------------------------------------------------------------ */
@media (hover: hover) and (pointer: fine) {

    .btn:hover,
    button:hover,
    a.btn:hover {
        opacity: .88;
    }

    /* Event-Karten heben leicht ab */
    .event-card .card {
        transition:
            transform var(--aj-base) var(--aj-ease),
            box-shadow var(--aj-base) var(--aj-ease);
    }

    .event-card:not(.past-event) .card:hover {
        transform: translateY(-3px);
        box-shadow: 0 12px 28px rgba(0, 0, 0, .35);
    }

    /* Galerie-Bilder */
    .andyjost-gallery-img {
        transition: opacity var(--aj-base) var(--aj-ease),
                    transform var(--aj-base) var(--aj-ease);
    }

    .andyjost-gallery-img:hover {
        opacity: .82;
        transform: scale(1.015);
    }

    /* Navigation */
    .navbar-nav .nav-link {
        transition: color var(--aj-base) var(--aj-ease);
    }
}

/* ------------------------------------------------------------
   3. Bandmitglieder-Fotos
------------------------------------------------------------ */
@media (hover: hover) and (pointer: fine) {
    .andyjost-member-photo {
        transition: transform var(--aj-slow) var(--aj-ease);
    }
    .andyjost-member-photo:hover {
        transform: scale(1.04);
    }
}

/* ------------------------------------------------------------
   4. Formularfelder
------------------------------------------------------------ */
.bf input,
.bf textarea {
    transition:
        border-color var(--aj-base) var(--aj-ease),
        background-color var(--aj-base) var(--aj-ease);
}

/* ------------------------------------------------------------
   5. Reduced Motion
   Kein "alles aus" – Bewegung raus, Farb-/Opacity-Feedback bleibt.
------------------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
    }

    /* Transform-Bewegung komplett raus */
    .btn:active,
    button:active,
    a.btn:active,
    .event-card .card:hover,
    .andyjost-gallery-img:hover,
    .andyjost-member-photo:hover {
        transform: none !important;
    }

    /* Farb-/Opacity-Übergänge bleiben, nur schneller */
    .btn,
    button,
    a.btn,
    .bf input,
    .bf textarea,
    .navbar-nav .nav-link {
        transition-duration: 60ms !important;
    }
}
