/*
    Template Name    : Triple
	Description		 : Responsive HTML5 Template.
    Version          : 1.0
*/

/*
================================================
/* Table of Content
==================================================

1. Fonts - Raleway and Opensans
2. Common CSS
3. Loader CSS
4. Header Top area
5. Navigation
6. Slider Area
7. Animated Headline
8. Youtube Area
9. Slider Image area
10. About Us
11. Services
12. Team 
13. Portfolio
14. Counter
15. Pricing Table
16. Testimonials Wrapper
17. Blog
18. Client
19. Contact Us
20. Footer
21. Media Quries 

/*
================================================
1. Fonts - Raleway and Opensans
quicksand
================================================
*/
body {    font-family: 'Open Sans', Arial, sans-serif;}

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/OpenSans-Regular.woff2') format('woff2');
}


    /* Estilo del contenedor principal del acordeón */
    #faqAccordion {
        max-width: 800px; /* Ancho máximo del acordeón */
        margin: 0 auto; /* Centrado horizontal */
    }


/*
================================================
2. Common CSS
================================================
*/
* {
	margin: 0;
	padding: 0;
}
body {
	font-family: "Quicksand", sans-serif;
	font-size: 14px;
	line-height: 23px;
	font-weight: 400;
	overflow-x: hidden;
}
h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: "Quicksand", sans-serif;
	margin-top: 20px;
	text-transform: none;
	font-size: 16px;
	font-weight: 600;
	color: #595c65;
}
h5 {
	font-size: 16px;
	font-weight: 100;
}
h1 {
	font-size: 14px;
	font-weight: 100;
}
h6 {
	font-size: 16px;
}
h4 {
	font-weight: 600;
}
p {
	font-size: 14px;
	color: #595c65;
}
.font-weight {
	font-weight: 600;
}
.font-weight-h {
	font-weight: 700;
}
.color-g {
	color: #595c65;
}
.color-y {
	color: #1E1E1E;
}
.color-w {
	color: #fff;
}
.text-transform {
	text-transform: uppercase;
}
a,
a:hover,
a:active,
a:focus {
	outline: none;
	border: none;
	font-family: Montserrat, sans-serif;
	text-decoration: none;
}
a {
	transition: all 0.3s ease 0s;
}
a:focus,
a:hover {
	color: #595c65;
}
body,
html {
	height: 100%;
}
section {
	width: 100%;
	float: left;
	padding: 30px 0;
}
.section-title {
	text-align: center;
	margin: 0 0 25px;
}

section h2 {
	text-align: center;
	text-transform: uppercase;
	letter-spacing: 2px;
	position: relative;
	text-align: center;
	padding: 12px 10px 10px;
}
.section-title h2 {
	font-size: 35px;
	letter-spacing: 1.2px;
	padding: 60px 20px 5px 20px;
	text-transform: uppercase;
	font-weight: 600;
	margin-bottom: 10px;
	position: relative;
}

.overlay {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
}
.alpha-50 {
	opacity: 0.5;
}
.prl-20 {
	padding-right: 20px !important;
	padding-left: 20px !important;
}
.pt-20 {
	padding-top: 20px !important;
}
.ptb-20 {
	padding-top: 20px !important;
	padding-bottom: 20px !important;
}
.ptb-30 {
	padding-top: 30px !important;
	padding-bottom: 30px !important;
}
.mb-5 {
	margin-bottom: 5px !important;
}
.mt-20 {
	margin-top: 20px !important;
}
.mb-10 {
	margin-bottom: 10px !important;
}
.mb-20 {
	margin-bottom: 20px !important;
}
.t-uppercase {
	text-transform: uppercase;
}
.font-55 {
	font-size: 55px !important;
}
.font-40 {
	font-size: 40px !important;
}
.font-30 {
	font-size: 30px !important;
}
.font-20 {
	font-size: 20px;
}
a.btn {
	border: 1px solid #1E1E1E;
	color: #1E1E1E;
	padding: 12px 20px;
}
a.btn:hover {
	background: #1E1E1E;
	color: #fff;
}
.margin-bottom-1 {
	margin-bottom: 10px;
}
.margin-bottom-2 {
	margin-bottom: 30px;
}
.padding-1 {
	padding: 10px;
}
.padding-2 {
	padding: 20px;
}
.text-color {
	color: #ffffff;
}
.space {
	padding-bottom: 40px;
}
.line-height-1 {
	line-height: 23px;
}
.line-height-2 {
	line-height: 27px;
}
.bx-shadow {
	-webkit-box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.1);
	box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.1);
}
.padding-no {
	padding: 0;
}
.btn-action {
  position: relative;
  background-color: transparent;
  color: #000;
  font-size: 20px;
  font-weight: bold;
  border: 2px solid #000;
  padding: 10px 20px;
  text-align: center;
  overflow: hidden;
  z-index: 2;
  transition: color 0.4s, border-color 0.4s;
  animation: pulse-border 2s infinite; /* Animación de pulsación */
}

.btn-action::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #fff;
  z-index: -1;
  transition: transform 0.4s;
  transform: scaleX(0);
  transform-origin: left;
}

.btn-action:hover::before {
  transform: scaleX(1);
}

.btn-action:hover {
  color: #000;
  border-color: #fff;
}

.btn-action::before {
  transform: scaleX(0);
  transition: transform 0.4s ease-out;
}

.btn-action:hover::before {
  transform: scaleX(1);
  transition: transform 0.4s ease-in;
}

.btn-action:hover {
  color: #000;
}

.btn-action {
  transition: color 0.4s, border-color 0.4s, background-color 0.4s ease-in-out;
}

/* Animación de pulsación para el borde */
@keyframes pulse-border {
  0% {
    border-color: #000;
  }
  50% {
    border-color: #fff; /* Cambia a un color llamativo, como rojo */
  }
  100% {
    border-color: #000;
  }
}
/*
================================================
 Dots
================================================
*/
.dots,
.dots:before,
.dots:after {
	display: inline-block;
	width: 6px;
	height: 6px;
	border-radius: 999px;
}
.dots {
	position: relative;
	margin-right: 15px;
	margin-left: 15px;
}
.dots:before,
.dots:after {
	content: "";
	position: absolute;
	background-color: inherit;
}
.dots:before {
	right: 15px;
}
.dots:after {
	left: 15px;
}
.dots.dots--small,
.dots.dots--small:before,
.dots.dots--small:after {
	width: 5px;
	height: 5px;
}
.dots.dots--small {
	margin-right: 12px;
	margin-left: 12px;
}
.dots.dots--small:before {
	right: 12px;
}
.dots.dots--small:after {
	left: 12px;
}
.dt-theme {
	background-color: #1E1E1E !important;
}
.treatment-link {
    display: block;
    text-decoration: none;
    color: inherit;
}

.treatment-link .item {
    cursor: pointer;
    transition: transform 0.2s ease;
}

.treatment-link .item:hover {
    transform: scale(1.02); /* Efecto hover para mejorar la interacción */
}

/*
================================================
4. header-top-area
================================================
*/

