/* =====================================================================
   RISE · Departamentos (mesa de trabajo 2)
   ===================================================================== */

/* ---------------------------------------------------------------- hero */
.depto-hero { position: relative; height: calc(1244 * var(--u)); overflow: hidden; background: var(--c-ink); }
/* Slideshow: cada foto lleva su propio fondo de tinta y se desvanece sobre la anterior. */
.depto-hero__slide { position: absolute; inset: 0; background: var(--c-ink); opacity: 0; transition: none; }
.depto-hero__slide.is-active { opacity: 1; z-index: 1; transition: opacity 1s var(--ease); } /* solo la que entra se desvanece */
.depto-hero__slide.is-prev { z-index: 0; opacity: 1; transition: none; }
.depto-hero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .6; }
.depto-hero .frame { z-index: 2; }
.depto-hero__title { color: var(--c-paper); font-weight: 700; letter-spacing: var(--track); }
/* Los dos renglones centrados en el hero, uno debajo del otro (padding-left compensa el espaciado que queda
   tras la última letra). Se reducen sobre su centro y hacia la unión entre ellos: título al 85 %, subtítulo al 76 %. */
.depto-hero__t1, .depto-hero__t2 { position: absolute; left: 50%; padding-left: var(--track); white-space: nowrap; }
.depto-hero__t1 { top: calc(581.16 * var(--u)); font-size: calc(88 * var(--u)); line-height: calc(88 * var(--u)); transform: translateX(-50%) scale(.85); transform-origin: 50% 100%; }
.depto-hero__t2 { top: calc(670.56 * var(--u)); font-size: calc(47 * var(--u)); line-height: calc(47 * var(--u)); font-weight: 300; /* Light, la de la barra de navegación */ transform: translateX(-50%) scale(.76); transform-origin: 50% 0; }

/* ---------------------------------------------------------------- tipologías */
.tipologias { position: relative; height: calc(1140 * var(--u)); background: var(--c-paper); overflow: hidden; }
.tipologias__dot {
  position: absolute; left: calc(63.2 * var(--u)); top: calc(67.1 * var(--u));
  width: calc(41.1 * var(--u)); height: calc(41.1 * var(--u)); border-radius: 50%; background: var(--c-yellow);
}
.tipologias__dot::after { /* línea vertical que baja hasta contacto */
  content: ""; position: absolute; left: calc(20 * var(--u)); top: 100%;
  width: 1px; height: calc(1140 * var(--u)); background: var(--c-ink);
}
.tipologias__title {
  position: absolute; left: calc(118.7 * var(--u)); top: calc(70 * var(--u));
  font-size: var(--fs-lg); line-height: var(--fs-lg); font-weight: 700; letter-spacing: 0;
}

.tipologias__selector { position: absolute; z-index: 2; left: calc(394.7 * var(--u)); top: calc(70.2 * var(--u)); display: flex; gap: calc(44 * var(--u)); } /* encima del panel de la tipología, que ocupa toda la sección */
.pill {
  position: relative; height: calc(73.4 * var(--u)); padding: 0 calc(40 * var(--u)) 0 calc(33 * var(--u));
  border: 1px solid var(--c-ink); border-radius: calc(15 * var(--u));
}
.pill__label {
  display: block; margin-top: calc(11.05 * var(--u));
  font-size: calc(16.2 * var(--u)); line-height: calc(16.2 * var(--u)); letter-spacing: var(--track); white-space: nowrap;
}
.pill__nums { display: flex; gap: calc(10.1 * var(--u)); margin: calc(4.6 * var(--u)) calc(-12 * var(--u)) 0 calc(-8.7 * var(--u)); }
.pill__num {
  width: calc(34.3 * var(--u)); height: calc(34.3 * var(--u)); padding: 0; border: 0; border-radius: 50%;
  background: transparent; color: var(--c-ink); cursor: pointer;
  font-size: var(--fs-lg); line-height: calc(34.3 * var(--u)); font-weight: 300; letter-spacing: 0;
  transition: background-color .25s var(--ease);
}
.pill__num:hover { background: rgb(239 182 39 / .35); }
.pill__num[aria-pressed="true"] { background: var(--c-yellow); font-weight: 700; }

.tipologia { position: absolute; inset: 0; animation: tipo-in .45s var(--ease); }
.tipologia[hidden] { display: none; }
@keyframes tipo-in { from { opacity: 0; } to { opacity: 1; } }

.tipologia__planta {
  position: absolute; left: calc(24.5 * var(--u)); top: calc(212.3 * var(--u));
  width: calc(1503.6 * var(--u)); height: calc(845.8 * var(--u));
  display: grid; place-items: center;
}
.tipologia__planta img { width: 100%; height: auto; }
.tipologia__pendiente {
  font-size: var(--fs-sm); letter-spacing: var(--track); color: var(--c-slate);
  padding: calc(24 * var(--u)) calc(40 * var(--u)); border: 1px dashed var(--c-slate); border-radius: calc(14 * var(--u));
}

.tipologia__info { position: absolute; left: calc(1393.7 * var(--u)); top: calc(275.7 * var(--u)); width: calc(436 * var(--u)); }
.tipologia__datos {
  padding: calc(1.05 * var(--u)) 0 0 calc(27.8 * var(--u));
  border-left: calc(3 * var(--u)) solid var(--c-yellow);
  font-size: var(--fs-lg); line-height: calc(33.6 * var(--u)); letter-spacing: var(--track);
}
.tipologia__datos > span { display: block; }
.tipologia__datos > .tipologia__movil { display: none; } /* copia con cortes protegidos, solo para móvil */
.tipologia__pisos { margin-top: calc(33.6 * var(--u)); }
.tipologia__cotizar { margin: calc(85.75 * var(--u)) 0 0 calc(2.1 * var(--u)); min-width: calc(218.2 * var(--u)); border-radius: calc(14 * var(--u)); }

.tipologia__llave {
  position: absolute; left: calc(1390.7 * var(--u)); top: calc(732.2 * var(--u));
  width: calc(319.6 * var(--u)); height: auto;
}