:root{
    --blanco: #fff;
    --beis: #FBF3E6;
    --alternative: #f0f0f0;
    --negro: #000;
    --oscuro: #111111;
    --gris: #5c5c5c;
    --primario: #E1C699;
    --primarioOscuro: #BEA27B;
    --primarioMoreOscuro: #a38a67;
    --secundario: #EEEBE4;
    --secundarioOscuro: #dad7d2;
    /* --ftMain: 'Montserrat', sans-serif; */
    --ftText: 'Questrial', sans-serif;
    --ftMain: 'Questrial', sans-serif;
}
/* Globales */
html{
    font-size: 62.5%;
    box-sizing: border-box; /* hack para box model */
    scroll-snap-type: y mandatory;
    font-family: var(--ftText);
}
.p-rel{
    position: relative;
}
.p-abs{
    position: absolute;
}
.left{
    left: 0;
}
.p-fix{
    position: fixed;
}
.txt-lower{
    text-transform: lowercase!important;
}
.txt-normal{
    text-transform: none!important;
}
.txt-upp{
    text-transform: uppercase!important;
}
.text-white{
    color: var(--blanco);
}

.cont-about .bg-light{
    background-color: rgba(246, 239, 223, 0.9);
}

.cont-about h4{
    font-weight: normal;
    text-transform: uppercase;
}

.bg-white{
    background-color: var(--blanco);
}
.bg-light{
    background-color: var(--beis);
}
.bg-lightAlternative{
    background-color: var(--alternative);
}
.bg-dark{
    background-color: var(--oscuro);
}
.bg-black{
    background-color: var(--negro);
}
.bg-primary{
    background-color: var(--primario);
}
.bg-primarioOscuro{
    background-color: var(--primarioOscuro);
}
.bg-secundario{
    background-color: var(--secundario);
}
.bg-secundarioOscuro{
    background-color: var(--secundarioOscuro);
}
.txt-color-light{
    color: var(--blanco);
}
.txt-color-main{
    color: var(--primario);
}
*, *:before, *:after {
    box-sizing: inherit;
}
.w-100{
    width: 100%;
}
.w-50{
    width: 50%;
}
body{
    font-size: 16px;/*1rem=10px*/
    font-family: var(--ftText);
    background-color: var(--beis);
    scroll-behavior: smooth;
}
body p{
    font-family: var(--ftText);
    font-weight: normal;
}
.container{
    max-width: 120rem;
    margin: 0 auto;
}
.btn{
    display: inline-block;
    padding: 1rem 3rem;
    transition: all .3s ease;
    text-align: center;
}
.btn:hover{
    cursor: pointer;
}
.btn-main{
    background-color: var(--primarioOscuro);
    color: var(--blanco);
}
.btn-main:hover{
    transition: all .3s ease;
    background-color: var(--primario);
}
.btn-secondary{
    background-color: var(--secundario);
    color: var(--negro);
}
.btn-secondary:hover{
    transition: all .3s ease;
    background-color: var(--secundarioOscuro);
}
.grid{
    display: grid;
}
.grid-2{
    grid-template-columns: repeat(2,1fr);
}
.grid-3{
    grid-template-columns: repeat(3,1fr);
}
.grid-4{
    grid-template-columns: repeat(4,1fr);
}
.grid-5{
    grid-template-columns: repeat(5,1fr);
}
.grid-6{
    grid-template-columns: repeat(6,1fr);
}
.gap-2{
    gap: 2rem;
}
.gap-3{
    gap: 3rem;
}
.gap-4{
    gap: 3rem;
}
.column-1-3{
  grid-column: 1 / 3;
}
.column-1-4{
  grid-column: 1 / 4;
}
.column-2-3{
  grid-column: 2 / 4;
}
.column-2-4{
    grid-column: 2 / 5;
}
.column-3-6{
    grid-column: 3 / 6;
}
.column-4-7{
    grid-column: 4 / 7;
}
.flex{
    display: flex;
}
.flex-column{
    flex-direction: column;
}
.flex-row{
    flex-direction: row;
}
.items-center{
    align-items: center;
}
.content-center{
    align-content: center;
}
.items-end{
    align-items: flex-end;
}
.items-start{
    align-items: flex-start;
}
.justify-center{
    justify-content: center;
}
.justify-between{
    justify-content: space-between;
}
.justify-start{
    justify-content: flex-start;
}
.justify-end{
    justify-content: flex-end;
}
.m-0{
    margin: 0;
}
.sombra{
    -webkit-box-shadow: 0px 5px 15px 0px rgba(112,112,112,1);
    -moz-box-shadow: 0px 5px 15px 0px rgba(112,112,112,1);
    box-shadow: 0px 5px 15px 0px rgba(112,112,112,1);
    background-color: var(--blanco);
    padding: 2rem;
    /* border-radius: 2rem; */
}