.header-top-area {
	left: 0;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 9999;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.logo a {
	font-size: 14px;
	font-weight: 700;
	color: #1E1E1E;
	letter-spacing: 2px;
	text-transform: uppercase;
}
.logo {
	padding-top: 14px;

}

.header-full-width {

    background-size: cover;
    background-position: center;
    width: 100%;
    height: 100vh; /* Adjust the height as needed */
    display: flex;
    align-items: center; /* Centra verticalmente el contenido */
    justify-content: center; /* Opcional: centra horizontalmente el contenido */
    flex-direction: column; /* Asegura que los elementos se apilen verticalmente */
}



.header-full-width-tratamientos {
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 68vh; /* Ajusta la altura según sea necesario */
    display: flex;
    align-items: center; /* Centra verticalmente el contenido */
    justify-content: center; /* Opcional: centra horizontalmente el contenido */
    flex-direction: column; /* Asegura que los elementos se apilen verticalmente */
}


.header-full-width-depilacion {
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 30vh; /* Ajusta la altura según sea necesario */
    display: flex;
    align-items: center; /* Centra verticalmente el contenido */
    justify-content: center; /* Opcional: centra horizontalmente el contenido */
    flex-direction: column; /* Asegura que los elementos se apilen verticalmente */
}

.header-content p {
	font-size: 18px;
	margin-bottom: 30px;
	color: black;

}

/*Whatsapp*/
.float {
	position: fixed;
	width: 60px;
	height: 60px;
	bottom: 80px;
	right: 40px;
	background-color: #25d366;
	color: #fff;
	border-radius: 50px;
	text-align: center;
	font-size: 30px;
	box-shadow: 2px 2px 3px #999;
	z-index: 100;
}

.my-float {
	margin-top: 16px;
}

/*
================================================
5. Navigation
================================================
*/
.menu-bg {
	background: rgba(0, 0, 0, 0.9);
	z-index: 999;
}
.menu-bg .logo {
	padding-top: 18px;
	transition: all 0.3s ease 0s;
}
.navbar-default {
	background-color: inherit;
	border-color: inherit;
}
.navbar {
	border-radius: 0;
	min-height: auto;
	margin: 0;
	border: none;
	z-index: 9;
}
.navbar-collapse {
	float: right;
	margin: 0;
	padding: 0;
}
.navbar-brand {
	padding: 0;
	height: auto;
}
.navbar-nav > li {
	padding: 0;
}
.navbar-default .navbar-nav li a {
	color: #fff;
	font-size: 13px;
	font-weight: 400;
	padding: 30px 13px;
	transition: all 0.3s ease 0s;
	text-transform: uppercase;
}
.menu-bg .navbar-default .navbar-nav li a {
	padding: 20px 10px;
	transition: all 0.3s ease 0s;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:focus,
.navbar-default .navbar-nav > .active > a:hover {
	background-color: inherit;
	color: #1E1E1E;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:focus,
.navbar-default .navbar-nav > .active > a:hover {
	color: #1E1E1E;
}
.navbar-default .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > li > a:hover {
	color: #1E1E1E;
}
.menu-bg .logo a,
.menu-bg .navbar-default .navbar-nav li a:hover {
	color: #1E1E1E;
}
.menu-bg {
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
	background: #fff;
	box-shadow: 0 2px 10px -1px rgba(87, 97, 100, 0.35);
	background: #fff;
	border: none;
}
.menu-bg .navbar-nav li a {
	color: #595c65;
}
/* Estilos para el dropdown */
.navbar-nav .dropdown {
  position: relative;
}

.navbar-nav .dropdown-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background-color: inherit; /* Usar el color de fondo heredado */
  padding: 0;
  list-style: none;
  min-width: 200px;
  box-shadow: 0 8px 16px rgba(0,0,0,0.1);
}

.navbar-nav .dropdown-menu li {
  width: 100%;
}

.navbar-nav .dropdown-menu li a {
  padding: 10px 15px;
  color: #fff; /* Color del texto heredado */
  font-size: 13px; /* Tamaño de texto heredado */
  text-transform: none; /* Evitar transformaciones de texto */
}

.navbar-nav .dropdown-menu li a:hover {
  color: #1E1E1E; /* Mantener el color al hacer hover */
}

.navbar-nav .dropdown:hover .dropdown-menu,
.navbar-nav .dropdown:focus .dropdown-menu,
.navbar-nav .dropdown.show .dropdown-menu {
  display: block; /* Mostrar el menú al hacer hover o click */
}

/* Evitar el cierre del dropdown al hacer click dentro */
.navbar-nav .dropdown-menu {
  pointer-events: auto;
}

.navbar.scrolled {
  color: #000; /* Cambia el color del texto a negro */
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); /* Sombra negra detrás del texto */
  transition: text-shadow 0.3s ease, color 0.3s ease; /* Transición suave */
}

.navbar.scrolled .navbar-nav .dropdown-menu li a {
  color: #000; /* Cambia el color del texto en el dropdown a negro */
}
/*


/*
================================================
11. Services
================================================
*/
.services {
	text-align: center;
}
.services .item {
	padding: 15px;
	min-height: 150px;
	margin-bottom: 15px;
	text-align: center;
}
.services .item i {
	font-size: 45px;
	color: #1E1E1E;
}
.services .item h3 {
	margin: 15px 0 10px 0;
	font-size: 18px;
}
.services .item p {
	font-size: 13px;
	color: #595c65;
}

  .services .item:hover {
    box-shadow: 0px 10px 10px 7px rgba(0, 0, 0, 0.2);
    transition-duration: 0.3s;
  }
  .item:hover {
    background: #fff;
  }

/*
================================================
19. Contact Us
================================================
*/
.text-danger {
	color: #f2332f;
}
.contactus {
	background: #f9f9f9;
}
.outer-box {
	width: 85%;
	margin: 0 auto;
}
.contact-us ul {
	padding: 0;
}
.contact-us li {
	color: #595c65;
	margin-bottom: 25px;
	display: block;
}
.contact-us li .box {
	background: #fff;
	box-shadow: 0px 12px 30px rgba(0, 0, 0, 0.12);
	padding: 30px 20px;
	text-align: center;
	border-radius: 4px;
	color: #595c65;
	font-weight: 600;
}
.contact-us .lnr {
	display: block;
	font-size: 30px;
	margin: 0 0 10px 0;
	color: #1E1E1E;
}
.form-box {
	padding: 35px 20px;
	box-shadow: 0px 12px 30px rgba(0, 0, 0, 0.12);
	background: #fff;
	border-radius: 4px;
}
.contact-us input,
.contact-us textarea {
	background: none;
	border: 1px solid #dadada;
	box-shadow: none;
	height: 40px;
	color: #595c65;
}
.contact-us textarea {
	height: 150px;
}
.contact-us .btn-submit {
	padding: 10px 20px;
	margin-top: 10px;
	border: none;
}
.contact-us .btn-submit:hover {
	background: #333;
	color: #fff;
} /*
================================================
20. Footer
================================================
*/
footer {
	background-color: #595b64;
	padding: 25px 0;
	width: 100%;
	float: left;
	align-items: center;
}

footer p {
	color: #fff;
	text-align: center;
	margin: 0;
}

.social {
	margin: 0;
	padding: 0;
	align-items: center;
}

.social ul {
	margin: 0;
	padding: 5px;
}

.social ul li {
	margin: 5px;
	list-style: none outside none;
	display: inline-block;
}

.social i {
	width: 40px;
	height: 40px;
	color: #fff;
	background-color: #595c65;
	font-size: 22px;
	text-align: center;
	padding-top: 12px;
	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	-o-border-radius: 50%;
	transition: all ease 0.3s;
	-moz-transition: all ease 0.3s;
	-webkit-transition: all ease 0.3s;
	-o-transition: all ease 0.3s;
	-ms-transition: all ease 0.3s;
}

.social i:hover {
	color: #fff;
	text-decoration: none;
	transition: all ease 0.3s;
	-moz-transition: all ease 0.3s;
	-webkit-transition: all ease 0.3s;
	-o-transition: all ease 0.3s;
	-ms-transition: all ease 0.3s;
}

.social .fa-facebook {
	background: #4060a5;
}

.social .fa-facebook:hover {
	background: #1E1E1E;
}

.social .fa-twitter:hover {
	background: #1E1E1E;
}

.social .fa-twitter {
	background: #00abe3;
}

.social .fa-linkedin:hover {
	background: #1E1E1E;
}
.social .fa-linkedin {
	background: #0094bc;
}

.social .fa-instagram:hover {
	background: #1E1E1E;
}
.social .fa-instagram {
	background: #375989;
}

.social .fa-youtube:hover {
	background: #1E1E1E;
}
.social .fa-youtube {
	background: #ff1f25;
}
.social .fa-medium:hover {
	background: #1E1E1E;
}
.social .fa-medium {
	background: #ff1f25;
}
/*
================================================
20. Navigator Movile
================================================
*/


		@media (max-width: 767px) {
		  .navbar-nav > li {
			padding: 0;
			margin: 0;
		  }

		  .navbar-nav li a {
			padding: 10px 15px; /* Espaciado más compacto en móviles */
			font-size: 14px; /* Ajuste del tamaño de fuente en móviles */
			margin: 0;
			color: #fff;
			text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.9); /* Sombra negra para mayor visibilidad */
		  
			
		  }

		  /* Ajustar el colapso del menú en móviles */
		  .navbar-collapse {
			display: none;
			opacity: 0;
			transition: opacity 0.3s ease-in-out;
			margin-top: -50px;
		  }

		  .navbar-collapse.open {
			display: block;
			opacity: 1;
		  }
		  
		  .navbar-toggle .icon-bar {
		  background-color: #000 !important; /* Forzamos el color negro para el ícono de hamburguesa */
		}

		.navbar-nav li a {
		  padding: 10px 15px !important; /* Ajuste de padding forzado */
		  line-height: 1.2; /* Reduce la altura de línea para compactar los items */
		  padding: 8px 15px; /* Ajusta el padding superior/inferior */
		  margin: 0; /* Asegúrate de que no haya margen extra */
		  font-size: 10px; /* Puedes ajustar el tamaño de la fuente si es necesario */
		  color: #fff; /* Texto blanco */
		  text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.9); /* Sombra negra más densa */
		}

		
		/* Estilos del botón de hamburguesa */
		.navbar-toggle {
		  background-color: transparent;
		  border: none;
		  padding: 0px;
		  margin-top: 0; /* Asegúrate de que no haya margen superior */
		  padding: 0; /* Elimina el padding */
		  position: relative;
		  top: 0; /* Puedes ajustar este valor si el botón aún está desalineado */
		  transform: translateY(-140%); /* Alinea verticalmente con el logo */
		}

		.navbar-toggle .icon-bar {
		    background-color: #000; /* Asegura que las barras sean negras */
			  width: 22px; /* Ajusta el tamaño según lo que prefieras */
			  height: 2px; /* Define el grosor de las barras */
			  margin: 4px 0; /* Ajusta el espacio entre las barras */
		}
		
		.navbar-toggle:focus,
			.navbar-toggle:active {
			  outline: none; /* Evita que el ícono quede con algún borde o fondo al hacer clic */
		}
		
		.navbar-toggle:focus .icon-bar,
			.navbar-toggle:active .icon-bar {
			background-color: #000 !important; /* Mantiene las barras negras cuando se hace clic */
		}

		.navbar-nav > li {
		  padding: 0; /* Elimina el padding extra */
		  margin: 0; /* Elimina el margen entre los ítems */

		}



		  .navbar-nav .dropdown-menu {
			position: static; /* Elimina la superposición */
			float: none;
			width: 100%; /* Que ocupe todo el ancho */
			background-color: inherit; /* Mantiene el color de fondo */
			border: none; /* Elimina bordes que puedan interferir */
			box-shadow: none; /* Elimina sombras */
			
		  }

		  .navbar-nav .dropdown-menu li {
			display: block;
			width: 100%;
		  }

		  .navbar-nav .dropdown-menu li a {
			padding: 8px 15px; /* Ajusta el padding para el dropdown también */
			text-align: left; /* Alinear el texto a la izquierda */
			  text-shadow: 3px 6px 6px rgba(0, 0, 0, 0.9); /* Misma sombra negra para los elementos del dropdown */

		  }
		  
		  /* Asegurar que el menú dropdown no se superponga */
		  .dropdown-menu {
			margin-top: 0;
		  }

		  /* Aumentar la separación entre los elementos */
		  .navbar-nav > li {
			margin-bottom: 5px;
		  }

		  .dropdown-menu {
			padding: 0;
		  }

		  /* Estilo de los enlaces dentro del dropdown */
		  .dropdown-menu li a {
			padding: 10px 15px;
			color: #333;
			background-color: #transparent;
			border-bottom: 1px solid #ddd;
		  }

		  .dropdown-menu li a:hover {
			background-color: #f8f8f8;
		  }

		  /* Evitar superposición */
		  .dropdown-menu {
			position: relative;
			z-index: 1000; /* Eleva el menú por encima de otros elementos */
		  }
			}
			










/*
================================================
21. Media Quries 
================================================
*/
@media (min-width: 768px) and (max-width: 991px) {
	.navigation {
		padding: 0;
	}
	.logo {
		float: left;

		width: 250px;
	}
	.menu-bg .logo {
		padding-top: 29px;
	}
					.navbar-toggle {
					  background-color: #fff;
					  border: none;
					  padding: 10px;
					}
	.navbar-default .navbar-nav li a {
		font-size: 12px;
		padding: 23px 10px;
	}
	.navbar-collapse {
		margin: 6px 0 0;
	}
	.navigation .navbar-collapse {
		padding: 0;
	}
	.navbar {
		margin-top: 0px;
	}
	.section-title h2 {
		line-height: 40px;
	}
	.font-55 {
		font-size: 30px !important;
	}
	.aboutus-2 h1 {
		padding-top: 20px;
		font-size: 16px;
	}
	.feature-sec h1 {
		letter-spacing: 0px;
	}
	div.team-cnt div {
		margin: 0 0 15px;
		text-align: center;
	}
	.contact-info-content p span {
		padding: 8px 0 0;
	}
	.contact-info-content {
		padding: 36px 25px;
	}
}
@media (max-width: 767px) {
	section h2 {
		font-size: 25px;
	}
	
	.banner-text h1 {
		font-size: 16px;
		line-height: 30px;
	}
	.banner-text h3 {
		line-height: 30px;
	}
	.font-55 {
		font-size: 16px !important;
		line-height: 35px;
	}
	a.slide-btn {
		font-size: 14px;
		padding: 8px 16px;
		width: 120px;
	}
	.welcome-control {
		display: none;
	}
	.single-slide-item h2 {
		font-size: 24px;
		line-height: 26px;
	}
	.section-title h2 {
		font-size: 26px;
		line-height: 30px;
	}
	.counter {
		margin: 0 0 50px;
	}
	.counters {
		padding-bottom: 30px;
		margin: 0;
	}
	div.team-cnt > div > div {
		margin: 0 0 25px;
		text-align: center;
	}
	.ourteam {
		padding: 66px 0 40px;
	}
	.feature-sec h1 {
		letter-spacing: 3px;
	}
.blog-container {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
    margin-top: 20px;
}

.blog-post {
    background-color: #fff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    width: 200px;
    height: 200px;
    display: flex;
    flex-direction: column;
    text-align: center;
    margin: 10px; /* Espacio entre los elementos */
}

.blog-post img {
    width: 100%;
    height: 120px;
    object-fit: cover;
    flex-shrink: 0;
}

.content-wrapper2 {
    padding: 10px;
    flex-grow: 1;
    overflow: hidden;
}

.blog-post h2 {
    font-size: 16px;
    margin: 5px 0;
    color: #2c3e50;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.blog-post p {
    font-size: 12px;
    color: #555;
    margin-bottom: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.blog-post a {
    text-decoration: none;
    color: #007bff;
    font-weight: bold;
    font-size: 14px;
}
	.callouts {
		padding: 0;
	}
	.logo img {
		height: 50px;
	}
	

}
/* =========================================================
   AA TREATMENT CONTENT MOBILE SYSTEM
   Uso previsto en HTML:
   - .aa-tc-content
   - .aa-tc-section
   - .aa-has-image
   - .aa-price-section
   - .aa-video-section
   - .aa-faq-section
   - .aa-map-section
   - .aa-tc-cta
   - .aa-tc-list-check
   ========================================================= */

/* Desktop intacto */
.aa-tc-content,
.aa-tc-section,
.aa-price-section,
.aa-video-section,
.aa-faq-section,
.aa-map-section {
  /* sin estilos globales para desktop */
}

/* =========================================================
   MOBILE
   ========================================================= */
@media (max-width: 767px) {
  /* Wrapper general del contenido */
  .aa-tc-content {
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 16px !important;
    background: #f7f3ef;
  }

  /* Card base para cada sección */
  .aa-tc-section,
  .aa-price-section,
  .aa-faq-section,
  .aa-map-section {
    background: #ffffff;
    border: 1px solid #ece6e0;
    border-radius: 24px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
    padding: 18px !important;
    margin-bottom: 16px !important;
    overflow: hidden;
  }

  /* Títulos dentro de las cards */
  .aa-tc-section h2,
  .aa-price-section h2,
  .aa-faq-section h2,
  .aa-map-section h2 {
    margin: 0 0 12px !important;
    font-size: 24px !important;
    line-height: 1.05 !important;
    font-weight: 700 !important;
    color: #1f2d3d !important;
    text-align: left !important;
  }

  /* Párrafos */
  .aa-tc-section p,
  .aa-price-section p,
  .aa-faq-section p,
  .aa-map-section p {
    font-size: 15px !important;
    line-height: 1.5 !important;
    color: #5f6875 !important;
    margin: 0 0 14px !important;
    text-align: left !important;
    max-width: 100% !important;
  }

  /* Imágenes dentro de secciones */
  .aa-tc-section img,
  .aa-map-section img {
    display: block;
    width: 100% !important;
    height: auto !important;
    border-radius: 18px !important;
    margin: 0 0 14px !important;
  }

  /* Si la imagen va arriba, no hace falta más */
  .aa-has-image img:first-of-type {
    margin-top: 4px !important;
  }

  /* Listas generales */
  .aa-tc-section ul,
  .aa-price-section ul,
  .aa-faq-section ul,
  .aa-map-section ul {
    margin: 0 0 14px !important;
    padding-left: 18px !important;
  }

  .aa-tc-section li,
  .aa-price-section li,
  .aa-faq-section li,
  .aa-map-section li {
    font-size: 15px !important;
    line-height: 1.5 !important;
    color: #445063 !important;
    margin-bottom: 8px !important;
  }

  /* Variante para listas con check */
  .aa-tc-list-check {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .aa-tc-list-check li {
    position: relative;
    padding-left: 24px !important;
    margin-bottom: 10px !important;
  }

  .aa-tc-list-check li::before {
    content: "✔";
    position: absolute;
    left: 0;
    top: 0;
    color: #2faa66;
    font-weight: 700;
  }
  
  

  /* =========================================================
     PRECIOS
     ========================================================= */
  .aa-price-section {
    background: #ffffff;
    border: 1px solid #ebe4de;
  }

  .aa-price-section h2 {
    text-align: center !important;
    font-size: 26px !important;
  }

  .aa-price-section .aa-price-highlight,
  .aa-price-section p[style*="c0392b"] {
    margin: 0 0 14px !important;
    color: #c0392b !important;
    font-size: 17px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    text-align: center !important;
  }

  .aa-price-section [data-prices-table] {
    margin-top: 10px;
  }

  .aa-price-section [data-prices-table] table {
    width: 100% !important;
    border-collapse: collapse !important;
    background: #fff !important;
    border-radius: 16px !important;
    overflow: hidden !important;
  }

  .aa-price-section [data-prices-table] th,
  .aa-price-section [data-prices-table] td {
    padding: 12px 10px !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
  }

  .aa-price-section [data-prices-table] th {
    text-align: left !important;
    color: #1f2d3d !important;
    font-weight: 700 !important;
    border-bottom: 1px solid #edf1f4 !important;
  }

  .aa-price-section [data-prices-table] td:last-child,
  .aa-price-section [data-prices-table] th:last-child {
    text-align: right !important;
    white-space: nowrap;
  }

.aa-price-section .btn-wsp,
.aa-price-section .aa-tc-cta {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;
    min-height: 58px !important;

    margin-top: 18px !important;
    padding: 0 26px !important;

    border: 0 !important;
    border-radius: 999px !important;

    background: #c79a82 !important;

    color: #ffffff !important;
    text-decoration: none !important;

    font-family: var(--aa-sans, Arial, sans-serif) !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;

    box-shadow: none !important;

    transition:
        background 0.25s ease,
        transform 0.2s ease;
}

.aa-price-section .btn-wsp:hover,
.aa-price-section .aa-tc-cta:hover {
    background: #bb8d75 !important;
    transform: translateY(-1px);
}

.aa-price-section .btn-wsp:active,
.aa-price-section .aa-tc-cta:active {
    transform: translateY(0);
}

@media (max-width: 767px) {
    .aa-price-section .btn-wsp,
    .aa-price-section .aa-tc-cta {
        min-height: 54px !important;
        font-size: 15px !important;
        border-radius: 999px !important;
    }
}

  /* =========================================================
     VIDEOS
     ========================================================= */
  .aa-video-section,
  .recommended-videos {
    display: none !important;
  }

  /* =========================================================
     FAQ
     ========================================================= */
  .aa-faq-section {
    padding: 18px !important;
  }

  .aa-faq-section h2 {
    text-align: center !important;
    margin-bottom: 14px !important;
  }

  .aa-faq-section #faqAccordion {
    max-width: 100% !important;
    margin: 0 auto !important;
  }

  .aa-faq-section .card {
    margin-bottom: 12px !important;
    border-radius: 18px !important;
    overflow: hidden !important;
    box-shadow: none !important;
  }

  .aa-faq-section .card-header {
    padding: 14px !important;
    font-size: 15px !important;
    line-height: 1.4 !important;
    font-weight: 700 !important;
    color: #1f2d3d !important;
    text-align: left !important;
  }

  .aa-faq-section .card-body {
    padding: 14px !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    color: #5f6875 !important;
    text-align: left !important;
  }

  /* =========================================================
     MAPA
     ========================================================= */
  .aa-map-section h2 {
    text-align: center !important;
  }

  .aa-map-section .btn-como-llegar,
  .aa-map-section .aa-tc-cta {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 48px !important;
    padding: 0 18px !important;
    border-radius: 16px !important;
    background: #ff6600 !important;
    color: #fff !important;
    text-decoration: none !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.08);
  }

  .aa-map-section iframe {
    width: 100% !important;
    height: 280px !important;
    border: 0 !important;
    border-radius: 18px !important;
    display: block !important;
    margin-top: 14px !important;
  }

  /* =========================================================
     RESEÑAS
     ========================================================= */
  .review-card {
    width: 100% !important;
    max-width: 100% !important;
    border-radius: 18px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06) !important;
  }

  /* =========================================================
     CTA FINAL SIMPLE
     ========================================================= */
  .aa-tc-cta-wrap {
    text-align: center !important;
    margin-top: 14px !important;
  }

  .aa-tc-cta-wrap a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 48px !important;
    padding: 0 18px !important;
    border-radius: 16px !important;
    background: #25d366 !important;
    color: #fff !important;
    text-decoration: none !important;
    font-size: 15px !important;
    font-weight: 700 !important;
  }
}

  #whatsapp-link {
    display: none !important;
  }
}

