/* ============================================================
   MDC Propiedades — Ficha de propiedad pública
   Paleta de marca aprobada:
   navy #0B2D8C · cian #29C5E6 · azul CTA #1657FF
   Tipografía: Space Grotesk (títulos) · Plus Jakarta Sans (cuerpo)
   Todo prefijado .mdcprop-* para no chocar con el tema activo.
   ============================================================ */

/* Variables a nivel :root (no dentro de .mdcprop-ficha) para que también
   estén disponibles en los modales, que en el HTML viven FUERA del
   contenedor .mdcprop-ficha. */
:root {
	--mdcprop-navy: #0B2D8C;
	--mdcprop-navy-oscuro: #081f63;
	--mdcprop-cian: #29C5E6;
	--mdcprop-coral: #1657FF;
	--mdcprop-coral-oscuro: #0F46C4;
	--mdcprop-gris-texto: #4a4a55;
	--mdcprop-gris-claro: #f4f6fb;
	--mdcprop-borde: #e2e6f0;
}

.mdcprop-ficha {
	font-family: 'Plus Jakarta Sans', -apple-system, sans-serif;
	color: #1a1a2e;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 20px 60px;
}

.mdcprop-ficha h1,
.mdcprop-ficha h2,
.mdcprop-titulo {
	font-family: 'Space Grotesk', sans-serif;
}

/* ---------- Galería ---------- */
.mdcprop-ficha__galeria {
	position: relative;
	margin-bottom: 28px;
}

.mdcprop-galeria__grid {
	display: grid;
	grid-template-columns: 2fr 1fr 1fr;
	grid-template-rows: 1fr 1fr;
	gap: 8px;
	border-radius: 14px;
	overflow: hidden;
	height: 460px;
}

.mdcprop-galeria__item--0 {
	grid-row: 1 / 3;
}

.mdcprop-galeria__grid img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.mdcprop-galeria__item {
	cursor: pointer;
	position: relative;
	transition: opacity .2s;
}
.mdcprop-galeria__item:hover { opacity: .92; }
.mdcprop-galeria__mas {
	position: absolute;
	inset: 0;
	background: rgba(6,15,51,.55);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	font-size: 16px;
	font-family: 'Space Grotesk', sans-serif;
}

.mdcprop-galeria__placeholder {
	height: 320px;
	background: var(--mdcprop-gris-claro);
	border-radius: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--mdcprop-gris-texto);
}

.mdcprop-badge-estatus {
	position: absolute;
	top: 16px;
	left: 16px;
	z-index: 2;
	padding: 6px 14px;
	border-radius: 20px;
	font-weight: 700;
	font-size: 13px;
	color: #fff;
}

.mdcprop-badge-estatus--venta { background: var(--mdcprop-coral); }
.mdcprop-badge-estatus--renta { background: var(--mdcprop-cian); color: var(--mdcprop-navy-oscuro); }

.mdcprop-btn-compartir {
	position: absolute;
	top: 16px;
	right: 16px;
	z-index: 2;
	background: #fff;
	border: none;
	border-radius: 20px;
	padding: 8px 16px;
	font-weight: 600;
	font-size: 13px;
	cursor: pointer;
	box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}

.mdcprop-btn-compartir:hover { background: var(--mdcprop-gris-claro); }

/* ---------- Cuerpo: dos columnas ---------- */
.mdcprop-ficha__cuerpo {
	display: grid;
	grid-template-columns: 1fr 360px;
	gap: 40px;
}

@media (max-width: 860px) {
	.mdcprop-ficha__cuerpo { grid-template-columns: 1fr; }
	.mdcprop-galeria__grid { height: auto; grid-template-columns: 1fr; grid-template-rows: none; }
	.mdcprop-galeria__item--0 { grid-row: auto; }
}

/* ---------- Columna principal ---------- */
.mdcprop-titulo {
	font-size: 28px;
	margin: 0 0 6px;
	color: var(--mdcprop-navy-oscuro);
}

.mdcprop-ubicacion {
	color: var(--mdcprop-gris-texto);
	margin: 0 0 4px;
}

.mdcprop-clave {
	font-size: 13px;
	color: #9a9aa8;
	margin: 0 0 20px;
}

.mdcprop-specs-bar {
	display: flex;
	gap: 24px;
	flex-wrap: wrap;
	padding: 18px 0;
	border-top: 1px solid var(--mdcprop-borde);
	border-bottom: 1px solid var(--mdcprop-borde);
	margin-bottom: 20px;
}

.mdcprop-spec {
	display: flex;
	flex-direction: column;
}

