
/* =====================================================
   RESPONSIVE - MÓVIL
===================================================== */

/* =====================================================
   SECCIÓN: AJUSTES GENERALES
===================================================== */

@media(max-width:767px){

	h1{
		font-size:2.2rem;
	}

	section{
		padding:55px 0;
	}

}

/* =====================================================
   SECCIÓN: MENÚ MÓVIL
===================================================== */

@media(max-width:767px){

	/* =================================================
	   BARRA DEL MENÚ
	================================================= */

	.site-menu{
		position:fixed;
		top:0;
		left:0;
		right:0;
		z-index:99999;
		width:100%;
		height:64px;
		margin:0;
		padding:0;
		background:var(--primary);
	}

	/* =================================================
	   CONTENEDOR
	================================================= */

	.site-menu-container{
		position:relative;
	z-index:100000;
	width:90%;
	height:64px;
	margin:0 auto;
	padding:0;
	display:flex;
	align-items:center;
	justify-content:flex-end;
	}

	/* =================================================
	   BOTÓN HAMBURGUESA
	================================================= */

	.site-menu-button{
		position:relative;
		z-index:100002;
		display:flex;
		align-items:center;
		justify-content:center;
		flex-direction:column;
		width:44px;
		height:44px;
		margin:0;
		padding:0;
		cursor:pointer;
	}

	/* =================================================
	   LÍNEAS DEL ICONO
	================================================= */

	.site-menu-button span{
		display:block;
		width:25px;
		height:2px;
		margin:3px 0;
		background:#D4AF37;
		border-radius:2px;
		transition:.25s ease;
	}

	/* =================================================
	   MENÚ OCULTO
	================================================= */

	.site-menu-nav{
		display:none;
		position:absolute;
		top:64px;
		left:5%;
		z-index:100001;
		width:90%;
		height:auto;
		margin:0;
		padding:10px 0;
		flex-direction:column;
		align-items:stretch;
		justify-content:flex-start;
		gap:0;
		background:var(--primary);
		border-radius:0 0 12px 12px;
		box-shadow:0 12px 25px rgba(0,0,0,.18);
		overflow:hidden;
	}

	/* =================================================
	   MENÚ ABIERTO
	================================================= */

	.site-menu-nav.active{
		display:flex;
	}

	/* =================================================
	   ENLACES
	================================================= */

	.site-menu-nav a{
		display:flex;
		align-items:center;
		width:100%;
		min-height:52px;
		height:52px;
		box-sizing:border-box;
		margin:0;
		padding:0 25px;
		color:#FFFFFF !important;
		font-size:15px;
		font-weight:600;
		border-bottom:1px solid rgba(255,255,255,.12);
		transition:.25s;
	}

	.site-menu-nav a:last-child{
		border-bottom:none;
	}

	.site-menu-nav a:hover{
		padding-left:32px;
		background:rgba(255,255,255,.10);
		color:#60A5FA !important;
	}

	.site-menu-nav a.active{
		color:#D4AF37 !important;
	}

	/* =================================================
	   BOTÓN HAMBURGUESA ACTIVO
	================================================= */

	.site-menu-button.active span:nth-child(1){
		transform:translateY(8px) rotate(45deg);
	}

	.site-menu-button.active span:nth-child(2){
		opacity:0;
		transform:scaleX(0);
	}

	.site-menu-button.active span:nth-child(3){
		transform:translateY(-8px) rotate(-45deg);
	}

	/* =================================================
	   ESPACIO SUPERIOR
	================================================= */

	body{
		padding-top:64px;
	}

}




/* =====================================================
   SECCIÓN: HERO
===================================================== */

