/* ── FOOTER ───────────────────────────────────────── */

.footer {

    background: var(--bg2);

    border-top:
        1px solid var(--border);

    padding: 48px 40px 28px;

}

/* ── INNER ────────────────────────────────────────── */

.footer-inner {

    max-width: 1140px;

    margin: 0 auto;

}

/* ── TOP ──────────────────────────────────────────── */

.footer-top {

    display: grid;

    grid-template-columns:
        2fr 1fr 1fr 1fr;

    gap: 40px;

    margin-bottom: 40px;

}

/* ── BRAND ────────────────────────────────────────── */

.footer-brand-name {

    font-family: 'Syne', sans-serif;

    font-size: 20px;

    font-weight: 800;

    margin-bottom: 12px;

}

.footer-brand-name span {

    color: var(--accent);

}

.footer-brand-desc {

    font-size: 13px;

    color: var(--muted2);

    line-height: 1.7;

    max-width: 260px;

}

/* ── COLUMN ───────────────────────────────────────── */

.footer-col-title {

    font-family: 'Syne', sans-serif;

    font-size: 12px;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: 0.08em;

    color: var(--muted);

    margin-bottom: 16px;

}

/* ── LINKS ────────────────────────────────────────── */

.footer-links {

    display: flex;

    flex-direction: column;

    gap: 9px;

}

.footer-link {

    font-size: 13px;

    color: var(--muted2);

    text-decoration: none;

    transition: color 0.2s;

}

.footer-link:hover {

    color: var(--accent);

}

/* ── BOTTOM ───────────────────────────────────────── */

.footer-bottom {

    border-top:
        1px solid var(--border);

    padding-top: 24px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 16px;

    flex-wrap: wrap;

}

/* ── COPY ─────────────────────────────────────────── */

.footer-copy {

    font-size: 12px;

    color: var(--muted);

}

.footer-copy span {

    color: var(--accent);

}

/* ── BADGES ───────────────────────────────────────── */

.footer-badges {

    display: flex;

    gap: 8px;

}

.footer-badge {

    padding: 4px 12px;

    background: var(--bg3);

    border:
        1px solid var(--border);

    border-radius: 6px;

    font-size: 11px;

    color: var(--muted2);

}