/* Nuestras sedes (home v5) · propuesta G: foto/mapa + las dos sedes a la vista */
/* ---------- Piezas comunes ---------- */
.sd-fg__media { position: relative; overflow: hidden; background: #EFE7DC; isolation: isolate; }
.sd-fg__foto,
.sd-fg__mapa { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; border: 0; opacity: 0; visibility: hidden; transition: opacity .6s var(--curva), visibility 0s linear .6s; }
.sd-fg__foto.activo,
.sd-fg__mapa.activo { opacity: 1; visibility: visible; transition: opacity .6s var(--curva), visibility 0s; }
.sd-fg__foto img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.04); transition: transform 1.4s var(--curva); }
.sd-fg__foto.activo img { transform: none; }
.sd-fg__mapa { z-index: 1; background: #EFE7DC; }
/* El mapa se corre 64px a la izquierda para que el control de capas de Google no quede bajo el interruptor */
.sd-fg__mapa { left: -64px; width: calc(100% + 64px); }

.sd-fg__ref { position: absolute; z-index: 2; top: 18px; left: 18px; padding: 5px 11px; border-radius: var(--r-pildora); background: rgba(31, 26, 21, .5); color: rgba(255, 255, 255, .9); font-size: 11.5px; font-weight: 500; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }

.sd-fg__vista { position: absolute; z-index: 3; left: 20px; bottom: 20px; display: inline-flex; gap: 2px; padding: 4px; border-radius: var(--r-pildora); background: var(--blanco); box-shadow: 0 8px 24px rgba(31, 26, 21, .16); }
.sd-fg__vista button { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 16px 0 13px; border-radius: var(--r-pildora); font-size: 13.5px; font-weight: 500; color: var(--texto-60); transition: background-color .25s var(--curva-hover), color .25s var(--curva-hover); }
.sd-fg__vista button .lucide { width: 15px; height: 15px; }
.sd-fg__vista button:hover { color: var(--texto); }
.sd-fg__vista button[aria-pressed="true"] { background: var(--acento); color: var(--blanco); }


.sd-fg__lista { display: grid; gap: 14px; }
.sd-fg__lista li { display: flex; align-items: flex-start; gap: 12px; font-size: 15px; line-height: 1.4; font-weight: 500; }
.sd-fg__lista .lucide { width: 18px; height: 18px; margin-top: 1px; color: var(--acento-hondo); }
.sd-fg__lista small { display: block; margin-top: 2px; font-size: 13.5px; font-weight: 400; color: var(--texto-60); }

.sd-fg__acciones { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.sd-fg__llegar { background: var(--crema-2); color: var(--texto); }
.sd-fg__llegar:hover { background: var(--texto); color: var(--blanco); }

/* ---------- Foto/mapa grande + las dos sedes a la vista ---------- */
.sd-g { display: grid; grid-template-columns: 1fr 1.12fr; padding: 0; background: #1A130D; color: var(--blanco); }
.sd-g > .sd-fg__media { height: 700px; background: #241A13; }
.sd-g .sd-fg__foto::after { content: ""; position: absolute; inset: 0; background: linear-gradient(270deg, rgba(26, 19, 13, 0) 72%, rgba(26, 19, 13, .55) 100%); pointer-events: none; }
.sd-g .sd-fg__mapa { background: #241A13; }

.sd-g__contenido { order: -1; display: flex; flex-direction: column; justify-content: center; padding: 64px 64px 64px max(var(--pad-x), calc((100vw - var(--contenedor)) / 2)); }
.sd-g .titulo { margin-top: 0; color: var(--blanco); }
.sd-g .titulo em { color: #F0C38A; }

.sd-g__sedes { display: grid; gap: 12px; margin-top: 32px; }
.sd-g__sede { padding: 22px 24px 24px; border: 1px solid rgba(255, 255, 255, .1); border-radius: 16px; cursor: pointer; transition: background-color .3s var(--curva-hover), border-color .3s var(--curva-hover); }
.sd-g__sede:hover { border-color: rgba(240, 195, 138, .3); }
.sd-g__sede.activo { border-color: rgba(240, 195, 138, .5); background: rgba(240, 195, 138, .07); }
.sd-g__sede h3 { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.sd-g__sede h3 button { font-family: var(--serif); font-size: 30px; font-weight: 400; line-height: 1.1; letter-spacing: -0.035em; color: rgba(255, 255, 255, .7); transition: color .3s var(--curva-hover); }
.sd-g__sede.activo h3 button,
.sd-g__sede:hover h3 button { color: var(--blanco); }
.sd-g .sd-fg__lista { grid-template-columns: 1.45fr 1fr; gap: 12px 20px; }
.sd-g .sd-fg__lista li { font-size: 14.5px; color: rgba(255, 255, 255, .9); }
.sd-g .sd-fg__lista .lucide { width: 17px; height: 17px; color: #F0C38A; }
.sd-g .sd-fg__lista small { color: rgba(255, 255, 255, .55); }
.sd-g .sd-fg__acciones { margin-top: 20px; }
.sd-g .sd-fg__acciones .boton { height: 42px; }
.sd-g .sd-fg__llegar { background: rgba(255, 255, 255, .08); color: var(--blanco); }
.sd-g .sd-fg__llegar:hover { background: var(--blanco); color: var(--texto); }

@media (max-width: 1100px) {
  .sd-g { grid-template-columns: 1fr 1fr; }
  .sd-g__contenido { padding-right: 40px; }
  .sd-g .sd-fg__lista { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .sd-g { grid-template-columns: 1fr; }
  .sd-g > .sd-fg__media { height: auto; aspect-ratio: 4 / 3; }
  .sd-g .sd-fg__foto::after { background: linear-gradient(0deg, rgba(26, 19, 13, .45) 0%, rgba(26, 19, 13, 0) 35%); }
  .sd-g__contenido { order: 0; padding: 36px var(--pad-x) 56px; }
  .sd-g .titulo { font-size: 32px; }
  .sd-g__sedes { margin-top: 24px; }
  .sd-g__sede { padding: 20px 18px 20px; }
  .sd-g__sede h3 button { font-size: 27px; }
  .sd-fg__vista { left: 14px; bottom: 14px; }
  .sd-fg__vista button { height: 34px; padding: 0 14px 0 11px; font-size: 13px; }
  .sd-fg__ref { top: 14px; left: 14px; }
  .sd-fg__acciones .boton { flex: 1 1 auto; padding-inline: 16px; }
  .sd-fg__lista li { font-size: 14.5px; }
}
@media (prefers-reduced-motion: reduce) {
  .sd-fg__foto, .sd-fg__mapa, .sd-fg__foto img { transition: none; }
  .sd-fg__foto img { transform: none; }
}