/*
Theme Name: Uncode Child
Description: Child theme for Uncode theme
Author: Undsgn™
Author URI: http://www.undsgn.com
Template: uncode
Version: 1.0.0
Text Domain: uncode
*/

:root{
	--olive: #546B69;
}
/* Selector de Idioma */
.lang-select{
	display: inline-block;
	margin-right: 15px;
}
.custom-lang-selector {
    display: inline-block;
    border: none;
    select{
		cursor: pointer;
		text-transform: uppercase;
        border: none;
        color: white;
        background-color: transparent;
		appearance: none !important;
    	-webkit-appearance: none !important;
    	-moz-appearance: none !important;
		&:not([multiple]){
			background-image: none;
		}
    }
}
/* boton de reserva */
.btn-color-xsdn.btn-color-xsdn.btn-color-xsdn.btn-color-xsdn.btn-color-xsdn:hover{
	color: var(--olive) !important;
}

#masthead{
	.row-menu-inner{
		@media ( width < 960px){
			display: flex;
			justify-content: center;
			align-items: center;
		}
	}
	#logo-container-mobile{
		@media ( width < 960px){
			padding-top: 40px !important;
		}
	}
	.menu-horizontal-inner{
		@media ( width < 960px){
			padding: 0;
		}
	}
	.main-menu-container{
		@media ( width < 960px){
			height: auto;
			width: auto;
			position: absolute;
			right: 0;
			top: -3px;
		}
	}
	.menu-item-790{
		a{
			padding: 0;
			font-size: 0 !important;
		}
		.fa-angle-right{
			display: none;
		}
		.menu-icon{
			&::before{
				display: block;
				width: 30px;
				height: 30px;
				background-position: center center;
				background-size: cover;
				background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzMiIGhlaWdodD0iMzMiIHZpZXdCb3g9IjAgMCAzMyAzMyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTI0LjAwNzMgOC4wMDAxNUw4IDI0LjAwNzQiIHN0cm9rZT0iIzIzMUYyMCIvPgo8cGF0aCBkPSJNOC4wMDA0MyA4LjAwNjcxTDI0LjAwNzcgMjQuMDE0IiBzdHJva2U9IiMyMzFGMjAiLz4KPC9zdmc+Cg==);
			}
		}
	}
}
p{
	line-height: 1.5;
	@media (width < 540px){
		font-size: 14px;
		line-height: 1.429;
	}
}

.text-balanced{
	text-wrap: balance;
}

h3:not([class*="fontsize-"]), .h3:not([class*="fontsize-"]) {
	@media (max-width: 959px) {
        font-size: 36px;
		line-height: 1;
    }
}

/*
.text-small{
	font-size: 12px;
	> * {
		font-size: inherit;
		line-height: inherit;
	}
	@media (width < 540px){
		font-size: 10px;
		line-height: 1.2;
	}
}
*/

.hero-home-desktop{
	.auto-height-device{
		@media (1200px < width < 1500px){
			height: 685px !important;
		}
	}
}
.hero-logo-mobile{ transform: translateY(-40px)}
.mmb-container{ display: none;}
#page-header .col-lg-4{ position: absolute !important; right: -36px; top: -15px; padding: 0}
.btn-flat.custom-link.button-close{
	background-color: white !important;
    color: black !important;
    border: none;
	i{
		margin: 0;
		font-size: 30px;
	}
	&:hover{
		background-color: white !important;
		color: black !important;
	}
}

footer{
	a{
		display: inline-block;
		margin: 5px 3px;
		color: white !important;
		&:hover{
			text-decoration: underline;
		}
	}
}

/* para que funcionen los scroll driven animations with css */

.box-wrapper{
	overflow: visible !important;
}

/* ------------------------------------------- */
/* 1. KEYFRAMES: DEFINICIÓN DE ANIMACIONES */
/* ------------------------------------------- */

/* Animación Base: Zoom In (para escritorio) */
@keyframes zoomIn {
	from {
		opacity: 0;
		transform: scale(1.5);
	}
	to {
		opacity: 1;
		transform: scale(1);
	}
}

/* Animación Móvil: Desplazamiento Vertical (TranslateY) */
@keyframes fadeInSlideMobile {
	from {
		opacity: 0;
		transform: translateY(100px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* ------------------------------------------- */
/* 2. CLASE PRINCIPAL: APLICACIÓN Y RESPONSIVIDAD */
/* ------------------------------------------- */

.scroll-reveal-zoom {
    /* ESTADO INICIAL (Base para la animación Zoom In) */
    opacity: 0;
    transform: scale(1.5); /* Usamos el 'from' de zoomIn aquí */

    /* CONFIGURACIÓN SCROLL-DRIVEN (Común a ambas animaciones) */
    animation-duration: 0.5s;
    animation-timing-function: ease-out;
    animation-fill-mode: forwards;
    animation-timeline: view();
    animation-range: entry 25% cover 50%;
    
    /* POR DEFECTO: Aplica la animación de escritorio */
    animation-name: zoomIn;
}


/* RESPONSIVIDAD: SOBREESCRIBE LA ANIMACIÓN EN MÓVILES */
@media (max-width: 1441px) {
	.scroll-reveal-zoom {
        /* Sobreescribe el estado inicial para la nueva animación */
        transform: translateY(100px);
        
        /* Aplica la animación de desplazamiento vertical */
		animation-name: fadeInSlideMobile;
	}
}


/* 3. CLASE MODIFICADORA (Elemento Final) */

/* Clase para corregir la animación del último bloque cerca del footer */
.scroll-reveal-zoom.scroll-reveal-zoom--end {
    /* Ajusta el rango para que la animación termine antes */
    animation-range: entry 0% cover 5%;
    /* Opcional: Aumentar la duración en este caso para suavizar */
    animation-duration: 1s; 
}




.delay-2 {
    animation-delay: 0.3s; 
}


.delay-3 {
    animation-delay: 0.5s;
}

.break-for-mobile{
	display: block;
	@media (width > 1360px),(width < 912px){
		display: none;
	}
}

#section-unique-5{
	.background-inner{
		@media (width < 1600px){
			background-size: 90% auto !important;
		}
		@media (width < 768px){
			background-size: 180% auto !important;
		}
		@media (width < 540px){
			background-size: 220% auto !important;
		}
		
	}
}


.link-opacity{
	transition: opacity 300ms;
	&:hover{
		opacity: 0.7;
	}
}


.btn-color-748864.btn-outline:not(.btn-hover-nobg):not(.btn-text-skin):not(.icon-animated):hover{
	color: #F4C780 !important;
}

.mt-sm{
	margin-top: 20px !important;
}

@media (max-width: 959px) {
    .fontsize-178671-custom {
        font-size: 32px;
    }
}

@media (max-width: 959px) {
    footer .break-for-mobile {
		margin-top: 10px;
        display: block;
    }
}


.btn-directions{
	border: solid 1px #556c69;
	padding: 16px 39px;
	display: inline-block;
	font-weight: 700 !important;
	font-size: 15px;
	border-radius: 2px;
	&:hover{
		background-color: #556c69;
		color: #F4C780 !important;
	}
}