/* =========================================================
   AA GLOBAL FAQ ACCORDION
   Unifica todos los FAQ de tratamientos y otras páginas
   Requiere:
   - #faqAccordion
   - .card
   - .card-header
   - .bg-light / .bg-dark
   - .card-body
   - .card-body.active
   ========================================================= */

#faqAccordion {
  max-width: 800px;
  margin: 0 auto;
}

#faqAccordion .card {
  margin-bottom: 16px;
  border-radius: 16px;
  text-align: left;
  overflow: hidden;
  border: 1px solid #e7e2dc;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.05);
  background: #fff;
}

#faqAccordion .card-header {
  position: relative;
  padding: 16px 48px 16px 18px;
  cursor: pointer;
  font-weight: 700;
  color: #1f2d3d;
  font-size: 16px;
  line-height: 1.45;
  text-align: left;
  background-color: #f8f5f2;
  transition: background-color 0.2s ease;
}

#faqAccordion .card-header:hover {
  background-color: #f1ece7;
}

#faqAccordion .card-header::after {
  content: "+";
  position: absolute;
  right: 18px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 22px;
  font-weight: 400;
  color: #7b6d66;
  line-height: 1;
}

#faqAccordion .card-body {
  display: none;
  padding: 16px 18px 18px;
  background-color: #ffffff;
  font-size: 15px;
  line-height: 1.65;
  color: #5f6875;
  text-align: left;
  border-top: 1px solid #eee8e3;
}

#faqAccordion .card-body.active {
  display: block;
}

#faqAccordion .card:has(.card-body.active) .card-header::after {
  content: "–";
}

#faqAccordion .bg-light,
#faqAccordion .bg-dark {
  background-color: transparent;
}

/* fallback si :has no está disponible */
#faqAccordion .card-header.active::after {
  content: "–";
}

/* Mobile */
@media (max-width: 767px) {
  #faqAccordion {
    max-width: 100%;
  }

  #faqAccordion .card {
    margin-bottom: 12px;
    border-radius: 18px;
  }

  #faqAccordion .card-header {
    padding: 15px 44px 15px 16px;
    font-size: 15px;
    line-height: 1.4;
  }

  #faqAccordion .card-header::after {
    right: 16px;
    font-size: 20px;
  }

  #faqAccordion .card-body {
    padding: 14px 16px 16px;
    font-size: 14px;
    line-height: 1.55;
  }
}

/* =========================================================
   REVIEWS EXISTENTES - SIN TOCAR HTML
   ========================================================= */

.review-card {
  background-color: #fff;
  padding: 22px 20px 18px;
  border-radius: 22px;
  width: 280px;
  max-width: 300px;
  flex: 1 1 280px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
  border: 1px solid #ece6e0;
  color: #445063;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.review-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.08);
}

.review-card p {
  margin: 0 0 16px;
  font-size: 15px;
  line-height: 1.7;
  color: #445063;
}

.review-card strong {
  display: block;
  margin-top: auto;
  font-size: 15px;
  font-weight: 700;
  color: #1f2d3d;
}

@media (max-width: 767px) {
  .review-card {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    padding: 18px 16px 16px;
    border-radius: 20px;
    margin-bottom: 0 !important;
  }

  .review-card p {
    font-size: 14px;
    line-height: 1.65;
    margin-bottom: 14px;
  }

  .review-card strong {
    font-size: 14px;
  }

  .review-card + a,
  .review-card ~ a[href*="maps.app.goo.gl"] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 46px;
    margin-top: 4px;
    padding: 0 16px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid #e7e2dc;
    color: #2b3f59;
    text-decoration: none;
    font-size: 13px;
    line-height: 1.3;
    font-weight: 600;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    text-align: center;
  }
}

/* =========================================================
   AA LOCATION BLOCK + FOOTER CLEANUP
   Agregar al final de style.css
   ========================================================= */

/* =========================
   AA LOCATION BLOCK
   ========================= */

.aa-location-block {
  padding: 20px;
  margin-bottom: 40px;
}

.aa-location-inner {
  max-width: 900px;
  margin: 0 auto;
  padding: 28px 20px;
  background-color: #f9f9f9;
  border-radius: 8px;
  text-align: center;
}

.aa-location-title {
  margin: 0 0 12px;
  color: #2c3e50;
  font-size: 24px;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
}

.aa-location-address {
  margin: 0 0 20px;
  font-size: 16px;
  line-height: 1.6;
  text-align: center;
}

.aa-location-address a {
  color: #2c3e50;
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: color 0.3s ease;
}

.aa-location-address a:hover,
.aa-location-address a:focus {
  color: #ff6600;
}

.aa-location-cta {
  margin-top: 0;
  text-align: center;
}

.aa-location-button {
  display: inline-block;
  background-color: #ff6600;
  color: #ffffff;
  padding: 15px 30px;
  border-radius: 8px;
  text-decoration: none;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.2;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  transition: background-color 0.3s ease, transform 0.2s ease;
}

.aa-location-button:hover,
.aa-location-button:focus {
  background-color: #e65c00;
  color: #ffffff;
  text-decoration: none;
  transform: translateY(-1px);
}

.aa-location-button:focus {
  outline: 2px solid #2c3e50;
  outline-offset: 3px;
}

/* =========================
   AA SITE FOOTER CLEANUP
   ========================= */

.aa-site-footer-copy {
  margin-bottom: 10px;
}

.aa-site-footer-note {
  margin-bottom: 20px;
}

/* =========================
   MOBILE ONLY IMPROVEMENTS
   Footer + Location block
   ========================= */

@media (max-width: 767px) {
  .aa-location-block {
    padding: 16px;
    margin-bottom: 32px;
  }

  .aa-location-inner {
    padding: 24px 16px;
  }

  .aa-location-title {
    font-size: 22px;
    line-height: 1.3;
    margin-bottom: 10px;
  }

  .aa-location-address {
    font-size: 15px;
    line-height: 1.5;
    margin-bottom: 18px;
  }

  .aa-location-button {
    width: 100%;
    max-width: 320px;
    padding: 14px 18px;
    font-size: 17px;
  }

  footer.aa-site-footer,
  .aa-site-footer,
  footer {
    padding-top: 18px;
    padding-bottom: 90px;
  }

  .aa-site-footer .container,
  footer .container {
    max-width: 100%;
    padding-left: 16px;
    padding-right: 16px;
  }

  .aa-site-footer p,
  footer p {
    max-width: 320px;
    margin: 0 auto 12px;
    font-size: 14px;
    line-height: 1.45;
    text-align: center;
  }

  .aa-site-footer-copy {
    font-size: 13px;
    line-height: 1.4;
    margin-bottom: 10px;
  }

  .aa-site-footer-note {
    font-size: 13px;
    line-height: 1.45;
    margin-bottom: 14px;
  }

  .aa-site-footer .social-btns,
  footer .social-btns {
    margin-top: 10px;
    margin-bottom: 18px;
  }

  .aa-site-footer .social-network,
  footer .social-network {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 0;
    margin: 0;
  }

  .aa-site-footer .social-network li,
  footer .social-network li {
    margin: 0;
    list-style: none;
  }

  .aa-site-footer .social-network a,
  footer .social-network a {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
}

/* =========================================================
   Subtratamientos Estructura de Secciones e imagen
   Estructura común para subtratamientos generados
   ========================================================= */

.aa-subt-content {
  max-width: 900px;
  margin: 0 auto;
  padding: 24px 20px 48px;
}

.aa-subt-section {
  margin-bottom: 40px;
}

.aa-subt-section h2 {
  color: #2c3e50;
  font-size: 24px;
  font-weight: 700;
  margin: 0 0 16px;
  line-height: 1.25;
  text-align: left;
  text-transform: none;
  letter-spacing: normal;
  padding: 0;
}

.aa-subt-section p {
  font-size: 16px;
  line-height: 1.7;
  margin: 0 0 16px;
  color: #595c65;
}

.aa-subt-main-image {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 8px;
  margin-bottom: 20px;
}

.aa-lite-footer {
  padding: 32px 20px;
  text-align: center;
}

.aa-lite-footer p {
  margin: 0 0 10px;
}

@media (max-width: 767px) {
  .aa-subt-content {
    max-width: 100%;
    padding: 16px;
  }

  .aa-subt-section {
    margin-bottom: 28px;
  }

  .aa-subt-section h2 {
    font-size: 22px;
    line-height: 1.2;
    margin-bottom: 12px;
  }

  .aa-subt-section p {
    font-size: 15px;
    line-height: 1.6;
    margin-bottom: 14px;
  }

  .aa-subt-main-image {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 8px;
    margin-bottom: 16px;
  }

  .aa-lite-footer {
    padding: 24px 16px 90px;
  }

  .aa-lite-footer p {
    font-size: 14px;
    line-height: 1.45;
  }
}

/* =========================================================
   AA MOBILE LAYER FOR TREATMENT HEADER
   No redefine desktop header styles
   ========================================================= */

/* Desktop: ocultar mobile por defecto */
.aa-hero-mobile-topbar,
.aa-hero-mobile,
.aa-bottom-nav-mobile {
  display: none !important;
}

.aa-header-desktop,
.aa-hero-desktop {
  display: block;
}

.aa-hero-desktop.header-full-width-tratamientosindividuales {
  display: flex;
}

@media (max-width: 767px) {
  .aa-header-desktop,
  .aa-hero-desktop {
    display: none !important;
  }

  .aa-hero-mobile-topbar {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px 10px;
    background: #f6f2ee;
    border-bottom: 1px solid #ebe4de;
  }

.aa-hero-mobile-logo{
    padding:8px 12px;
    border-radius:16px;
    background:rgba(255,255,255,.16);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    border:1px solid rgba(255,255,255,.22);
}

.aa-hero-mobile-logo img{
    height:34px;
    width:auto;
    filter:
        brightness(1.12)
        contrast(1.12)
        drop-shadow(0 1px 6px rgba(255,255,255,.28));
}

  .aa-hero-mobile-blog,
  .aa-hero-mobile-topbar-blog {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: 0 14px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid #e7ddd7;
    color: #2b3f59 !important;
    text-decoration: none !important;
    font-size: 13px;
    font-weight: 600;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
  }

  .aa-hero-mobile {
    display: block !important;
    background: #f6f2ee;
    padding: 14px 16px 24px;
    border-bottom: 1px solid #ebe4de;
  }

  .aa-hero-mobile-inner {
    max-width: 340px;
    margin: 0 auto;
    text-align: center;
  }

  .aa-hero-mobile-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 14px;
    margin: 0 0 16px;
    border-radius: 999px;
    background: #efe6e0;
    color: #8b6d5d;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 1;
  }

  .aa-hero-mobile-title {
    margin: 0 0 12px;
    color: #203754;
    font-size: 30px;
    line-height: 0.98;
    font-weight: 400;
    text-align: center;
  }

  .aa-hero-mobile-subtitle {
    margin: 0 0 18px;
    color: #5e6c7f;
    font-size: 16px;
    line-height: 1.32;
    font-weight: 500;
    text-align: center;
  }

  .aa-hero-mobile-cta {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 50px;
    padding: 0 22px;
    border-radius: 18px;
    background: #fff;
    color: #1f3550 !important;
    text-decoration: none !important;
    font-size: 15px;
    font-weight: 700;
    border: 1px solid #e5ddd7;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
  }

  .aa-bottom-nav-mobile {
    display: flex !important;
    position: fixed;
    left: 10px;
    right: 10px;
    bottom: 10px;
    z-index: 9999;
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-radius: 22px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.16);
    padding: 8px 6px;
  }

  .aa-bottom-nav-mobile a {
    flex: 1;
    min-width: 0;
    text-align: center;
    text-decoration: none !important;
    color: #7b8794 !important;
    padding: 8px 4px;
  }

  .aa-bottom-nav-mobile a span {
    display: block;
    font-size: 12px;
    line-height: 1.15;
    font-weight: 600;
  }

  #whatsapp-link,
  .float {
    display: none !important;
  }
	  body {
    padding-bottom: 90px;
  }