.mdcprop-spec strong {
	font-size: 18px;
	font-family: 'Space Grotesk', sans-serif;
	color: var(--mdcprop-navy);
}

.mdcprop-spec span {
	font-size: 12px;
	color: var(--mdcprop-gris-texto);
}

.mdcprop-amenidades {
	display: flex;
	gap: 8px;
	margin-bottom: 20px;
}

.mdcprop-pill {
	background: var(--mdcprop-gris-claro);
	border-radius: 16px;
	padding: 6px 14px;
	font-size: 13px;
	font-weight: 600;
	color: var(--mdcprop-navy);
}

.mdcprop-descripcion {
	line-height: 1.7;
	color: var(--mdcprop-gris-texto);
	margin-bottom: 24px;
}

.mdcprop-multimedia {
	display: flex;
	gap: 16px;
}

.mdcprop-multimedia__link {
	color: var(--mdcprop-navy);
	font-weight: 600;
	text-decoration: none;
	border: 1px solid var(--mdcprop-borde);
	border-radius: 10px;
	padding: 10px 16px;
}

.mdcprop-multimedia__link:hover { border-color: var(--mdcprop-navy); }

/* ---------- Columna lateral (sticky) ---------- */
.mdcprop-ficha__lateral {
	position: sticky;
	top: 20px;
	align-self: start;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.mdcprop-card {
	border-radius: 14px;
	padding: 22px;
}

.mdcprop-card--precio {
	background: #fff;
	border: 1px solid var(--mdcprop-borde);
}

.mdcprop-precio {
	font-family: 'Space Grotesk', sans-serif;
	font-size: 26px;
	font-weight: 700;
	color: var(--mdcprop-navy-oscuro);
	margin-bottom: 16px;
}

.mdcprop-precio span {
	font-size: 14px;
	font-weight: 400;
	color: var(--mdcprop-gris-texto);
}

.mdcprop-btn {
	display: block;
	width: 100%;
	border: none;
	border-radius: 10px;
	padding: 13px;
	font-weight: 700;
	font-size: 15px;
	cursor: pointer;
	margin-bottom: 10px;
	font-family: 'Plus Jakarta Sans', sans-serif;
}

.mdcprop-btn--primario {
	background: var(--mdcprop-coral);
	color: #fff;
}

.mdcprop-btn--primario:hover { background: var(--mdcprop-coral-oscuro); }

.mdcprop-btn--secundario {
	background: #fff;
	color: var(--mdcprop-navy);
	border: 2px solid var(--mdcprop-navy);
	margin-bottom: 0;
}

.mdcprop-btn--secundario:hover { background: var(--mdcprop-gris-claro); }

.mdcprop-card--asesor {
	background: var(--mdcprop-navy-oscuro);
	color: #fff;
	text-align: center;
}

.mdcprop-asesor__avatar {
	width: 64px;
	height: 64px;
	border-radius: 50%;
	background: var(--mdcprop-cian);
	color: var(--mdcprop-navy-oscuro);
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	font-size: 22px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 12px;
}

.mdcprop-asesor__nombre {
	font-weight: 700;
	font-size: 17px;
}

.mdcprop-asesor__rol {
	font-size: 13px;
	color: var(--mdcprop-cian);
	margin-bottom: 16px;
}

.mdcprop-asesor__telefono-visible {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	color: #fff;
	font-weight: 700;
	font-size: 15.5px;
	letter-spacing: .01em;
	margin-bottom: 18px;
	text-decoration: none;
	transition: color .2s;
}

.mdcprop-asesor__telefono-visible svg {
	width: 17px;
	height: 17px;
	color: var(--mdcprop-cian);
	flex-shrink: 0;
}

.mdcprop-asesor__telefono-visible:hover { color: var(--mdcprop-cian); }

.mdcprop-asesor__botones {
	display: flex;
	gap: 10px;
	justify-content: center;
}

.mdcprop-btn-icono {
	width: 42px;
	height: 42px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(255,255,255,0.12);
	color: #fff;
	border-radius: 50%;
	text-decoration: none;
	transition: background .25s, transform .25s;
}

.mdcprop-btn-icono svg { width: 18px; height: 18px; }

.mdcprop-btn-icono:hover { background: var(--mdcprop-cian); color: var(--mdcprop-navy-oscuro); transform: translateY(-2px) scale(1.06); }

.mdcprop-card--cotizador {
	background: var(--mdcprop-cian);
	color: var(--mdcprop-navy-oscuro);
	text-align: center;
}

.mdcprop-cotizador__titulo {
	font-weight: 700;
	margin: 0 0 14px;
}

.mdcprop-btn--cotizador {
	background: var(--mdcprop-navy-oscuro);
	color: #fff;
}

.mdcprop-btn--cotizador:hover { background: var(--mdcprop-navy); }

.mdcprop-link-pdf {
	display: block;
	margin-top: 12px;
	color: var(--mdcprop-navy-oscuro);
	font-weight: 600;
	font-size: 13px;
	text-decoration: underline;
}

/* ---------- Modales ---------- */
.mdcprop-modal {
	position: fixed;
	inset: 0;
	background: rgba(6,15,51,0.65);
	backdrop-filter: blur(3px);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 9999;
	padding: 20px;
}

.mdcprop-modal[hidden] { display: none; }

.mdcprop-modal__contenido {
	background: #fff;
	border-radius: 20px;
	max-width: 460px;
	width: 90%;
	max-height: 88vh;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	position: relative;
	box-shadow: 0 40px 80px -20px rgba(6,15,51,.55);
}

.mdcprop-modal__header {
	position: relative;
	background: linear-gradient(135deg, var(--mdcprop-navy) 0%, var(--mdcprop-navy-oscuro) 100%);
	padding: 30px 32px 26px;
	flex-shrink: 0;
}

.mdcprop-modal__header::after {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(120% 100% at 100% 0%, rgba(41,197,230,.28), transparent 60%);
	pointer-events: none;
}

.mdcprop-modal__icono {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 13px;
	background: rgba(255,255,255,.14);
	margin-bottom: 14px;
	transition: transform .4s cubic-bezier(.34,1.56,.64,1);
}

.mdcprop-modal:not([hidden]) .mdcprop-modal__icono { animation: mdcpropIconoPop .5s cubic-bezier(.34,1.56,.64,1); }
@keyframes mdcpropIconoPop { 0%{ transform:scale(.4) rotate(-15deg); opacity:0; } 100%{ transform:scale(1) rotate(0); opacity:1; } }

.mdcprop-modal__icono svg {
	width: 22px;
	height: 22px;
	stroke: var(--mdcprop-cian);
	fill: none;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.mdcprop-modal__contenido h2 {
	position: relative;
	color: #fff;
	font-size: 21px;
	font-weight: 700;
	margin: 0 0 8px;
	letter-spacing: -.01em;
}

.mdcprop-modal__cerrar {
	position: absolute;
	top: 18px;
	right: 18px;
	width: 32px;
	height: 32px;
	background: rgba(255,255,255,.14);
	border: none;
	border-radius: 50%;
	font-size: 18px;
	line-height: 1;
	cursor: pointer;
	color: #fff;
	transition: background .2s;
	z-index: 2;
}

.mdcprop-modal__cerrar:hover { background: rgba(255,255,255,.26); }

.mdcprop-modal__body {
	padding: 28px 32px 32px;
	overflow-y: auto;
}

.mdcprop-modal__disclaimer {
	font-size: 12px;
	color: var(--mdcprop-gris-texto);
	margin-bottom: 18px;
	line-height: 1.5;
}

.mdcprop-modal__meta {
	position: relative;
	display: inline-block;
	font-size: 12px;
	font-weight: 600;
	color: #fff;
	background: rgba(255,255,255,.14);
	padding: 6px 13px;
	border-radius: 999px;
}

.mdcprop-cotizador-form label,
#mdcprop-form-cita label,
#mdcprop-modal-quiero label {
	display: block;
	font-size: 11.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .05em;
	margin-bottom: 16px;
	color: var(--mdcprop-gris-texto);
}

.mdcprop-modal__fila-2 {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
}

.mdcprop-cotizador-form input,
.mdcprop-cotizador-form select,
#mdcprop-form-cita input,
#mdcprop-modal-quiero input {
	display: block;
	width: 100%;
	margin-top: 8px;
	padding: 13px 15px;
	border: 1.5px solid var(--mdcprop-borde);
	border-radius: 12px;
	font-size: 14.5px;
	font-weight: 500;
	color: var(--mdcprop-navy-oscuro);
	font-family: 'Plus Jakarta Sans', sans-serif;
	background: #FAFBFF;
	transition: border-color .2s, box-shadow .2s, background .2s;
}

