/* ============================================================
           FOOTER
        ============================================================ */
        .site-footer { background: var(--color-white); border-top: 1px solid var(--color-border); padding: var(--space-xl) 0 var(--space-md); }
        .footer-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.2fr; gap: var(--space-lg); margin-bottom: var(--space-lg); }
        .footer-brand .site-logo { font-size: 1.25rem; margin-bottom: 0.75rem; display: block; }
        .footer-brand p { font-size: var(--font-size-sm); color: var(--color-mid-gray); line-height: 1.7; max-width: 240px; }
        .footer-col-title { font-size: var(--font-size-sm); font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--color-black); margin-bottom: var(--space-sm); }
        .footer-links { display: flex; flex-direction: column; gap: 0.4rem; }
        .footer-links a { font-size: var(--font-size-sm); color: var(--color-mid-gray); transition: color var(--transition-fast), padding-left var(--transition-fast); }
        .footer-links a:hover { color: var(--color-black); padding-left: 4px; }
        .footer-contact p { font-size: var(--font-size-sm); color: var(--color-mid-gray); margin-bottom: 0.35rem; display: flex; align-items: flex-start; gap: 0.5rem; }
        .footer-contact p i { margin-top: 3px; flex-shrink: 0; }
        .footer-bottom { border-top: 1px solid var(--color-border); padding-top: var(--space-sm); display: flex; align-items: center; justify-content: space-between; font-size: var(--font-size-xs); color: var(--color-mid-gray); }
.footer-links ul,
.footer-links li {
    list-style: none;
    margin: 0;
    padding: 0;
}

.footer-links ul {
    display: flex;
    gap: 20px;
}