/* Capa de actualización visual (2026-10-11).
   Se carga DESPUÉS de estilos.css: pule el diseño existente sin cambiar la estructura.
   Paleta de la marca: oscuro #202628, arena #e5ddc5, celeste #b2c8cf, verde El Duque #2c4a37. */

:root{
	--v-dark: #202628;
	--v-sand: #e5ddc5;
	--v-sky: #b2c8cf;
	--v-green: #2c4a37;
	--v-radius: 16px;
	--v-shadow: 0 12px 32px -14px rgba(32, 38, 40, 0.35);
	--v-shadow-hover: 0 22px 44px -16px rgba(32, 38, 40, 0.45);
}

html{
	scroll-behavior: smooth;
	scroll-padding-top: 110px; /* el menú queda fijo arriba */
}

body{
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

::selection{
	background-color: rgba(178, 200, 207, 0.6);
}

a, button{
	transition: color 0.2s ease, background-color 0.2s ease, transform 0.25s ease, box-shadow 0.25s ease;
}

:focus-visible{
	outline: 2px solid var(--v-sky);
	outline-offset: 3px;
}

/* ---------- MENÚ FIJO ---------- */

header{
	position: sticky;
	top: 0;
	z-index: 1030;
	background-color: #ffffff;
	transition: box-shadow 0.3s ease;
}

header.is-scrolled{
	box-shadow: 0 10px 30px -14px rgba(32, 38, 40, 0.45);
}

header .header-top{
	height: 4px;
}

header .header-info{
	height: 96px;
}

header .header-info ul li a{
	position: relative;
	display: inline-block;
	padding: 6px 0;
	letter-spacing: 0.03em;
}

header .header-info ul li a::after{
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 0;
	height: 2px;
	border-radius: 2px;
	background-color: var(--v-dark);
	transition: width 0.25s ease;
}

header .header-info ul li a:hover::after,
header .header-info ul li a[aria-current="page"]::after{
	width: 100%;
}

header .header-whatsapp,
header .header-contacto{
	border-radius: 999px;
	padding: 8px 24px;
	box-shadow: 0 6px 16px -8px rgba(32, 38, 40, 0.6);
}

header a:hover .header-whatsapp,
header a:hover .header-contacto{
	background-color: #000000;
	transform: translateY(-1px);
}

header .header-red img{
	transition: transform 0.2s ease, opacity 0.2s ease;
}

header a:hover .header-red img{
	transform: scale(1.1);
}

header .header-menu-abrir,
header .header-menu-cerrar{
	cursor: pointer;
}

@media (max-width:991px){
	header .header-info{
		height: 92px;
	}

	header .header-logo-movil{
		width: 118px;
		padding-top: 4px;
	}

	/* el menú móvil se abre justo debajo del encabezado */
	header .header-menu-movil{
		top: 100%;
		height: calc(100vh - 96px);
		overflow-y: auto;
		box-shadow: 0 20px 30px -20px rgba(0, 0, 0, 0.3);
	}

	header .header-menu-movil ul li a{
		display: block;
		padding: 12px 0;
		letter-spacing: 0.04em;
	}
}

/* ---------- EQUIPO ---------- */

.equipo .equipo-info{
	text-align: left;
}

.equipo .equipo-info h2::after{
	content: "";
	display: block;
	width: 56px;
	height: 4px;
	border-radius: 4px;
	background-color: var(--v-dark);
	margin: 14px 0 18px 0;
}

.equipo .equipo-info h1{
	font-size: 18px;
	font-weight: 500;
	line-height: 1.5;
	color: var(--v-dark);
}

.equipo .equipo-info p{
	line-height: 1.7;
}

/* ---------- MISIÓN / VISIÓN ---------- */

.mision-vision .mision-vision-boton{
	border-radius: var(--v-radius);
	letter-spacing: 0.02em;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.mision-vision .mision-vision-boton:hover{
	transform: translateY(-4px);
	box-shadow: 0 22px 40px -20px rgba(0, 0, 0, 0.7);
}

.mision-vision .mision-vision-cta{
	display: block;
	border: 0;
	border-radius: 999px;
	padding: 7px 0;
	margin-top: 10px !important;
	font-weight: 500 !important;
	letter-spacing: 0.08em;
	font-family: inherit;
}

.mision-vision .mision-vision-cta:hover{
	background-color: #000000;
}

.modal-content{
	border: 0;
	border-radius: var(--v-radius);
	overflow: hidden;
}

/* ---------- PROYECTOS ---------- */

.proyectos .owl-stage-outer{
	padding: 12px 0 44px 0;
}

.proyectos .proyectos-modulo{
	border: 0;
	border-radius: var(--v-radius);
	box-shadow: var(--v-shadow);
	padding: 14px 14px 22px 14px;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.proyectos .proyectos-modulo:hover{
	transform: translateY(-6px);
	box-shadow: var(--v-shadow-hover);
}

.proyectos .proyectos-modulo-imagen{
	border: 0;
	border-radius: 12px;
	overflow: hidden;
}

.proyectos .proyectos-modulo-imagen img{
	transition: transform 0.5s ease;
}

.proyectos .proyectos-modulo:hover .proyectos-modulo-imagen img{
	transform: scale(1.04);
}

.proyectos .proyectos-modulo-lotes{
	color: #7f9ea8;
}

.proyectos .proyectos-modulo-cta,
.duque .duque-info .duque-cat{
	border-radius: 999px;
	padding: 8px 0;
	line-height: 1.4;
	font-weight: 500;
	letter-spacing: 0.06em;
	transition: background-color 0.2s ease, transform 0.2s ease;
}

.proyectos a:hover .proyectos-modulo-cta,
.duque a:hover .duque-cat{
	background-color: #000000;
	transform: translateY(-1px);
}

.proyectos .owl-prev,
.proyectos .owl-next{
	box-shadow: 0 6px 16px -6px rgba(0, 0, 0, 0.45);
	background-position: center;
}

/* ---------- EL DUQUE (bloque de la home) ---------- */

.duque .duque-info p{
	letter-spacing: 0.04em;
}

/* ---------- MAPA ---------- */

.mapa-google{
	border-radius: var(--v-radius);
	overflow: hidden;
	box-shadow: var(--v-shadow);
}

.mapa-info{
	border-radius: 14px;
	box-shadow: 0 16px 40px -18px rgba(0, 0, 0, 0.5);
}

.mapa-ubicacion{
	border-bottom-color: #e3e7e8;
	border-radius: 10px;
	transition: background-color 0.2s ease;
}

.mapa-ubicacion:hover,
.mapa-ubicacion.is-active{
	background-color: #f2f5f6;
}

.mapa-ubicacion .mapa-cat{
	border-radius: 999px;
	font-size: 12px;
	letter-spacing: 0.06em;
	transition: background-color 0.2s ease;
}

.mapa-ubicacion .mapa-cat:hover,
.mapa-ubicacion.is-active .mapa-cat{
	background-color: var(--v-green);
}

.mapa-ubicaciones{
	scrollbar-width: thin;
	scrollbar-color: #9aa5a8 transparent;
}

@media (max-width:991px){
	.mapa-info{
		border-radius: 0 0 var(--v-radius) var(--v-radius);
	}
}

/* ---------- CONTACTO ---------- */

.contacto .container{
	border-radius: var(--v-radius);
	overflow: hidden;
	box-shadow: var(--v-shadow);
}

.contacto .contacto-whatsapp{
	border-radius: 999px;
	padding: 8px 30px;
	box-shadow: 0 10px 22px -10px rgba(32, 38, 40, 0.7);
}

.contacto a:hover .contacto-whatsapp{
	background-color: #000000;
	transform: translateY(-2px);
}

.contacto .contacto-info .modulo{
	border-top-color: rgba(32, 38, 40, 0.25);
}

/* ---------- FORMULARIO (pie) ---------- */

footer .form-control{
	height: 50px;
	border: 1px solid transparent;
	border-radius: 12px;
	padding: 10px 16px;
	font-size: 15px;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

footer textarea.form-control{
	padding-top: 14px;
	resize: vertical;
}

footer .form-control:focus{
	border-color: var(--v-sky);
	box-shadow: 0 0 0 4px rgba(178, 200, 207, 0.35);
}

footer form .boton-enviar{
	border-radius: 999px;
	padding: 12px 44px;
	font-weight: 700;
	letter-spacing: 0.08em;
	color: var(--v-dark);
	cursor: pointer;
	box-shadow: 0 10px 22px -12px rgba(0, 0, 0, 0.8);
}

footer form .boton-enviar:hover{
	background-color: #ffffff;
	transform: translateY(-1px);
}

footer .alert{
	border-radius: 12px;
}

footer h2::after{
	content: "";
	display: block;
	width: 56px;
	height: 4px;
	border-radius: 4px;
	background-color: var(--v-sky);
	margin-top: 14px;
}

footer .redes a i{
	transition: transform 0.2s ease, opacity 0.2s ease;
}

footer .redes a:hover i{
	transform: scale(1.12);
}

/* ---------- EL DUQUE (página) ---------- */

.duque-barrio .boton{
	border-radius: 999px;
	box-shadow: 0 14px 30px -14px rgba(0, 0, 0, 0.7);
	transition: background-color 0.2s ease, transform 0.25s ease;
}

.duque-barrio a:hover .boton{
	background-color: var(--v-green);
	transform: translateY(-2px);
}

.duque-tour-360 .tour-container{
	padding: 0 15px;
}

.duque-tour-360 .tour-container iframe{
	border-radius: var(--v-radius);
	box-shadow: 0 30px 60px -30px rgba(0, 0, 0, 0.8);
}

.duque-comodidades .circulos .circulo{
	box-shadow: 0 18px 40px -20px rgba(0, 0, 0, 0.7);
	transition: transform 0.3s ease;
}

.duque-comodidades .circulos .circulo:hover{
	transform: translateY(-6px);
}

.duque-comodidades .proteccion-ambiental,
.duque-comodidades .titulo{
	border-radius: var(--v-radius);
}

.duque-mejor .mejor{
	box-shadow: 0 16px 34px -18px rgba(0, 0, 0, 0.6);
	transition: transform 0.3s ease;
}

.duque-mejor .mejor:hover{
	transform: scale(1.04);
}

/* ---------- NOVEDADES ---------- */

.blog-header{
	padding: 90px 0 60px 0;
}

.blog-card{
	border-radius: 18px;
}

.blog-content h2 a:hover,
.blog-read-more:hover{
	color: #6f8f99;
}

.blog-read-more{
	display: inline-flex;
	align-items: center;
	gap: 4px;
}

.blog-article{
	border-radius: 20px;
}

.blog-article-content a{
	color: var(--v-green);
	font-weight: 500;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.blog-article-content a:hover{
	color: var(--v-dark);
}

.blog-article-content h3{
	font-size: 19px;
	font-weight: 700;
	color: var(--v-dark);
	margin: 28px 0 12px 0;
}

.blog-article-content ol{
	margin-bottom: 20px;
	padding-left: 22px;
}

.blog-article-content ol li{
	margin-bottom: 10px;
}

.blog-checklist{
	list-style: none;
	padding: 22px 24px !important;
	background-color: #f4f1e8;
	border-radius: 14px;
}

.blog-checklist li{
	position: relative;
	padding-left: 28px;
}

.blog-checklist li::before{
	content: "✓";
	position: absolute;
	left: 0;
	top: 0;
	font-weight: 700;
	color: var(--v-green);
}

.blog-breadcrumb{
	font-size: 13px;
	color: #9aa5a8;
	margin-bottom: 14px;
}

.blog-breadcrumb a{
	color: var(--v-sky);
}

.blog-breadcrumb a:hover{
	color: #ffffff;
	text-decoration: none;
}

/* ---------- WHATSAPP FLOTANTE ---------- */

.wa-float{
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 1020; /* debajo del menú fijo y del menú móvil abierto */
	width: 58px;
	height: 58px;
	border-radius: 50%;
	background-color: #25d366;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 12px 26px -8px rgba(0, 0, 0, 0.45);
}

.wa-float:hover{
	background-color: #1ebe5b;
	transform: translateY(-3px);
}

.wa-float img{
	width: 30px;
	height: 30px;
}

@media (min-width:992px){
	.wa-float{
		right: 28px;
		bottom: 28px;
	}
}

/* ---------- MOVIMIENTO REDUCIDO ---------- */

@media (prefers-reduced-motion: reduce){
	html{
		scroll-behavior: auto;
	}

	*, *::before, *::after{
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}

	.wow{
		visibility: visible !important;
	}
}
