/* Footer shared styles */

#ft-grid {
    align-items: start !important;
    justify-items: start !important;
}

#ft-col-0,
#ft-col-1,
#ft-col-2,
#ft-col-3,
#ft-col-4,
#ft-copy {
    opacity: 0;
    transform: translateY(32px);
    transition: opacity 0.65s cubic-bezier(0.22, 1, 0.36, 1),
                transform 0.65s cubic-bezier(0.22, 1, 0.36, 1);
}

/* Explicitly ensure brand column content is left-aligned */
#ft-col-0 {
    text-align: left !important;
    justify-self: start !important;
    align-self: start !important;
}

#ft-col-0 img {
    margin: 0 0 28px 0 !important;
    display: block !important;
}

#ft-col-0.ft-visible,
#ft-col-1.ft-visible,
#ft-col-2.ft-visible,
#ft-col-3.ft-visible,
#ft-col-4.ft-visible,
#ft-copy.ft-visible {
    opacity: 1 !important;
    transform: translateY(0) !important;
}

#ft-topline {
    animation: ftBorderPulse 3s ease-in-out infinite alternate;
}

@keyframes ftBorderPulse {
    0% {
        opacity: 0.7;
        background-position: 0% 50%;
    }
    100% {
        opacity: 1;
        background-position: 100% 50%;
    }
}

.spin-slow {
    animation: spin 20s linear infinite;
}

@keyframes spin {
    from {
        transform: translateY(-50%) rotate(0deg);
    }
    to {
        transform: translateY(-50%) rotate(360deg);
    }
}

/* Mobile Overrides (≤ 767px) */
@media (max-width: 767px) {
    #ft-grid {
        grid-template-columns: 1fr 1fr !important;
        gap: 36px 20px !important;
        padding-bottom: 40px !important;
    }

    #ft-col-0 {
        grid-column: 1 / -1 !important;
    }
}