.m-1{
    margin: 10px!important;
}
.m-2{
    margin: 20px!important;
}
.m-3{
    margin: 30px!important;
}
.m-4{
    margin: 40px!important;
}
.m-5{
    margin: 50px!important;
}


.mt-0{
    margin-top: 0px!important;
}
.mt-1{
    margin-top: 10px!important;
}
.mt-2{
    margin-top: 20px!important;
}
.mt-3{
    margin-top: 30px!important;
}
.mt-4{
    margin-top: 40px!important;
}
.mt-5{
    margin-top: 50px!important;
}

.mb-0{
    margin-bottom: 0px!important;
}
.mb-1{
    margin-bottom: 10px!important;
}
.mb-2{
    margin-bottom: 20px!important;
}
.mb-3{
    margin-bottom: 30px!important;
}
.mb-4{
    margin-bottom: 40px!important;
}
.mb-5{
    margin-bottom: 50px!important;
}

.ml-0{
    margin-left: 0px!important;
}
.ml-1{
    margin-left: 10px!important;
}
.ml-2{
    margin-left: 20px!important;
}
.ml-3{
    margin-left: 30px!important;
}
.ml-4{
    margin-left: 40px!important;
}
.ml-5{
    margin-left: 50px!important;
}

.mr-0{
    margin-right: 0px!important;
}
.mr-1{
    margin-right: 10px!important;
}
.mr-2{
    margin-right: 20px!important;
}
.mr-3{
    margin-right: 30px!important;
}
.mr-4{
    margin-right: 40px!important;
}
.mr-5{
    margin-right: 50px!important;
}

.p-1{
    padding: 10px!important;
}
.p-2{
    padding: 20px!important;
}
.p-3{
    padding: 30px!important;
}
.p-4{
    padding: 40px!important;
}
.p-5{
    padding: 50px!important;
}

.pt-0{
    padding-top: 0px!important;
}
.pt-1{
    padding-top: 10px!important;
}
.pt-2{
    padding-top: 20px!important;
}
.pt-3{
    padding-top: 30px!important;
}
.pt-4{
    padding-top: 40px!important;
}
.pt-5{
    padding-top: 50px!important;
}

.pb-0{
    padding-bottom: 0px!important;
}
.pb-1{
    padding-bottom: 10px!important;
}
.pb-2{
    padding-bottom: 20px!important;
}
.pb-3{
    padding-bottom: 30px!important;
}
.pb-4{
    padding-bottom: 40px!important;
}
.pb-5{
    padding-bottom: 50px!important;
}
.pb-10{
    padding-bottom: 100px!important;
}

.pl-0{
    padding-left: 0px!important;
}
.pl-1{
    padding-left: 10px!important;
}
.pl-2{
    padding-left: 20px!important;
}
.pl-3{
    padding-left: 30px!important;
}
.pl-4{
    padding-left: 40px!important;
}
.pl-5{
    padding-left: 50px!important;
}

.pr-0{
    padding-right: 0px!important;
}
.pr-1{
    padding-right: 10px!important;
}
.pr-2{
    padding-right: 20px!important;
}
.pr-3{
    padding-right: 30px!important;
}
.pr-4{
    padding-right: 40px!important;
}
.pr-5{
    padding-right: 50px!important;
}

