
:root{
    --blanco : #ffffff;
    /* --rojo : #DB0000; */
    --rojo: #ff0000;
    --rojo2 : #C20202;
    --negro : #2C2C2C;
    --negro2: #515151;
    --verde: #5DA494;
    --gris : #898989; 
    --gris-card-background: #E4E4E4;
    --gris-background: #EEEEEE;
}
*{font-family: "Onest", sans-serif; font-optical-sizing: auto;font-style: normal;color:var(--negro);}
body{background-color: var(--gris-background);}
.container{max-width: 1280px;width:90%; position: relative; margin: 0 auto; padding: 0 20px;box-sizing: border-box; }

header{position: absolute;top:0;left: 0;height: 10vh;width: 100%;}
header img{max-width:327px;}
header .container{display: grid;justify-content: end;justify-items: center;padding:50px 0;}

section{padding:100px 0;}

.btn{display:inline-block; text-decoration: none; background-color: var(--rojo);padding:15px 30px;will-change: background-position;background-size: 210% 100%;background-position: 99% center;background-repeat: no-repeat;
-webkit-transition: background-position .66667s cubic-bezier(.24,.22,.31,1.07);transition: background-position .66667s cubic-bezier(.24,.22,.31,1.07);
background-image: linear-gradient(100deg, var(--rojo2) 50%, var(--rojo)  50%);
}
.btn span{color:var(--blanco);font-size: 1.2rem;font-weight: 600;}
.btn:hover {background-position: 0 center;cursor:pointer;}
.btn:disabled{opacity: .5;touch-action: none;pointer-events: none;}


section .one-half{max-width:50%;}
@media only screen and (max-width: 1280px) {section .one-half{max-width:50%;}}
@media only screen and (max-width: 1080px) {section .one-half{max-width:60%;}}
@media only screen and (max-width:  990px) {section .one-half{max-width:70%;}}
@media only screen and (max-width:  768px) {section .one-half{max-width:90%;}}
@media only screen and (max-width:  460px) {section .one-half{max-width:100%;}}

section .eight{max-width:80%;}
@media only screen and (max-width:  768px) {section .eight{max-width:90%;}}
@media only screen and (max-width:  460px) {section .eight{max-width:100%;}}

section .third{width:30%;}

/*aviso privacidad*/
section#first.aviso{background-size: contain;  background-position: 0 0; background-repeat: no-repeat;}
section#first.aviso .text-container{margin:0 0 50px 0;}

