/* ============================================================
   Footer — Figma 8:4175 · 1920 × 448
   ============================================================ */
/* Section 447 = 80 + conteneur 287 + 80 */
.footer { padding-top: 80px; padding-bottom: 80px; }
.footer__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 232px;
  gap: var(--sp-80);
  align-items: start;
  min-height: 287px;
}

.footer__brand { display: flex; flex-direction: column; align-items: flex-start; gap: 33px; }
.footer__logo { width: min(640px, 100%); height: auto; }
.footer__baseline { max-width: 531px; font-size: var(--fs-body); line-height: 19.2px; color: #000; }

/* Ligne basse de la colonne de marque : le lien légal tient sur la même
   ligne que l'icône, la hauteur du pied reste celle du live. */
.footer__bas { display: flex; align-items: center; gap: 20px; }
.footer__legal {
  font-size: var(--fs-sm);
  line-height: 20px;
  color: var(--c-navy);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.footer__legal:hover { color: var(--c-orange); }

.footer__social { display: inline-flex; }
.footer__social-ic {
  display: block;
  width: 20px;
  height: 20px;
  background-color: var(--c-navy);
  -webkit-mask: url('../../assets/masks/puce.svg') no-repeat center / contain;
          mask: url('../../assets/masks/puce.svg') no-repeat center / contain;
  transition: background-color 0.2s ease;
}
.footer__social:hover .footer__social-ic { background-color: var(--c-orange); }

.footer__right { display: flex; flex-direction: column; gap: 40px; }
.footer__nav { display: flex; flex-direction: column; gap: 12px; }
.footer__link { display: flex; align-items: center; gap: 8px; color: var(--c-navy); }
.footer__link:hover .footer__chev { transform: translateX(3px); }
.footer__chev {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  flex-shrink: 0;
  border-radius: 50%;
  background: var(--c-violet);
  color: var(--c-white);
  transition: transform 0.25s var(--ease-out);
}
.footer__chev svg { width: 16px; height: 16px; }

.footer__copy {
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  text-transform: uppercase;
  color: var(--c-navy);
}

@media (max-width: 991px) {
  .footer { padding-top: 40px; padding-bottom: 48px; }
  .footer__inner { grid-template-columns: minmax(0, 1fr); gap: 40px; }
}
