/* Mobile-First real: Ajuste da imagem para o topo e degradê vertical */
        @media (max-width: 767.98px) {
            .hero-img-container {
                display: block !important;
                position: relative !important;
                width: 100% !important;
                height: 280px !important;
            }
            .hero-img-container > div {
                background: linear-gradient(to bottom, rgba(6, 12, 22, 0) 0%, #060c16 100%) !important;
            }
            
            h1 {
                font-size: 28px !important;
            }
            p {
                font-size: 14px !important;
            }
            .btn-hero-eletrocentro {
                width: 100%;
                max-width: 320px;
                padding: 16px 20px !important;
            }
        }
        
        /* Efeitos de Hover */
        .btn-hero-eletrocentro:hover {
            background: #003a8c !important;
            color: #ffffff !important;
            transform: translateY(-1px);
        }
        .btn-hero-eletrocentro:hover svg {
            transform: translateX(3px);
        }
      
      
      @media(min-width:992px){
        .container-hero-desk{
          padding-top: 100px; padding-bottom: 100px;
        }
      }


       /* Divisão customizada em 5 colunas iguais para telas grandes (Bootstrap col-lg-2-4) */
        @media (min-width: 992px) {
            .col-lg-2-4 {
                flex: 0 0 20%;
                max-width: 20%;
            }
            /* Linha vertical divisória entre os itens idêntica à imagem */
            .diferencial-col {
                position: relative;
                border-right: 1px solid rgba(255, 255, 255, 0.08);
                padding-right: 15px;
                padding-left: 15px;
            }
            .diferenciais-wrapper .row > div:first-child {
                padding-left: 10px;
            }
            .last-col {
                border-right: none !important;
            }
        }

        /* Ajustes responsivos Mobile-First */
        @media (max-width: 991.98px) {
            .diferenciais-wrapper {
                padding: 20px 15px !important;
            }
            .diferencial-col {
                border-bottom: 1px solid rgba(255, 255, 255, 0.08);
                padding-bottom: 15px;
            }
            .diferenciais-wrapper .row > div:last-child {
                border-bottom: none !important;
                padding-bottom: 0;
            }
        }



        /* Ajustes responsivos Mobile-First */
        @media (max-width: 767.98px) {
            .img-left-container {
                min-height: 260px !important;
                height: 260px;
            }
            .content-block-middle {
                border-right: none !important;
                border-bottom: 1px solid rgba(255, 255, 255, 0.08);
            }
            .bg-panel-container {
                width: 100% !important;
                opacity: 0.25; /* Suaviza no mobile para dar foco total no texto */
            }
            .bg-panel-container > div {
                background: linear-gradient(to bottom, rgba(4, 8, 15, 0.2) 0%, #04080f 100%) !important;
            }
            .sobre-wrapper h2 {
                font-size: 21px !important;
            }
        }



        /* Alinhamento flex d-flex centralizado para os badges dos icones */
        .icon-badge {
            display: flex !important;
        }

        /* Estrutura de 5 colunas para telas grandes */
        @media (min-width: 992px) {
            .col-lg-2-4 {
                flex: 0 0 20%;
                max-width: 20%;
            }
        }

        /* Ajustes responsivos Mobile-First */
        @media (max-width: 767.98px) {
            h2 {
                font-size: 22px !important;
                margin-bottom: 25px !important;
                text-align: center;
            }
            .card-solucao {
                margin-bottom: 10px;
            }
        }


         /* Ajustes das setas no Desktop */
        @media (min-width: 768px) {
            .workflow-arrow {
                height: 50px; /* Centraliza perfeitamente com a linha média dos ícones */
                padding: 0 10px;
                flex-shrink: 0;
            }
            .svg-arrow-fluxo {
                width: 45px;
                height: auto;
            }
        }

        /* Responsivo Mobile-First Real */
        @media (max-width: 767.98px) {
            .processo-wrapper {
                padding: 30px 20px !important;
            }
            .processo-wrapper h2 {
                font-size: 20px !important;
                margin-bottom: 35px !important;
            }
            .workflow-item {
                margin-bottom: 10px;
            }
            .workflow-arrow {
                margin-bottom: 20px;
                margin-top: 5px;
            }
            /* Gira o SVG para apontar para baixo mantendo a consistência visual */
            .svg-arrow-fluxo {
                width: 12px;
                height: auto;
                transform: rotate(90deg);
            }
            .last-item {
                margin-bottom: 0 !important;
            }
        }


         /* Divisórias Verticais no Desktop */
        @media (min-width: 576px) {
            .separator-right {
                border-right: 1px solid rgba(255, 255, 255, 0.06);
            }
            .separator-right-sm {
                border-right: 1px solid rgba(255, 255, 255, 0.06);
            }
        }

        /* Responsivo Mobile-First Real */
        @media (max-width: 575.98px) {
            .separator-right {
                border-right: 1px solid rgba(255, 255, 255, 0.06);
            }
            .mobile-top-space {
                margin-top: 25px;
            }
            .beneficio-item h3 {
                font-size: 13px !important;
            }
            .beneficio-item p {
                font-size: 11px !important;
                padding: 0 4px !important;
            }
            .ideal-item p {
                font-size: 11px !important;
            }
        }



         /* Efeito de Hover e Ajustes Finos */
        .btn-cta-whatsapp:hover {
            background-color: #003d96 !important;
            transform: translateY(-2px);
            color: #ffffff !important;
        }
        .btn-cta-whatsapp:active {
            transform: translateY(0);
        }

        /* Ajustes Responsivos para Mobile-First Real */
        @media (max-width: 991.98px) {
            .btn-cta-whatsapp {
                width: 100%;
                max-width: 280px;
                margin-top: 10px;
            }
        }

        @media (max-width: 575.98px) {
            /* Diminuir paddings internos no container para caber melhor na tela do celular */
            div[style*="padding: 30px 40px"] {
                padding: 25px 20px !important;
            }
            h2 {
                font-size: 19px !important;
            }
            p {
                font-size: 12px !important;
            }
        }