@media(max-width:767px){

	.hero{
		width:100%;
		aspect-ratio:9 / 16;
		min-height:0;
		overflow:hidden;
		background-size:cover;
		background-position:center center;
	}

	.overlay{
	display:flex;
	align-items:center;
	justify-content:center;
	width:100%;
	min-height:calc(100% + 20vh);
	height:calc(100% + 20vh);
	margin-top:-10vh;
	margin-bottom:-10vh;
	box-sizing:border-box;
	overflow:visible;
	background:rgba(15,23,42,.55);
}

	@media(max-width:767px) and (orientation:landscape){

	.overlay{
		min-height:calc(100% + 120px);
		height:calc(100% + 120px);
		margin-top:-60px;
		margin-bottom:-60px;
	}

}

	/* =================================================
	   TÍTULO
	================================================= */

	.hero-content h1{
		margin:10px 0;
		font-size:42px;
		line-height:1.1;
	}

	/* =================================================
	   DESCRIPCIÓN
	================================================= */

	.hero-content > p{
		margin:0 auto 20px;
		font-size:18px;
		line-height:1.4;
	}

	/* =================================================
	   FILA HERO
	================================================= */

	.hero-search-row{
		display:flex;
		flex-direction:column;
		align-items:center;
		justify-content:center;
		width:100%;
		gap:20px;
	}

	/* =================================================
	   LOGO
	================================================= */

	.hero-logo{
		width:100%;
	}

	.hero-logo img{
		display:block;
		width:220px;
		max-width:100%;
		height:auto;
		margin:0 auto;
	}

	/* =================================================
	   FILTRO
	================================================= */

	.search{
		display:flex;
		flex-direction:column;
		align-items:center;
		width:100%;
		max-width:360px;
		margin:0 auto;
		gap:8px;
	}

	/* =================================================
	   SELECTORES
	================================================= */

	.search select{
		width:100%;
		height:42px;
		padding:0 12px;
	}

	/* =================================================
	   BOTÓN BUSCAR
	================================================= */

	.search button{
		width:100%;
		height:42px;
		padding:0 20px;
	}

}
/* =====================================================
   SECCIÓN: PROPIEDADES DESTACADAS
===================================================== */

@media(max-width:767px){

	.featured-properties-container{
		width:90%;
		padding:55px 0;
	}

	.properties-title{
		margin-bottom:35px;
	}

	.properties-title span{
		font-size:28px;
	}

	.property-grid{
		grid-template-columns:1fr;
		gap:20px;
	}

	.propiedad-destacada-card{
		height:470px;
	}

}

/* =====================================================
   SECCIÓN: SERVICIOS
===================================================== */

@media(max-width:767px){

	.services-subcontainer{
		width:90%;
		padding:60px 0;
	}

	.services-title{
		margin-bottom:35px;
	}

	.services-title span{
		font-size:28px;
	}

	.services-grid{
		grid-template-columns:1fr;
		gap:20px;
	}

	.service-card{
		padding:30px 20px;
	}

}

/* =====================================================
   SECCIÓN: NOSOTROS
===================================================== */

@media(max-width:767px){

	.about-container{
		width:90%;
		padding:65px 0;
		gap:35px;
	}

	.about-image img{
		height:350px;
	}

	.about-content span{
		font-size:30px;
	}

	.about-content h2{
		font-size:30px;
	}

	.about-stats{
		flex-direction:column;
		gap:20px;
	}

}

/* =====================================================
   SECCIÓN: TESTIMONIOS
===================================================== */

@media(max-width:767px){

	.subtestimonials-container{
		width:90%;
		padding:65px 0;
	}

	.testimonials-title{
		margin-bottom:35px;
	}

	.testimonials-title span{
		font-size:28px;
	}

	.testimonial-container{
		grid-template-columns:1fr;
		gap:20px;
	}

	.testimonial-card{
		padding:30px 20px;
	}

}

/* =====================================================
   SECCIÓN: FOOTER
===================================================== */

@media(max-width:767px){

	.footer-container{
		width:90%;
		grid-template-columns:1fr;
		gap:30px;
	}

}

/* =====================================================
   SECCIÓN: CATÁLOGO DE PROPIEDADES
===================================================== */

