
/* =====================================================
   RESPONSIVE - TABLETA
===================================================== */

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

@media(max-width:992px){

	h1{
		font-size:3rem;
	}

	section{
		padding:70px 0;
	}

}

/* =====================================================
   SECCIÓN: CONTACTO
===================================================== */

@media(max-width:900px){

	.contact{
		padding:70px 0;
	}

	.contact > .container{
		width:90%;
		grid-template-columns:1fr;
		gap:50px;
	}

	.contact-heading{
		max-width:700px;
	}

	.contact-heading h1{
		font-size:38px;
	}

	.contact-form{
		max-width:650px;
	}

}

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

@media(max-width:1000px){

	.propiedades-destacadas-lista{
		grid-template-columns:repeat(2,1fr);
	}

}

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

@media(max-width:1000px){

	.category-grid{
		grid-template-columns:repeat(2,1fr);
	}

}

/* =====================================================
   SECCIÓN: MENÚ TABLETA
===================================================== */

@media(min-width:768px) and (max-width:1199px){

	/* =================================================
	   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:1199px){

	.hero{
		min-height:600px;
	}

	.overlay{
		min-height:600px;
	}

	.hero-content{
		width:90%;
		margin:20px;
	}

	.hero-content .tag{
		font-size:20px;
		letter-spacing:2px;
	}

	.hero-content h1{
		font-size:60px;
	}

	.hero-content > p{
		font-size:21px;
	}

	.hero-search-row{
		gap:25px;
	}

	.hero-logo img{
		width:400px;
	}

}

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

@media(max-width:1199px){

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

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

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

	.property-grid{
		grid-template-columns:repeat(2,1fr);
		gap:25px;
	}

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

}

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

@media(max-width:1199px){

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

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

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

	.services-grid{
		grid-template-columns:repeat(2,1fr);
		gap:25px;
	}

	.service-card{
		padding:35px 25px;
	}

}

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

@media(max-width:1199px){

	.about-container{
		width:90%;
		padding:90px 0;
		grid-template-columns:1fr;
		gap:50px;
	}

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

	.about-content{
		text-align:center;
	}

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

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

	.about-stats{
		justify-content:center;
	}

	.about-btn{
		margin:auto;
	}

}

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

@media(max-width:1199px){

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

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

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

	.testimonial-container{
		grid-template-columns:repeat(2,1fr);
		gap:25px;
	}

	.testimonial-card{
		padding:35px 25px;
	}

}

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

@media(max-width:1199px){

	.footer-container{
		width:90%;
		grid-template-columns:repeat(2,1fr);
		gap:35px;
	}

}

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

@media(max-width:1199px){

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

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

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

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

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

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

		.catalogo-filtro{
		width:90%;
		gap:15px;
	}

	.catalogo-filtro select{
		width:220px;
		height:48px;
	}

	.catalogo-filtro button{
		width:120px;
		height:48px;
		flex:none;
	}


}

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

@media(max-width:1199px){

	.categorias-carrusel-flecha{
		flex:0 0 40px;
		width:40px;
		height:40px;
		margin:0 10px;
		font-size:27px;
	}

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

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

	.categoria2-info{
		padding:14px 18px 16px;
	}

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

	.categoria2-boton{
		width:65%;
	}

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

}

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

@media(max-width:1199px){

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

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

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

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

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

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

	.propiedad2-card{
		height:500px;
	}

	.propiedad2-info{
		padding:14px 18px 16px;
	}

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

	.propiedad2-boton{
		width:65%;
	}

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

}

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

@media(max-width:1199px){

	#propiedad-detalle{
		display:flex;
		flex-direction:column;
		width:90%;
		max-width:none;
		padding:0 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;
		align-items:center;
		justify-content:space-between;
		gap:20px;
		width:90%;
		box-sizing:border-box;
		margin:0;
		padding:12px 15px;
	}

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

	#boton-regresar{
		padding:11px 18px;
		font-size:12px;
		white-space:nowrap;
	}

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

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

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

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

	.detalle-miniaturas{
		width:100%;
		margin-top:0;
		gap:8px;
	}

	.miniatura-propiedad{
		width:75px;
		height:55px;
	}

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

	.detalle-flyer,
	.detalle-flyer-simulado{
		width:80%;
		max-width:520px;
		height:auto;
		aspect-ratio:3 / 4;
		margin:0 auto;
	}

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

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

	.detalle-cabecera{
		flex-direction:column;
		align-items:flex-start;
		gap:20px;
		margin-top:25px;
		padding:25px;
	}

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

	.detalle-ubicacion{
		font-size:24px;
	}

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

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

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

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

	.detalle-principal{
		width:100%;
	}

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

	.atributos{
		grid-template-columns:repeat(2,minmax(0,1fr));
	}

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

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

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

	.detalle-ubicacion-mapa{
		grid-template-columns:1fr;
		gap:20px;
	}

	.detalle-ubicacion-datos{
		width:100%;
	}

	.detalle-mapa{
		width:100%;
		max-width:850px;
		min-height:320px;
		margin:0 auto;
	}

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

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

	.detalle-lateral{
		position:fixed;
		right:20px;
		top:auto;
		bottom:80px;
		z-index:950;
		width:230px;
	}

	.detalle-card{
		padding:18px;
		border-radius:14px;
		box-shadow:0 10px 30px rgba(0,0,0,.30);
	}

	.detalle-card > span{
		margin-bottom:5px;
		font-size:9px;
	}

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

	.detalle-card .detalle-estado{
		margin-bottom:15px;
		font-size:14px;
	}

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

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

}


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

@media(max-width:1199px){

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

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

	.nosotros-hero h1{
		font-size:42px;
	}

	.nosotros-hero p{
		font-size:16px;
	}

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

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

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

	.nosotros-propuesta{
		padding:25px;
	}

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

	.nosotros-section-header h2{
		font-size:32px;
	}

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

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

	.socios-grid{
		grid-template-columns:repeat(2,1fr);
		gap:20px;
	}

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

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

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

	.valores-grid{
		grid-template-columns:repeat(2,1fr);
		gap:15px;
	}

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

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

	.servicios-grid{
		grid-template-columns:repeat(2,1fr);
		gap:20px;
	}

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

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

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

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

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

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

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

	.registro-marca{
		grid-template-columns:repeat(3,1fr);
		gap:12px;
	}

	.registro-item{
		padding:22px 15px;
	}

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

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

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

}


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

@media(max-width:1199px){

	.asesoria-juridica-page{
		width:100%;
	}

	.asesoria-container{
		width:90%;
	}

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

	.asesoria-hero h1{
		font-size:42px;
	}

	.asesoria-hero p{
		font-size:16px;
	}

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

	.asesoria-section-header h2{
		font-size:32px;
	}

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

	.asesoria-servicios-grid{
		grid-template-columns:repeat(2,1fr);
		gap:20px;
	}

	.asesoria-servicio-card{
		padding:28px 22px;
	}

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

	.asesoria-proceso-grid{
		grid-template-columns:repeat(2,1fr);
		gap:20px;
	}

	.asesoria-proceso-card{
		padding:25px 20px;
	}

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

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

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

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

	.asesoria-alcance-grid{
		grid-template-columns:repeat(2,1fr);
		gap:20px;
	}

	.asesoria-alcance-card{
		padding:25px 20px;
	}

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

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

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

}