/* ── Page Load Animations ── */
@keyframes fadeUp {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}
@keyframes slideDown {
    from { opacity: 0; transform: translateY(-10px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes subtlePop {
    0% { transform: translateY(0) scale(1); }
    45% { transform: translateY(-2px) scale(1.02); }
    100% { transform: translateY(0) scale(1); }
}
@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}
@keyframes rotate {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* Animation classes */
.fade-up {
    animation: fadeUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) both;
}
.fade-up-d1 { animation: fadeUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0.1s both; }
.fade-up-d2 { animation: fadeUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0.2s both; }
.fade-up-d3 { animation: fadeUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0.3s both; }
.fade-up-d4 { animation: fadeUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0.4s both; }
.fade-up-d5 { animation: fadeUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0.5s both; }
.fade-up-d6 { animation: fadeUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0.6s both; }
.fade-up-d7 { animation: fadeUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0.7s both; }
.fade-up-d8 { animation: fadeUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0.8s both; }
.fade-in { animation: fadeIn 0.4s cubic-bezier(0.16, 1, 0.3, 1) both; }
.slide-down { animation: slideDown 0.3s cubic-bezier(0.16, 1, 0.3, 1) both; }
.bounce { animation: subtlePop 1s cubic-bezier(0.16, 1, 0.3, 1) both; }
.pulse { animation: pulse 2s ease-in-out infinite; }
.rotate { animation: rotate 1s linear infinite; }

/* Auto-apply to elements */
header {
    animation: fadeIn 0.4s cubic-bezier(0.16, 1, 0.3, 1) both;
}
.max-w-4xl > *:nth-child(1) { animation: fadeUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) both; }
.max-w-4xl > *:nth-child(2) { animation: fadeUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0.1s both; }
.max-w-4xl > *:nth-child(3) { animation: fadeUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0.2s both; }
.max-w-4xl > *:nth-child(4) { animation: fadeUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0.3s both; }
.max-w-4xl > *:nth-child(5) { animation: fadeUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0.4s both; }
.max-w-4xl section > *:nth-child(1) { animation: fadeUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) both; }
.max-w-4xl section > *:nth-child(2) { animation: fadeUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0.1s both; }
.max-w-4xl section > *:nth-child(3) { animation: fadeUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0.2s both; }
.max-w-4xl section > *:nth-child(4) { animation: fadeUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0.3s both; }

/* ── Hover & Transition Polish ── */
.card-hover {
    transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}
.card-hover:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 30px rgba(127, 29, 29, 0.08);
    border-color: rgba(153, 27, 27, 0.18);
}
.card-hover:active {
    transform: translateY(0);
}
.btn-hover {
    transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.btn-hover:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 22px rgba(153, 27, 27, 0.18);
}
.btn-hover:active {
    transform: translateY(0);
}
.input-focus {
    transition: border-color 0.2s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.input-focus:focus {
    box-shadow: 0 0 0 3px rgba(153, 27, 27, 0.08);
}
.nav-link-hover {
    border-radius: 8px;
    transition: background-color 0.2s cubic-bezier(0.16, 1, 0.3, 1), color 0.2s cubic-bezier(0.16, 1, 0.3, 1), border-radius 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.nav-link-hover:hover {
    background-color: rgba(255,255,255,0.14);
}

/* ── Card hover effects (any link/div card with rounded corners) ── */
a[class*="rounded"], div[class*="rounded"] {
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
a[class*="rounded"]:hover, div[class*="rounded"]:hover {
    box-shadow: 0 12px 30px rgba(127, 29, 29, 0.08);
    border-color: rgba(153, 27, 27, 0.18);
}
a[class*="rounded"]:active, div[class*="rounded"]:active {
    transform: translateY(0);
}

/* ── Table row hover ── */
tbody tr {
    transition: background-color 0.2s ease, background-color 0.2s ease;
}
tbody tr:hover {
    background-color: rgba(153, 27, 27, 0.04);
}

/* ── Button hover ── */
button[type="submit"], button[class*="bg-blue"] {
    transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}
button[type="submit"]:hover, button[class*="bg-blue"]:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 18px rgba(153, 27, 27, 0.16);
}
button[type="submit"]:active, button[class*="bg-blue"]:active {
    transform: translateY(0);
}

/* ── Input focus glow ── */
input[type="text"], input[type="search"], input:not([type]) {
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
input[type="text"]:focus, input[type="search"]:focus, input:not([type]):focus {
    box-shadow: 0 0 0 3px rgba(153, 27, 27, 0.08);
}

/* ── Nav link hover ── */
nav a {
    border-radius: 8px;
    transition: background-color 0.2s cubic-bezier(0.16, 1, 0.3, 1), color 0.2s cubic-bezier(0.16, 1, 0.3, 1), border-radius 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}
@media (hover: hover) and (pointer: fine) {
    nav a:hover {
        background-color: rgba(255,255,255,0.1);
    }
}

/* Search result animation */
#searchResult:not(.hidden) {
    animation: fadeUp 0.3s cubic-bezier(0.16, 1, 0.3, 1) both;
}
/* Countdown number pulse */
.countdown-num {
    transition: transform 0.15s cubic-bezier(0.16, 1, 0.3, 1);
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* Page-level enter/exit transitions used for navigation */
.page-transition-enter { opacity: 0; transform: translateY(6px); }
.page-transition-enter-active { opacity: 1; transform: translateY(0); transition: opacity 420ms cubic-bezier(0.16,1,0.3,1), transform 420ms cubic-bezier(0.16,1,0.3,1); }

.page-transition-exit { opacity: 1; transform: translateY(0); }
.page-transition-exit-active { opacity: 0; transform: translateY(-8px); transition: opacity 360ms cubic-bezier(0.16,1,0.3,1), transform 360ms cubic-bezier(0.16,1,0.3,1); }

@media (prefers-reduced-motion: reduce) {
    .page-transition-enter-active, .page-transition-exit-active { transition: none !important; transform: none !important; }
}