.f-1{
    font-size: 10px!important;
}
.f-2{
    font-size: 20px!important;
}
.f-25{
    font-size: 28px!important;
}
.f-3{
    font-size: 30px!important;
}
.f-4{
    font-size: 40px!important;
}
.f-5{
    font-size: 50px!important;
}
.f-6{
    font-size: 60px!important;
}
.f-150{
    font-size: 150px!important;
}
@media (max-width: 554px) {
    .f-5{
        font-size: 35px!important;
    }
    .f-150{
        font-size: 100px!important;
    }
}
.f-bold{
    font-weight: bold;
}
.f-bold-600{
    font-weight: 600;
}
/* tipografía */
h1{
    font-size: 4.8rem;
    font-weight: 600;
}
h2{
    font-size: 3.9rem;
    font-weight: 400;
}
h3{
    font-size: 3.1rem;
    font-weight: 300;
}
h4{
    font-size: 2.4rem;
    /* font-weight: 600; */
    font-weight: normal;
}
h1,h2,h4{
    font-family: var(--ftMain);
}
h3,p{
    font-family: var(--ftText);
}
a{
    text-decoration: none;
    font-family: var(--ftMain);
}
img{
    max-width: 100%;
}
.text-center{
    text-align:center;
}
.text-left{
    text-align:left;
}
/* Títulos */
.title{
    font-family: var(--ftMain);
    display: flex;
    flex-direction: column;
    border-left: var(--primarioOscuro) 3px solid;
    padding-left: 10px;
    margin-bottom: 20px;
}
.title h3,.title h4{
    margin: 0;
}
.title h3{
    text-transform: capitalize;
}
.cont-txt{
    padding: 3rem;
}


/* slider */
.cont-exp .cont-img-cars{
    position: relative;
    display: flex;
    justify-content: space-between;
    width: 100%;
}
/* imagenes slider */
.cont-exp .cont-slider-cars{
    width: 100%;
    overflow: hidden;
    scroll-behavior: smooth;
}
.cont-exp .cont-slider-cars .slider-cars{
    display: flex;
    flex-wrap: nowrap;
}
.cont-exp .cont-slider-cars .slider-cars .sli-cars{
    min-width: 25%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: .3s ease all;
}
.cont-exp .cont-img-cars .cont-slider-cars .sli-cars img{
    height: 150px;
    width: 150px;
    object-fit: contain;
}
.cont-exp .cont-img-cars .cont-slider-cars .sli-cars:hover{
   /* transform: scale(1.1); */
   transition: .3s ease all;
   /* z-index: 600; */
}
.sli-cars{
    position: relative;
}
.menu-movil,
.menu-burger {
    display: none;
}
.cont-movil{
    position: relative;
}
.barra-movil{
    display: none;
}
.card{
    padding: 30px;
    background-color: var(--blanco);
    display: flex;
    flex-direction: column;
    align-items: center;
    /* border-radius: 10px; */
    border: var(--secundarioOscuro) solid 2px;
    text-align: center;
    min-width: 200px;
}
.card:hover{
    border: var(--primario) solid 2px;
}
.card h4{
    color: var(--gris);
    margin: 0;
    margin-bottom: 10px;
}
.card:hover h4{
    color: var(--negro);
}
.card img{
    /* width: 150px; */
    width: 150px;
    height: 150px;
    object-fit: contain;
}
.card small{
    text-transform: capitalize;
}
/* ajustes responsive */
@media (max-width: 768px) { 
    .bar-menu{
        display: none;
    }
    .barra-movil{
        display: grid;
        background-color: var(--primario);
        /* display: flex;
        align-items: center;
        justify-content: flex-end; */
        padding: 1rem 2rem;
        min-height: 50px;
    }
    .menu-burger{
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        transition: all .5s ease-in-out;
    }
    .menu-movil {
        display: flex;
        flex-direction: column;
        text-align: center;
        background-color: var(--secundario);
        position: absolute;
        border-left: var(--primarioOscuro) solid .5rem;
        left: -100%;
        width: 95%;
        z-index: 1000;
    }
    .menu-movil a{
        color: var(--oscuro);
        padding: 10px 0;
        /* border-bottom: #da3612 solid 1px; */
    }
    .menu-movil a:last-child{
        background-color: var(--primarioOscuro);
        color: var(--oscuro);
      /* border: #761f07 solid 2px; */
    }
    
    .menu-movil a:hover{
        background-color: var(--primarioOscuro);
        /* border-left: #761f07 solid 6px; */
        border-bottom: none;
        color: white;
    }
    /* botón burger */
    .menu-burger a{
        padding: 0;
    }
    .btn-burger{
        width: 3rem;
        height: .2rem;
        background-color: var(--negro);
        border-radius: .5rem;
        transition: all .5s ease-in-out;
    }
    .btn-burger::before, .btn-burger::after{
        content: '';
        position: absolute;
        width: 3rem;
        height: .2rem;
        background-color: var(--negro);
        border-radius: .5rem;
        transition: all .5s ease-in-out;
    }
    .btn-burger::before{
        transform: translateY(-10px);
    }
    .btn-burger::after{
        transform: translateY(10px);
    }
    /* animación de close */
    .menu-burger.open .btn-burger{
        transform: translateX(-50px);
        background: transparent;
    }
    .menu-burger.open .btn-burger::before{
        transform: rotate(45deg) translate(35px, -35px);
    }
    .menu-burger.open .btn-burger::after {
        transform: rotate(-45deg) translate(35px, 35px);
    }
    .cont-txt{
        padding: 0;
    }
    .seccion{
        padding:3rem!important;
    }
    .cont-exp .cont-slider-cars .slider-cars .sli-cars{
        min-width: 50%;
    }
    .cont-clients .cont-exp .cont-slider-cars .slider-cars .sli-cars{
        min-width: 33%;
    }
}

