@media only screen and (max-width: 768px) {

    #career {
        display: block;
        min-height: auto;
        padding: 40px 0;
        text-align: center;
        color: #fff;
    }

    #career h2 {
        font-size: 2rem;
        margin-bottom: 15px;
    }

    #career p {
        font-size: 16px;
        text-align: left;
    }

    #career .equipe {
        max-width: 100%;
        margin: 0 auto 20px;
        transform: none;
        box-shadow: none;
        transition: none;
        border: 3px solid #fff;
    }

    #career .btn-warning {
        font-size: 14px;
        padding: 15px 20px;
    }

    /* Ajustando os ícones de benefícios para ficarem 2 ou 3 por linha */

    #career .row.text-center {
        display: flex;
    }

    #career .firstline {
        margin-bottom: 0px;
    }

    #career .row.text-center .col-md-2 {
        flex: 0 0 50%;
        /* Isso ajusta para 2 ícones por linha */
        max-width: 50%;
        margin: 5px 0;
    }

    #career .mb4-4 {
        margin-bottom: 0px;
    }

    /* Se quiser 3 ícones por linha, ajuste o flex e o max-width */
    /* 
    #career .row.text-center .col-md-2 {
        flex: 0 0 30%;
        max-width: 30%;
        margin: 10px 0;
    }
    */

    #career .benefit-item {
        width: 100%;
        margin-bottom: 15px;
        height: auto;
        padding: 15px;
    }

    #career .benefit-item i {
        font-size: 24px;
        margin-bottom: 10px;
    }

    #career .benefit-item p {
        font-size: 14px;
        line-height: 1.4;
    }
}