/* ===== FAQ ===== */

.aa-faq-shell .card {
  margin-bottom: 20px;
  border-radius: 8px;
  text-align: center;
  overflow: hidden;
}

.aa-faq-shell .card-header {
  padding: 15px;
  cursor: pointer;
  font-weight: bold;
  color: #333;
  font-size: 16px;
  line-height: 1.6;
}

.aa-faq-shell .bg-light {
  background-color: #f7f7f7;
}

.aa-faq-shell .bg-dark {
  background-color: #ecf0f1;
}

.aa-faq-shell .card-body {
  display: none;
  padding: 15px;
  background-color: #ecf0f1;
  font-size: 16px;
  line-height: 1.6;
}

.aa-faq-shell .card-body.active {
  display: block;
}
  } 
  
/* =========================================================
   RELATION SECTION (dentro de tratamientos individuales)
   Mantiene coherencia visual con aa-tc-section
   ========================================================= */

.aa-relation-section {
  background: transparent !important;
  padding: 0;
}

/* opcional: si querés leve separación sin "bloque" */
.aa-relation-section .container {
  padding: 0;
}

/* ajusta el título para que no rompa jerarquía */
.aa-relation-section .aa-relation-title {
  margin-top: 20px;
  margin-bottom: 16px;
}
/* =========================================================
   AA HUBS GRID - Tratamientos / Corporales / Afecciones
   Cuerpo de cards unificado
   No toca hero ni H1
   ========================================================= */

.treatments-unified-section {
  background: #fff;
  padding: 56px 0 40px;
}

.treatments-unified-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px 24px;
}

.treatment-unified-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
  color: inherit;
  text-decoration: none;
  background: #fff;
  border: 1px solid #ece7e3;
  border-radius: 24px;
  box-shadow: 0 10px 28px rgba(0,0,0,0.06);
}

.treatment-unified-card:hover {
  color: inherit;
  text-decoration: none;
  transform: translateY(-3px);
  box-shadow: 0 16px 34px rgba(0,0,0,0.09);
}

.treatment-unified-media {
  position: relative;
  overflow: hidden;
  background: #f7f4f2;
}

.treatment-unified-media img {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  height: auto;
  object-fit: cover;
}

.treatment-unified-tag {
  position: absolute;
  left: 14px;
  bottom: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,0.92);
  color: #555;
  font-size: 12px;
  line-height: 1;
  font-weight: 700;
  box-shadow: 0 4px 10px rgba(0,0,0,0.08);
}

.treatment-unified-body {
  padding: 18px 18px 20px;
}

.treatment-unified-title-text {
  margin: 0 0 10px;
  padding: 0;
  font-size: 22px;
  line-height: 1.18;
  color: #222;
  font-weight: 700;
  text-align: left;
}

.treatment-unified-description {
  margin: 0;
  font-size: 15px;
  line-height: 1.65;
  color: #5d5d5d;
  text-align: left;
}

.treatment-title-mobile {
  display: none;
}

.treatment-title-desktop {
  display: inline;
}

.treatments-mobile-help {
  display: none;
}

.aa-relation-section {
  padding-top: 32px;
}

.aa-relation-title {
  text-align: center;
  font-size: 26px;
  color: #2c3e50;
  margin: 0 0 24px;
}
/* MOBILE */
@media (max-width: 767px) {
  .treatments-unified-section {
    padding: 12px 0 28px;
    background: #f6f3f1;
  }

  .treatments-unified-section .container {
    padding-left: 14px;
    padding-right: 14px;
  }

  .treatments-unified-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }

  .treatment-unified-card {
    border-radius: 22px;
    border: 1px solid #ece7e3;
    background: #fff;
    box-shadow: 0 4px 14px rgba(0,0,0,0.05);
  }

  .treatment-unified-card:hover {
    transform: none;
    box-shadow: 0 4px 14px rgba(0,0,0,0.05);
  }

  .treatment-unified-media img {
    width: 100%;
    height: 128px;
    aspect-ratio: auto;
    object-fit: cover;
  }

  .treatment-unified-tag {
    position: absolute;
    left: 10px;
    bottom: 10px;
    margin: 0;
    min-height: auto;
    padding: 5px 9px;
    background: rgba(255,255,255,0.82);
    color: #666;
    font-size: 11px;
    line-height: 1;
    font-weight: 700;
    box-shadow: none;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
  }

  .treatment-unified-body {
    padding: 10px 12px 14px;
  }

  .treatment-unified-title-text {
    margin: 0;
    padding: 0;
    font-size: 16px;
    line-height: 1.15;
    color: #222;
    text-align: left;
  }

  .treatment-unified-description {
    display: none;
  }

  .treatment-title-mobile {
    display: inline;
  }

  .treatment-title-desktop {
    display: none;
  }

  .treatments-mobile-help {
    display: block;
    margin-top: 18px;
    padding: 18px;
    background: #fff;
    border: 1px solid #ece7e3;
    border-radius: 22px;
    box-shadow: 0 4px 14px rgba(0,0,0,0.05);
  }

  .treatments-mobile-help h3 {
    margin: 4px 0 10px;
    font-size: 20px;
    line-height: 1.15;
    color: #222;
  }

  .treatments-mobile-help p {
    margin: 0 0 14px;
    font-size: 14px;
    line-height: 1.45;
    color: #5f5f5f;
  }

  .treatments-mobile-help-cta {
    display: inline-flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    border-radius: 16px;
    background: #222;
    color: #fff;
    text-decoration: none;
    font-size: 15px;
    font-weight: 700;
  }
    .aa-relation-title {
    text-align: left;
    font-size: 22px;
    margin-bottom: 16px;
  }
}
/* =========================================================
   AA RELATION SECTION
   Ajuste exclusivo para bloques dinámicos de:
   subtratamientos / relacionados / tratamientos de afección
   No afecta hubs principales
   ========================================================= */

@media (min-width: 768px) {
  .aa-relation-section .container {
    max-width: 900px;
  }

  .aa-relation-section .treatments-unified-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 28px 24px;
  }

  .aa-relation-section .treatment-unified-card {
    flex: 0 1 calc(50% - 12px);
    max-width: 390px;
  }

  .aa-relation-section .aa-relation-title {
    text-align: center;
    width: 100%;
  }
}
/* =========================================================
   AA RELATION SECTION - INTERNAL PAGES ONLY
   No afecta tratamientos.html / afecciones.html / corporales
   ========================================================= */

@media (min-width: 768px) {
  .aa-tc-content .aa-relation-section {
    padding: 0;
    background: transparent;
  }

  .aa-tc-content .aa-relation-section .container {
    width: 100%;
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
  }

  .aa-tc-content .aa-relation-title {
    text-align: center;
    margin: 0 0 24px;
  }

  .aa-tc-content .treatments-unified-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
  }
}
/* =========================================================
   AA FOOTER NAV - VISIBILIDAD Y CONTRASTE
   ---------------------------------------------------------
   Problema detectado:
   - Links del footer poco visibles (bajo contraste + opacity)
   - En mobile se percibían como "desactivados"

   Objetivo:
   - Mejorar legibilidad sin competir con CTAs (WhatsApp / bottom nav)
   - Mantener estética premium (no gritar, pero sí verse)
   - Asegurar buena interpretación por usuarios y LLMs

   Decisión:
   - Color blanco (#ffffff) para contraste en fondo oscuro
   - Opacidad leve para mantener jerarquía visual
   ========================================================= */

.aa-footer-nav {
  color: #ffffff; /* Fuerza color base para asegurar contraste */
}

.aa-footer-nav a {
  color: #ffffff; /* Evita heredar gris del footer */
  text-decoration: none;
  opacity: 0.9; /* Visible pero no dominante */
  font-weight: 400;
  transition: opacity 0.2s ease, text-decoration 0.2s ease;
}

.aa-footer-nav a:hover,
.aa-footer-nav a:focus {
  opacity: 1; /* Feedback visual claro */
  text-decoration: underline;
}


/* =========================================================
   AA SOCIAL ICONS - CONSISTENCIA VISUAL
   ---------------------------------------------------------
   Problema detectado:
   - Iconos sociales con bajo contraste (azul sobre gris)
   - Pérdida de peso visual respecto al diseño original

   Objetivo:
   - Alinear iconos con el resto del footer
   - Mejorar visibilidad sin romper estética

   Decisión:
   - Color blanco + leve opacidad
   - Hover simple (sin efectos exagerados)
   ========================================================= */

.social-network a {
  color: #ffffff; /* Mejora contraste sobre fondo oscuro */
  opacity: 0.85;
  transition: opacity 0.2s ease;
}

.social-network a:hover,
.social-network a:focus {
  opacity: 1;
}


/* =========================================================
   AA FOOTER NAV - MOBILE AJUSTES
   ---------------------------------------------------------
   Objetivo:
   - Mejorar lectura en pantallas chicas
   - Evitar saturación visual
   ========================================================= */

@media (max-width: 767px) {
  .aa-footer-nav {
    font-size: 13px;
    gap: 10px 16px;
  }
}


/* =========================================================
   AA BLOG HUB — SECCION FINAL CORREGIDA
   Debe ir AL FINAL de style.css
   Compatible con blog1.html actual
========================================================= */

.aa-bloghub-page,
.aa-bloghub-page * {
  box-sizing: border-box;
}

.aa-bloghub-page {
  width: 100%;
  min-height: 100vh;
  background: #f5f3f1;
  color: #111827;
  font-family: "Open Sans", Arial, sans-serif;
  overflow-x: hidden;
}

.aa-bloghub-page a {
  text-decoration: none;
}

.aa-bloghub-page main {
  display: block;
  width: 100%;
  clear: both;
}

/* HEADER */

.aa-bloghub-header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 20;
  padding: 22px 24px 0;
}

