/*catering comofunciona*/

.catering-comofunciona {
    background-color: black;
    color: white;
}

.catering-comofunciona .container {
    padding-top: 140px;
    padding-bottom: 140px;
}

.catering-comofunciona .titulo {
    font-family: Cormorant Garamond;
    font-size: 52px;
    font-weight: 700;
    line-height: 57px;
    padding: 0 16px;
    border-radius: 8px;
    background: linear-gradient(270deg, #14181C 0%, rgba(20, 24, 28, 0.00) 65.42%);
}

.catering-comofunciona .bloque-como-funciona .card-como .number {
    font-family: Cormorant Garamond;
    font-size: 52px;
    font-weight: 700;
    line-height: 50px;
    margin-bottom: 24px;
}

.catering-comofunciona .bloque-como-funciona .card-como img {
    height: 70px;
}

.catering-comofunciona .card-como p {
    font-size: 16px;
    line-height: 27px;
    color: #F7F7F7;
}

.catering-comofunciona .bloque-como-funciona-mobile .slick-slide img {
    margin: auto;
}

.catering-comofunciona .slick-dots {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 16px;
    margin-top: 3rem;
    margin-bottom: 1rem;
}

.catering-comofunciona .slick-dots li {
    position: relative;
    width: 5px;
    height: 5px;
    margin: 0 3.5px;
    background-color: #8B8B8B;
    border-radius: 50%;
}

.catering-comofunciona .slick-dots li.slick-active {
    background-color: white;
    width: 12px;
    height: 12px;
    margin: unset;
}

.catering-comofunciona .slick-dots button {
    font-size: 16px;
    font-weight: 400;
    line-height: 27px;
    background: unset;
    color: #8B8B8B;
    border: unset;
    position: absolute;
    bottom: 11px;
    left: 50%;
    transform: translateX(-50%);
}

.catering-comofunciona .slick-dots li.slick-active button {
    font-size: 18px;
    font-weight: 600;
    color: white;
    bottom: 19px;
}


@media (max-width:991px) {
    .catering-comofunciona .container {
        padding-top: 60px;
        padding-bottom: 60px;
        max-width: 100%;
    }

    .catering-comofunciona .bloque-como-funciona .card-como .number {
        display: none;
    }

    .catering-comofunciona .titulo {
        font-size: 36px;
        font-weight: 700;
        line-height: 54px;
        background: unset;
        padding: unset;
    }

    .catering-comofunciona .bloque-como-funciona-mobile .slick-list {
        margin: 0 -15px;
        padding: 0 15px;
    }
}