/* ═══════════════════════════════════════════════════
   CTA — Sticky call-to-action button
   ═══════════════════════════════════════════════════ */

.sticky-cta {
    position: fixed;
    inset-block-end: 20px;
    inset-inline-start: 50%;
    transform: translateX(-50%);
    inline-size: 90%;
    max-inline-size: 500px;
    background: linear-gradient(135deg, var(--accent-red), var(--accent-red-dark));
    color: var(--white);
    text-align: center;
    padding: 18px;
    font-family: var(--font-sans);
    font-size: 1.1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    border: none;
    border-radius: 50px;
    box-shadow: var(--shadow-glow-red);
    cursor: pointer;
    z-index: 100;
    transition: all var(--duration-fast) var(--ease-out);

    /* Entrance animation */
    animation: ctaSlideUp var(--duration-slow) var(--ease-bounce) 1s both;
}

@keyframes ctaSlideUp {
    from {
        opacity: 0;
        transform: translateX(-50%) translateY(60px);
    }

    to {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
}

.sticky-cta:active {
    transform: translateX(-50%) scale(0.96);
    box-shadow: 0 4px 12px rgba(211, 47, 47, 0.4);
}

/* ─── Footer ─── */
.footer {
    text-align: center;
    padding: var(--space-lg) var(--space-md);
    font-size: 0.75rem;
    color: var(--text-light);
    border-block-start: 2px solid var(--text-main);
    margin-inline: var(--space-md);
}

.footer__brand {
    font-family: var(--font-serif);
    font-size: 1.5rem;
    font-weight: 900;
    color: var(--text-main);
    margin-block-end: var(--space-xs);
}

.footer__social {
    display: flex;
    justify-content: center;
    gap: var(--space-sm);
    margin-block: var(--space-sm);
    font-family: var(--font-sans);
    font-size: 0.85rem;
    text-transform: uppercase;
}

.footer__social a {
    color: var(--accent-red);
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* ─── Reduced Motion ─── */
@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}