.aa-bloghub-header-inner {
  max-width: 1180px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.aa-bloghub-logo img {
  display: block;
  width: 220px;
  height: auto;
}

.aa-bloghub-menu-button {
  display: none;
  align-items: center;
  gap: 8px;
  border: 0;
  background: rgba(255,255,255,.92);
  color: #111827;
  padding: 10px 16px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
  box-shadow: 0 6px 18px rgba(0,0,0,.12);
}

.aa-bloghub-menu-button i {
  display: block;
  width: 13px;
  height: 2px;
  background: #111827;
  border-radius: 999px;
}

.aa-bloghub-nav {
  display: flex;
  align-items: center;
  gap: 24px;
}

.aa-bloghub-nav a {
  color: #ffffff;
  font-size: 13px;
  font-weight: 800;
  text-transform: uppercase;
  text-shadow: 0 2px 8px rgba(0,0,0,.3);
}

/* HERO */

.aa-bloghub-hero {
  min-height: 460px;
  padding: 120px 20px 72px;
  background: #6d6968;
  color: #ffffff;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

.aa-bloghub-hero-inner {
  max-width: 900px;
  margin: 0 auto;
}

.aa-bloghub-hero h1 {
  margin: 0 auto 18px !important;
  color: #ffffff !important;
  font-size: clamp(42px, 6vw, 74px) !important;
  line-height: 1.05 !important;
  font-weight: 900 !important;
  letter-spacing: -0.04em;
  text-align: center !important;
}

.aa-bloghub-hero p {
  max-width: 660px;
  margin: 0 auto 26px !important;
  color: rgba(255,255,255,.92) !important;
  font-size: 17px !important;
  line-height: 1.55 !important;
  text-align: center !important;
}

.aa-bloghub-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 28px;
  background: #ffffff;
  color: #111827 !important;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 900;
  box-shadow: 0 10px 25px rgba(0,0,0,.16);
}

/* PILLS DEBAJO DEL HERO */

.aa-bloghub-hero-pills {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin-top: 22px;
}

.aa-bloghub-hero-pills a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 8px 15px;
  background: rgba(255,255,255,.92);
  color: #111827 !important;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
  box-shadow: 0 5px 16px rgba(0,0,0,.12);
}

/* INTRO */

.aa-bloghub-intro-section {
  padding-top: 54px !important;
  padding-bottom: 24px !important;
}

.aa-bloghub-intro {
  max-width: 860px;
  margin: 0 auto !important;
  color: #4b5563 !important;
  font-size: 16px !important;
  line-height: 1.75 !important;
  text-align: center !important;
}

/* SECCIONES */

.aa-bloghub-section {
  width: calc(100% - 40px) !important;
  max-width: 1180px !important;
  margin: 0 auto !important;
  padding: 58px 0 !important;
  clear: both !important;
  float: none !important;
}

.aa-bloghub-section h2 {
  margin: 0 0 28px !important;
  padding: 0 !important;
  color: #111827 !important;
  font-size: 18px !important;
  line-height: 1.2 !important;
  letter-spacing: .22em !important;
  text-transform: uppercase !important;
  font-weight: 900 !important;
  text-align: center !important;
}

/* DESTACADOS CHICOS */

.aa-bloghub-featured-grid {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 18px !important;
  width: 100% !important;
}

.aa-bloghub-featured-card {
  display: block;
  background: #ffffff;
  border-radius: 18px;
  overflow: hidden;
  color: #111827 !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.08);
  border: 1px solid rgba(0,0,0,.06);
  transition: transform .2s ease, box-shadow .2s ease;
}

.aa-bloghub-featured-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 30px rgba(0,0,0,.12);
}

.aa-bloghub-featured-media {
  position: relative;
  aspect-ratio: 1 / 1;
  background: #e7e7e7;
  overflow: hidden;
}

.aa-bloghub-featured-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.aa-bloghub-featured-tag {
  position: absolute;
  left: 10px;
  bottom: 10px;
  max-width: calc(100% - 20px);
  padding: 6px 10px;
  background: rgba(255,255,255,.92);
  color: #555;
  border-radius: 999px;
  font-size: 11px;
  line-height: 1;
  font-weight: 800;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.aa-bloghub-featured-body {
  padding: 13px 12px 15px;
}

.aa-bloghub-featured-body h3 {
  margin: 0 !important;
  padding: 0 !important;
  color: #111827 !important;
  font-size: 16px !important;
  line-height: 1.18 !important;
  font-weight: 900 !important;
  text-align: left !important;
}

/* FALLBACK si todavía quedan cards viejas en destacados */

.aa-bloghub-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  gap: 28px !important;
  width: 100% !important;
}

.aa-bloghub-card {
  background: #ffffff;
  border-radius: 24px;
  overflow: hidden;
  color: #111827 !important;
  box-shadow: 0 8px 26px rgba(0,0,0,.08);
}

.aa-bloghub-card a {
  display: flex;
  flex-direction: column;
  height: 100%;
  color: inherit !important;
}

.aa-bloghub-card img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  display: block;
  background: #e7e7e7;
}

.aa-bloghub-card-content {
  padding: 22px;
}

.aa-bloghub-label {
  display: block;
  margin-bottom: 10px;
  color: #9b7b63;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.aa-bloghub-card h3 {
  margin: 0 0 12px !important;
  padding: 0 !important;
  color: #111827 !important;
  font-size: 23px !important;
  line-height: 1.2 !important;
  font-weight: 900 !important;
  text-align: left !important;
}

.aa-bloghub-card p {
  margin: 0 !important;
  color: #4b5563 !important;
  font-size: 15px !important;
  line-height: 1.65 !important;
  text-align: left !important;
}

.aa-bloghub-read {
  display: inline-block;
  margin-top: 18px;
  color: #111827;
  font-size: 14px;
  font-weight: 900;
}

/* GRIDS PEQUEÑOS */

.aa-bloghub-grid-small {
  grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  max-width: 860px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* NOTA Y PAGINACION */

.aa-bloghub-render-note {
  display: none !important;
}

.aa-bloghub-pagination {
  display: flex;
  justify-content: center;
  gap: 10px;
  padding: 30px 20px 70px;
}

.aa-bloghub-pagination a {
  display: inline-flex;
  width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  background: #ffffff;
  color: #111827;
  border-radius: 12px;
  font-weight: 900;
  box-shadow: 0 4px 14px rgba(0,0,0,.08);
}

/* FOOTER */

.aa-bloghub-footer {
  background: #595b64;
  padding: 34px 20px;
  color: #ffffff;
  text-align: center;
}

.aa-bloghub-footer-inner {
  max-width: 900px;
  margin: 0 auto;
}

.aa-bloghub-footer p {
  margin: 0 0 8px !important;
  color: #ffffff !important;
  text-align: center !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
}

/* BOTTOM NAV MOBILE */

.aa-bottom-nav-mobile {
  display: none !important;
}

/* TABLET */

@media (max-width: 1024px) {
  .aa-bloghub-featured-grid {
    grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  }

  .aa-bloghub-grid {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  }
}

/* MOBILE */

@media (max-width: 767px) {
  .aa-bloghub-header {
    padding: 14px 14px 0;
  }

  .aa-bloghub-header-inner {
    width: 100%;
  }

  .aa-bloghub-logo img {
    width: 150px;
  }

  .aa-bloghub-menu-button {
    display: inline-flex;
  }

  .aa-bloghub-menu-button span {
    display: inline-block;
  }

  .aa-bloghub-nav {
    display: none;
    position: absolute;
    left: 14px;
    right: 14px;
    top: 64px;
    padding: 12px;
    border-radius: 18px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 12px 28px rgba(0,0,0,.16);
    flex-direction: column;
    align-items: stretch;
    gap: 0;
  }

  .aa-bloghub-nav.is-open {
    display: flex;
  }

  .aa-bloghub-nav a {
    color: #111827 !important;
    text-shadow: none !important;
    padding: 12px 10px;
    font-size: 13px;
    border-bottom: 1px solid rgba(0,0,0,.06);
  }

  .aa-bloghub-nav a:last-child {
    border-bottom: 0;
  }

  .aa-bloghub-hero {
    min-height: 430px;
    padding: 88px 18px 36px;
  }

  .aa-bloghub-hero h1 {
    max-width: 330px;
    font-size: 34px !important;
    line-height: 1.08 !important;
  }

  .aa-bloghub-hero p {
    max-width: 330px;
    font-size: 15px !important;
    line-height: 1.38 !important;
  }

  .aa-bloghub-cta {
    width: 100%;
    max-width: 290px;
  }

  .aa-bloghub-hero-pills {
    max-width: 330px;
    margin-left: auto;
    margin-right: auto;
    gap: 9px;
  }

  .aa-bloghub-hero-pills a {
    min-height: 34px;
    padding: 8px 13px;
    font-size: 12px;
  }

  .aa-bloghub-section {
    width: calc(100% - 28px) !important;
    padding: 42px 0 !important;
  }

  .aa-bloghub-intro-section {
    padding: 34px 0 !important;
  }

  .aa-bloghub-intro {
    text-align: left !important;
    font-size: 15px !important;
    line-height: 1.65 !important;
  }

  .aa-bloghub-section h2 {
    margin-bottom: 24px !important;
    font-size: 23px !important;
    line-height: 1.2 !important;
    letter-spacing: .08em !important;
    text-align: left !important;
  }

  .aa-bloghub-featured-grid {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 12px !important;
  }

  .aa-bloghub-featured-body {
    padding: 10px 10px 12px;
  }

  .aa-bloghub-featured-body h3 {
    font-size: 15px !important;
  }

  .aa-bloghub-grid,
  .aa-bloghub-grid-small {
    grid-template-columns: 1fr !important;
    max-width: 480px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    gap: 20px !important;
  }

  .aa-bloghub-card img {
    height: 205px;
  }

  .aa-bloghub-card h3 {
    font-size: 21px !important;
  }

  .aa-bottom-nav-mobile {
    position: fixed !important;
    left: 10px !important;
    right: 10px !important;
    bottom: 10px !important;
    z-index: 99999 !important;
    display: grid !important;
    grid-template-columns: repeat(4,1fr) !important;
    gap: 0 !important;
    padding: 8px 10px !important;
    background: rgba(255,255,255,.96) !important;
    border: 1px solid rgba(0,0,0,.08) !important;
    border-radius: 18px !important;
    box-shadow: 0 10px 28px rgba(0,0,0,.16) !important;
  }

  .aa-bottom-nav-mobile a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 34px !important;
    color: #111827 !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    text-align: center !important;
  }

  .aa-bloghub-footer {
    padding-bottom: 92px;
  }
}
/* =========================================================
   AA LUX DESKTOP NAV
   Cápsula superior desktop: logo + menú + polo derecho
   ========================================================= */

.aa-lux-desktop-nav {
  position: fixed;
  top: 24px;
  left: 0;
  right: 0;
  z-index: 9999;
  pointer-events: none;
}