.mdcprop-cotizador-form input:focus,
.mdcprop-cotizador-form select:focus,
#mdcprop-form-cita input:focus,
#mdcprop-modal-quiero input:focus {
	outline: none;
	border-color: var(--mdcprop-navy);
	background: #fff;
	box-shadow: 0 0 0 4px rgba(11,45,140,.1);
}

#mdcprop-form-cita .mdcprop-btn--primario,
#mdcprop-modal-quiero .mdcprop-btn--primario {
	width: 100%;
	justify-content: center;
	margin-top: 6px;
	padding: 15px;
	border-radius: 999px;
	font-size: 15px;
	font-weight: 700;
	background: linear-gradient(135deg, var(--mdcprop-navy) 0%, #1657FF 130%);
	box-shadow: 0 14px 28px -10px rgba(11,45,140,.5);
	border: none;
	transition: transform .2s, box-shadow .2s;
}

#mdcprop-form-cita .mdcprop-btn--primario:hover,
#mdcprop-modal-quiero .mdcprop-btn--primario:hover {
	transform: translateY(-1px);
	box-shadow: 0 18px 34px -10px rgba(11,45,140,.6);
}

.mdcprop-cotizador-resultados {
	margin-top: 16px;
}

.mdcprop-escenario-tasa {
	display: flex;
	justify-content: space-between;
	padding: 10px 0;
	border-bottom: 1px solid var(--mdcprop-borde);
}

