body{
    background-image: linear-gradient(to bottom, #ffffff 81px, #020b16 81px);
    background-repeat: no-repeat;
    background-color: #020b16; /* Cor de segurança caso o gradiente falhe */
    min-height: 100vh; /* Garante que o body ocupe toda a altura da tela */
    margin: 0;
           }
      
        /* Hero Section com a imagem de fundo */
        .hero-section {
            position: relative;
            min-height: 100vh;
            display: flex;
            align-items: center;
          
            
            background-size: cover;
            padding: 80px 0;
            overflow: hidden;
        }
  
 

        /* Subtítulo superior */
        .hero-tagline {
            font-size: 1rem;
            font-weight: 600;
            color: #4a90e2;
            letter-spacing: 0.5px;
            margin-bottom: 1.5rem;
        }

        .hero-tagline span {
            color: var(--text-muted);
        }

        /* Título Principal */
        .hero-title {
            font-size: 2.4rem;
            font-weight: 700;
            line-height: 1.2;
            margin-bottom: 1.5rem;
            max-width: 800px;
          color:#fff;
        }

        .hero-title .highlight {
            color: #4a90e2;
        }

        /* Texto Descritivo */
        .hero-text {
            font-size: 1rem;
            line-height: 1.6;
            color: rgba(255, 255, 255, 0.85);
            max-width: 520px;
            margin-bottom: 2.5rem;
        }

        /* Botão de Ação Customizado */
        .btn-cta {
            background-color: var(--brand-blue);
            color: var(--text-light);
            font-weight: 600;
            font-size: 1rem;
            padding: 12px 32px;
            border-radius: 6px;
            border: none;
            transition: all 0.3s ease;
            display: inline-flex;
            align-items: center;
            gap: 10px;
        }

        .btn-cta:hover {
            background-color: #005ecb;
            color: var(--text-light);
            transform: translateY(-2px);
            box-shadow: 0 8px 20px rgba(0, 118, 255, 0.3);
        }

        /* Selo ENGIE com toque sutil de vidro */
        .brand-badge-container {
            display: flex;
            justify-content: center;
            align-items: center;
            margin-bottom: 2rem;
        }

        .brand-badge {
            width: 180px;
            height: 180px;
            border-radius: 50%;
            /*background: rgba(255, 255, 255, 0.03);
            border: 1px solid rgba(255, 255, 255, 0.1);
            backdrop-filter: blur(8px);
            -webkit-backdrop-filter: blur(8px);*/
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            /*padding: 20px;box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);*/
            text-align: center;
            
        }

        .brand-badge img {
            width: 250px;
            height: auto;
            margin-bottom: 8px;
        }

        .brand-badge span {
            font-size: 0.65rem;
            text-transform: uppercase;
            letter-spacing: 1.5px;
            color: rgba(255, 255, 255, 0.7);
            font-weight: 600;
            line-height: 1.2;
        }

        /* Responsividade (Mobile-First) */
        @media (min-width: 768px) {
            .hero-title {
                font-size: 3.2rem;
            }
            .hero-text {
                font-size: 1.05rem;
            }
            .brand-badge-container {
                margin-bottom: 0;
                justify-content: flex-start;
                padding-left: 15%;
            }
          
          .brand-badge{position:absolute; top:20%;left:55%;}
            
        }

        @media (min-width: 992px) {
            .brand-badge-container {
                padding-left: 0%;
            }
        }






          /* Fundo geral idêntico ao tom azul-escuro das imagens */
        .bg-delta-dark {
            background-color: #020b16;
            color: #ffffff;
        }

        /* --- Estilos da Seção de Fluxo de Atuação --- */
        .icon-container {
            position: relative;
            width: 70px;
            height: 70px;
            margin: 0 auto 15px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        /* O número azul exato da imagem, sobreposto ao ícone */
        .badge-number {
            position: absolute;
            bottom: 2px;
            right: -5px;
            background-color: #0d6efd; /* Azul vibrante */
            color: #ffffff;
            width: 22px;
            height: 22px;
            border-radius: 50%;
            font-size: 12px;
            font-weight: bold;
            display: flex;
            align-items: center;
            justify-content: center;
            border: 2px solid #020b16; /* Cria o recorte sutil sobre o fundo */
        }

       /* Setas pontilhadas entre os passos (apenas no Desktop) */
@media (min-width: 992px) {
    .step-arrow:not(:last-child)::after {
        content: "";
        position: absolute;
        /* Alinha verticalmente com o centro do ícone */
        top: 35px; 
        /* Mantém o comprimento reduzido e centralizado no espaço */
        right: -15%; 
        width: 30%; 
        /* Altura necessária para a seta maior não cortar nas pontas */
        height: 16px; 
        /* SVG ajustado: Seta totalmente branca (#ffffff) com 90% de opacidade (0.9) */
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='16' viewBox='0 0 100 16' preserveAspectRatio='none'%3E%3Cline x1='0' y1='8' x2='90%25' y2='8' stroke='%23ffffff' stroke-opacity='0.9' stroke-width='1.2' stroke-dasharray='1.5,3'/%3E%3Cpolyline points='88,2 96,8 88,14' fill='none' stroke='%23ffffff' stroke-opacity='0.9' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: center right;
    }
}












  .bg-delta-dark {
            background-color: #020b16;
            color: #ffffff;
        }

        /* Ajuste para 7 colunas na mesma linha no Desktop */
        @media (min-width: 992px) {
            .row-cols-lg-7 > * {
                flex: 0 0 auto;
                width: 14.285714%;
            }
        }

        /* Filtro para deixar os ícones no azul brilhante da imagem */
        .icon-blue {
           
            width: 62px;
          height:auto;
            margin-bottom: 15px;
        }




          .bg-delta-dark {
            background-color: #020b16;
        }
        /* Estilização interna do card para simular o contorno e o degradê sutil do fundo */
        .cta-card {
            background: linear-gradient(135deg, #031227 0%, #020b16 100%);
            border: 1px solid rgba(255, 255, 255, 0.1) !important;
        }
        /* Botão azul customizado idêntico ao padrão da Delta */
        .btn-delta {
            background-color: #0d6efd;
            color: #ffffff;
            font-weight: 500;
            padding: 10px 24px;
            transition: background-color 0.2s ease;
        }
        .btn-delta:hover {
            background-color: #0b5ed7;
            color: #ffffff;
        }