.aa-lux-nav-inner {
  width: min(1280px, calc(100% - 128px));
  min-height: 74px;
  margin: 0 auto;
  padding: 8px 12px 8px 14px;

  display: grid;
  grid-template-columns: 230px 1fr 230px;
  align-items: center;
  column-gap: 20px;

  pointer-events: auto;

  border-radius: 26px;
  background: rgba(255, 246, 242, 0.78);
  border: 1px solid rgba(255, 255, 255, 0.52);
  box-shadow: 0 14px 34px rgba(74, 56, 50, 0.13);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

/* LOGO: fondo más sutil, sin bloque blanco pesado */
.aa-lux-logo {
  width: 210px;
  height: 58px;

  display: flex;
  align-items: center;
  justify-content: flex-start;

  padding: 6px 12px;
  border-radius: 22px;

  background: rgba(255, 255, 255, 0.38);
  border: 1px solid rgba(255, 255, 255, 0.34);
  box-shadow: 0 6px 18px rgba(74, 56, 50, 0.05);
}

.aa-lux-logo img {
  display: block;
  width: 172px;
  max-width: 172px;
  height: auto;
  opacity: 0.95;
}

/* MENÚ CENTRAL */
.aa-lux-menu {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 30px;
}

.aa-lux-link,
.aa-lux-trigger {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;

  color: #4f4642;
  font-size: 12px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: 2px;
  text-transform: uppercase;
  text-decoration: none;

  white-space: nowrap;
}

.aa-lux-link:hover,
.aa-lux-trigger:hover {
  color: #2f2926;
}

.aa-lux-dot {
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: rgba(220, 154, 133, 0.72);
}

/* DROPDOWN */
.aa-lux-item {
  position: relative;
}

.aa-lux-popover {
  position: absolute;
  top: calc(100% + 18px);
  left: 50%;
  transform: translateX(-50%);

  min-width: 245px;
  padding: 10px;

  display: none;

  border-radius: 20px;
  background: rgba(255, 250, 247, 0.94);
  border: 1px solid rgba(255,255,255,0.62);
  box-shadow: 0 18px 40px rgba(74, 56, 50, 0.18);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.aa-lux-item:hover .aa-lux-popover {
  display: block;
}

.aa-lux-popover a {
  display: block;
  padding: 12px 14px;
  border-radius: 14px;

  color: #4f4642;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.4px;
  text-decoration: none;
}

.aa-lux-popover a:hover {
  background: rgba(223, 169, 150, 0.18);
  color: #2f2926;
}

/* POLO DERECHO: mismo peso visual que el logo */
.aa-lux-cta {
  width: 210px;
  height: 58px;

  justify-self: end;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 22px;
  background: rgba(255, 255, 255, 0.42);
  border: 1px solid rgba(255, 255, 255, 0.42);
  box-shadow: 0 6px 18px rgba(74, 56, 50, 0.05);

  color: #5a4c47;
  font-size: 12px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: 2px;
  text-transform: uppercase;
  text-decoration: none;

  white-space: nowrap;
}

.aa-lux-cta:hover {
  background: rgba(255, 255, 255, 0.58);
  color: #2f2926;
}

/* DESKTOP MEDIANO */
@media (max-width: 1200px) {
  .aa-lux-nav-inner {
    width: min(1120px, calc(100% - 72px));
    grid-template-columns: 200px 1fr 200px;
    column-gap: 16px;
  }

  .aa-lux-logo,
  .aa-lux-cta {
    width: 190px;
  }

  .aa-lux-logo img {
    width: 160px;
    max-width: 160px;
  }

  .aa-lux-menu {
    gap: 22px;
  }

  .aa-lux-link,
  .aa-lux-trigger,
  .aa-lux-cta {
    font-size: 11px;
    letter-spacing: 1.7px;
  }
}

/* OCULTAR EN MOBILE */
@media (max-width: 767px) {
  .aa-lux-desktop-nav {
    display: none !important;
  }
}

/* =========================================================
   AA HOME PAGE SYSTEM
   SOLO INDEX.HTML
   Requiere: <body class="aa-home-page">

   Objetivo:
   - Hero del index sin pisar CSS legacy
   - Texto + CTA ubicados sobre torso/pecho
   - Desktop más bajo
   - Mobile más bajo
   ========================================================= */

/* RESET HOME */
.aa-home-page .header-content,
.aa-home-page .hero-title,
.aa-home-page .hero-subtitle,
.aa-home-page .hero-cta-wrap,
.aa-home-page .hero-cta {
  left: auto !important;
  right: auto !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

/* HERO PRINCIPAL */
.aa-home-page .hero-mobile-first {
  position: relative;
  width: 100%;
  min-height: 92vh;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  overflow: hidden;
  padding: 120px 20px 38px;
  background-size: cover !important;
  background-position: center center !important;
}

/* OVERLAY */
.aa-home-page .hero-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    to bottom,
    rgba(0,0,0,0.08) 0%,
    rgba(0,0,0,0.04) 35%,
    rgba(0,0,0,0.12) 100%
  );
}

/* CONTENEDOR TEXTO HERO */
.aa-home-page .header-content {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 560px;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  transform: translateY(155px) !important;
}

/* H1 */
.aa-home-page .hero-title {
  width: 100%;
  margin: 0 auto 14px;
  color: #ffffff;
  font-size: 42px;
  line-height: 1.02;
  font-weight: 500;
  letter-spacing: -0.6px;
  text-wrap: balance;
  text-shadow:
    0 2px 3px rgba(0,0,0,0.65),
    0 6px 18px rgba(0,0,0,0.42),
    0 0 2px rgba(0,0,0,0.95);
}

/* SUBTÍTULO */
.aa-home-page .hero-subtitle {
  width: 100%;
  max-width: 580px;
  margin: 0 auto 22px;
  color: #ffffff;
  font-size: 19px;
  line-height: 1.34;
  font-weight: 500;
  text-wrap: balance;
  text-shadow: 0 2px 10px rgba(0,0,0,0.34);
}

/* CTA */
.aa-home-page .hero-cta-wrap {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.aa-home-page .hero-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 54px;
  padding: 0 32px;
  border-radius: 16px;
  background: rgba(255,255,255,0.94);
  color: #222222 !important;
  font-size: 17px;
  line-height: 1;
  font-weight: 700;
  text-decoration: none !important;
  border: 1px solid rgba(0,0,0,0.10);
  box-shadow: 0 10px 28px rgba(0,0,0,0.14);
  animation: none !important;
}

.aa-home-page .hero-cta::before {
  display: none !important;
}

/* OCULTOS DEFAULT */
.aa-home-page .quick-treatments-mobile,
.aa-home-page .bottom-nav-mobile,
.aa-home-page .mobile-topbar,
.aa-home-page .mobile-blog-link {
  display: none;
}

/* DESKTOP */
@media (min-width: 768px) {
  .aa-home-page .mobile-topbar,
  .aa-home-page .mobile-blog-link,
  .aa-home-page .quick-treatments-mobile,
  .aa-home-page .bottom-nav-mobile {
    display: none !important;
  }

  .aa-home-page .aa-desktop-home-logo {
    display: block !important;
    position: relative;
    z-index: 99999;
  }

  .aa-home-page .aa-desktop-home-logo img {
    display: block !important;
    width: 300px !important;
    max-width: 300px !important;
    height: auto !important;
  }
}

/* TABLET / DESKTOP ANGOSTO */
@media (max-width: 1200px) and (min-width: 768px) {
  .aa-home-page .header-content {
    transform: translateY(135px) !important;
  }

  .aa-home-page .hero-title {
    font-size: 40px;
  }

  .aa-home-page .hero-subtitle {
    font-size: 18px;
  }
}

/* MOBILE */
@media (max-width: 767px) {
  .aa-home-page {
    padding-bottom: 82px;
  }

  .aa-home-page .desktop-nav .navbar-toggle,
  .aa-home-page .desktop-nav .navbar-collapse,
  .aa-home-page .aa-desktop-home-logo {
    display: none !important;
  }

  .aa-home-page .header-top-area {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 20;
    background: transparent;
  }

  .aa-home-page .mobile-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px 0;
  }

  .aa-home-page .logo {
    text-align: left;
    padding-top: 0;
  }

  .aa-home-page .logo img {
    width: 150px;
    max-width: 150px;
    height: auto;
    margin: 0;
  }

  .aa-home-page .mobile-blog-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 34px;
    padding: 0 14px;
    border-radius: 999px;
    background: rgba(255,255,255,0.14);
    color: #ffffff;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    border: 1px solid rgba(255,255,255,0.45);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
  }

  .aa-home-page .hero-mobile-first {
    min-height: 100vh;
    align-items: flex-end;
    justify-content: center;
    padding: 120px 18px 90px;
    background-position: center top !important;
  }

  .aa-home-page .header-content {
    width: 100%;
    max-width: 320px;
    padding: 0;
    transform: translateY(155px) !important;
  }

  .aa-home-page .hero-title {
    max-width: 300px;
    margin-bottom: 14px;
    font-size: 30px;
    line-height: 1.08;
    font-weight: 600;
    letter-spacing: -0.4px;
  }

  .aa-home-page .hero-subtitle {
    max-width: 300px;
    margin-bottom: 20px;
    font-size: 16px;
    line-height: 1.34;
  }

  .aa-home-page .hero-cta {
    width: 100%;
    max-width: 320px;
    min-height: 52px;
    font-size: 16px;
  }

  .aa-home-page .quick-treatments-mobile {
    display: flex;
    gap: 6px;
    width: 100%;
    max-width: 340px;
    margin: 14px auto 0;
  }

  .aa-home-page .quick-treatments-mobile a {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 38px;
    padding: 0 6px;
    border-radius: 999px;
    background: rgba(255,255,255,0.88);
    color: #333333;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
  }

  .aa-home-page .bottom-nav-mobile {
    display: flex;
    position: fixed;
    left: 10px;
    right: 10px;
    bottom: 10px;
    z-index: 9999;
    padding: 8px 6px;
    border-radius: 22px;
    background: rgba(255,255,255,0.96);
    border: 1px solid rgba(0,0,0,0.06);
    box-shadow: 0 10px 35px rgba(0,0,0,0.14);
  }

  .aa-home-page .bottom-nav-mobile a {
    flex: 1;
    min-width: 0;
    padding: 8px 4px;
    text-align: center;
    text-decoration: none;
    color: #444444;
  }

  .aa-home-page .bottom-nav-mobile a span {
    display: block;
    font-size: 12px;
    line-height: 1.15;
    font-weight: 600;
  }
}
/* =========================================================
   TOP DEPTH LAYER
   Sombra superior para mejorar contraste del nav/logo
   ========================================================= */

.aa-home-page .hero-mobile-first::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 145px;

    z-index: 2;

    pointer-events: none;

    background:
        linear-gradient(
            to bottom,
            rgba(0,0,0,0.88) 0%,
            rgba(0,0,0,0.62) 38%,
            rgba(0,0,0,0.22) 72%,
            rgba(0,0,0,0.00) 100%
        );
}
/* =========================================================
   HERO BACKGROUND IMAGES
   Desktop + Mobile separados
   ========================================================= */

