/*
 * footer.css — Site footer.
 * Depends on: base.css, layout.css, components.css
 */

/* ── Wrapper ────────────────────────────────────────────────────────────── */

.site-footer {
    background:   var(--color-bg-surface);
    border-top:   1px solid var(--color-border);
    margin-top:   auto;
}

.footer__inner {
    padding-block: var(--space-16) var(--space-8);
}

/* ── Top grid ───────────────────────────────────────────────────────────── */

.footer__grid {
    display:               grid;
    grid-template-columns: 1.5fr repeat(3, 1fr);
    gap:                   var(--space-10);
    margin-bottom:         var(--space-12);
}

@media (max-width: 960px) {
    .footer__grid {
        grid-template-columns: 1fr 1fr;
    }

    .footer__brand-col {
        grid-column: span 2;
    }
}

@media (max-width: 600px) {
    .footer__grid {
        grid-template-columns: 1fr;
    }

    .footer__brand-col {
        grid-column: span 1;
    }
}

/* ── Brand column ───────────────────────────────────────────────────────── */

.footer__logo {
    display:         inline-flex;
    align-items:     center;
    gap:             var(--space-3);
    text-decoration: none;
    margin-bottom:   var(--space-4);
}

.footer__logo span {
    font-size:   var(--text-base);
    font-weight: var(--font-bold);
    color:       var(--color-text-primary);
}

.footer__tagline {
    font-size:    var(--text-sm);
    color:        var(--color-text-secondary);
    line-height:  var(--leading-relaxed);
    max-width:    36ch;
    margin-bottom:var(--space-5);
}

.footer__certs {
    list-style:    none;
    padding:       0;
    display:       flex;
    flex-direction:column;
    gap:           var(--space-2);
    margin-bottom: var(--space-6);
}

.footer__certs li {
    display:     flex;
    align-items: center;
    gap:         var(--space-2);
    font-size:   var(--text-xs);
    font-weight: var(--font-medium);
    color:       var(--color-text-secondary);
    line-height: 1;
}

.footer__certs li i {
    color:     var(--color-brand);
    width:     14px;
    font-size: 0.8em;
}

/* ── Social links ───────────────────────────────────────────────────────── */

.footer__social {
    display:    flex;
    align-items:center;
    gap:        var(--space-3);
}

.footer__social-link {
    display:         flex;
    align-items:     center;
    justify-content: center;
    width:           34px;
    height:          34px;
    background:      var(--color-bg-elevated);
    border:          1px solid var(--color-border);
    border-radius:   var(--radius-md);
    color:           var(--color-text-muted);
    text-decoration: none;
    font-size:       var(--text-sm);
    transition:      background var(--transition-fast),
                     border-color var(--transition-fast),
                     color var(--transition-fast);
}

.footer__social-link:hover {
    background:   var(--color-brand-dim);
    border-color: var(--color-border-brand);
    color:        var(--color-brand);
}

/* ── Link columns ───────────────────────────────────────────────────────── */

.footer__col-heading {
    font-size:     var(--text-xs);
    font-weight:   var(--font-semibold);
    color:         var(--color-text-primary);
    text-transform:uppercase;
    letter-spacing:var(--tracking-wider);
    margin-bottom: var(--space-4);
}

.footer__links {
    list-style:    none;
    padding:       0;
    display:       flex;
    flex-direction:column;
    gap:           var(--space-3);
}

.footer__links a {
    font-size:       var(--text-sm);
    color:           var(--color-text-secondary);
    text-decoration: none;
    transition:      color var(--transition-fast);
}

.footer__links a:hover {
    color: var(--color-text-primary);
}

/* ── Newsletter ─────────────────────────────────────────────────────────── */

.footer__newsletter {
    margin-top: var(--space-6);
    padding-top:var(--space-6);
    border-top: 1px solid var(--color-border);
}

.footer__newsletter-label {
    display:      block;
    font-size:    var(--text-xs);
    font-weight:  var(--font-semibold);
    color:        var(--color-text-primary);
    text-transform:uppercase;
    letter-spacing:var(--tracking-wider);
    margin-bottom: var(--space-3);
}

.footer__newsletter-row {
    display: flex;
    gap:     var(--space-2);
}

.footer__newsletter-row .input {
    flex:      1;
    min-width: 0;
}

.footer__newsletter-note {
    font-size:  var(--text-xs);
    color:      var(--color-text-muted);
    margin-top: var(--space-2);
}

/* ── Bottom bar ─────────────────────────────────────────────────────────── */

.footer__bottom {
    display:         flex;
    align-items:     center;
    justify-content: space-between;
    gap:             var(--space-4);
    padding-top:     var(--space-6);
    border-top:      1px solid var(--color-border);
    flex-wrap:       wrap;
}

.footer__legal {
    font-size: var(--text-xs);
    color:     var(--color-text-muted);
    margin:    0;
}

.footer__bottom-nav {
    display: flex;
    gap:     var(--space-5);
    flex-wrap: wrap;
}

.footer__bottom-nav a {
    font-size:       var(--text-xs);
    color:           var(--color-text-muted);
    text-decoration: none;
    transition:      color var(--transition-fast);
}

.footer__bottom-nav a:hover {
    color: var(--color-text-secondary);
}

@media (max-width: 600px) {
    .footer__bottom {
        flex-direction: column;
        align-items:    flex-start;
    }

    .footer__bottom-nav {
        gap: var(--space-4);
    }
}
