/* ========== Footer ADCE (mobile-first) ========== */
.site-footer{
  background:#0d0f1a;
  color:#cfd3dc;
  margin-top:40px;
  padding:32px 0 0;
  padding-top: calc(env(safe-area-inset-top) + 24px);
}

.footer-grid{
  display:grid;
  gap:24px;
  grid-template-columns: 1fr;             /* móvil: 1 columna */
  grid-template-areas:
    "brand"
    "links"
    "contacto"
    "mapa";
}

/* --- Bloques --- */
.f-brand{ grid-area: brand; }
.f-links{ grid-area: links; }
.f-contacto{ grid-area: contacto; }
.f-map{ grid-area: mapa; }

.f-brand img{ height:46px; margin-bottom:10px }
.f-links h3, .f-contacto h3, .f-map h3{ color:#fff; margin:0 0 10px }

.f-links ul, .f-contacto ul{ list-style:none; margin:0; padding:0 }
.f-links a{
  color:#cfd3dc; text-decoration:none; display:inline-block;
  padding:8px 0;                          /* tamaño táctil */
}
.f-links a:hover, .f-links a:focus-visible{ color:#fff }

.f-contacto li{ margin:6px 0; padding:6px 0 }
.f-social{ display:flex; gap:10px; margin-top:10px }
.f-social a{
  display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px; border-radius:50%;
  background:var(--adce-green); color:#fff; font-weight:700; text-decoration:none
}
.f-social a:hover, .f-social a:focus-visible{ background:var(--adce-green-dark) }

/* --- Mapa responsive 16:9 --- */
.map-embed{
  position:relative; width:100%; padding-top:56.25%;
  border-radius: var(--radius); overflow:hidden; box-shadow: var(--shadow);
  background:#0b0e18;
}
.map-embed iframe{ position:absolute; inset:0; width:100%; height:100%; border:0 }
.map-note{ display:block; margin-top:8px; color:#aab2c5 }

/* Línea legal */
.footer-bottom{
  border-top:1px solid #1d2233;
  text-align:center; padding:14px 0; color:#aab2c5; margin-top:8px
}

/* ========== Breakpoints ========== */

/* ≥ 640px: dos columnas y el mapa ancho completo abajo */
@media (min-width: 640px){
  .footer-grid{
    grid-template-columns: 1.2fr 1fr;
    grid-template-areas:
      "brand links"
      "contacto contacto"
      "mapa mapa";
  }
}

/* ≥ 960px: tres columnas; mapa a todo el ancho debajo */
@media (min-width: 960px){
  .footer-grid{
    grid-template-columns: 1.6fr 1fr 1.2fr;
    grid-template-areas:
      "brand links contacto"
      "mapa  mapa  mapa";
    align-items:start;
  }
}

/* ≥ 1280px (opcional): mapa como 4ª columna (quítalo si prefieres el de arriba) */
@media (min-width: 1280px){
  /* Descomenta si quieres el mapa al costado:
  .footer-grid{
    grid-template-columns: 1.4fr 1fr 1fr 1.6fr;
    grid-template-areas: "brand links contacto mapa";
  }
  */
}

/* Accesibilidad y estabilidad */
.f-links a:focus-visible, .f-social a:focus-visible{
  outline:2px solid var(--adce-green); outline-offset:2px;
}
@media (prefers-reduced-motion: reduce){
  .map-embed, .f-social a{ transition:none }
}