/* slider */
.slider {
    /* width: 75vw; */
    /* height: auto; */
    /* margin: auto; */
    overflow: hidden;
}

.slider .slide-track {
    display: flex;
    animation: scroll 40s linear infinite;
    -webkit-animation: scroll 40s linear infinite;
    /* width: calc(200px * 27); */
    width: 5400px;
    height: 250px;
}
.slider .slide-track.slide-certify{
    width: 400px;
    height: 100%;
}
.slider .slider-team{
    display: flex;
    animation: scroll 80s linear infinite;
    -webkit-animation: scroll 80s linear infinite;
    /* width: calc(200px * 27); */
    width: 8000px;
    height: 100%;
    /* height: 250px; */
}


.slider .slide-track a.slide{
    min-width: 200px;
    border: var(--primario) solid 2px;
}
.slider .slide-track a:hover{
    transform: scale(1.1);
    transition: all .2s ease-in;
}

.slider .slide-track a.slide img, .slider .slider-team div img {
    height: 100%;
    /* max-height: 200px; */
    width: 200px;
    /* height: 100px; */
    object-fit: cover;
}

.slider .slider-team div img {
    /* width: 100%; */
    width: 400px;
    /* margin: 0 20px; */
}

@keyframes scroll {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
    50% {
        -webkit-transform: translateX(calc(-200px * 10));
        transform: translateX(calc(-200px * 10));
    }
    90% {
        -webkit-transform: translateX(calc(-200px * 20));
        transform: translateX(calc(-200px * 20));
    }
    100% {
        -webkit-transform: translateX(calc(-200px * 22));
        transform: translateX(calc(-200px * 22));
    }
}
#scrollTopBtn {
    display: none;
    position: fixed;
    bottom: 5px;
    left: 5px;
    transition: background-color 0.3s ease-in-out; /* Agregar una transición para el cambio de color en hover */

}

#scrollTopBtn:hover {
    background-color: var(--primarioOscuro);
}