/*
  inventory-detail-v2.css — DETALLE de propiedad y edificio: fotos protagonistas.
  Capa sobre inventory.css (cargar después). Misma línea que el resto del sitio.
*/

html, body { overflow-x: clip; }

/* ═══ PROPIEDAD · SHOWREEL: la foto es la obra ═══ */
.pd-gallery {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  grid-template-columns: 1fr;
  gap: 4px;
  margin-bottom: 2.5rem;
}
/* Foto principal a pantalla (casi) completa */
.pd-gallery-main {
  border-radius: 0;
  aspect-ratio: auto;
  height: min(72vh, 720px);
}
/* Las secundarias, como fotogramas del reel */
.pd-gallery-side {
  grid-template-rows: none;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
}
.pd-gallery-thumb { border-radius: 0; aspect-ratio: 16 / 7; }

/* Encabezado compacto antes de la galería */
.pd-head { margin-bottom: 1.5rem; }

/* ── Secciones numeradas, como el índice del home ── */
.pd-cols { counter-reset: pds; }
.pd-section { margin-bottom: 3.2rem; }
.pd-section h2 {
  counter-increment: pds;
  font-family: var(--sans, inherit);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--ink-3);
  margin: 0 0 1.4rem;
}
.pd-section h2::before {
  content: counter(pds, decimal-leading-zero);
  font-family: var(--display);
  font-weight: var(--display-weight);
  color: var(--accent);
  margin-right: 0.7em;
  letter-spacing: 0;
}

/* ── Características: de caja seca a ficha editorial ── */
.pd-specs {
  background: none;
  border: 0;
  border-radius: 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  gap: 0;
}
.pd-spec {
  background: none;
  padding: 1.5rem 1rem 1.5rem 0;
  gap: 0.45rem;
}
.pd-spec:not(:nth-child(3n + 1)) {
  border-left: 1px solid var(--line);
  padding-left: 1.3rem;
}
.pd-spec .lbl { font-size: 0.66rem; letter-spacing: 0.16em; }
.pd-spec .val { font-size: clamp(1.7rem, 2.6vw, 2.3rem); line-height: 1; }

/* ── Descripción: voz editorial ── */
.pd-desc {
  font-size: 1.12rem;
  line-height: 1.85;
  max-width: 62ch;
}

/* ── Amenidades: lista de créditos, no chips ── */
.pd-amenities { gap: 0 2.4rem; }
.pd-amenity {
  border-bottom: 1px solid var(--line-2);
  padding: 0.75rem 0;
  font-size: 0.98rem;
}

/* ── Ficha de contacto: placa oscura, como el resto de la línea ── */
.pd-card {
  background: #0c0e10;
  border: 0;
  border-radius: 18px;
  color: #fff;
}
.pd-card-price { color: #fff; }
.pd-card-price .per { color: rgba(255, 255, 255, 0.6); }
.pd-card-sub { color: rgba(255, 255, 255, 0.65); }
.pd-card-note { color: rgba(255, 255, 255, 0.5); }
.pd-card .pd-share-label { color: rgba(255, 255, 255, 0.5); }

@media (max-width: 600px) {
  .pd-gallery { margin-bottom: 1.5rem; }
  .pd-gallery-main { height: 52vh; }
  .pd-gallery-thumb { aspect-ratio: 3 / 2; }
  .pd-spec:not(:nth-child(3n + 1)) { border-left: 0; padding-left: 0; }
  .pd-spec:nth-child(even) { border-left: 1px solid var(--line); padding-left: 1.1rem; }
  .pd-spec .val { font-size: 1.5rem; }
}

/* ═══ EDIFICIO: hero más cinematográfico, modelos y amenidades más grandes ═══ */
.bld-hero { height: clamp(400px, 62vh, 580px); }
.bld-hero-shade {
  background: linear-gradient(to bottom, rgba(8, 8, 10, 0.4) 0%, rgba(8, 8, 10, 0) 38%, rgba(8, 8, 10, 0.85) 100%);
}
.bld-hero-name { font-size: clamp(2.4rem, 5.5vw, 4rem); }

/* Modelos: cards más anchas, foto más alta */
.bld-models { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 1.3rem; }
.bld-mc { aspect-ratio: 4 / 3.4; }

/* ═══ SHOWREEL del desarrollo: tira full-bleed de todas las fotos ═══ */
.bld-reel { margin: 3.2rem 0; }
.bld-reel-track {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  display: flex;
  gap: 4px;
  overflow-x: auto;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
  padding-bottom: 0.3rem;
}
.bld-reel-track::-webkit-scrollbar { display: none; }
.bld-reel-shot {
  flex: 0 0 auto;
  height: clamp(300px, 48vh, 460px);
  border: 0;
  padding: 0;
  background: none;
  cursor: zoom-in;
  scroll-snap-align: start;
}
.bld-reel-shot img {
  height: 100%;
  width: auto;
  display: block;
  transition: filter 0.25s;
}
.bld-reel-shot:hover img { filter: brightness(1.06); }
.bld-reel-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 0.8rem;
}
.bld-reel-hint {
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-3);
}

