/* ==========================================================================
   Footer: oscuro y sereno (inverse-surface del DESIGN.md), poco contenido
   ========================================================================== */

.footer {
  /* Esquinas superiores redondeadas: se monta sobre el final de contacto para que
     las esquinas dejen ver su color (#e6f3f9) y no el fondo de la página */
  position: relative;
  margin-top: calc(var(--radius-lg) * -1);
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  /* Abajo se reserva espacio para el botón flotante de WhatsApp (que no tape el crédito) */
  padding: clamp(var(--space-7), 7vw, var(--space-8)) var(--gutter) calc(var(--space-6) + 4.5rem);
  background: #263237;                       /* inverse-surface */
  color: #e6f3f9;                            /* inverse-on-surface */
}

.footer__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 0.8fr) minmax(0, 1fr);
  gap: var(--space-7);
  max-width: 72rem;
  margin-inline: auto;
  padding-bottom: var(--space-7);
}

.footer__logo { color: #fff; }
.footer__logo .brand__mark { color: var(--color-primary-tint); }   /* variante clara sobre el footer oscuro */

.footer__blurb {
  max-width: 32ch;
  margin-top: var(--space-4);
  font-size: var(--fs-sm);
  line-height: 1.65;
  color: rgb(230 243 249 / 0.78);            /* 7:1 sobre #263237 */
}

.footer__heading {
  margin: 0 0 var(--space-4);
  font-family: var(--font-sans);
  font-size: var(--fs-xs);
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;                 /* etiqueta pequeña: permitido por el DESIGN.md */
  color: var(--color-primary-tint);
}

.footer__list {
  display: grid;
  gap: var(--space-1);
  margin: 0;
  padding: 0;
  list-style: none;
}
.footer a {
  color: #e6f3f9;
  text-decoration: none;
  transition: color var(--dur-fast) var(--ease-out);
}
.footer__list a {
  display: inline-block;
  padding: var(--space-2) 0;                 /* objetivo de pulsación cómodo */
  font-size: var(--fs-sm);
}
.footer a:hover { color: #fff; }           /* el logo y el resto solo aclaran el color; sin subrayado seco */
.footer :focus-visible { outline-color: var(--color-primary-tint); }

/* Línea de hover suave: la misma del menú (nace del centro con fundido, ease-in-out, 450 ms),
   en salvia claro para el fondo oscuro. Solo en los enlaces de la lista; el logo y el teléfono no llevan línea. */
.footer__list a {
  position: relative;
}
.footer__list a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0.3125rem;
  height: 0.09375rem;
  border-radius: var(--radius-pill);
  background: var(--color-primary-tint);
  opacity: 0;
  transform: scaleX(0.35);
  transform-origin: center;
  transition:
    transform 450ms cubic-bezier(0.4, 0, 0.2, 1),
    opacity 350ms ease;
}
.footer__list a:hover::after,
.footer__list a:focus-visible::after {
  opacity: 1;
  transform: scaleX(1);
}

.footer__address {
  font-style: normal;
  font-size: var(--fs-sm);
  line-height: 1.9;
  color: rgb(230 243 249 / 0.78);
}
.footer__address a { font-weight: 600; color: #e6f3f9; }

.footer__bottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2) var(--space-5);
  max-width: 72rem;
  margin-inline: auto;
  padding-top: var(--space-5);
  border-top: 0.0625rem solid rgb(230 243 249 / 0.16);
  font-size: var(--fs-xs);
  line-height: 1.6;
  color: rgb(230 243 249 / 0.72);            /* 6:1 */
}
.footer__bottom p { margin: 0; }

/* Crédito de la agencia: en reposo se distingue por el peso y el blanco; al pasar el cursor aparece
   la misma línea suave del resto del footer (nace del centro con fundido, ease-in-out, 450 ms). */
.footer__credit a {
  position: relative;
  display: inline-block;
  font-weight: 600;
  color: #fff;
  text-decoration: none;
}
.footer__credit a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 0.09375rem;
  border-radius: var(--radius-pill);
  background: var(--color-primary-tint);
  opacity: 0;
  transform: scaleX(0.35);
  transform-origin: center;
  transition:
    transform 450ms cubic-bezier(0.4, 0, 0.2, 1),
    opacity 350ms ease;
}
.footer__credit a:hover::after,
.footer__credit a:focus-visible::after {
  opacity: 1;
  transform: scaleX(1);
}

@media (max-width: 56rem) {
  .footer__inner { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6); }
  .footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 36rem) {
  .footer__inner { grid-template-columns: minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  .footer a,
  .footer__list a::after,
  .footer__credit a::after { transition: none; }
}