/* Desktop */
.aa-home-page .hero-mobile-first {
    background-image: url('../images/sliders/top2.webp');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

/* Mobile */
@media (max-width: 767px) {

    .aa-home-page .hero-mobile-first {
        background-image: url('../images/sliders/top.webp');
        background-size: cover;
        background-position: center top;
    }

}



/* =========================================================
   DESKTOP · SECCIONES SIN FRANJA ROSA
   ========================================================= */

@media (min-width: 768px) {

  .aa-tc-content {
    background: transparent !important;
    padding: 0 20px 64px !important;
  }

  .aa-tc-content > section {
    margin-bottom: 46px !important;
    padding: 34px 30px !important;
    border-radius: 28px !important;
    background: var(--aa-bg-card-final, #FFFDFC) !important;
    border: 1px solid var(--aa-border-final, rgba(120, 90, 80, 0.08)) !important;
    box-shadow: none !important;
  }

  .aa-tc-content > section:first-child {
    margin-top: 46px !important;
  }

  .aa-tc-content > section:nth-of-type(even) {
    background: var(--aa-bg-alt-final, #F5ECE8) !important;
  }

  .aa-tc-content > section.aa-price-section,
  .aa-price-section {
    background: var(--aa-bg-price-final, #EFE4DF) !important;
    border-color: rgba(120, 90, 80, 0.10) !important;
  }

  .aa-tc-content > section.aa-faq-shell,
  .aa-tc-content > section:has(#faqAccordion),
  .aa-faq-shell {
    background: var(--aa-bg-faq-final, #F3E9E4) !important;
    border-color: rgba(120, 90, 80, 0.10) !important;
  }

  .aa-tc-content > section.aa-relation-section,
  .aa-relation-section {
    background: transparent !important;
    border: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* =========================================================
   CTA BUTTONS · PREMIUM GRADIENT
   Aplica a tratamientos, subtratamientos y afecciones
   ========================================================= */

.aa-price-section .btn-wsp,
.aa-price-section .aa-btn-whatsapp,
.aa-location-button,
.aa-location-block .aa-btn,
.aa-location-map-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;

  min-height: 48px !important;
  padding: 0 22px !important;

  border: 0 !important;
  border-radius: 999px !important;

  background: linear-gradient(135deg, var(--aa-accent-final, #b38b73) 0%, var(--aa-accent-dark-final, #8d6e5c) 100%) !important;
  color: #fff !important;

  font-family: var(--aa-sans-final, "Helvetica Neue", Helvetica, Arial, sans-serif) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  letter-spacing: .01em !important;
  text-transform: none !important;
  text-decoration: none !important;

  box-shadow: 0 10px 24px rgba(141,110,92,.18) !important;

  transition:
    transform .18s ease,
    box-shadow .18s ease,
    opacity .18s ease !important;
}

.aa-price-section .btn-wsp:hover,
.aa-price-section .aa-btn-whatsapp:hover,
.aa-location-button:hover,
.aa-location-block .aa-btn:hover,
.aa-location-map-btn:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 14px 28px rgba(141,110,92,.22) !important;
  opacity: .96 !important;
  color: #fff !important;
  text-decoration: none !important;
}

.aa-price-section .btn-wsp,
.aa-price-section .aa-btn-whatsapp {
  width: auto !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Icono WhatsApp */
.aa-price-section .btn-wsp::before,
.aa-price-section .aa-btn-whatsapp::before {
  content: "";
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  display: inline-block;

  background-image: url("../images/phoneicon.webp");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;

  opacity: .95;
}
/* =========================================================
   BOTTOM NAV MOBILE
   ========================================================= */

body[data-treatment] .aa-bottom-nav-mobile {
  background: rgba(255,248,245,.92) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;

  border-top: 1px solid rgba(120,90,80,.08) !important;

  box-shadow: 0 -8px 24px rgba(0,0,0,.06) !important;
}

body[data-treatment] .aa-bottom-nav-mobile a,
body[data-treatment] .aa-bottom-nav-mobile span {
  font-family: var(--aa-sans-final) !important;
  color: var(--aa-text-final) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .01em !important;

  transition:
    opacity .18s ease,
    transform .18s ease !important;
}

body[data-treatment] .aa-bottom-nav-mobile a:hover {
  opacity: .78 !important;
  transform: translateY(-1px) !important;
}

/* =========================================================
   LOCATION + FOOTER
   ========================================================= */

.aa-idx-location {
  background: var(--aa-bg-final) !important;
  padding: 72px 24px 72px !important;
  border-top: 1px solid #E9DDD8 !important;
  text-align: center !important;
}

.aa-idx-location-inner {
  max-width: 760px !important;
  margin: 0 auto !important;
}

.aa-idx-location-eyebrow {
  display: block !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
  color: var(--aa-accent-dark-final) !important;
  margin-bottom: 14px !important;
}

.aa-idx-location-title {
  font-family: var(--aa-serif-final) !important;
  font-size: clamp(32px,4vw,50px) !important;
  font-weight: 300 !important;
  line-height: 1.08 !important;
  color: var(--aa-text-final) !important;
  margin-bottom: 26px !important;
}

.aa-idx-location-address a,
.aa-idx-location-phone,
.aa-idx-location-hours {
  display: block !important;
  font-family: var(--aa-sans-final) !important;
  font-size: 16px !important;
  font-weight: 300 !important;
  line-height: 1.8 !important;
  color: #4E403B !important;
  text-decoration: none !important;
  margin-bottom: 4px !important;
}

.aa-idx-location-address a {
  color: var(--aa-accent-dark-final) !important;
}

.aa-idx-footer {
  background: #2C2323 !important;
  padding: 56px 24px 48px !important;
  border-top: 1px solid rgba(255,255,255,.04) !important;
}

.aa-idx-footer-inner {
  max-width: 760px !important;
  margin: 0 auto !important;
  text-align: center !important;
}

.aa-idx-footer-social {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 24px !important;
  margin-bottom: 28px !important;
}

.aa-idx-footer-social a {
  color: #D9B8A7 !important;
  font-size: 18px !important;
  opacity: .9 !important;

  transition:
    opacity .2s,
    transform .2s,
    color .2s !important;
}

.aa-idx-footer-social a:hover {
  color: #fff !important;
  opacity: 1 !important;
  transform: translateY(-1px) !important;
}

.aa-idx-footer-copy {
  font-size: 13px !important;
  font-weight: 300 !important;
  letter-spacing: .02em !important;
  color: rgba(255,255,255,.72) !important;
  margin-bottom: 10px !important;
}

.aa-idx-footer-note {
  max-width: 520px !important;
  margin: 0 auto !important;
  font-size: 12px !important;
  font-weight: 300 !important;
  line-height: 1.7 !important;
  color: rgba(255,255,255,.42) !important;
}

/* =========================================================
   BLOG SOFT STRIP
   ========================================================= */

.aa-blog-soft-strip {
  padding: 26px 20px !important;
  background: linear-gradient(135deg, #fbf7f3 0%, #f4ebe4 100%) !important;
  border-top: 1px solid #eadfd7 !important;
  border-bottom: 1px solid #eadfd7 !important;
  text-align: center !important;
}

.aa-blog-soft-strip-inner {
  max-width: 760px !important;
  margin: 0 auto !important;
}

.aa-blog-soft-strip-eyebrow {
  display: block !important;
  margin-bottom: 8px !important;
  font-size: 10px !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
  color: #a9826d !important;
  font-weight: 500 !important;
}

.aa-blog-soft-strip p {
  margin: 0 !important;
  font-size: 15.5px !important;
  line-height: 1.55 !important;
  color: #5f5550 !important;
}

.aa-blog-soft-strip a {
  color: #8d6e5c !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  border-bottom: 1px solid rgba(141, 110, 92, .45) !important;
  padding-bottom: 2px !important;
}

.aa-blog-soft-strip a:hover {
  color: #6f5142 !important;
  border-bottom-color: #6f5142 !important;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {
  body[data-treatment] .aa-tc-content h2,
  body[data-treatment] .aa-content-v2 h2,
  body[data-treatment] .aa-relation-section h2,
  body[data-treatment] .aa-reviews-shell h2,
  body[data-treatment] .aa-faq-shell h2,
  body[data-treatment] .aa-location-block h2 {
    font-size: 30px !important;
    line-height: 1.08 !important;
  }

  body[data-treatment] .aa-tc-content p,
  body[data-treatment] .aa-tc-content li,
  body[data-treatment] .aa-price-section p,
  body[data-treatment] .aa-faq-shell .card-body,
  body[data-treatment] .aa-reviews-shell p,
  body[data-treatment] .aa-location-block p {
    font-size: 16px !important;
    line-height: 1.78 !important;
  }

  body[data-treatment] .aa-idx-footer,
  body[data-treatment] .aa-site-footer {
    padding-bottom: 130px !important;
  }
}

/* =========================================================
   PRICE SECTION · 3 Cuotas sin interes
   ========================================================= */

body[data-treatment] .aa-price-section p:first-of-type {

  color: #a26760 !important;

  font-size: 17px !important;

  font-weight: 600 !important;

  letter-spacing: .08em !important;

  text-transform: uppercase !important;

  text-align: center !important;
}

/* ============================================================
   HERO + NAV · REDISEÑO PREMIUM v2
   Solo CSS — sin modificar el HTML de ninguna página
   Pegar al FINAL de style.css (sobreescribe versión anterior)
   ============================================================ */

/* Google Fonts — agregar UNA VEZ en el <head> de cada página
   (o en tu layout/partial compartido):

   <link rel="preconnect" href="https://fonts.googleapis.com">
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;1,300&family=Jost:wght@300;400;600&display=swap" rel="stylesheet">
*/


/* ── VARIABLES ───────────────────────────────────────────── */

:root {
  --aa-gold:       #c9a96e;
  --aa-gold-dark:  #9e7a42;
  --aa-cream:      #faf7f5;
  --aa-nav:        #efe4df;
  --aa-nav-border: #d4bfb8;
  --aa-ink:        #2a1f1a;
  --aa-ink-light:  #1e1512;
  --aa-muted:      #7a6257;
  --aa-hint:       #a08070;
  --aa-rule:       #ddd5cf;

  --aa-serif: 'Cormorant Garamond', Georgia, serif;
  --aa-sans:  'Jost', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

/* ════════════════════════════════════════════════════════════
   NAV DESKTOP · GLOBAL
   ════════════════════════════════════════════════════════════ */

.header-top-area.aa-header-desktop {
  background: var(--aa-nav) !important;
  border-bottom: 0.5px solid var(--aa-nav-border) !important;
  box-shadow: none !important;
  padding: 0 !important;

  position: fixed !important;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
}

/* Container */
.header-top-area.aa-header-desktop .container {
  max-width: 1140px;
  padding: 0 40px;
}

/* Row */
.header-top-area.aa-header-desktop .row {
  display: flex !important;
  align-items: center !important;
  min-height: 68px;
}

/* ════════════════════════════════════════════════════════════
   LOGO
   ════════════════════════════════════════════════════════════ */

.header-top-area.aa-header-desktop .logo,
.header-top-area.aa-header-desktop .aa-desktop-home-logo {
  padding: 0 !important;
  margin: 0 !important;
  line-height: 1 !important;
}

.header-top-area.aa-header-desktop .logo img,
.header-top-area.aa-header-desktop .aa-desktop-home-logo img {
  width: auto !important;
  height: auto !important;
  max-height: 58px !important;

  opacity: 1 !important;
  filter: none !important;

  display: block !important;
  object-fit: contain !important;
}

/* ════════════════════════════════════════════════════════════
   NAVBAR
   ════════════════════════════════════════════════════════════ */

.header-top-area.aa-header-desktop .navbar.navbar-default {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  margin: 0 !important;
  min-height: unset !important;
}

.header-top-area.aa-header-desktop .navbar-collapse {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  float: none !important;
}

/* ════════════════════════════════════════════════════════════
   LINKS · INTERIOR
   ════════════════════════════════════════════════════════════ */

.header-top-area.aa-header-desktop .nav.navbar-nav > li > a {
  font-family: var(--aa-sans) !important;
  font-size: 10.5px !important;
  font-weight: 400 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;

  color: #6b5248 !important;

  padding: 0 14px !important;
  line-height: 68px !important;

  background: transparent !important;
  border-bottom: 1px solid transparent !important;

  transition:
    color 0.2s,
    border-color 0.2s !important;

  text-shadow: none !important;
}

.header-top-area.aa-header-desktop .nav.navbar-nav > li > a:hover,
.header-top-area.aa-header-desktop .nav.navbar-nav > li > a:focus,
.header-top-area.aa-header-desktop .nav.navbar-nav > li.active > a {
  color: var(--aa-ink) !important;
  border-bottom-color: var(--aa-gold) !important;
  background: transparent !important;
}

/* ════════════════════════════════════════════════════════════
   CTA CONTACTANOS
   ════════════════════════════════════════════════════════════ */

.header-top-area.aa-header-desktop .nav.navbar-nav > li:last-child > a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  min-height: 42px !important;
  padding: 0 22px !important;

  margin: 13px 0 13px 14px !important;

  border-radius: 999px !important;
  border: 0 !important;

  background: linear-gradient(
    135deg,
    #b38b73 0%,
    #8d6e5c 100%
  ) !important;

  color: #fff !important;

  line-height: 1 !important;

  font-family: var(--aa-sans) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  letter-spacing: .10em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;

  text-shadow: none !important;

  box-shadow:
    0 10px 24px rgba(141,110,92,.18) !important;

  transition:
    transform .18s ease,
    box-shadow .18s ease,
    opacity .18s ease !important;
}

.header-top-area.aa-header-desktop .nav.navbar-nav > li:last-child > a:hover {
  transform: translateY(-1px) !important;

  box-shadow:
    0 14px 28px rgba(141,110,92,.22) !important;

  opacity: .96 !important;

  color: #fff !important;

  background: linear-gradient(
    135deg,
    #bb9279 0%,
    #937260 100%
  ) !important;
}

/* ════════════════════════════════════════════════════════════
   DROPDOWN
   ════════════════════════════════════════════════════════════ */

.header-top-area.aa-header-desktop .dropdown-menu {
  background: var(--aa-nav) !important;

  border: 0.5px solid var(--aa-nav-border) !important;
  border-top: 1.5px solid var(--aa-gold) !important;

  border-radius: 18px !important;

  box-shadow:
    0 18px 40px rgba(42,31,26,.14) !important;

  padding: 10px 0 !important;
  margin-top: 6px !important;
}

.header-top-area.aa-header-desktop .dropdown-menu > li > a {
  font-family: var(--aa-sans) !important;
  font-size: 10.5px !important;
  font-weight: 400 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;

  color: #6b5248 !important;

  padding: 11px 24px !important;

  background: transparent !important;

  transition:
    color 0.15s,
    padding-left 0.15s !important;
}

.header-top-area.aa-header-desktop .dropdown-menu > li > a:hover {
  color: var(--aa-ink) !important;
  background: transparent !important;
  padding-left: 30px !important;
}

/* ════════════════════════════════════════════════════════════
   HOME · NAV TRANSPARENTE SOLO INDEX
   ════════════════════════════════════════════════════════════ */

body.aa-home-page .header-top-area.aa-home-header {
  position: absolute !important;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;

  background: transparent !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}

/* Links blancos SOLO home */
body.aa-home-page .header-top-area.aa-home-header .nav.navbar-nav > li > a {
  color: rgba(255,255,255,.92) !important;

  text-shadow:
    0 1px 2px rgba(0,0,0,.22) !important;
}

body.aa-home-page .header-top-area.aa-home-header .nav.navbar-nav > li > a:hover,
body.aa-home-page .header-top-area.aa-home-header .nav.navbar-nav > li.active > a {
  color: #fff !important;
  border-bottom-color: rgba(255,255,255,.55) !important;
}

/* CTA home */
body.aa-home-page .header-top-area.aa-home-header .nav.navbar-nav > li:last-child > a {
  background: linear-gradient(
    135deg,
    #b38b73 0%,
    #8d6e5c 100%
  ) !important;

  color: #fff !important;
}

/* Dropdown home */
body.aa-home-page .header-top-area.aa-home-header .dropdown-menu {
  background: rgba(255,248,244,.96) !important;

  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* ════════════════════════════════════════════════════════════
   DROPDOWN HOVER FIX
   Evita que se cierre al bajar el mouse
   ════════════════════════════════════════════════════════════ */

@media (min-width: 769px) {

  .header-top-area.aa-header-desktop .navbar-nav .dropdown {
    position: relative !important;
  }

  .header-top-area.aa-header-desktop .navbar-nav .dropdown::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    height: 14px;
  }

  .header-top-area.aa-header-desktop .navbar-nav .dropdown-menu {
    top: calc(100% + 6px) !important;
    margin-top: 0 !important;
  }

  .header-top-area.aa-header-desktop .navbar-nav .dropdown:hover > .dropdown-menu,
  .header-top-area.aa-header-desktop .navbar-nav .dropdown:focus-within > .dropdown-menu {
    display: block !important;
  }
}

/* ════════════════════════════════════════════════════════════
   HERO DESKTOP · PREMIUM SIN SOLAPARSE CON NAV
   ════════════════════════════════════════════════════════════ */

@media (min-width: 769px) {

  header .header-full-width-tratamientosindividuales,
  .aa-treatment-header .header-full-width-tratamientosindividuales,
  .header-full-width-tratamientosindividuales {
    background-image: none !important;
    background-color: var(--aa-cream) !important;

    min-height: auto !important;

    /* clave: 68px nav + 56px aire visual */
    padding: 124px 40px 52px !important;

    display: block !important;
    overflow: visible !important;
    position: relative !important;
    text-align: center !important;

    border-bottom: 0.5px solid var(--aa-rule) !important;
  }

  .header-full-width-tratamientosindividuales::before,
  .header-full-width-tratamientosindividuales::after {
    display: none !important;
  }

  header .header-full-width-tratamientosindividuales .header-content,
  .aa-treatment-header .header-full-width-tratamientosindividuales .header-content,
  .header-full-width-tratamientosindividuales .header-content {
    position: relative !important;
    width: 100% !important;
    max-width: 680px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    text-align: center !important;
    display: block !important;
    box-sizing: border-box !important;
  }

  .header-full-width-tratamientosindividuales .header-content h1 {
    font-family: var(--aa-serif) !important;
    font-size: clamp(34px, 3.5vw, 50px) !important;
    font-weight: 300 !important;
    line-height: 1.06 !important;
    letter-spacing: -0.01em !important;
    color: var(--aa-ink-light) !important;
    text-align: center !important;
    text-shadow: none !important;
    text-transform: none !important;
    margin: 0 0 16px !important;
    padding: 0 !important;
  }

  .header-full-width-tratamientosindividuales .header-content > p:not(.hero-featured-price) {
    font-family: var(--aa-sans) !important;
    font-size: 15px !important;
    font-weight: 300 !important;
    line-height: 1.8 !important;
    color: var(--aa-muted) !important;
    text-align: center !important;
    text-shadow: none !important;
    margin: 0 auto 24px !important;
    max-width: 520px !important;
    padding: 0 !important;
    display: block !important;
  }

  .header-full-width-tratamientosindividuales .hero-featured-price {
    display: block !important;
    width: fit-content !important;
    margin: 0 auto 26px !important;
    padding: 14px 28px !important;
    border: 0.5px solid var(--aa-rule) !important;
    text-align: center !important;
    text-shadow: none !important;
  }

  .header-full-width-tratamientosindividuales .hero-featured-price::before {
    content: "Precio desde" !important;
    display: block !important;
    font-family: var(--aa-sans) !important;
    font-size: 9px !important;
    font-weight: 400 !important;
    letter-spacing: 0.22em !important;
    text-transform: uppercase !important;
    color: var(--aa-gold) !important;
    margin-bottom: 6px !important;
  }

  .header-full-width-tratamientosindividuales .hero-featured-price strong {
    font-family: var(--aa-serif) !important;
    font-size: 24px !important;
    font-weight: 300 !important;
    color: var(--aa-ink-light) !important;
    display: block !important;
    line-height: 1.2 !important;
  }

  .header-full-width-tratamientosindividuales .hero-featured-price span {
    font-size: 26px !important;
  }

.header-full-width-tratamientosindividuales .btn-action {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;

  min-height: 50px !important;
  padding: 0 28px !important;

  border-radius: 999px !important;
  border: 0 !important;

  background: linear-gradient(
    135deg,
    #b38b73 0%,
    #8d6e5c 100%
  ) !important;

  color: #fff !important;

  font-family: var(--aa-sans-final, "Helvetica Neue", Helvetica, Arial, sans-serif) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  letter-spacing: .01em !important;
  text-transform: none !important;
  text-decoration: none !important;

  text-shadow: none !important;

  box-shadow:
    0 10px 24px rgba(141,110,92,.18) !important;

  animation: none !important;
  margin-top: 0 !important;

  transition:
    transform .18s ease,
    box-shadow .18s ease,
    opacity .18s ease !important;
}

.header-full-width-tratamientosindividuales .btn-action:hover,
.header-full-width-tratamientosindividuales .btn-action:focus {
  transform: translateY(-1px) !important;

  box-shadow:
    0 14px 28px rgba(141,110,92,.22) !important;

  opacity: .96 !important;

  color: #fff !important;
  text-decoration: none !important;

  background: linear-gradient(
    135deg,
    #bb9279 0%,
    #937260 100%
  ) !important;
}

  .header-full-width-tratamientosindividuales .btn-action::before {
    display: none !important;
  }

  .header-full-width-tratamientosindividuales .btn-action:hover,
  .header-full-width-tratamientosindividuales .btn-action:focus {
    background: var(--aa-gold) !important;
    color: #fff !important;
    transform: none !important;
  }
}

/* Mobile: ocultar hero desktop, no tocar hero mobile */
@media (max-width: 768px) {
  .header-full-width-tratamientosindividuales,
  header .header-full-width-tratamientosindividuales,
  .aa-treatment-header .header-full-width-tratamientosindividuales {
    display: none !important;
  }
}

/* =========================================================
   TYPO · H2 + TITULOS DE CARDS / HUBS
   ========================================================= */

.aa-tc-content h2,
.aa-relation-section h2,
.aa-relation-title,
.aa-faq-shell h2,
.aa-reviews-shell h2,
.aa-location-block h2 {
  font-family: var(--aa-serif-final, "Cormorant Garamond", Georgia, serif) !important;
  font-size: clamp(24px, 2.2vw, 34px) !important;
  line-height: 1.08 !important;
  font-weight: 300 !important;
  letter-spacing: 0.01em !important;
  text-transform: none !important;
  color: var(--aa-text-final, #2a2020) !important;
  text-align: center !important;
}

.treatment-unified-title-text,
.treatments-unified-grid h3,
.treatment-card h3,
.treatment-card-title,
.aa-treatment-card-title {
  font-family: var(--aa-sans-final, "Helvetica Neue", Helvetica, Arial, sans-serif) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
  color: var(--aa-text-final, #2a2020) !important;
}

/* =========================================================
   MOBILE TOPBAR · LOGO SIZE FIX
   ========================================================= */

.aa-hero-mobile-logo {
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
  max-width: none !important;
  height: auto !important;
}

.aa-hero-mobile-logo img {
  width: 150px !important;
  height: auto !important;
  max-width: 150px !important;
  max-height: none !important;

  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
  object-fit: contain !important;
}
/* =========================================================
   NAV DROPDOWN · FIX HOVER GAP DESKTOP
   Evita que se cierre al bajar el cursor
   ========================================================= */

@media (min-width: 769px) {

  .header-top-area.aa-header-desktop .navbar-nav .dropdown {
    position: relative !important;
  }

  .header-top-area.aa-header-desktop .navbar-nav .dropdown::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    height: 14px;
  }

  .header-top-area.aa-header-desktop .navbar-nav .dropdown-menu {
    top: calc(100% + 6px) !important;
    margin-top: 0 !important;
  }

  .header-top-area.aa-header-desktop .navbar-nav .dropdown:hover > .dropdown-menu,
  .header-top-area.aa-header-desktop .navbar-nav .dropdown:focus-within > .dropdown-menu {
    display: block !important;
  }
}
/* ============================================================
   HERO + NAV · REDISEÑO PREMIUM v2
   Solo CSS — sin modificar el HTML de ninguna página
   Pegar al FINAL de style.css (sobreescribe versión anterior)
   ============================================================ */

/* Google Fonts — agregar UNA VEZ en el <head> de cada página
   (o en tu layout/partial compartido):

   <link rel="preconnect" href="https://fonts.googleapis.com">
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;1,300&family=Jost:wght@300;400;600&display=swap" rel="stylesheet">
*/


/* ── VARIABLES ───────────────────────────────────────────── */

:root {
  --aa-gold:       #c9a96e;
  --aa-gold-dark:  #9e7a42;
  --aa-cream:      #faf7f5;
  --aa-nav:        #efe4df;
  --aa-nav-border: #d4bfb8;
  --aa-ink:        #2a1f1a;
  --aa-ink-light:  #1e1512;
  --aa-muted:      #7a6257;
  --aa-hint:       #a08070;
  --aa-rule:       #ddd5cf;

  --aa-serif: 'Cormorant Garamond', Georgia, serif;
  --aa-sans:  'Jost', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

/* ════════════════════════════════════════════════════════════
   NAV DESKTOP · GLOBAL
   ════════════════════════════════════════════════════════════ */

.header-top-area.aa-header-desktop {
  background: var(--aa-nav) !important;
  border-bottom: 0.5px solid var(--aa-nav-border) !important;
  box-shadow: none !important;
  padding: 0 !important;

  position: fixed !important;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
}

/* Container */
.header-top-area.aa-header-desktop .container {
  max-width: 1140px;
  padding: 0 40px;
}

/* Row */
.header-top-area.aa-header-desktop .row {
  display: flex !important;
  align-items: center !important;
  min-height: 68px;
}

/* ════════════════════════════════════════════════════════════
   LOGO
   ════════════════════════════════════════════════════════════ */

.header-top-area.aa-header-desktop .logo,
.header-top-area.aa-header-desktop .aa-desktop-home-logo {
  padding: 0 !important;
  margin: 0 !important;
  line-height: 1 !important;
}

.header-top-area.aa-header-desktop .logo img,
.header-top-area.aa-header-desktop .aa-desktop-home-logo img {
  width: auto !important;
  height: auto !important;
  max-height: 58px !important;

  opacity: 1 !important;
  filter: none !important;

  display: block !important;
  object-fit: contain !important;
}

/* ════════════════════════════════════════════════════════════
   NAVBAR
   ════════════════════════════════════════════════════════════ */

.header-top-area.aa-header-desktop .navbar.navbar-default {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  margin: 0 !important;
  min-height: unset !important;
}

.header-top-area.aa-header-desktop .navbar-collapse {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  float: none !important;
}

/* ════════════════════════════════════════════════════════════
   LINKS · INTERIOR
   ════════════════════════════════════════════════════════════ */

.header-top-area.aa-header-desktop .nav.navbar-nav > li > a {
  font-family: var(--aa-sans) !important;
  font-size: 10.5px !important;
  font-weight: 400 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;

  color: #6b5248 !important;

  padding: 0 14px !important;
  line-height: 68px !important;

  background: transparent !important;
  border-bottom: 1px solid transparent !important;

  transition:
    color 0.2s,
    border-color 0.2s !important;

  text-shadow: none !important;
}

.header-top-area.aa-header-desktop .nav.navbar-nav > li > a:hover,
.header-top-area.aa-header-desktop .nav.navbar-nav > li > a:focus,
.header-top-area.aa-header-desktop .nav.navbar-nav > li.active > a {
  color: var(--aa-ink) !important;
  border-bottom-color: var(--aa-gold) !important;
  background: transparent !important;
}

/* ════════════════════════════════════════════════════════════
   CTA CONTACTANOS
   ════════════════════════════════════════════════════════════ */

.header-top-area.aa-header-desktop .nav.navbar-nav > li:last-child > a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  min-height: 42px !important;
  padding: 0 22px !important;

  margin: 13px 0 13px 14px !important;

  border-radius: 999px !important;
  border: 0 !important;

  background: linear-gradient(
    135deg,
    #b38b73 0%,
    #8d6e5c 100%
  ) !important;

  color: #fff !important;

  line-height: 1 !important;

  font-family: var(--aa-sans) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  letter-spacing: .10em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;

  text-shadow: none !important;

  box-shadow:
    0 10px 24px rgba(141,110,92,.18) !important;

  transition:
    transform .18s ease,
    box-shadow .18s ease,
    opacity .18s ease !important;
}

.header-top-area.aa-header-desktop .nav.navbar-nav > li:last-child > a:hover {
  transform: translateY(-1px) !important;

  box-shadow:
    0 14px 28px rgba(141,110,92,.22) !important;

  opacity: .96 !important;

  color: #fff !important;

  background: linear-gradient(
    135deg,
    #bb9279 0%,
    #937260 100%
  ) !important;
}

/* ════════════════════════════════════════════════════════════
   DROPDOWN
   ════════════════════════════════════════════════════════════ */

.header-top-area.aa-header-desktop .dropdown-menu {
  background: var(--aa-nav) !important;

  border: 0.5px solid var(--aa-nav-border) !important;
  border-top: 1.5px solid var(--aa-gold) !important;

  border-radius: 18px !important;

  box-shadow:
    0 18px 40px rgba(42,31,26,.14) !important;

  padding: 10px 0 !important;
  margin-top: 6px !important;
}

.header-top-area.aa-header-desktop .dropdown-menu > li > a {
  font-family: var(--aa-sans) !important;
  font-size: 10.5px !important;
  font-weight: 400 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;

  color: #6b5248 !important;

  padding: 11px 24px !important;

  background: transparent !important;

  transition:
    color 0.15s,
    padding-left 0.15s !important;
}

.header-top-area.aa-header-desktop .dropdown-menu > li > a:hover {
  color: var(--aa-ink) !important;
  background: transparent !important;
  padding-left: 30px !important;
}

/* ════════════════════════════════════════════════════════════
   HOME · NAV TRANSPARENTE SOLO INDEX
   ════════════════════════════════════════════════════════════ */

body.aa-home-page .header-top-area.aa-home-header {
  position: absolute !important;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;

  background: transparent !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}

/* Links blancos SOLO home */
body.aa-home-page .header-top-area.aa-home-header .nav.navbar-nav > li > a {
  color: rgba(255,255,255,.92) !important;

  text-shadow:
    0 1px 2px rgba(0,0,0,.22) !important;
}

body.aa-home-page .header-top-area.aa-home-header .nav.navbar-nav > li > a:hover,
body.aa-home-page .header-top-area.aa-home-header .nav.navbar-nav > li.active > a {
  color: #fff !important;
  border-bottom-color: rgba(255,255,255,.55) !important;
}

/* CTA home */
body.aa-home-page .header-top-area.aa-home-header .nav.navbar-nav > li:last-child > a {
  background: linear-gradient(
    135deg,
    #b38b73 0%,
    #8d6e5c 100%
  ) !important;

  color: #fff !important;
}

/* Dropdown home */
body.aa-home-page .header-top-area.aa-home-header .dropdown-menu {
  background: rgba(255,248,244,.96) !important;

  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
/* =========================================================
   INDEX MOBILE · TOPBAR SOBRE HERO
   ========================================================= */

@media (max-width: 768px) {

  body.aa-home-page header {
    position: relative !important;
  }

  body.aa-home-page .mobile-topbar {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 40 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;

    padding: 14px 16px !important;
  }

  body.aa-home-page .mobile-topbar::before,
  body.aa-home-page .mobile-topbar::after {
    display: none !important;
  }

  body.aa-home-page .mobile-topbar .logo,
  body.aa-home-page .mobile-topbar .logo a,
  body.aa-home-page .mobile-topbar .logo img {
    background: transparent !important;
    box-shadow: none !important;
  }

  body.aa-home-page .mobile-topbar .logo img {
    width: 150px !important;
    height: auto !important;
    max-width: 150px !important;
    opacity: 1 !important;
    filter: none !important;
  }
}