/* ═══ AMENIDADES: mosaico grande, formato showreel ═══ */
.bld-info { grid-template-columns: 1fr; }
.bld-amen-photos {
  grid-template-columns: repeat(4, 1fr);
  gap: 4px;
  margin-top: 1.5rem;
}
.bld-amen-photo {
  border-radius: 0;
  aspect-ratio: 4 / 3;
}
.bld-amen-photo:first-child {
  grid-column: span 2;
  grid-row: span 2;
}
@media (max-width: 700px) {
  .bld-amen-photos { grid-template-columns: repeat(2, 1fr); }
  .bld-amen-photo:first-child { grid-column: span 2; grid-row: auto; }
  .bld-reel-shot { height: 260px; }
}

/* ═══ MODELOS: el precio de Contado manda ═══ */
.bld-eng-price { display: flex; flex-direction: column; gap: 0.15rem; }
.bld-listbase-row { order: 1; }
.bld-listbase-row span { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--ink-3); }
.bld-listbase-row s { color: var(--ink-3); }
/* Contado: grande, verde, protagonista */
.bld-contado-row { order: 2; display: flex; align-items: baseline; gap: 0.6rem; }
.bld-contado-row span { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: #1b9e6b; }
.bld-contado-row .bld-contado-amt,
.bld-contado-row b {
  font-family: var(--display);
  font-weight: var(--display-weight);
  letter-spacing: var(--display-tracking);
  font-size: 1.55rem;
  color: #1b9e6b;
}
/* Financiado: secundario, en azul de marca */
.bld-eng-price-row { order: 3; }
.bld-eng-price-row span { font-size: 0.72rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; color: var(--accent); }
.bld-eng-price-row b { color: var(--ink-2); font-size: 0.98rem; }

/* ═══ FORMAS DE PAGO: dos caminos en tarjetas (la tabla queda fuera) ═══ */
.bld-cmp2 { display: none !important; }
.bld-plans {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.2rem;
}
@media (max-width: 700px) {
  .bld-plans { display: none; }   /* móvil conserva su interruptor */
}
.bld-plan {
  border-radius: 18px;
  padding: 1.6rem 1.6rem 1.4rem;
}
.bld-plan.is-contado { background: rgba(27, 158, 107, 0.08); }
.bld-plan.is-finance { background: color-mix(in srgb, var(--accent) 9%, #fff); }
.bld-plan-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
  margin-bottom: 1rem;
}
.bld-plan-name {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 1.02rem;
  font-weight: 700;
  color: var(--ink);
}
.bld-plan-name::before {
  content: "";
  width: 10px; height: 10px;
  border-radius: 50%;
  flex: none;
}
.is-contado .bld-plan-name::before { background: #1b9e6b; }
.is-finance .bld-plan-name::before { background: var(--accent); }
.bld-plan-disc {
  font-size: 0.74rem;
  font-weight: 700;
  padding: 0.35rem 0.7rem;
  border-radius: 999px;
  color: #fff;
}
.is-contado .bld-plan-disc { background: #1b9e6b; }
.is-finance .bld-plan-disc { background: color-mix(in srgb, var(--accent) 80%, #000); }
.bld-plan-price {
  font-family: var(--display);
  font-weight: var(--display-weight);
  letter-spacing: var(--display-tracking);
  font-size: clamp(2rem, 3.2vw, 2.7rem);
  line-height: 1;
  color: var(--ink);
}
.bld-plan-cap {
  margin-top: 0.4rem;
  font-size: 0.8rem;
  color: var(--ink-3);
}
.bld-plan-benefit {
  margin-top: 0.8rem;
  font-size: 0.85rem;
  font-weight: 600;
}
.is-contado .bld-plan-benefit { color: #157a52; }
.is-finance .bld-plan-benefit { color: color-mix(in srgb, var(--accent) 75%, #000); }
/* Barra de proporciones del plan */
.bld-plan-bar {
  display: flex;
  gap: 3px;
  height: 8px;
  margin-top: 1.1rem;
}
.bld-plan-bar span { border-radius: 4px; }
.bld-plan-bar.is-contado span { background: #1b9e6b; }
.bld-plan-bar.is-finance span { background: var(--accent); }
.bld-plan-bar span:nth-child(2) { opacity: 0.55; }
.bld-plan-bar span:nth-child(3) { opacity: 0.3; }
/* Recorrido 1 → 2 → 3 */
.bld-plan-steps {
  display: flex;
  flex-direction: column;
  margin-top: 0.9rem;
}
.bld-plan-step {
  display: grid;
  grid-template-columns: 26px 1fr auto;
  align-items: center;
  gap: 0.8rem;
  padding: 0.75rem 0;
  border-top: 1px solid rgba(10, 10, 10, 0.08);
}
.bld-plan-n {
  width: 26px; height: 26px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.78rem;
  font-weight: 700;
  color: #fff;
}
.is-contado .bld-plan-n { background: #1b9e6b; }
.is-finance .bld-plan-n { background: var(--accent); color: #0a0a0a; }
.bld-plan-mid b { display: block; font-size: 0.92rem; color: var(--ink); }
.bld-plan-mid span { font-size: 0.78rem; color: var(--ink-3); }
.bld-plan-amt {
  text-align: right;
  font-weight: 700;
  color: var(--ink);
  font-size: 0.98rem;
}
.bld-plan-amt small { display: block; font-weight: 500; color: var(--ink-3); font-size: 0.74rem; }