/* ================================================================
   LISBOA CAR V4 — FOOTER.CSS  (escrito do zero, classes lc-footer__*)
   Mobile-first. Consome os tokens de variables.css. Tema escuro.
   Inclui o banner de consentimento (LGPD) que libera o GTM.
   ================================================================ */

.lc-footer {
    background-color: var(--cor-preta);
    color: var(--cor-branca);
    border-top: 2px solid var(--cor-primaria);
}

/* Grade: 1 coluna (mobile) -> 2 (tablet) -> 4 (desktop) */
.lc-footer__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--espacamento-xl);
    padding-block: var(--margem-secao-topo) var(--margem-secao-base);
}

/* ---------- Marca ---------- */
.lc-footer__logo-link { display: inline-flex; }
.lc-footer__brand img { max-height: 30px; width: auto; height: auto; }
.lc-footer__tagline {
    margin-top: var(--espacamento-xs);
    color: var(--cor-branca);
    font-size: 13px;
    max-width: 32ch;
}
.lc-footer__social {
    display: flex;
    gap: var(--espacamento-sm);
    margin-top: var(--espacamento-md);
}
.lc-social {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--cor-branca);
    background-color: rgba(255, 255, 255, 0.06);
    border-radius: var(--borda-radius-circular);
    transition: var(--transicao-rapida);
}
.lc-social:hover { color: var(--cor-preta); background-color: var(--cor-primaria); transform: translateY(-2px); }
.lc-social:focus-visible { outline: 2px solid var(--cor-primaria); outline-offset: 2px; }
.lc-social__icon { width: 20px; height: 20px; }

/* ---------- Títulos das colunas ---------- */
.lc-footer__title {
    font-family: var(--fonte-titulos);
    font-size: 16px;
    color: var(--cor-branca);
    margin-bottom: var(--espacamento-xs);
}

/* ---------- Menu (mais delicado: fontes menores e itens bem juntos) ---------- */
.lc-footer__menu { display: flex; flex-direction: column; gap: 0; margin: 0; padding: 0; }
.lc-footer__menu li { margin: 0; }
.lc-footer__menu a {
    display: block;
    padding: 8px 0; /* área de toque >= 24px + espaçamento entre os itens (a11y) */
    color: var(--cor-branca);
    font-size: var(--font-size-caption);
    line-height: 1.4;
    transition: var(--transicao-rapida);
}
.lc-footer__menu a:hover { color: var(--cor-primaria); }

/* ---------- Unidades ---------- */
.lc-footer__address {
    font-style: normal;
    color: var(--cor-branca);
    font-size: 13px;
    margin-bottom: var(--espacamento-sm);
}
.lc-footer__actions { display: flex; flex-direction: column; gap: var(--espacamento-3xs); }
.lc-footer__action {
    display: inline-flex;
    align-items: center;
    gap: var(--espacamento-2xs);
    color: var(--cor-branca);
    font-size: 13px;
    font-weight: 600;
    transition: var(--transicao-rapida);
}
.lc-footer__action:hover { color: var(--cor-primaria); }
.lc-footer__action--wa:hover { color: var(--cor-whatsapp); }
.lc-footer__action-icon { width: 16px; height: 16px; flex-shrink: 0; }

/* ---------- Barra de copyright ---------- */
.lc-footer__bar {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-block: var(--espacamento-md);
}
.lc-footer__copy {
    color: var(--cor-branca);
    font-size: var(--font-size-caption);
    text-align: center;
}
.lc-footer__bar-link {
    color: var(--cor-branca);
    text-decoration: underline;
}
.lc-footer__bar-link:hover,
.lc-footer__bar-link:focus-visible {
    color: var(--cor-destaque);
}

/* ================================================================
   BANNER DE CONSENTIMENTO (LGPD) — libera o GTM ao aceitar
   ================================================================ */
.lc-consent {
    position: fixed;
    left: 50%;
    bottom: var(--espacamento-md);
    transform: translateX(-50%);
    z-index: var(--z-index-toast);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--espacamento-sm);
    width: min(680px, calc(100% - 2 * var(--espacamento-md)));
    padding: var(--espacamento-sm) var(--espacamento-md);
    background-color: var(--cor-grafite-medio);
    color: var(--cor-branca);
    border: 1px solid var(--cor-primaria);
    border-radius: var(--borda-radius-lg);
    box-shadow: var(--sombra-forte);
}
.lc-consent[hidden] { display: none; }
.lc-consent__text { flex: 1 1 260px; font-size: var(--font-size-body-sm); line-height: var(--leading-texto); }
.lc-consent__link { color: var(--cor-destaque); text-decoration: underline; } /* laranja claro: contraste AA no fundo escuro */
.lc-consent__accept {
    flex-shrink: 0;
    min-height: var(--botao-altura-min);
    padding: var(--botao-padding);
    background-color: var(--cor-primaria);
    color: var(--cor-preta);
    font-family: var(--fonte-titulos);
    font-weight: 700;
    border: 2px solid var(--cor-preta);
    border-radius: var(--botao-radius);
    transition: var(--transicao-rapida);
}
.lc-consent__accept:hover { background-color: var(--cor-preta); color: var(--cor-primaria); border-color: var(--cor-primaria); }
.lc-consent__accept:focus-visible { outline: 3px solid var(--cor-branca); outline-offset: 2px; }

/* ================================================================
   TABLET (>= 768px): 2 colunas
   ================================================================ */
@media (min-width: 768px) {
    .lc-footer__grid { grid-template-columns: 1fr 1fr; }
    .lc-footer__brand { grid-column: 1 / -1; }
}

/* ================================================================
   DESKTOP (>= 993px): marca larga + menu + 2 unidades
   ================================================================ */
@media (min-width: 993px) {
    .lc-footer__grid {
        grid-template-columns: 1.6fr 1fr 1.2fr 1.2fr;
        gap: var(--espacamento-xxl);
    }
    .lc-footer__brand { grid-column: auto; }
}

/* ================================================================
   MOBILE (< 768px): tudo CENTRALIZADO (igual à referência do V2)
   ================================================================ */
@media (max-width: 767px) {
    .lc-footer { text-align: center; }
    .lc-footer__brand { display: flex; flex-direction: column; align-items: center; }
    .lc-footer__tagline { margin-inline: auto; }
    .lc-footer__social { justify-content: center; }
    .lc-footer__menu { align-items: center; }
    .lc-footer__actions { align-items: center; }
}