.mdcprop-escenario-tasa strong {
	font-family: 'Space Grotesk', sans-serif;
	color: var(--mdcprop-navy);
}

.mdcprop-modal__resultado {
	margin-top: 14px;
	font-weight: 600;
	color: var(--mdcprop-navy);
}


/* ---- Secciones extra: video, tour 360, mapa ---- */
.mdcprop-secciones-extra {
	margin-top: 32px;
	display: flex;
	flex-direction: column;
	gap: 28px;
}

.mdcprop-extra-bloque {
	background: #fff;
	border: 1px solid #e8edf5;
	border-radius: 12px;
	overflow: hidden;
}

.mdcprop-extra-titulo {
	font-family: 'Space Grotesk', sans-serif;
	font-size: 11px;
	font-weight: 700;
	color: #6b7280;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	margin: 0;
	padding: 14px 20px;
	border-bottom: 1px solid #e8edf5;
	background: #f8faff;
}

.mdcprop-video-wrap {
	background: #000;
}

.mdcprop-video-wrap iframe {
	display: block;
	width: 100%;
	aspect-ratio: 16/9;
}

.mdcprop-multimedia__link {
	display: block;
	padding: 14px 20px;
	color: #29C5E6;
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
}
.mdcprop-multimedia__link:hover { text-decoration: underline; }

/* ---- Placeholder sin contenido ---- */
.mdcprop-sin-contenido {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 36px 20px;
	color: #9ca3af;
	font-size: 13px;
}
.mdcprop-sin-icono {
	font-size: 32px;
	opacity: 0.4;
}

/* Precio oculto */
.mdcprop-precio-consultar {
	font-size: 18px;
	font-weight: 700;
	color: #6b7280;
	font-style: italic;
}

/* ---------- Lightbox de galería ---------- */
.mdcprop-lightbox {
	position: fixed;
	inset: 0;
	background: rgba(6,15,51,.94);
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
}
.mdcprop-lightbox[hidden] { display: none; }

.mdcprop-lightbox__img {
	max-width: 88vw;
	max-height: 82vh;
	object-fit: contain;
	border-radius: 8px;
	box-shadow: 0 30px 70px -20px rgba(0,0,0,.6);
}

.mdcprop-lightbox__cerrar {
	position: absolute;
	top: 22px;
	right: 26px;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: rgba(255,255,255,.12);
	border: none;
	color: #fff;
	font-size: 22px;
	cursor: pointer;
	transition: background .2s;
}
.mdcprop-lightbox__cerrar:hover { background: rgba(255,255,255,.24); }

.mdcprop-lightbox__nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: rgba(255,255,255,.12);
	border: none;
	color: #fff;
	font-size: 24px;
	cursor: pointer;
	transition: background .2s, transform .2s;
}
.mdcprop-lightbox__nav:hover { background: var(--mdcprop-cian); color: var(--mdcprop-navy-oscuro); }
.mdcprop-lightbox__nav--prev { left: 22px; }
.mdcprop-lightbox__nav--next { right: 22px; }

.mdcprop-lightbox__contador {
	position: absolute;
	bottom: 26px;
	left: 50%;
	transform: translateX(-50%);
	background: rgba(255,255,255,.12);
	color: #fff;
	padding: 8px 18px;
	border-radius: 999px;
	font-size: 13.5px;
	font-weight: 700;
	font-family: 'Space Grotesk', sans-serif;
}

@media (max-width: 640px) {
	.mdcprop-lightbox__nav { width: 42px; height: 42px; font-size: 19px; }
	.mdcprop-lightbox__nav--prev { left: 8px; }
	.mdcprop-lightbox__nav--next { right: 8px; }
	.mdcprop-lightbox__cerrar { top: 12px; right: 12px; }
}