section#first{min-height:50vh; padding-top:150px; background-position:center; background-image: url(../assets/SUB-EVOKE-LANDING-background-smaller.png);background-size: cover; background-position: center;transition: 300ms background-position ease-in-out ;}
@media only screen and (max-width:  768px) {section#first{background-position:80% 0;}}
@media only screen and (max-width:  460px) {section#first{background-position:90% 0;}}
section#first h1{font-size:3rem;font-weight: 900;}
section#first h1 span{color: var(--rojo);text-transform: uppercase;line-height: 5rem; background-color: var(--blanco);padding:0 6px;-webkit-box-decoration-break: clone;box-decoration-break: clone;}
section#first .text-container{background-color: var(--gris-background); padding:20px 6px; margin:50px 0;}
section#first .text-container h2{font-size: 1.5rem;font-weight: 800;line-height: 2rem;}
section#first .text-container p{font-size: 1rem;margin:20px 0 0 0;line-height: 2rem;}


/* @media only screen and (max-width: 1280px) {section#first h1{font-size:2.5rem;}} */
/* @media only screen and (max-width: 1080px) {section#first h1{font-size:2rem;}} */
/* @media only screen and (max-width:  990px) {section#first h1{font-size:2rem;line-height: 1.5rem;}} */
@media only screen and (max-width:  768px) {section#first h1{font-size:2rem;}   section#first h1 span{line-height: 3.5rem;}}
@media only screen and (max-width:  460px) {section#first h1{font-size:1.5rem;} section#first h1 span{line-height: 2.5rem;}}

@media only screen and (max-width:  768px) {section#first .text-container h2{font-size: 1.5rem;} section#first .text-container p{font-size: 1rem;line-height: 1.5rem;} }
@media only screen and (max-width:  460px) {section#first .text-container h2{font-size: 1.2rem;} }    


section#clientes{text-align: center;padding:50px 0 ;background: rgb(238,238,238);
    background: linear-gradient(180deg, rgba(238,238,238,1) 0%, rgba(255,255,255,1) 50%, rgba(238,238,238,1) 100%);}
section#clientes .row{display: flex;flex-direction: row;flex-wrap: wrap;justify-content:center;grid-gap:25px;}
section#clientes .row img{max-width: 180px;}


section#cards{padding:0;}
section#cards .row{display:flex; flex-direction: row;flex-wrap: wrap;justify-content:center;grid-gap:20px;grid-auto-rows: 1fr;}
section#cards .row .third{flex-basis: 30%;box-sizing: border-box;}
section#cards .row .card{height:100%; width:calc(100% - 40px);display: grid;grid-template-rows: 70px 115px 1fr; border-bottom: 1px solid var(--rojo);background-color: var(--gris-card-background);padding:20px;}
section#cards .row .card .grid{text-align: right;height: 100%; }
section#cards .row .card .grid img{max-width: 40px;}
section#cards .row .card .title-container{display: grid;align-items: end;}
section#cards .row .card h3{font-size:2rem;color:var(--negro2);font-weight: 700;position: relative;}
section#cards .row .card h3:after{content:'-';position: absolute;bottom:-35px;left:0;}
section#cards .row .card .text-container{padding-top:45px;}
section#cards .row .card .text-container p{font-size: 1.1rem;padding-bottom:15px;line-height: 2rem;}

@media only screen and (max-width:  990px) { section#cards .row .card h3{font-size:1.5rem;}}
@media only screen and (max-width:  768px) {section#cards .row .third{flex-basis: 100%;max-width: 460px;margin: 25px auto;}  section#cards .row .card h3{font-size: 2rem;;} }
@media only screen and (max-width:  360px) {section#cards .row .card h3{font-size:1.5rem;} section#cards .row .card .text-container p{font-size: 1rem;} }


section#testimonios{background: radial-gradient(circle, rgba(93,164,148,0.2) 0%, rgba(238,238,238,1) 50%);}
section#testimonios p.title{text-align: center;color:var(--verde);margin:50px auto;}
section#testimonios .card-testimonial{width: 70%; margin:0 auto; display: grid;grid-template-columns: 80px 5fr;grid-gap:20px;}
section#testimonios .card-testimonial .text-container{font-weight: 600;font-size: 1.1rem;}
section#testimonios .card-testimonial .text-container p{margin:20px 0;color:var(--negro2);line-height: 2rem;}
section#testimonios .card-testimonial .nombre-container{display: grid;grid-template-columns: 1fr 3fr;margin:50px 0 0 0;align-items:center;grid-gap:20px;padding-bottom:5px;}
section#testimonios .card-testimonial .nombre-container h5{color:var(--verde);font-size: 1.5rem;margin-bottom:15px;}
section#testimonios .card-testimonial .nombre-container p{color:var(--negro2);font-size: 1.2rem;font-weight: 300;}
.glider-prev img{transform: scale(.5) rotate(0);}
.glider-next img{transform: scale(.5) rotate(180deg);}
@media only screen and (max-width:  768px) {
    section#testimonios .card-testimonial{grid-template-columns: 1fr;width:90%;}
    section#testimonios .card-testimonial img{margin:0 auto;}
    section#testimonios .card-testimonial .nombre-container{grid-template-columns: 1fr;text-align: center;}
}


section#cta-final{background-color: var(--blanco);text-align: center;}
section#cta-final .row{width:250px;margin:0 auto;display: grid;grid-template-columns: repeat(5,1fr);grid-gap: 5px;    justify-items: center;align-items: center;}
section#cta-final h2{color:var(--negro2);font-size: 2rem;margin:30px auto;width:60%;line-height: 2.5rem;}
section#cta-final form{box-shadow:1px 1px 100px rgba(93,164,148,0.2); max-width: 360px;padding:30px;margin:0 auto;}
section#cta-final form input[type="text"],
section#cta-final form input[type="email"]{font-size:1.2rem; width: calc(100% - 42px);padding:10px 20px;border:1px solid var(--gris);background-color: var(--blanco);margin:10px 0;}
section#cta-final form select{font-size:1.2rem; width: 100%;padding:10px 20px;border:1px solid var(--gris);background-color: var(--blanco);margin:10px 0;}
section#cta-final form textarea{font-size:1.2rem; width: calc(100% - 42px); height:100px; padding:10px 20px;border:1px solid var(--gris);background-color: var(--blanco);margin:10px 0;resize:none;}
section#cta-final form button{border:0;margin-top:20px;}
section#cta-final form input[name="response"]{text-align: center; margin-top:25px;font-size:.9rem;color:var(--gris);border:0;background-color: transparent;display: block;width:100%;touch-action: none;pointer-events: none;}


@media only screen and (max-width:  768px) {
    section#cta-final h2{font-size: 1.5rem;width:90%;}
    section#cta-final form select{font-size: 1rem;}
}

.whatsapp{position: fixed;bottom:10px;right:10px;width:50px;height:50px;padding:10px 12px 18px 15px;border-radius: 100px;z-index: 100;background-color: var(--blanco);}
.whatsapp svg{fill:var(--verde);}

.grecaptcha-badge{bottom:100px !important;}

footer .container{display: grid;grid-template-columns: 1fr 5fr 2fr;justify-items: start;align-items: center;color:var(--rojo)}
footer .container p,
footer .container a{color:var(--rojo);}
@media only screen and (max-width:  768px) {
    footer{padding:30px 0;}
    footer .container{grid-template-columns: 1fr;justify-items: center;grid-gap:20px;}
    footer .container p, footer .container a{text-align: center;}
}

@media only screen and (max-width:  460px) {
    footer .container p, footer .container a{font-size: .8rem;}
}