﻿@media (max-width: 900px) {
    .topbar-inner {
        flex-direction: column;
        align-items: stretch;
        gap: 2px;
        padding: 1px 2px 0;
    }

    .left-section {
        min-height: 44px;
    }

    .brand-logo img {
        width: 38px;
        height: 38px;
    }

    .brand-text {
        font-size: 22px;
    }

    .brand-text2 {
        font-size: 18px;
    }

    .menu {
        justify-content: flex-start;
        gap: 0;
        width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        padding: 2px 0 12px;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
    }

        .menu li {
            padding: 0 14px;
            border-left: 1px solid #e2e8f0;
        }

            .menu li:first-child {
                padding-left: 0;
                border-left: none;
            }

        .menu a {
            font-size: 13px;
        }

    .hero-contenido {
        flex-direction: column;
        text-align: center;
    }

    .hero-texto,
    .hero-imagen {
        width: 100%;
    }

    .grid-soluciones {
        grid-template-columns: 1fr;
    }

    .grid-beneficios {
        grid-template-columns: 1fr;
    }
}

