/* =============================================
   SMA-FOOTER.CSS — Public footer (dark, clean)
   Mirrors the WebServices footer: logo identity +
   labeled link columns. Uses Bootstrap's
   .container-xxl for horizontal padding so its
   content lines up with the header/toolbar above.
   ============================================= */

.sma-footer {
    background: var(--sma-dark-gradient);
    border-top: 1px solid var(--sma-dark-border);
    color: var(--sma-dark-text);
}

.sma-footer-content {
    padding-top: 3.5rem;
    padding-bottom: 2rem;
}

.sma-footer-grid {
    display: grid;
    grid-template-columns: 1.3fr 1fr 1fr 1fr;
    gap: 2.5rem 2rem;
    align-items: start;
    margin-bottom: 2.5rem;
}

.sma-footer-section {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0;
}

.sma-footer-identity {
    gap: 1.25rem;
}

/* Matches the header logo's rendered height (see #kt_header .header-logo-img
   in sma-header.css) so the same mark reads as one consistent size across
   the whole shell instead of ballooning in the footer. */
.sma-footer-logo-img {
    height: 42px;
    width: auto;
    align-self: flex-start;
}

.sma-footer-about {
    font-size: .85rem;
    color: var(--sma-dark-muted);
    line-height: 1.75;
    margin: 0;
    max-width: 34ch;
}

.sma-footer-heading {
    font-size: .78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #ffffff;
}

.sma-footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: .8rem;
}

    .sma-footer-links a {
        font-size: .9rem;
        color: var(--sma-dark-muted);
        text-decoration: none;
        transition: color .2s ease;
    }

        .sma-footer-links a:hover {
            color: var(--sma-primary);
        }

.sma-footer-divider {
    height: 1px;
    background: var(--sma-dark-border);
    margin: 0 0 1.5rem;
}

.sma-footer-bottom {
    display: flex;
    justify-content: center;
    align-items: center;
}

.sma-footer-copyright {
    font-size: .8rem;
    color: var(--sma-dark-muted);
    margin: 0;
}

@media (max-width: 1080px) {
    .sma-footer-grid {
        grid-template-columns: 1fr 1fr 1fr;
        gap: 2rem;
    }

    .sma-footer-identity {
        grid-column: 1 / -1;
    }

    .sma-footer-about {
        max-width: 60ch;
    }
}

@media (max-width: 760px) {
    .sma-footer-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 520px) {
    .sma-footer-content {
        padding-top: 2.5rem;
        padding-bottom: 1.75rem;
    }

    .sma-footer-grid {
        grid-template-columns: 1fr;
        gap: 1.75rem;
    }
}