/* ==================================================
		 VARIABLES GLOBALES
	  ================================================== */

	  :root {

		--green: #5BB824;
		--green-dark: #3f8f15;

		--ink: #2B323A;
		--paper: #F5F5F5;
		--mist: #E8EEE4;

		--shadow-soft: 0 12px 30px rgba(43, 50, 58, 0.08);
		--shadow-medium: 0 18px 45px rgba(43, 50, 58, 0.12);

		--transition: all 0.3s ease;

		--radius-sm: 12px;
		--radius-md: 18px;
		--radius-lg: 999px;

	  }

	  /* ==================================================
		 CONFIGURACIÓN GENERAL
	  ================================================== */

	  html {

		scroll-behavior: smooth;

	  }

	  body {

		font-family: "DM Sans", sans-serif;

		color: var(--ink);

		background-color: var(--paper);

		overflow-x: hidden;

		margin: 0;
		padding: 0;

	  }

	  .display-font {

		font-family: "Fraunces", serif;

	  }
	  
		  
	/* ==================================================
	   TIPOGRAFÍA GLOBAL
	================================================== */

	/* Títulos centrados */

	h1,
	h2,
	h3,
	h4,
	h5,
	h6,
	.display-font{

		text-align:center;

	}


	/* Párrafos justificados */

	p,
	blockquote,
	li{

		text-align:justify;

		text-justify:inter-word;

	}


	/* Textos de apoyo */

	section p{

		line-height:1.8;

	}


	/* Badges y textos cortos */

	.text-sm.uppercase{

		text-align:center;

	}  
	  


	  /* ==================================================
		 HEADER / NAVEGACIÓN
	  ================================================== */

	  .nav-logo img {

		height: 52px;

		width: auto;

		transition: var(--transition);

	  }

	  .nav-logo img:hover {

		transform: scale(1.03);

	  }
	  
		  
		  
		  
	/* =========================
	   LOGO RESPONSIVE
	========================= */

	.logo-img {

		width: auto;

		height: 180px;

		max-height: none;

		object-fit: contain;

		transition: all 0.3s ease;

	}

	.logo-img:hover {

		transform: scale(1.03);

	}

	/* Tablet */

	@media (max-width: 768px) {

		.logo-img {

			height: 120px;

		}

	}

	/* Móvil */

	@media (max-width: 480px) {

		.logo-img {

			height: 90px;

		}

	}
	  




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


	  /* ==================================================
		 REDES SOCIALES
	  ================================================== */

	  .social-link {

		display: flex;

		align-items: center;

		justify-content: center;

		width: 42px;

		height: 42px;

		border-radius: 50%;

		color: var(--ink);

		transition: var(--transition);

	  }

	  .social-link:hover {

		background: var(--green);

		color: white;

		transform: translateY(-3px);

		box-shadow: var(--shadow-soft);

	  }

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

	  .menu-toggle {

		display: flex;

		flex-direction: column;

		gap: 6px;

		padding: 10px;

		border: none;

		background: transparent;

		cursor: pointer;

		transition: var(--transition);

	  }

	  .menu-toggle:hover {

		transform: scale(1.05);

	  }

	  .menu-line {

		width: 28px;

		height: 2px;

		border-radius: 999px;

		background: var(--ink);

		transition: all .3s ease;

	  }

	  .menu-toggle.open .menu-line:nth-child(1) {

		transform: translateY(8px) rotate(45deg);

	  }

	  .menu-toggle.open .menu-line:nth-child(2) {

		opacity: 0;

	  }

	  .menu-toggle.open .menu-line:nth-child(3) {

		transform: translateY(-8px) rotate(-45deg);

	  }

	/* ==================================================
	   MENÚ MÓVIL
	================================================== */

	.mobile-overlay {

		opacity: 0;

		pointer-events: none;

		transition: opacity .35s ease;

		backdrop-filter: blur(12px);

		background: rgba(43, 50, 58, 0.55);

	}

	.mobile-overlay.open {

		opacity: 1;

		pointer-events: auto;

	}

	.mobile-panel {

		transform: translateX(100%);

		transition: transform .35s cubic-bezier(.2, .8, .2, 1);

		box-shadow: -10px 0 40px rgba(0, 0, 0, .15);

	}

	.mobile-overlay.open .mobile-panel {

		transform: translateX(0);

	}

	/* ==================================================
	   CABECERA DEL MENÚ MÓVIL
	================================================== */

	.mobile-header {

		display: flex;

		align-items: center;

		justify-content: center;

		position: relative;

		padding-bottom: 1rem;

		margin-bottom: 1.25rem;

		border-bottom: 1px solid rgba(43, 50, 58, 0.08);

	}
	
	
	
	
	
	
	
	

	/* ==================================================
	   LOGO MENÚ MÓVIL
	================================================== */

	.logo-mobile {

		display: block;

		width: auto;

		height: 120px;

		max-width: 100%;

		object-fit: contain;

		margin: 0 auto;

		transition: transform .3s ease;

	}

	.logo-mobile:hover {

		transform: scale(1.03);

	}

	/* ==================================================
	   BOTÓN CERRAR
	================================================== */

	.mobile-close {

		position: absolute;

		top: 50%;

		right: 0;

		transform: translateY(-50%);

		width: 42px;

		height: 42px;

		border-radius: 999px;

		background: #ffffff;

		display: flex;

		align-items: center;

		justify-content: center;

		box-shadow: 0 8px 20px rgba(0, 0, 0, .10);

		transition: all .3s ease;

	}

	.mobile-close:hover {

		background: var(--green);

		color: white;

	}

	/* ==================================================
	   ENLACES DEL MENÚ
	================================================== */

	.mobile-link {

		position: relative;

		display: flex;

		align-items: center;

		padding: 12px 0;

		font-size: 1rem;

		font-weight: 500;

		letter-spacing: 0.02em;

		color: var(--ink);

		border-bottom: 1px solid rgba(43, 50, 58, 0.06);

		transition: all .25s ease;

	}

	.mobile-link:hover {

		color: var(--green);

		padding-left: 10px;

	}

	.mobile-link:last-child {

		border-bottom: none;

	}
	
	
	
	
	
	/* ========================================================= */
	/* BARRA SUPERIOR */
	/* ========================================================= */

	.nav-shell{

		background:#2B323A;

		backdrop-filter:blur(16px);

		box-shadow:0 8px 24px rgba(0,0,0,.18);

	}

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

	.header-top {

		max-width: 1320px;

		height: 46px;

		margin: 0 auto;

		padding: 0 30px;

		display: flex;

		align-items: center;

		justify-content: space-between;

	}

	/* ========================================================= */
	/* REDES */
	/* ========================================================= */

	.social-container {

		display: flex;

		align-items: center;

		gap: 8px;

	}

	.social-link {

		width: 34px;

		height: 34px;

		border-radius: 50%;

		display: flex;

		align-items: center;

		justify-content: center;

		color: #5BB824;

		background: rgba(91, 184, 36, 0.08);

		transition: all .3s ease;

	}

	.social-link:hover {

		background: rgba(91, 184, 36, 0.18);

		transform: translateY(-2px);

	}

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

	.desktop-nav {

		display: flex;

		align-items: center;

		gap: 24px;

	}

	.desktop-nav a {

		color: #5BB824;

		font-size: .90rem;

		font-weight: 600;

		letter-spacing: .02em;

		transition: .3s ease;

	}

	.desktop-nav a:hover {

		color: #8be249;

	}

	/* ========================================================= */
	/* IDIOMAS */
	/* ========================================================= */

	.language-switch {

		display: flex;

		align-items: center;

		gap: 10px;

		margin-left: 10px;

		padding: 6px 14px;

		border-radius: 999px;

		background: rgba(255,255,255,.08);

		border: 1px solid rgba(91,184,36,.12);

	}

	.lang-button{

		display:flex;

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

		width:36px;
		height:36px;

		padding:0;

		border-radius:50%;

		overflow:hidden;

		transition:.3s;

	}

	.lang-button.active {

		color: #8be249;

	}
	
	
	/*======================================================
	BANDERAS
	======================================================*/

	.lang-button img{

		width:24px;
		height:24px;

		border-radius:50%;

		object-fit:cover;

		display:block;

	}	
	
	

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

	.logo-container {

		position: fixed;

		top: 50px;

		left: 50%;

		transform: translateX(-50%);

		z-index: 49;

	}

	.logo-img {

		height: 125px;

		width: auto;

		object-fit: contain;

		transition: .3s ease;

	}

	.logo-img:hover {

		transform: scale(1.03);

	}

	/* ========================================================= */
	/* HAMBURGUESA */
	/* ========================================================= */

	.menu-toggle{

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

		width:54px;
		height:54px;

		background:#2B323A;   /* Negro de la marca */

		border-radius:50%;

		border:1px solid rgba(91,184,36,.25);

		box-shadow:0 10px 25px rgba(0,0,0,.25);

		transition:.3s;

	}

	.menu-line {

		width: 24px;

		height: 2px;

		border-radius: 999px;

		background: #5BB824;

	}

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

	@media (max-width: 1024px) {

		.logo-container {

			top: 58px;

		}

		.logo-img {

			height: 95px;

		}

	}

	@media (max-width: 768px) {

		.social-container {

			display: none;

		}

		.logo-container {

			top: 55px;

		}

		.logo-img {

			height: 80px;

		}

	}
	
	
	
	
		
	/* ==========================================
	   OCULTAR BARRA SUPERIOR EN MÓVILES
	========================================== */

	@media (max-width: 768px) {

		/* Oculta la barra con redes y menú */

		.nav-shell {

			background: transparent;

			backdrop-filter: none;

			border-bottom: none;

			box-shadow: none;

		}

		.header-top {

			justify-content: flex-end;

			height: 70px;
		}

		/* Oculta las redes */

		.social-container {

			display: none;
		}

		/* Oculta el menú de escritorio */

		.desktop-nav {

			display: none;
		}

		/* Mantiene visible el botón hamburguesa */

		.menu-toggle {

			display: flex;

			background: rgba(255, 255, 255, 0.15);

			backdrop-filter: blur(12px);

		}

		/* Ajusta el logo */

		.logo-container {

			top: 15px;

			left: 24px;

			transform: none;
		}

		.logo-img {

			height: 70px;
		}

	}
	
	
	
	/* ==================================================
	   RESPONSIVE
	================================================== */

	@media (max-width: 768px) {

		.logo-mobile {

			height: 110px;

		}

	}

	@media (max-width: 480px) {

		.logo-mobile {

			height: 95px;

		}

	}






	.lang-button {

		font-size: 0.9rem;

		font-weight: 600;

		transition: .25s ease;

	}

	.lang-button:hover {

		color: var(--green);

	}
	
	
		.lang-button img{

			width:28px;
			height:28px;

			border-radius:50%;
			object-fit:cover;

		}

	

	/* =====================================================
	   HERO PREMIUM AMG
	===================================================== */

	.hero-visual{
		position:relative;
		display:flex;
		align-items:center;
		justify-content:center;
		min-height:100vh;
		overflow:hidden;
	}



	outline: 2px solid red;
	background: rgba(255,0,0,.1);


	/*----------------------------------------------------*/

	.hero-video{
		position:absolute;
		inset:0;
		width:100%;
		height:100%;
		object-fit:cover;
		transform:scale(1.08);
		filter:contrast(1.05) saturate(1.05);
		z-index:0;
	}

	/*----------------------------------------------------*/
	/* Overlay blanco premium */
	/*----------------------------------------------------*/

	.hero-overlay{
		position:absolute;
		inset:0;
		background:rgba(255,255,255,.5);
		backdrop-filter:blur(1px);
		z-index:1;
	}

	/*----------------------------------------------------*/
	/* Gradiente premium */
	/*----------------------------------------------------*/

	.hero-gradient{
		position:absolute;
		inset:0;
		z-index:2;

		background:
			radial-gradient(
				circle at center,
				rgba(255,255,255,.18) 0%,
				rgba(255,255,255,.08) 45%,
				transparent 75%
			),

			linear-gradient(
				180deg,
				rgba(255,255,255,.15) 0%,
				rgba(255,255,255,.05) 40%,
				rgba(255,255,255,.18) 100%
			);
	}

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

	.hero-visual > .relative{

		position:relative;
		z-index:20;

		width:100%;
		max-width:1280px;

		margin:0 auto;

		padding:6rem 2rem;

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

		text-align:center;

	}

	.hero-container{

		width:100%;
		max-width:1280px;

		margin:0 auto;

		padding:0 2rem;

	}

	.hero-content{

		width:100%;

		max-width:1200px;

		margin-inline:auto;

		display:flex;

		flex-direction:column;

		align-items:center;

		justify-content:center;

		text-align:center;

		padding-inline:2rem;

	}

	.hero-content > *{
		width:100%;
		margin-left:auto;
		margin-right:auto;
	}

	.hero-title{
		max-width:1050px;
	}

	.hero-description{
		max-width:820px;
	}

	.hero-visual .mt-12{
		display:flex;
		justify-content:center;
		align-items:center;
	}

	.glass-card{
		display:flex;
		justify-content:center;
		align-items:center;
	}
	.hero-content > *{
		width:100%;
		margin-left:auto;
		margin-right:auto;
	}

	.hero-title{
		max-width:1050px;
	}

	.hero-description{
		max-width:820px;
	}

	.hero-visual .mt-12{
		display:flex;
		justify-content:center;
		align-items:center;
	}

	.glass-card{
		display:flex;
		justify-content:center;
		align-items:center;
	}



	/*======================================================
	BADGE
	======================================================*/

	.hero-badge{

		display:inline-flex;

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

		width:fit-content;
		max-width:min(90vw,700px);

		margin:0 auto 2rem;

		padding:14px 28px;

		border-radius:999px;

		background:rgba(255,255,255,.18);

		border:1px solid rgba(91,184,36,.45);

		backdrop-filter:blur(24px);
		-webkit-backdrop-filter:blur(24px);

		color:#5BB824;

		font-size:clamp(.70rem,1.2vw,.90rem);

		font-weight:800;

		letter-spacing:.12em;

		text-transform:uppercase;

		text-align:center;

		text-shadow:
			0 2px 6px rgba(255,255,255,.55),
			0 1px 2px rgba(0,0,0,.15);

		box-shadow:
			0 12px 35px rgba(0,0,0,.18);

	}
		
	/*======================================================
	BADGE - MÓVIL
	======================================================*/

	@media (max-width:768px){

		.hero-badge{

			max-width:90%;

			padding:12px 20px;

			font-size:.72rem;

			letter-spacing:.08em;

			white-space:normal;

			line-height:1.5;

		}

	}
	
	/*======================================================
	TITULO
	======================================================*/

	.hero-title{

		width:100%;

		max-width:1050px;

		margin:0 auto;

		color:#FFF;

		text-align:center;

		font-size:clamp(3rem,6vw,6rem);

		line-height:1.05;

		letter-spacing:-.03em;

		text-shadow:

			0 3px 8px rgba(0,0,0,.65),
			0 8px 20px rgba(0,0,0,.55),
			0 18px 40px rgba(0,0,0,.35);

			}

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

	.hero-description{

		width:100%;

		max-width:820px;

		margin:2rem auto 0;

		color:rgba(255,255,255,.96);

		text-align:center;

		font-size:1.18rem;

		line-height:2;

		text-shadow:

			0 2px 6px rgba(0,0,0,.65),
			0 8px 18px rgba(0,0,0,.35);

	}

	/*======================================================
	BOTONES
	======================================================*/

	.hero-visual .mt-12{

		width:100%;

		display:flex;

		justify-content:center;

		align-items:center;

		flex-wrap:wrap;

		gap:20px;

	}

	.hero-btn-primary{

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

		gap:10px;

		padding:17px 34px;

		border-radius:999px;

		background:#5BB824;

		color:#FFF;

		font-weight:700;

		text-shadow:0 1px 3px rgba(0,0,0,.35);

		box-shadow:0 15px 35px rgba(91,184,36,.35);

		transition:.35s;

	}

	.hero-btn-primary:hover{

		background:#4FA91E;

		transform:translateY(-5px);

	}

	.hero-btn-secondary{

		display:inline-flex;

		align-items:center;

		justify-content:center;

		gap:10px;

		padding:17px 34px;

		border-radius:999px;

		border:1px solid rgba(255,255,255,.30);

		background:rgba(255,255,255,.18);

		backdrop-filter:blur(20px);

		color:#FFF;

		text-shadow:0 1px 3px rgba(0,0,0,.45);

		transition:.35s;

	}

	.hero-btn-secondary:hover{

		background:rgba(255,255,255,.26);

		transform:translateY(-5px);

	}
	
	
	/*======================================================
	HERO - DASHBOARD
	======================================================*/

	.glass-card{

		width:100%;

		max-width:1152px;

		margin:4rem auto 0;

		display:flex;

		justify-content:center;

		align-items:center;

	}

	/*======================================================
	GRID
	======================================================*/

	.hero-stats{

		width:100%;

		display:grid;

		grid-template-columns:repeat(2,minmax(320px,1fr));

		justify-content:center;

		align-items:stretch;

		gap:24px;

		margin:0 auto;

	}

	/*======================================================
	TARJETAS
	======================================================*/
	.hero-stat-item{

		position:relative;

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

		min-height:190px;

		padding:30px;

		text-align:center;

		border-radius:24px;

		background:rgba(255,255,255,.18);

		border:1px solid rgba(255,255,255,.35);

		backdrop-filter:blur(22px);
		-webkit-backdrop-filter:blur(22px);

		box-shadow:0 18px 40px rgba(0,0,0,.22);

		transition:.35s;

	}

	.hero-stat-item:hover{

		transform:translateY(-8px);

		border-color:#5BB824;

	}

	/*======================================================
	BRILLO
	======================================================*/

	.hero-stat-item::before{

		content:"";

		position:absolute;

		inset:0;

		border-radius:inherit;

		background:linear-gradient(

			180deg,

			rgba(255,255,255,.08),

			transparent 55%

		);

		pointer-events:none;

	}

	/*======================================================
	NUMERO
	======================================================*/

	.hero-stat-item .counter{

		font-size:clamp(2.2rem, 4vw, 4.2rem);

		font-weight:800;

		line-height:1;

		color:#FFF;

		text-shadow:
			0 2px 8px rgba(0,0,0,.60),
			0 10px 20px rgba(0,0,0,.35);

		margin-bottom:12px;

	}

	/*======================================================
	TEXTO
	======================================================*/

	.hero-stat-item span{

		font-size:clamp(.95rem, 1.2vw, 1.15rem);

		font-weight:500;

		line-height:1.5;

		color:rgba(255,255,255,.97);

		text-shadow:
			0 2px 6px rgba(0,0,0,.50);

	}

	/*======================================================
	TABLET
	======================================================*/

	@media (max-width:992px){

		.glass-card{

			max-width:760px;

		}

		.hero-stats{

			grid-template-columns:repeat(2,1fr);

			gap:20px;

		}

		.hero-stat-item{

			min-height:170px;

			padding:26px;

		}

		.hero-stat-item .counter{

			font-size:2.3rem;

		}

	}

	/*======================================================
	MOVIL
	======================================================*/

	@media (max-width:768px){

		.glass-card{

			max-width:430px;

			margin-top:2.5rem;

		}

		.hero-stats{

			grid-template-columns:1fr;

			gap:18px;

		}

		.hero-stat-item{

			min-height:150px;

		}

		.hero-stat-item .counter{

			font-size:2.2rem;

		}

	}

	/*======================================================
	MOVIL PEQUEÑO
	======================================================*/

	@media (max-width:480px){

		.glass-card{

			padding:0 12px;

		}

		.hero-stat-item{

			padding:22px;

		}

		.hero-stat-item span{

			font-size:.78rem;

		}

	}

	/*======================================================
	CAPAS
	======================================================*/

	.hero-video{

		z-index:0;

	}

	.hero-overlay{

		z-index:1;

	}

	.hero-gradient{

		z-index:2;

	}


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

	@media (max-width: 992px){

		.hero-stats{

			width:100%;

			max-width:980px;

			margin:0 auto;

			display:grid;

			grid-template-columns:repeat(2,minmax(320px,1fr));

			justify-content:center;

			align-content:center;

			gap:22px;

		}

	@media(max-width:768px){

	.hero-stats{

	grid-template-columns:1fr;

	max-width:460px;

	}

	}

		.hero-stats{

			grid-template-columns:1fr;
			gap:18px;

		}

		.hero-stat-item{

			width:100%;
			max-width:100%;
			min-height:150px;

		}

	}

	@media (max-width:480px){

		.glass-card{

			padding:0 16px;

		}

		.hero-stat-item{

			padding:24px 18px;

		}

	}

	  /* ==================================================
		 ANIMACIONES
	  ================================================== */

	  .reveal {

		opacity: 1;

		transform: translateY(0);

		transition: opacity .75s ease,
					transform .75s ease;

	  }

	  .reveal.is-visible {

		opacity: 1;

		transform: translateY(0);

	  }

	  @keyframes float {

		0%, 100% {

		  transform: translateY(0);

		}

		50% {

		  transform: translateY(-16px);

		}

	  }

	  /* ==================================================
		 MAPA
	  ================================================== */

	  .map-frame {

		width: 100%;

		min-height: 470px;

		border: 0;

		border-radius: var(--radius-md);

		filter: grayscale(.08);

		overflow: hidden;

	  }

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

	  @media (max-width: 1024px) {

		.hero-visual::after {

		  background: linear-gradient(
			90deg,
			rgba(29, 39, 30, 0.90),
			rgba(29, 39, 30, 0.55)
		  );

		}

		.social-link {

		  width: 38px;

		  height: 38px;

		}

		.nav-logo img {

		  height: 44px;

		}

	  }



	/* ========================================================= */
	/* WHATSAPP */
	/* ========================================================= */

	  
	.whatsapp-float{

		position:fixed;

		right:25px;

		bottom:60px;

		width:64px;
		height:64px;

		border-radius:50%;

		background:#25D366;

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

		color:#fff;

		font-size:34px;

		text-decoration:none;

		z-index:9999;

		box-shadow:0 10px 25px rgba(0,0,0,.25);

		animation:pulseButton 1.8s infinite;

		transition:.3s;

	}

	.whatsapp-float:hover{

		background:#20c05c;

	}

	.whatsapp-float::before{

		content:"";

		position:absolute;

		inset:-8px;

		border-radius:50%;

		border:2px solid rgba(37,211,102,.45);

		animation:whatsappPulse 2s infinite;

	}

	.whatsapp-tooltip{

		position:absolute;

		right:78px;

		background:#fff;

		color:#333;

		padding:12px 18px;

		border-radius:30px;

		white-space:nowrap;

		font-size:.9rem;

		font-weight:500;

		box-shadow:0 8px 25px rgba(0,0,0,.18);

		animation:tooltipFloat 3s infinite;

	}

	.whatsapp-tooltip::after{

		content:"";

		position:absolute;

		right:-8px;

		top:50%;

		transform:translateY(-50%);

		border:8px solid transparent;

		border-left-color:#fff;

	}

	@keyframes whatsappPulse{

		0%{

			transform:scale(.9);

			opacity:1;

		}

		100%{

			transform:scale(1.6);

			opacity:0;

		}

	}

	@keyframes whatsappBounce{

		0%,100%{

			transform:translateY(0);

		}

		8%{

			transform:translateY(-10px);

		}

		14%{

			transform:translateY(0);

		}

		20%{

			transform:translateY(-5px);

		}

	}

	@keyframes tooltipFloat{

		0%,100%{

			transform:translateX(0);

		}

		50%{

			transform:translateX(-3px);

		}

	}

	@media (max-width:768px){

		.whatsapp-float{

			width:58px;
			height:58px;

			right:18px;
			bottom:60px;

			font-size:30px;

		}

		.whatsapp-tooltip{

			display:block;

			right:0;

			bottom:72px;

			width:210px;

			white-space:normal;

			padding:12px 16px;

			border-radius:18px;

			font-size:.82rem;

			line-height:1.3;

		}

		.whatsapp-tooltip::after{

			top:100%;

			right:24px;

			transform:none;

			border:8px solid transparent;

			border-top-color:#fff;

		}

	}	
	@keyframes pulseButton{

		0%{
			transform:scale(1);
			box-shadow:0 0 0 0 rgba(37,211,102,.55);
		}

		50%{
			transform:scale(1.12);
			box-shadow:0 0 0 18px rgba(37,211,102,0);
		}

		100%{
			transform:scale(1);
			box-shadow:0 0 0 0 rgba(37,211,102,0);
		}

	}
	
	



	/* =====================================
	   FILTROS DE TRATAMIENTOS
	===================================== */

	.treatment-button {

		transition:
			all .35s ease;

		color:white;

		background:transparent;

	}


	.treatment-button:hover {

		background:rgba(183,243,145,.12);

		border-color:#b7f391;

		transform:translateY(-2px);

	}



	.treatment-button.active {

		background:#5BB824;

		color:#ffffff;

		border-color:#5BB824;

		box-shadow:
			0 10px 25px rgba(91,184,36,.35);

		transform:translateY(-2px);

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

	#clinic-slider{

		will-change:transform;

	}

	.clinic-dot{

		width:12px;

		height:12px;

		border-radius:50%;

		background:rgba(255,255,255,.45);

		transition:.35s;

	}

	.clinic-dot.active{

		width:36px;

		border-radius:999px;

		background:#5BB824;

	}

	#clinic-prev,
	#clinic-next{

		backdrop-filter:blur(12px);

	}

	#clinic-prev:hover,
	#clinic-next:hover{

		background:#5BB824;

	}

	#clinic-prev:hover i,
	#clinic-next:hover i{

		color:white;

	}
	
	#clinic-slider{
		display:flex;
		width:100%;
		will-change:transform;
	}

	#clinic-slider > div{
		flex:0 0 100%;
	}
	
	#clinic-slider img{
			display:block;
	}