/* =============================================================
   Footer — present on every page
   ============================================================= */
.site-footer { background: var(--ink); color: rgba(248,246,241,.6); padding: 3rem 0 3rem; font-size: .85rem; }
.footer-inner { display: flex; flex-direction: column; gap: .5rem; }
.footer-legal a { text-decoration: underline; }

/* Marca del footer — misma estructura y tipografía que el encabezado:
   icono a la izquierda + nombre (Cormorant, mayúsculas, tracking) y tagline
   (Montserrat, cursiva, dorado) apilados en columna. */
.footer-brand { display: inline-flex; align-items: center; gap: .85rem; margin-bottom: 1.25rem; text-decoration: none; }
.footer-brand img { height: 58px; width: auto; flex-shrink: 0; opacity: .95; }
.footer-brand-text { display: flex; flex-direction: column; align-items: center; text-align: center; line-height: 1.05; gap: .12rem; }
.footer-brand-name { font-family: var(--serif); font-weight: 600; color: var(--bg); font-size: 1.25rem; text-transform: uppercase; letter-spacing: .1em; }
/* Mismo filete dorado del logo que en el encabezado: línea corta y centrada
   entre el nombre y el eslogan, del centro de una «o» de TORREJÓN al de la otra. */
.footer-brand-rule {
  display: block;
  width: 4.4rem;
  height: 1px;
  margin: .16rem 0 .1rem;
  background: linear-gradient(90deg, #9c6f27 0%, #caa14e 50%, #9c6f27 100%);
}
.footer-brand-tagline { font-family: var(--sans); font-weight: 400; font-style: normal; font-size: .6rem; letter-spacing: .16em; text-transform: uppercase; color: var(--accent-2); }

/* --- Footer reordenado: marca + redes en fila arriba; copyright + legal en barra abajo.
   Clases nuevas (.footer-top/.footer-bottom/.footer-divider): no afectan a las
   páginas que aún usan el pie apilado clásico. --- */
.footer-top {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1.25rem 2rem; flex-wrap: wrap;
}
.footer-top .footer-brand { margin-bottom: 0; }
.footer-top .footer-social { margin-bottom: 0; }
.footer-divider { height: 1px; background: rgba(248,246,241,.14); margin: 1.6rem 0; }
.footer-bottom {
  display: flex; align-items: center; justify-content: space-between;
  gap: .35rem 1.5rem; flex-wrap: wrap;
}
.footer-bottom p { margin: 0; }
@media (max-width: 640px) {
  .footer-top { flex-direction: column; align-items: flex-start; gap: 1.25rem; }
  .footer-bottom { flex-direction: column; align-items: flex-start; }
}

/* Redes sociales — botones circulares con borde dorado que se rellenan al hover. */
.footer-social { display: flex; gap: .7rem; margin-bottom: 1.4rem; }
.footer-social a {
  display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: 50%;
  border: 1px solid rgba(169,121,43,.45); color: var(--accent-2);
  transition: background .25s var(--ease-out), color .25s var(--ease-out), border-color .25s var(--ease-out), transform .25s var(--ease-out);
}
.footer-social a:hover { background: var(--accent-2); color: var(--ink); border-color: var(--accent-2); transform: translateY(-2px); }
.footer-social svg { width: 19px; height: 19px; fill: currentColor; }