@media(max-width:767px){

	.catalogo-propiedades{
		padding-top:0;
	}

	.catalogo-propiedades-contenedor{
		width:90%;
		padding:0 0 60px;
	}

	.catalogo-propiedades-titulo{
		margin-bottom:35px;
	}

	.catalogo-propiedades-titulo span{
		font-size:16px;
	}

	.catalogo-propiedades-titulo h1{
		font-size:30px;
	}

	.catalogo-propiedades-titulo p{
		font-size:17px;
	}


	.catalogo-filtro{
		flex-direction:column;
		width:85%;
		gap:8px;
		margin:0 auto 50px;
	}

	.catalogo-filtro select{
		width:100%;
		height:40px;
		padding:0 12px;
		font-size:13px;
	}

	.catalogo-filtro button{
		width:100%;
		height:40px;
		font-size:13px;
	}

}

/* =====================================================
   SECCIÓN: CARRUSEL DE CATEGORÍAS
===================================================== */

@media(max-width:767px){

	.categorias-carrusel-flecha{
		flex:0 0 34px;
		width:34px;
		height:34px;
		margin:0 5px;
		font-size:22px;
	}

	.categorias-carrusel-lista{
		gap:12px;
	}

	.categoria2-card{
		flex:0 0 100%;
		height:360px;
	}

	.categoria2-info{
		padding:12px 15px 14px;
	}

	.categoria2-info h2{
		font-size:18px;
	}

	.categoria2-boton{
		width:70%;
	}

	.categorias-carrusel-ventana{
		touch-action:pan-y;
	}

}

/* =====================================================
   SECCIÓN: PROPIEDADES POR CATEGORÍA
===================================================== */

@media(max-width:767px){
	
	.propiedades-categoria{
		padding-top:0;
	}

	.propiedades-categoria-titulo{
		margin-bottom:20px;
	}

	.propiedades-categoria-titulo span{
		font-size:16px;
	}

	.propiedades-categoria-titulo h2{
		font-size:30px;
	}

	.propiedades-categoria-titulo p{
		font-size:17px;
	}

	.propiedades-categoria-lista{
		padding-top:20px;
		border-top:4px solid rgba(30,58,138,.35);
		grid-template-columns:1fr;
		gap:20px;
	}

	.propiedad2-card{
		height:470px;
	}

	.propiedad2-info{
		padding:12px 15px 14px;
	}

	.propiedad2-info h2{
		font-size:18px;
	}

	.propiedad2-boton{
		width:70%;
	}

	.propiedades-categoria-regresar{
		margin-top:35px;
	}

}

/* =====================================================
   SECCIÓN: PROPIEDAD DETALLE
===================================================== */

