.marcas{
    width: 100%;
    background-color:var(--bg-primario);
    overflow: hidden;
}
.marcas-text{
    text-align: center;
    width: 80%;
    margin: auto;
}
.marcas-text__title{
    font-size:var(--fz-title);
    font-family: var(--font-primaria);
    color: var(--bg-secundario);
}
.marcas-text__title span{
    color: var(--c-primario);
    font-weight: 800;
}
.marcas-text__paragraph{
    color: var(--bg-secundario);
    font-family: var(--font-secundaria);
    font-size: var(--fz-parrafo);
    font-weight: 500;
    text-align:center;
    margin: 10px;
}
.marcas-cards{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap:50px;
    padding: 30px;
}
.marcas-cards__card{
    background-color: var(--bg-primario);
    width: 300px;
    box-shadow: 0px 0px 10px 1px rgba(70, 70, 70, 0.13);
    padding: 30px 10px 10px 10px;
    display: flex;
    flex-direction: column;
    width: 300px;
    justify-content: space-around;
    align-items: center;
    flex-grow:0.2;
    transform: translateY(60px);
    opacity: 0;
    border-radius: 10px;
}
.marcas-cards__card-img{
    width:auto;
    max-width: 180px;
}

.card-text__title{
    font-size: 1.2rem;
    font-family: var(--font-primaria);
    color: var(--c-cuarto);
    margin: 5px 0px;
}
.card-text__paragraph{
    font-size: 1rem;
    font-family: var(--font-secundaria);
    font-weight: 500;
    color: var(--c-cuarto);
}
.card-text__btn{
    margin: 20px 0px;
    padding: 8px 20px;
    border-radius: 20px;
    border: none;
    background-color: var(--c-secundario);
    color: var(--bg-primario);
    font-weight: 600;
    font-size: 1rem;
    transition: scale ease-out 0.3s;
}
/*Observer change*/
.marcas-cards__card-visible{
  animation: traslateMarcas 0.6s ease-in  forwards;
}
@keyframes traslateMarcas {
    0%{
        transform: translateY(80px);
        opacity: 0;
    }
    100%{
        transform: translateY(0px);
        opacity: 1;
    }
    
}