@media (max-width: 767.98px) {
    .activity-option, .goal-option {
        flex: 0 0 calc(50% - 15px);
        max-width: calc(50% - 15px);
    }
    
    .nutritionist-header {
        flex-direction: column;
        text-align: center;
    }
    
    .nutritionist-info {
        margin-left: 0;
        margin-top: 1rem;
    }
}

@media (max-width: 575px) {
    .topbar { text-align: center; }
    .topbar img { margin-bottom: 25px; }
    .topbar .text-end { text-align: center !important; }
    .topbar .btn { display: none; }
    .header h1 { font-size: 1.9rem; }
    .header h2 br { display: none; }

    .calculator-container { padding-top: 1rem !important; }

    .activity-option, .goal-option {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .step-container h2 {
        font-size: 1.6rem;  
    }
    .step-subttile { margin-bottom: 1.5rem !important; }
    .message-container {
        padding: 15px;
    }

    .card-body-step { padding: 1.5rem 5px 1.5rem 5px !important; }

    /* ETAPA 2 - GENERO */
    .gender-options {
         margin-bottom: 1rem;
        flex-direction: column;
        align-items: center;
    }

    .gender-option {
        flex: 0 0 calc(90% - 10px);
        max-width: calc(90% - 10px);
        padding: 1.2rem;
    }


    /* ETAPA - RESULTADO */
    .result-card {
        border-radius: 0 !important;
    }
    .result-card-tmb { border-radius: 15px 15px 0 0 !important; }
    .result-card-tdee { border-radius: 0 0 15px 15px !important; }
    .nutrition-container { padding: 1.5rem 5px 1.5rem 5px !important; }

    /* AUDIO */
    .card-audio-container { padding: 1.5rem 5px 1.5rem 5px !important; }
}



@media (max-width: 449px) {
    .topbar img { width: 280px; }
    .topbar .text-end {
        text-align: center !important;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .topbar .text-end a {
        padding: 0 !important;
        padding-bottom: 6px !important;
    }

    .header h1 {
        font-size: 1.45rem;
        font-weight: 700;
    }
    .header h2 {
        font-size: 1.1rem;
        margin-top: 20px;
    }

    .step-container h2 {
        font-size: 1.25rem;
        font-weight: 700;
    }

    .option-card {
        padding: 1rem 0px;
    }

    .message-container {
        padding: 5px;
    }
    .step-container p {
        font-size: 1.1rem;
    }
}