@media(max-width:767px){

	#propiedad-detalle{
		display:flex;
		flex-direction:column;
		width:90%;
		max-width:none;
		padding:30px 0 60px;
	}

	/* =================================================
	   ORDEN RESPONSIVE
	================================================= */

	.detalle-galeria{
		display:contents;
	}

	.detalle-imagen-principal{
		order:1;
	}

	.detalle-miniaturas{
		order:2;
	}

	.detalle-flyer,
	.detalle-flyer-simulado{
		order:3;
	}

	.detalle-cabecera{
		order:4;
	}

	.detalle-contenido{
		order:5;
	}

	.detalle-lateral{
		order:6;
	}

	/* =================================================
	   ESPACIO SUPERIOR DEL CONTENIDO
	================================================= */

	.detalle-imagen-principal{
		margin-top:70px;
	}



	/* =================================================
	   ENCABEZADO
	================================================= */

	.detalle-superior{
		position:fixed;
		top:84px;
		left:5%;
		z-index:900;
		display:flex;
		flex-direction:row;
		align-items:center;
		justify-content:space-between;
		gap:10px;
		width:90%;
		box-sizing:border-box;
		margin:0;
		padding:9px 10px;
		border-radius:12px;
	}

	.detalle-regresar{
		flex:0 0 auto;
	}

	#boton-regresar{
		width:auto;
		padding:9px 12px;
		font-size:10px;
		white-space:nowrap;
	}

	.detalle-titulo-superior{
		flex:1;
		min-width:0;
		font-size:18px;
		line-height:1.2;
		text-align:right;
	}

	/* =================================================
	   GALERÍA
	================================================= */

	.detalle-imagen-principal{
		width:100%;
		height:350px;
	}

	.detalle-imagen-principal img{
		width:100%;
		height:100%;
		object-fit:cover;
	}

	.detalle-miniaturas{
		width:100%;
		margin-top:0;
		gap:7px;
		overflow-x:auto;
		overflow-y:hidden;
		padding-bottom:3px;
	}

	.miniatura-propiedad{
		flex:0 0 65px;
		width:65px;
		height:50px;
		border-radius:7px;
	}

	/* =================================================
	   FLYER 3:4
	================================================= */

	.detalle-flyer,
	.detalle-flyer-simulado{
		width:78%;
		max-width:330px;
		height:auto;
		aspect-ratio:3 / 4;
		margin:5px auto 0;
		border-radius:12px;
	}

	.detalle-flyer img{
		display:block;
		width:100%;
		height:100%;
		object-fit:contain;
		border-radius:12px;
	}

	.detalle-flyer-simulado{
		font-size:18px;
	}

	/* =================================================
	   INFORMACIÓN PRINCIPAL
	================================================= */

	.detalle-cabecera{
		flex-direction:column;
		align-items:stretch;
		gap:18px;
		width:100%;
		margin-top:20px;
		padding:20px;
		border-radius:15px;
	}

	.detalle-cabecera > div:first-child{
		width:100%;
	}

	.detalle-operacion{
		padding:6px 14px;
		font-size:11px;
	}

	.detalle-ubicacion{
		margin:10px 0 7px;
		font-size:21px;
	}

	.detalle-categoria{
		font-size:11px;
	}

	.detalle-precio{
		align-items:flex-start;
		width:100%;
		text-align:left;
	}

	.detalle-precio strong{
		font-size:25px;
	}

	.detalle-precio span{
		font-size:12px;
	}

	/* =================================================
	   CONTENIDO
	===================================================== */

	.detalle-contenido{
		display:flex;
		flex-direction:column;
		width:100%;
		gap:18px;
		margin-top:18px;
	}

	.detalle-principal{
		width:100%;
		gap:18px;
	}

	/* =================================================
	   BLOQUES
	===================================================== */

	.detalle-bloque{
		width:100%;
		padding:20px;
		border-radius:15px;
	}

	.detalle-bloque h2{
		gap:9px;
		margin-bottom:18px;
		font-size:18px;
	}

	.detalle-bloque p{
		font-size:16px;
		line-height:1.7;
	}

	.detalle-seccion-icono{
		width:30px;
		height:30px;
		font-size:16px;
	}

	/* =================================================
	   CARACTERÍSTICAS
	===================================================== */

	.detalle-caracteristicas-titulo{
		gap:10px;
		margin-bottom:16px;
	}

	.detalle-caracteristicas-icono{
		width:34px;
		height:34px;
		font-size:17px;
	}

	.detalle-caracteristicas-titulo h2{
		font-size:18px;
	}

	.atributos{
		grid-template-columns:1fr;
		gap:8px;
	}

	.atributo{
		min-height:52px;
		padding:9px 10px;
	}

	.atributo::before{
		width:25px;
		height:25px;
		font-size:12px;
	}

	.atributo strong{
		font-size:15px;
	}

	.atributo span{
		font-size:16px;
	}

	/* =================================================
	   UBICACIÓN
	===================================================== */

	.detalle-ubicacion-mapa{
		display:flex;
		flex-direction:column;
		width:100%;
		gap:15px;
	}

	.detalle-ubicacion-datos{
		width:100%;
		padding:18px;
		box-sizing:border-box;
		border-radius:12px;
	}

	.detalle-ubicacion-datos span{
		margin-bottom:5px;
		font-size:16px;
	}

	.detalle-ubicacion-datos strong{
		margin-bottom:16px;
		font-size:16px;
	}

	.detalle-mapa{
		width:100%;
		max-width:700px;
		min-height:280px;
		margin:0 auto;
		border-radius:12px;
	}

	.detalle-mapa iframe{
		width:100%;
		height:280px;
	}

	/* =================================================
	   PANEL FLOTANTE
	===================================================== */

	.detalle-lateral{
		position:fixed;
		right:12px;
		top:auto;
		bottom:55px;
		z-index:950;
		width:190px;
	}

	.detalle-card{
		width:100%;
		padding:14px;
		border-radius:12px;
		box-shadow:0 8px 25px rgba(0,0,0,.30);
	}

	.detalle-card > span{
		margin-bottom:4px;
		font-size:8px;
	}

	.detalle-card > strong{
		margin-bottom:10px;
		font-size:14px;
	}

	.detalle-card .detalle-estado{
		margin-bottom:10px;
		font-size:12px;
	}

	.detalle-card .detalle-fecha{
		margin-bottom:10px;
		font-size:10px;
	}

	#boton-contacto-propiedad{
		margin-top:0;
		padding:9px 10px;
		font-size:9px;
	}

}


