/*
Theme Name: Nayla Child
Description: Child theme for the Nayla. Child themes are the recommended way of making modifications to a theme. <a href="http://codex.wordpress.org/Child_Themes">Read More</a>
Author: PeThemes
Author URI: http://pethemes.site
Template: nayla
*/


/* =Theme customization starts here
-------------------------------------------------------------- */

:root {
	--font-nav: clamp(2rem, 5vw, 4rem);
	--font-lh-nav: clamp(1.6rem, 2.564rem + 2.18vw, 5rem);
	--font-s-h1: clamp(1.1rem, 2rem + 2.18vw, 3.9rem);
	--font-lh-h1: clamp(1.6rem, 2.500rem + 2.18vw, 4rem);
	--font-s-h2: clamp(1.1rem, 1.9rem + 2.18vw, 3.3rem);
	--font-lh-h2: clamp(1.6rem, 2.5rem + 2.18vw, 4rem);
	--font-s-h3: clamp(1.1rem, 1.9rem + 2.18vw, 3.3rem);
	--font-lh-h3: clamp(1.6rem, 1.9rem + 2.18vw, 3.3rem);
	--font-s-destacado: clamp(1.1rem, 1.7rem + 2.18vw, 3rem);
	--font-lh-destacado: clamp(1.6rem, 1.9rem + 2.18vw, 3.3rem);
	--font-s-p: clamp(1.3rem, 2.564rem + 2.18vw, .63rem);
	--font-lh-p: clamp(1.6rem, 2.564rem + 2.18vw, 2rem);
	--font-s-text-h: clamp(1.3rem, 2.564rem + 2.18vw, 1.8rem);
	--color-deg-azul: linear-gradient(45deg, #3F5E6B , #88A3B3 100%);
}

[tabindex="-1"]:focus {
  outline: 0 !important;
}
/*
@media (min-width: 680px) {
    :root {
		--font-s-h1-tabs: clamp(2.5rem, 0.564rem + 2.18vw, 4.5rem);
        --font-s-h2: clamp(1.3rem, 0.564rem + 2.18vw, 3rem);
		--font-s-h2-tabs: clamp(1rem, 0.564rem + 2.18vw, 4rem);
		--font-menu: clamp(1rem, 0.564rem + 2.18vw, 4rem);
        --font-s-nav: 1.1111111111vw;
        --font-lh-nav: 3.9000vw;
		--circle-img: calc(8.33333vw - .08333rem);
    }
	.fullscreen_menu ul.menu.main-menu li {
		font-size: var(--font-menu)!important;
		line-height: var(--font-lh-nav)!important;
	}
}
@media (max-width:679px) {
	:root {
		--font-s-menu: clamp(.6rem, 0.564rem + 2.18vw, 4rem);
        --font-ls-nav: 0vw;
	}
	.fullscreen_menu ul.menu.main-menu li {
		font-size: var(--font-s-menu)!important;
		line-height: var(--font-ls-nav)!important;
	}
}
*/

/* Encabezados y Textos */


h1,h2,h3,h4 {
	font-family: 'Quicksand', sans-serif!important;
	font-weight: 600;
	color: #3F5E6B;
	background-image: linear-gradient(45deg, #3F5E6B , #88A3B3 100%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	display: inline-block;
	letter-spacing: -1.5px!important;
}
h1 {
	font-size: var(--font-s-h1)!important;
	line-height: var(--font-lh-h1)!important;
}
h2 {
	font-size: var(--font-s-h2)!important;
	line-height: var(--font-lh-h2)!important;
}
h3,.text-h3 {
	font-size: var(--font-s-h3)!important;
	line-height: var(--font-lh-h3)!important;
	font-weight: 600!important;
}
p {
	font-family: 'Roboto', sans-serif!important;
	font-size: var(--font-s-p)!important;
	font-weight: 300!important;
	line-height: var(--font-lh-p)!important;
}
.white h1,.white h2,.white h3 {
	color: #FFF!important;
	background-image: none!important;
	background-clip: unset!important;
	-webkit-background-clip: unset!important;
	-webkit-text-fill-color: #FFF!important;
}

.white h3 {
	font-size: var(--font-s-destacado)!important;
	line-height: var(--font-lh-destacado)!important;
	font-weight: 600!important;
}
.text-h2,.text-h3,.text-h4 {
	font-family: 'Quicksand', sans-serif!important;
	font-size: var(--font-s-text-h)!important;
    color: #88A3B7;
}
.small-black .text-h2 {
	font-size: 16px !important;
    font-weight: 500 !important;
    letter-spacing: .1px;
    color: #2e2d2c;
}
.partners img {
	width: 100%;
	max-width: 250px;
}

.bg-blue-move {
	background: #1F8199;
	background: radial-gradient(ellipse farthest-corner at center center, #1f8199 0%, #1f8199 50%, #087690 75%, #0894b5 100%);
  	background-size: 300% 300%;
	-webkit-animation: circle infinite 3s linear;
        -moz-animation: circle infinite 3s linear;
            -o-animation: circle infinite 3s linear;
                animation: circle infinite 3s linear;
}
.bg-orange-move {
	background: #C95940;
	background: radial-gradient(ellipse farthest-corner at center center, #C95940 0%, #F08062 48%, #F49F85 100%);
	background-size: 240% 240%;
	-webkit-animation: circle infinite 10s linear;
        -moz-animation: circle infinite 10s linear;
            -o-animation: circle infinite 10s linear;
                animation: circle infinite 10s linear;
}
.bg-lila-move {
	background: #4E4E87;
	background: radial-gradient(ellipse farthest-corner at center center, #4E4E87 0%, #7876B6 48%, #9E98CA 100%);
	background-size: 350% 350%;
	-webkit-animation: circle infinite 10s linear;
        -moz-animation: circle infinite 10s linear;
            -o-animation: circle infinite 10s linear;
                animation: circle infinite 10s linear;
}
.bg-blue-move::before {
	animation: background-anim infinite 13s linear;
}
.bg-orange-move::before,
.bg-lila-move::before {
	animation: background-anim infinite 7s linear;
}
.bg-blue-move,
.bg-orange-move,
.bg-lila-move {
	cursor:pointer!important;
}
.bg-blue-move .arrow svg#Capa_1,
.bg-orange-move .arrow svg#Capa_1,
.bg-lila-move .arrow svg#Capa_1 {
	transition: 0.5s ease;
}
.bg-blue-move:hover .arrow svg#Capa_1,
.bg-orange-move:hover .arrow svg#Capa_1,
.bg-lila-move:hover .arrow svg#Capa_1 {
	transition: 0.5s ease;
	transform: rotate(-45deg);
	transform-origin: center center;
}
.bg-bam {
	background: #98aab5;
	background: linear-gradient(45deg, #5f707b 0%, #8899a4 25%, #52646d 50%, #50616d 75%, #98aab5 100%);
  	background-size: 500% 500%;
	-webkit-animation: circle infinite 30s linear;
        -moz-animation: circle infinite 30s linear;
            -o-animation: circle infinite 30s linear;
                animation: circle infinite 30s linear;
}
.bg-blur {
	-webkit-backdrop-filter: blur(5px);
	backdrop-filter: blur(5px);
}
.bg-saturate {
	-webkit-backdrop-filter: saturate(0.4);
	filter: saturate(0.4);
}

/* Botones */

.bam-buttom a,
.join-bam a {
	display: inline-block;
    position: relative;
    margin: 1rem 0rem;
    padding: 1rem 4rem 1rem 2rem;
    border-radius: 3rem;
    font-family: 'Quicksand', sans-serif;
    border-width: 1px;
	border-style: solid;
	border-image: linear-gradient(45deg, #3F5E6B , #88A3B3) 3em;
    font-size: 1rem;
    font-weight: 600;
    background-color: transparent;
    color: #3F5E6B !important;
	overflow: hidden;
	transition: 0.5s ease;
}
.join-bam a {
    margin: 0;
    padding: .7rem 1rem;
	color: #88A3B3!important;
    border: 1px solid #88A3B3;
	border-image: none;
}
.bam-buttom a:hover,
.join-bam a:hover {
	color: #fff!important;
}
.bam-buttom a span::after {
	content: "";
	background-image: url(/public/wp-content/uploads/2025/10/arrow-bam-blue.svg);
    background-size: auto;
    background-position: 3px 0px;
    background-repeat: no-repeat;
    position: absolute;
    margin-top: 3px;
    right: 1rem;
    width: 30px;
    height: 13px;
	transition: 0.5s ease;
}
.bam-buttom a:hover span::after {
	content: "";
	background-image: url(/public/wp-content/uploads/2025/09/arrow-bam.svg);
    margin-top: -1px;
    right: 1rem;
    width: 30px;
    height: 13px;
    transform: rotate(314deg);
	transform-origin: center center;
}
.bam-buttom a::before,
.join-bam a::before {
	content: "";
    display: block;
    position: absolute;
    top: 0!important;
    left: 0!important;
    height: 100%!important;
    width: 0%!important;
    background: var(--color-deg-azul)!important;
    z-index: -1;
    -webkit-transition: width .3s ease-out!important;
    -o-transition: width .3s ease-out!important;
    transition: width .3s ease-out!important;
}
.bam-buttom a:hover::before,
.join-bam a:hover::before {
	right: 100%!important;
	width: 100%!important;
}
.bam-buttom-white a {
	display: inline-block;
    position: relative;
    margin: 1rem 0rem;
    padding: 1rem 4rem 1rem 2rem;
    border-radius: 3rem;
    font-family: 'Quicksand', sans-serif;
    border: 1px solid #FFF;
    font-size: 1rem;
    font-weight: 600;
    background-color: transparent;
    color: #FFF;
	overflow: hidden;
	transition: 0.5s ease;
}
.bam-buttom-white a:before {
	content: "";
	display: block;
	position: absolute;
	top: 0!important;
	left: 0!important;
	height: 100%!important;
	width: 0%!important;
	background: white;
	z-index: -1;
	-webkit-transition: width .3s ease-out!important;
	-o-transition: width .3s ease-out!important;
	transition: width .3s ease-out!important;
}
.bam-buttom-white a span:after {
	content: "";
	background-image: url(/public/wp-content/uploads/2025/09/arrow-bam.svg);
	background-size: auto;
	background-position: 3px 0px;
	background-repeat: no-repeat;
	position: absolute;
	margin-top: 3px;
	right: 1rem;
	width: 30px;
	height: 13px;
	transition: 0.5s ease;
}
.bam-buttom-white a:hover {
	color: #3F5E6B!important;
}
.bam-buttom-white a:hover span::after {
	content: "";
	background-image: url(/public/wp-content/uploads/2025/10/arrow-bam-blue.svg);
	margin-top: -1px;
	right: 1rem;
	width: 30px;
	height: 13px;
	transform: rotate(314deg);
	transform-origin: center center;
}
.bam-buttom-white a:hover::before {
	right: 100%!important;
	width: 100%!important;
}

/* Animaciones */


@keyframes textShine {
	0% {
		background-position: 0% 50%;
	}
	100% {
		background-position: 100% 50%;
	}
}

@keyframes circle {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

@keyframes background-anim {
  0% {
    background-position: 90% -3%;
	opacity: .7;
  }
  50% {
    background-position: 90% 5%;
	opacity: 1;
  }
  100% {
    background-position: 90% -3%;
	opacity: .7;
  }
}
@media (max-width: 480px) {
	@keyframes background-anim {
	  0% {
		background-position: 90% 22%;
		opacity: .7;
	  }
	  50% {
		background-position: 90% 30%;
		opacity: 1;
	  }
	  100% {
		background-position: 90% 22%;
		opacity: .7;
	  }
	}
}

/* MENU */

.fullscreen_menu ul.menu.main-menu li::before {
	background-color:transparent!important;
}
.fullscreen_menu ul.menu.main-menu li {
	font-family: 'Quicksand', sans-serif!important;
	font-size: var(--font-nav)!important;
	line-height: var(--font-lh-nav)!important;
	text-transform: none!important;
}
.site-header .menu-toggle .toggle-line, .site-header.sticky.sticked .toggle-line {
	background-color: #000!important;
}
.menu-toggle.has-underline.active .toggle-lines>.toggle-line {
	background-color: #FFF!important;
}
.site-header.sticky.sticked {
	backdrop-filter: blur(10px)!important;
}
.sticky-logo img, .site-logo img {
    width: auto!important;
    max-width: 110px!important;
    height: auto!important;
	
	@media (max-width: 480px) {
    	max-width: 90px!important;
	}
}
.sub-menu-wrapper {
	width: 100%!important;
	justify-content: center!important;
}
#site-navigation.fullscreen_menu ul.sub-menu {
	margin-right: 0px;
}
#site-navigation.fullscreen_menu span.material-icons {
	display: none;
}
#site-navigation.fullscreen_menu span.sub-close {
	-webkit-transform: translateX(0px) translateY(-25px) rotate(0deg);
    -ms-transform: translateX(0px) translateY(-25px) rotate(0deg);
    transform: translateX(0px) translateY(-25px) rotate(0deg);
}
#site-navigation.fullscreen_menu span.sub-close.active {
	content:"";
	background-image: url(/public/wp-content/uploads/2025/09/arrow-bam.svg);
	background-repeat: no-repeat;
	width: 20px;
	height: 20px;
	opacity:1;
	-webkit-transform: translateX(0px) translateY(-25px) rotate(180deg);
    -ms-transform: translateX(0px) translateY(-25px) rotate(180deg);
    transform: translateX(0px) translateY(-25px) rotate(180deg);
}


/* FOOTER */

footer .copy p {
	font-size: 15px!important;
}