/* =====================================================
   SECCIÓN: NOSOTROS
===================================================== */

@media(max-width:767px){

	.nosotros-hero{
		padding:55px 0;
	}

	.nosotros-hero .nosotros-container{
		width:90%;
	}

	.nosotros-etiqueta{
		margin-bottom:12px;
		font-size:11px;
		letter-spacing:2px;
	}

	.nosotros-hero h1{
		font-size:34px;
		line-height:1.15;
		margin-bottom:18px;
	}

	.nosotros-hero p{
		font-size:15px;
		line-height:1.65;
		text-align:justify;
	}

	.nosotros-quienes{
		padding:55px 0;
	}

	.nosotros-quienes-grid{
		width:90%;
		grid-template-columns:1fr;
		gap:25px;
	}

	.nosotros-quienes h2{
		font-size:28px;
	}

	.nosotros-quienes-texto p{
		font-size:15px;
	}

	.nosotros-propuesta{
		padding:22px 18px;
		border-radius:16px;
	}

	.nosotros-propuesta-item{
		grid-template-columns:35px 1fr;
		gap:10px;
		padding:13px 0;
	}

	.nosotros-propuesta-item p{
		font-size:13px;
	}

	.nosotros-section-header{
		width:90%;
		margin-bottom:30px;
	}

	.nosotros-section-header h2{
		font-size:28px;
		margin-bottom:12px;
	}

	.nosotros-section-header p{
		font-size:15px;
	}

	.nosotros-socios{
		padding:55px 0;
	}

	.nosotros-socios .nosotros-container{
		width:90%;
	}

	.socios-grid{
		grid-template-columns:1fr;
		gap:18px;
	}

	.socio-foto{
		aspect-ratio:16 / 9;
	}

	.socio-info{
		padding:14px 15px;
	}

	.socio-info h3{
		font-size:16px;
	}

	.nosotros-identidad{
		padding:55px 0;
	}

	.nosotros-identidad .nosotros-container{
		width:90%;
	}

	.identidad-grid{
		grid-template-columns:1fr;
		gap:15px;
		margin-bottom:20px;
	}

	.identidad-card{
		padding:22px 18px;
		border-radius:16px;
	}

	.identidad-card p{
		font-size:14px;
	}

	.valores-grid{
		grid-template-columns:1fr;
		gap:12px;
	}

	.valor-card{
		padding:20px;
	}

	.valor-card h3{
		font-size:17px;
	}

	.valor-card p{
		font-size:13px;
	}

	.nosotros-servicios{
		padding:55px 0;
	}

	.nosotros-servicios .nosotros-container{
		width:90%;
	}

	.servicios-grid{
		grid-template-columns:1fr;
		gap:15px;
	}

	.servicio-card{
		min-height:0;
		padding:24px 20px;
		border-radius:16px;
	}

	.servicio-card h3{
		font-size:18px;
	}

	.servicio-card p{
		font-size:14px;
	}

	.nosotros-especialidades{
		padding:55px 0;
	}

	.nosotros-especialidades .nosotros-container{
		width:90%;
	}

	.especialidades-grid{
		grid-template-columns:1fr;
		gap:25px;
	}

	.especialidades-texto h2{
		font-size:28px;
	}

	.especialidades-texto p{
		font-size:15px;
	}

	.especialidades-lista{
		border-radius:16px;
	}

	.especialidad-item{
		grid-template-columns:35px 1fr;
		gap:10px;
		padding:12px 15px;
	}

	.especialidad-item p{
		font-size:13px;
	}

	.cobertura{
		margin-top:25px;
		padding:20px;
	}

	.cobertura p{
		font-size:13px;
	}

	.nosotros-formalidad{
		padding:55px 0;
	}

	.nosotros-formalidad .nosotros-container{
		width:90%;
	}

	.nosotros-formalidad .formalidad-contenido > h2{
		font-size:28px;
	}

	.nosotros-formalidad .formalidad-contenido > p:not(.formalidad-nota){
		width:100%;
		font-size:15px;
	}

	.registro-marca{
		grid-template-columns:1fr;
		gap:12px;
		margin:25px 0 20px;
	}

	.registro-item{
		padding:20px 18px;
	}

	.nosotros-presencia{
		padding:55px 0;
	}

	.nosotros-presencia .nosotros-container{
		width:90%;
	}

	.presencia-contenido h2{
		font-size:28px;
	}

	.presencia-contenido > p{
		font-size:15px;
	}

	.presencia-web{
		width:100%;
		box-sizing:border-box;
		margin:18px 0;
		padding:15px 20px;
	}

	.presencia-web a{
		font-size:18px;
	}

}


/* =====================================================
   SECCIÓN: ASESORÍA JURÍDICA
===================================================== */

@media(max-width:767px){

	.asesoria-container{
		width:90%;
	}

	.asesoria-hero{
		padding:55px 0;
	}

	.asesoria-hero h1{
		font-size:34px;
		line-height:1.15;
	}

	.asesoria-hero p{
		font-size:15px;
		line-height:1.65;
	}

	.asesoria-section-header{
		width:90%;
		margin-bottom:30px;
	}

	.asesoria-section-header h2{
		font-size:28px;
		line-height:1.25;
	}

	.asesoria-section-header p{
		font-size:15px;
	}

	.asesoria-servicios{
		padding:55px 0;
	}

	.asesoria-servicios-grid{
		grid-template-columns:1fr;
		gap:15px;
	}

	.asesoria-servicio-card{
		padding:24px 20px;
		min-height:0;
		border-radius:16px;
	}

	.asesoria-servicio-card h3{
		font-size:18px;
	}

	.asesoria-servicio-card p{
		font-size:14px;
		line-height:1.65;
	}

	.asesoria-proceso{
		padding:55px 0;
	}

	.asesoria-proceso-grid{
		grid-template-columns:1fr;
		gap:15px;
	}

	.asesoria-proceso-card{
		padding:22px 18px;
		border-radius:16px;
	}

	.asesoria-proceso-card h3{
		font-size:18px;
	}

	.asesoria-proceso-card p{
		font-size:14px;
	}

	.asesoria-importancia{
		padding:55px 0;
	}

	.asesoria-importancia-grid{
		grid-template-columns:1fr;
		gap:25px;
	}

	.asesoria-importancia-contenido h2{
		font-size:28px;
	}

	.asesoria-importancia-contenido p{
		font-size:15px;
		line-height:1.65;
	}

	.asesoria-alcance{
		padding:55px 0;
	}

	.asesoria-alcance-grid{
		grid-template-columns:1fr;
		gap:15px;
	}

	.asesoria-alcance-card{
		padding:22px 18px;
		border-radius:16px;
	}

	.asesoria-alcance-card h3{
		font-size:18px;
	}

	.asesoria-alcance-card p{
		font-size:14px;
	}

	.asesoria-contacto{
		padding:55px 0;
	}

	.asesoria-contacto-contenido{
		width:90%;
	}

	.asesoria-contacto-contenido h2{
		font-size:28px;
	}

	.asesoria-contacto-contenido p{
		font-size:15px;
	}

}