* {
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
}
body {
    margin: 0 !important; /* Remove margem (!important) */
    padding: 0 !important; /* Remove espaçamento interno (!important) */
}
body {
    -webkit-font-smoothing: antialiased; /* Suaviza a serrilhagem das letras na tela: antialiased */
    -moz-osx-font-smoothing: grayscale; /* Suaviza a serrilhagem das letras na tela: grayscale */
    text-rendering: optimizeLegibility; /* Prioriza legibilidade na renderização do texto: optimizeLegibility */
    color: #0f172a; /* Cor do texto: #0f172a */
}
html {
    overflow-x: hidden; /* Esconde rolagem horizontal (evita scroll lateral) */
    max-width: 100%; /* Não deixa ultrapassar 100% do pai */
}
html body {
    background: #f7f7f7; /* Cor de fundo: #f7f7f7 */
    color: #000; /* Cor do texto: #000 */
    padding: 0; /* Remove espaçamento interno */
    margin: 0; /* Remove margem */
    overflow-x: hidden; /* Esconde rolagem horizontal (evita scroll lateral) */
    padding-top: 90px !important; /* Espaçamento interno superior: 90px (forçado com !important) */
}
#container-loading{
  background-color: rgba(255, 255, 255, 0.9);
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 999999;
    top: 0;
    left: 0;
}
.loading-center {
    position: relative;
    width: 80px;
    height: 80px;
    margin:17% auto;
}

.loading-center::before {
    content: '';
    position: absolute;
    inset: 0;
    border: 4px solid #333;
    border-top-color: #1c9fdb;
    border-radius: 50%;
    animation: girar 0.8s linear infinite;
}

.loading-center img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 40px;
    height: 40px;
    transform: translate(-50%, -50%);
}

@keyframes girar {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}
.form-contact {
    width: 98%; /* Largura: 98% */
}
.container {
    width: 1200px; /* Largura: 1200px */
    margin: 0 auto; /* Zera margem vertical e centraliza na horizontal */
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
}
header {
    position: fixed !important; /* Tira do fluxo normal e fixa na tela mesmo com scroll (!important) */
    top: 0 !important; /* Distância a partir do(a) topo: 0 (forçado com !important) */
    left: 0 !important; /* Distância a partir do(a) esquerda: 0 (forçado com !important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    z-index: 9999 !important; /* Camada de sobreposição (quanto maior, mais na frente): 9999 (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    border-bottom: 1px solid #e2e8f0 !important; /* Borda inferior: 1px solid #e2e8f0 (forçado com !important) */
}
.header-top {
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    height: 30px !important; /* Altura: 30px (forçado com !important) */
    background: #00a0e3 !important; /* Cor de fundo: #00a0e3 (forçado com !important) */
    color: #FFF !important; /* Cor do texto: #FFF (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    font-size: 13px !important; /* Tamanho da fonte: 13px (forçado com !important) */
    margin: 0 !important; /* Remove margem (!important) */
    padding: 0 !important; /* Remove espaçamento interno (!important) */
}
.background-nav {
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    height: 60px !important; /* Altura: 60px (forçado com !important) */
    background: #ffffff !important; /* Cor de fundo: #ffffff (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    margin: 0 !important; /* Remove margem (!important) */
    padding: 0 !important; /* Remove espaçamento interno (!important) */
}
.background-nav .container {
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    max-width: 1400px !important; /* Largura máxima: 1400px (forçado com !important) */
    height: 100% !important; /* Ocupa 100% da altura do pai (!important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    margin: 0 auto !important; /* Zera margem vertical e centraliza na horizontal (!important) */
}
ul.navs {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: row !important; /* Alinha os filhos lado a lado na horizontal (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    height: 100% !important; /* Ocupa 100% da altura do pai (!important) */
    margin: 0 !important; /* Remove margem (!important) */
    padding: 0 !important; /* Remove espaçamento interno (!important) */
    list-style: none !important; /* Remove marcadores da lista (!important) */
}
ul.navs > li:nth-child(1) {
    flex: 1 1 0px !important; /* Define grow/shrink/basis do item flex: 1 1 0px (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: flex-start !important; /* Alinha os filhos no início do eixo principal (!important) */
    margin-right: 0 !important; /* Margem direita: 0 (forçado com !important) */
}
ul.navs > li:not(:first-child):not(.ul-end) {
    flex: 0 0 auto !important; /* Define grow/shrink/basis do item flex: 0 0 auto (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
}
ul.navs > li:nth-child(1) img {
    height: 50px !important; /* Altura: 130px (forçado com !important) */
    width: auto !important; /* Largura automática, ajusta ao conteúdo (!important) */
    display: block !important; /* Muda para block, ocupa a linha toda (!important) */
    margin-top: 0 !important; /* Margem superior: 0 (forçado com !important) */
    margin-bottom: 0 !important; /* Margem inferior: 0 (forçado com !important) */
    margin-left: 0 !important; /* Margem esquerda: 0 (forçado com !important) */
    margin-right: 0 !important; /* Margem direita: 0 (forçado com !important) */
    object-fit: contain !important; /* Encaixa a imagem inteira no espaço (!important) */
}
ul.navs > li {
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    height: 100% !important; /* Ocupa 100% da altura do pai (!important) */
}
ul.navs > li > a {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    height: 100% !important; /* Ocupa 100% da altura do pai (!important) */
    padding: 0 16px !important; /* Espaçamento interno: 0 16px (forçado com !important) */
    color: #334155 !important; /* Cor do texto: #334155 (forçado com !important) */
    font-weight: 500 !important; /* Peso da fonte: 500 (forçado com !important) */
    font-size: 15px !important; /* Tamanho da fonte: 15px (forçado com !important) */
    text-decoration: none !important; /* Remove sublinhado/decoração do texto (!important) */
    cursor: pointer !important; /* Muda o cursor para indicar que é clicável (!important) */
    white-space: nowrap !important; /* Impede quebra de linha do texto (!important) */
    margin: 0 !important; /* Remove margem (!important) */
    transform: none !important; /* Transformação (rotação, escala ou deslocamento): none (forçado com !important) */
}
ul.navs > li > a:hover {
    color: #00a0e3 !important; /* Cor do texto: #00a0e3 (forçado com !important) */
}
.submenu-1 {
    display: none !important; /* Esconde o elemento e tira do fluxo (!important) */
    position: absolute !important; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative (!important) */
    top: 100% !important; /* Distância a partir do(a) topo: 100% (forçado com !important) */
    left: 50% !important; /* Distância a partir do(a) esquerda: 50% (forçado com !important) */
    transform: translateX(-50%) !important; /* Transformação (rotação, escala ou deslocamento): translateX(-50%) (forçado com !important) */
    margin-top: 0 !important; /* Margem superior: 0 (forçado com !important) */
    background: #ffffff !important; /* Cor de fundo: #ffffff (forçado com !important) */
    min-width: 140px !important; /* Largura mínima: 140px (forçado com !important) */
    box-shadow: 0px 8px 24px rgba(0, 0, 0, 0.08) !important; /* Sombra da caixa: 0px 8px 24px rgba(0, 0, 0, 0.08) (forçado com !important) */
    border-radius: 0 0 8px 8px !important; /* Arredonda os cantos: 0 0 8px 8px (forçado com !important) */
    border: 1px solid #e2e8f0 !important; /* Borda: 1px solid #e2e8f0 (forçado com !important) */
    border-top: none !important; /* Borda superior: none (forçado com !important) */
    padding: 8px 0 !important; /* Espaçamento interno: 8px 0 (forçado com !important) */
    z-index: 10000 !important; /* Camada de sobreposição (quanto maior, mais na frente): 10000 (forçado com !important) */
}
ul.navs > li:hover .submenu-1 {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
}
.submenu-1 a {
    display: block !important; /* Muda para block, ocupa a linha toda (!important) */
    padding: 10px 20px !important; /* Espaçamento interno: 10px 20px (forçado com !important) */
    height: auto !important; /* Altura automática, ajusta ao conteúdo (!important) */
    color: #1a1a1a !important; /* Cor do texto: #1a1a1a (forçado com !important) */
    text-decoration: none !important; /* Remove sublinhado/decoração do texto (!important) */
    font-size: 14px !important; /* Tamanho da fonte: 14px (forçado com !important) */
    font-weight: 500 !important; /* Peso da fonte: 500 (forçado com !important) */
    text-align: center !important; /* Centraliza o texto (!important) */
    white-space: nowrap !important; /* Impede quebra de linha do texto (!important) */
    transition: background-color 0.2s ease, color 0.2s ease !important; /* Anima a mudança de propriedade ao longo do tempo: background-color 0.2s ease, color 0.2s ease (forçado com !important) */
}
.submenu-1 a:hover {
    background: #f8fafc !important; /* Cor de fundo: #f8fafc (forçado com !important) */
    color: #00a0e3 !important; /* Cor do texto: #00a0e3 (forçado com !important) */
}
/* Mega menu — Soluções */
.mega-menu-solucoes,.submenu-1 {
    display: none !important; /* Esconde o elemento e tira do fluxo (!important) */
    position: absolute !important; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative (!important) */
    top: 100% !important; /* Distância a partir do(a) topo: 100% (forçado com !important) */
    left: 19% !important; /* Centraliza em relação ao item "Soluções" (!important) */
    transform: translateX(-50%) !important; /* Centraliza horizontalmente (forçado com !important) */
    margin-top: 0 !important; /* Margem superior: 0 (forçado com !important) */
    background: #ffffff !important; /* Cor de fundo: #ffffff (forçado com !important) */
    min-width: 780px !important; /* Largura mínima: 780px (forçado com !important) */
    max-width: min(900px, 92vw) !important; /* Evita transbordar em telas menores (forçado com !important) */
    box-shadow: 0px 16px 40px rgba(15, 23, 42, 0.12) !important; /* Sombra da caixa (forçado com !important) */
    border-radius: 0 0 14px 14px !important; /* Arredonda os cantos inferiores (forçado com !important) */
    border: 1px solid #e2e8f0 !important; /* Borda (forçado com !important) */
    border-top: none !important; /* Borda superior: none (forçado com !important) */
    padding: 28px !important; /* Espaçamento interno (forçado com !important) */
    gap: 28px !important; /* Espaço entre colunas e card promo (!important) */
    z-index: 10000 !important; /* Camada de sobreposição (forçado com !important) */
}
ul.navs > li:hover .mega-menu-solucoes,ul.navs > li:hover .submenu-1 {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: flex-start !important; /* Alinha os filhos no início do eixo cruzado (!important) */
}
.mega-menu-columns {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex: 1 1 auto !important; /* Define grow/shrink/basis do item flex (!important) */
    gap: 32px !important; /* Espaço entre colunas (!important) */
}
.mega-menu-col {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    min-width: 130px !important; /* Largura mínima da coluna (!important) */
}
.mega-menu-col-title {
    font-size: 11px !important; /* Tamanho da fonte (forçado com !important) */
    font-weight: 700 !important; /* Peso da fonte (forçado com !important) */
    color: #94a3b8 !important; /* Cor do texto (forçado com !important) */
    text-transform: uppercase !important; /* Caixa alta (forçado com !important) */
    letter-spacing: 0.6px !important; /* Espaçamento entre letras (forçado com !important) */
    margin-bottom: 12px !important; /* Margem inferior (forçado com !important) */
}
.mega-menu-col a {
    display: block !important; /* Muda para block, ocupa a linha toda (!important) */
    padding: 7px 0 !important; /* Espaçamento interno (forçado com !important) */
    color: #1e293b !important; /* Cor do texto (forçado com !important) */
    text-decoration: none !important; /* Remove sublinhado (!important) */
    font-size: 14px !important; /* Tamanho da fonte (forçado com !important) */
    font-weight: 500 !important; /* Peso da fonte (forçado com !important) */
    text-align: left !important; /* Alinha o texto à esquerda (!important) */
    white-space: nowrap !important; /* Impede quebra de linha (!important) */
    transition: color 0.2s ease !important; /* Anima a cor (!important) */
}
.mega-menu-col a:hover {
    color: #00a0e3 !important; /* Cor do texto (forçado com !important) */
}
.mega-menu-promo {
    flex: 0 0 220px !important; /* Define grow/shrink/basis do card promo (!important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    background: transparent;
    border-radius: 0 !important; /* Arredonda os cantos (forçado com !important) */
    padding: 0 !important; /* Espaçamento interno (forçado com !important) */
    text-decoration: none !important; /* Remove sublinhado (!important) */
    position: relative !important; /* Referência para elementos internos (!important) */
    overflow: hidden !important; /* Esconde transbordo do brilho decorativo (!important) */
    left:-20px;
}

.mega-menu-promo-label {
    font-size: 12px !important; /* Tamanho da fonte (forçado com !important) */
    font-weight: 500 !important; /* Peso da fonte (forçado com !important) */
    color: rgba(255, 255, 255, 0.7) !important; /* Cor do texto (forçado com !important) */
}
.mega-menu-promo-title {
    font-size: 22px !important; /* Tamanho da fonte (forçado com !important) */
    font-weight: 800 !important; /* Peso da fonte (forçado com !important) */
    color: #ffffff !important; /* Cor do texto (forçado com !important) */
    margin-top: 2px !important; /* Margem superior (forçado com !important) */
}
.mega-menu-promo-desc {
    font-size: 12.5px !important; /* Tamanho da fonte (forçado com !important) */
    color: rgba(255, 255, 255, 0.75) !important; /* Cor do texto (forçado com !important) */
    line-height: 1.5 !important; /* Altura da linha (forçado com !important) */
    margin: 10px 0 18px !important; /* Margem (forçado com !important) */
    position: relative !important; /* Fica acima do brilho decorativo (!important) */
}
.mega-menu-promo-arrow {
    display: inline-flex !important; /* Ativa flexbox mantendo inline (!important) */
    align-items: center !important; /* Centraliza no eixo cruzado (!important) */
    justify-content: center !important; /* Centraliza no eixo principal (!important) */
    width: 32px !important; /* Largura (forçado com !important) */
    height: 32px !important; /* Altura (forçado com !important) */
    border-radius: 50% !important; /* Formato circular (!important) */
    background: rgba(255, 255, 255, 0.12) !important; /* Cor de fundo (forçado com !important) */
    color: #ffffff !important; /* Cor do texto (forçado com !important) */
    font-style: normal !important; /* Remove itálico (!important) */
    margin-top: auto !important; /* Empurra para o fim do card (!important) */
    position: relative !important; /* Fica acima do brilho decorativo (!important) */
}
ul.navs > li.ul-end {
    flex: 1 1 0px !important; /* Define grow/shrink/basis do item flex: 1 1 0px (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: flex-end !important; /* Alinha os filhos no fim do eixo principal (!important) */
    margin-left: 0 !important; /* Margem esquerda: 0 (forçado com !important) */
    margin-top: 0 !important; /* Margem superior: 0 (forçado com !important) */
    gap: 16px !important; /* Espaço de 16px entre os itens (!important) */
}
li.ul-end a.glx-access {
    display: inline-flex !important; /* Ativa flexbox mantendo o elemento inline (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    gap: 8px !important; /* Espaço de 8px entre os itens (!important) */
    height: 34px !important; /* Altura: 34px (forçado com !important) */
    padding: 0 16px !important; /* Espaçamento interno: 0 16px (forçado com !important) */
    font-size: 12px !important; /* Tamanho da fonte: 12px (forçado com !important) */
    font-weight: 600 !important; /* Peso semi-negrito (!important) */
    border-radius: 6px !important; /* Arredonda os cantos: 6px (forçado com !important) */
    white-space: nowrap !important; /* Impede quebra de linha do texto (!important) */
    text-decoration: none !important; /* Remove sublinhado/decoração do texto (!important) */
    cursor: pointer !important; /* Muda o cursor para indicar que é clicável (!important) */
    transform: translateY(-12px) !important; /* Transformação (rotação, escala ou deslocamento): translateY(-12px) (forçado com !important) */
}
li.ul-end a.glx-access i,
li.ul-end a.glx-access svg {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    margin: 0 !important; /* Remove margem (!important) */
    padding: 0 !important; /* Remove espaçamento interno (!important) */
    font-size: 18px !important; /* Tamanho da fonte: 18px (forçado com !important) */
    line-height: 0 !important; /* Altura da linha do texto: 0 (forçado com !important) */
}
li.ul-end a.glx-access:not(.glx-access-fill) {
    border: 1px solid #00a0e3 !important; /* Borda: 1px solid #00a0e3 (forçado com !important) */
    color: #00a0e3 !important; /* Cor do texto: #00a0e3 (forçado com !important) */
    background: #FFF !important; /* Cor de fundo: #FFF (forçado com !important) */
}
li.ul-end a.glx-access-fill {
    border: 1px solid #00a0e3 !important; /* Borda: 1px solid #00a0e3 (forçado com !important) */
    background: #00a0e3 !important; /* Cor de fundo: #00a0e3 (forçado com !important) */
    color: #FFF !important; /* Cor do texto: #FFF (forçado com !important) */
}
.closex, .header-mob {
    display: none !important; /* Esconde o elemento e tira do fluxo (!important) */
}
ul.navs > li.ul-end > a.glx-access {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important; /* Anima a mudança de propriedade ao longo do tempo: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) (forçado com !important) */
}
ul.navs > li.ul-end > a.glx-access:hover {
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
    transform: translateY(-2px) !important; /* Transformação (rotação, escala ou deslocamento): translateY(-2px) (forçado com !important) */
    box-shadow: 0 6px 16px rgba(0, 160, 227, 0.35) !important; /* Sombra da caixa: 0 6px 16px rgba(0, 160, 227, 0.35) (forçado com !important) */
}
ul.navs > li.ul-end > a.glx-access:not(.glx-access-fill):hover {
    background-color: #00a0e3 !important; /* Cor de fundo: #00a0e3 (forçado com !important) */
    border-color: #00a0e3 !important; /* Cor da borda: #00a0e3 (forçado com !important) */
}
ul.navs > li.ul-end > a.glx-access.glx-access-fill:hover {
    background-color: #0082b8 !important; /* Cor de fundo: #0082b8 (forçado com !important) */
    border-color: #0082b8 !important; /* Cor da borda: #0082b8 (forçado com !important) */
}
ul.navs > li.ul-end > a.glx-access:hover i.icon-header,
ul.navs > li.ul-end > a.glx-access:hover i.i-login,
ul.navs > li.ul-end > a.glx-access:hover i.i-contact {
    filter: brightness(0) invert(1) !important; /* Filtro visual (blur, brilho, etc.): brightness(0) invert(1) (forçado com !important) */
}
.logo-galactix {
    cursor: pointer !important; /* Muda o cursor para indicar que é clicável (!important) */
    transition: all 0.3s ease !important; /* Anima a mudança de propriedade ao longo do tempo: all 0.3s ease (forçado com !important) */
}
.logo-galactix:not(.logo-core-active):hover {
    filter: drop-shadow(0 0 15px rgba(0, 160, 227, 0.6)) brightness(1.2) !important; /* Filtro visual (blur, brilho, etc.): drop-shadow(0 0 15px rgba(0, 160, 227, 0.6)) brightness(1.2) (forçado com !important) */
    transform: scale(1.05) !important; /* Transformação (rotação, escala ou deslocamento): scale(1.05) (forçado com !important) */
}
.logo-core-active {
    pointer-events: none !important; /* Impede clique e interação com o elemento (!important) */
    animation: logo-overload 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards !important; /* Aplica a animação: logo-overload 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards (forçado com !important) */
}
.monitores-flash {
    animation: monitor-emp-blast 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards !important; /* Aplica a animação: monitor-emp-blast 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards (forçado com !important) */
}
/* Define os quadros da animação "logo-overload" */
@keyframes logo-overload {
    0% {
        transform: scale(1) translate(0, 0); /* Transformação (rotação, escala ou deslocamento): scale(1) translate(0, 0) */
        filter: brightness(1); /* Filtro visual (blur, brilho, etc.): brightness(1) */
    }
    10% {
        transform: scale(0.9) translate(-4px, 4px); /* Transformação (rotação, escala ou deslocamento): scale(0.9) translate(-4px, 4px) */
        filter: drop-shadow(-5px 0 0px #00e5ff) drop-shadow(5px 0 0px #ff003c) brightness(2); /* Filtro visual (blur, brilho, etc.): drop-shadow(-5px 0 0px #00e5ff) drop-shadow(5px 0 0px #ff003c) brightness(2) */
    }
    20% {
        transform: scale(1.1) translate(4px, -4px); /* Transformação (rotação, escala ou deslocamento): scale(1.1) translate(4px, -4px) */
        filter: drop-shadow(5px 0 0px #00e5ff) drop-shadow(-5px 0 0px #ff003c) brightness(3); /* Filtro visual (blur, brilho, etc.): drop-shadow(5px 0 0px #00e5ff) drop-shadow(-5px 0 0px #ff003c) brightness(3) */
    }
    30% {
        transform: scale(0.95) translate(-2px, -2px); /* Transformação (rotação, escala ou deslocamento): scale(0.95) translate(-2px, -2px) */
        filter: drop-shadow(-3px 0 0px #ff003c) brightness(1.5); /* Filtro visual (blur, brilho, etc.): drop-shadow(-3px 0 0px #ff003c) brightness(1.5) */
    }
    40% {
        transform: scale(1.05) translate(2px, 2px); /* Transformação (rotação, escala ou deslocamento): scale(1.05) translate(2px, 2px) */
        filter: drop-shadow(3px 0 0px #00e5ff) brightness(2); /* Filtro visual (blur, brilho, etc.): drop-shadow(3px 0 0px #00e5ff) brightness(2) */
    }
    50% {
        transform: scale(1.15) translate(0, 0); /* Transformação (rotação, escala ou deslocamento): scale(1.15) translate(0, 0) */
        filter: drop-shadow(0 0 60px rgba(0, 160, 227, 1)) brightness(3); /* Filtro visual (blur, brilho, etc.): drop-shadow(0 0 60px rgba(0, 160, 227, 1)) brightness(3) */
    }
    80% {
        transform: scale(0.98); /* Transformação (rotação, escala ou deslocamento): scale(0.98) */
        filter: drop-shadow(0 0 20px rgba(0, 160, 227, 0.8)) brightness(1.2); /* Filtro visual (blur, brilho, etc.): drop-shadow(0 0 20px rgba(0, 160, 227, 0.8)) brightness(1.2) */
    }
    100% {
        transform: scale(1); /* Transformação (rotação, escala ou deslocamento): scale(1) */
        filter: drop-shadow(0 0 0px transparent) brightness(1); /* Filtro visual (blur, brilho, etc.): drop-shadow(0 0 0px transparent) brightness(1) */
    }
}
/* Define os quadros da animação "monitor-emp-blast" */
@keyframes monitor-emp-blast {
    0% {
        filter: brightness(1) contrast(1) blur(0px); /* Filtro visual (blur, brilho, etc.): brightness(1) contrast(1) blur(0px) */
        transform: scale(1) translate(0); /* Transformação (rotação, escala ou deslocamento): scale(1) translate(0) */
    }
    5% {
        filter: brightness(0.2) contrast(3); /* Filtro visual (blur, brilho, etc.): brightness(0.2) contrast(3) */
        transform: scale(0.98) translate(-2px, 2px); /* Transformação (rotação, escala ou deslocamento): scale(0.98) translate(-2px, 2px) */
    }
    10% {
        filter: brightness(4) contrast(1.5) drop-shadow(0 0 60px #00e5ff) blur(2px); /* Filtro visual (blur, brilho, etc.): brightness(4) contrast(1.5) drop-shadow(0 0 60px #00e5ff) blur(2px) */
        transform: scale(1.04) translate(3px, -3px) skewX(2deg); /* Transformação (rotação, escala ou deslocamento): scale(1.04) translate(3px, -3px) skewX(2deg) */
    }
    15% {
        filter: invert(1) brightness(2) hue-rotate(180deg) drop-shadow(0 0 30px #ff003c); /* Filtro visual (blur, brilho, etc.): invert(1) brightness(2) hue-rotate(180deg) drop-shadow(0 0 30px #ff003c) */
        transform: scale(0.99) translate(-4px, 1px) skewX(-2deg); /* Transformação (rotação, escala ou deslocamento): scale(0.99) translate(-4px, 1px) skewX(-2deg) */
    }
    20% {
        filter: invert(0) brightness(3) drop-shadow(0 0 100px #00a0e3) blur(1px); /* Filtro visual (blur, brilho, etc.): invert(0) brightness(3) drop-shadow(0 0 100px #00a0e3) blur(1px) */
        transform: scale(1.02) translate(2px, -2px); /* Transformação (rotação, escala ou deslocamento): scale(1.02) translate(2px, -2px) */
    }
    30% {
        filter: brightness(0.5); /* Filtro visual (blur, brilho, etc.): brightness(0.5) */
        transform: scale(0.99) translate(0); /* Transformação (rotação, escala ou deslocamento): scale(0.99) translate(0) */
    }
    40% {
        filter: brightness(1.5) drop-shadow(0 0 40px #00a0e3); /* Filtro visual (blur, brilho, etc.): brightness(1.5) drop-shadow(0 0 40px #00a0e3) */
        transform: scale(1.01); /* Transformação (rotação, escala ou deslocamento): scale(1.01) */
    }
    100% {
        filter: brightness(1) contrast(1) blur(0px); /* Filtro visual (blur, brilho, etc.): brightness(1) contrast(1) blur(0px) */
        transform: scale(1); /* Transformação (rotação, escala ou deslocamento): scale(1) */
    }
}
.container-showcase-float {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: row !important; /* Alinha os filhos lado a lado na horizontal (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    align-items: stretch !important; /* Estica os filhos para preencher o eixo cruzado (!important) */
    gap: 24px !important; /* Espaço de 24px entre os itens (!important) */
    margin: 26px auto 0 auto !important; /* Margem: 70px auto 0 auto (forçado com !important) */
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    z-index: 10 !important; /* Camada de sobreposição (quanto maior, mais na frente): 10 (forçado com !important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    max-width: 1400px !important; /* Largura máxima: 1400px (forçado com !important) */
    box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
}
.showcase-col-box {
    flex: 1 !important; /* Define grow/shrink/basis do item flex: 1 (forçado com !important) */
    float: none !important; /* Remove flutuação (!important) */
    width: auto !important; /* Largura automática, ajusta ao conteúdo (!important) */
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    overflow: hidden !important; /* Esconde o que ultrapassar os limites do elemento (!important) */
    background: rgba(255, 255, 255, 0.65) !important; /* Cor de fundo: rgba(255, 255, 255, 0.65) (forçado com !important) */
    backdrop-filter: blur(12px) !important; /* Desfoca o que fica atrás do elemento: blur(12px) (forçado com !important) */
    -webkit-backdrop-filter: blur(12px) !important; /* -webkit-backdrop-filter: blur(12px) (forçado com !important) */
    border: 1px solid rgba(255, 255, 255, 0.8) !important; /* Borda: 1px solid rgba(255, 255, 255, 0.8) (forçado com !important) */
    border-radius: 16px !important; /* Arredonda os cantos: 16px (forçado com !important) */
    padding: 32px 24px !important; /* Espaçamento interno: 32px 24px (forçado com !important) */
    box-shadow: 
        
        0 20px 40px rgba(15, 23, 42, 0.08), 
        
        0 4px 12px rgba(15, 23, 42, 0.04),  
        
        inset 0 0 0 1px rgba(255, 255, 255, 0.9) !important; /* Sombra da caixa: 0 20px 40px rgba(15, 23, 42, 0.08), 
        
        0 4px 12px rgba(15, 23, 42, 0.04),  
        
        inset 0 0 0 1px rgba(255, 255, 255, 0.9) (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    align-items: flex-start !important; /* Alinha os filhos no início do eixo cruzado (!important) */
    text-align: left !important; /* Alinha o texto à esquerda (!important) */
    cursor: pointer !important; /* Muda o cursor para indicar que é clicável (!important) */
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
    will-change: transform, background, border-color !important; /* Avisa o navegador para otimizar a propriedade: transform, background, border-color (forçado com !important) */
    -webkit-backface-visibility: hidden !important; /* -webkit-backface-visibility: hidden (forçado com !important) */
    backface-visibility: hidden !important; /* backface-visibility: hidden (forçado com !important) */
    transform: translateZ(0) !important; /* Transformação (rotação, escala ou deslocamento): translateZ(0) (forçado com !important) */
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), background 0.4s ease, border-color 0.4s ease !important; /* Anima a mudança de propriedade ao longo do tempo: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), background 0.4s ease, border-color 0.4s ease (forçado com !important) */
}
.showcase-col-box img {
    width: 44px !important; /* Largura: 44px (forçado com !important) */
    height: 44px !important; /* Altura: 44px (forçado com !important) */
    object-fit: contain !important; /* Encaixa a imagem inteira no espaço (!important) */
    float: left !important; /* Flutua o elemento para a esquerda (!important) */
    margin: 0 0 20px 0 !important; /* Margem: 0 0 20px 0 (forçado com !important) */
    transition: all 0.3s ease !important; /* Anima a mudança de propriedade ao longo do tempo: all 0.3s ease (forçado com !important) */
}
.showcase-col-box p:nth-of-type(1) {
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
    font-size: 13px !important; /* Tamanho da fonte: 13px (forçado com !important) */
    font-weight: 700 !important; /* Deixa o texto em negrito (!important) */
    color: #475569 !important; /* Cor do texto: #475569 (forçado com !important) */
    letter-spacing: 1px !important; /* Espaçamento entre letras: 1px (forçado com !important) */
    text-transform: uppercase !important; /* Transforma o texto em maiúsculas (!important) */
    margin: 0 0 12px 0 !important; /* Margem: 0 0 12px 0 (forçado com !important) */
    text-shadow: none !important; /* Sombra no texto: none (forçado com !important) */
    transition: color 0.3s ease !important; /* Anima a mudança de propriedade ao longo do tempo: color 0.3s ease (forçado com !important) */
}
.showcase-col-box p:nth-of-type(2) {
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
    font-size: 14px !important; /* Tamanho da fonte: 14px (forçado com !important) */
    color: #334155 !important; /* Cor do texto: #334155 (forçado com !important) */
    line-height: 1.65 !important; /* Altura da linha do texto: 1.65 (forçado com !important) */
    font-weight: 400 !important; /* Peso normal da fonte (!important) */
    margin: 0 !important; /* Remove margem (!important) */
    text-shadow: none !important; /* Sombra no texto: none (forçado com !important) */
    transition: color 0.3s ease !important; /* Anima a mudança de propriedade ao longo do tempo: color 0.3s ease (forçado com !important) */
}
.showcase-col-box:hover {
    transform: translateY(-12px) translateZ(0) !important; /* Transformação (rotação, escala ou deslocamento): translateY(-12px) translateZ(0) (forçado com !important) */
    background: 
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.45) 0%, transparent 60%),  
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.25) 0%, transparent 55%),  
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.2) 0%, transparent 60%),  
        #060913 !important; /* Fundo em gradiente: radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.45) 0%, transparent 60%),  
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.25) 0%, transparent 55%),  
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.2) 0%, transparent 60%),  
        #060913 (forçado com !important) */
    border-color: rgba(0, 160, 223, 0.4) !important; /* Cor da borda: rgba(0, 160, 223, 0.4) (forçado com !important) */
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.4) !important; /* Sombra da caixa: 0 25px 50px rgba(0, 0, 0, 0.4) (forçado com !important) */
}
.showcase-col-box:hover p:nth-of-type(1) {
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
}
.showcase-col-box:hover p:nth-of-type(2) {
    color: rgba(255, 255, 255, 0.9) !important; /* Cor do texto: rgba(255, 255, 255, 0.9) (forçado com !important) */
}
.showcase-col-box p:nth-of-type(1) span {
    color: #4f46e5 !important; /* Cor do texto: #4f46e5 (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
}
.showcase-col-box:hover p:nth-of-type(1) span {
    color: #6366f1 !important; /* Cor do texto: #6366f1 (forçado com !important) */
    text-shadow: 0 2px 10px rgba(99, 102, 241, 0.4) !important; /* Sombra no texto: 0 2px 10px rgba(99, 102, 241, 0.4) (forçado com !important) */
}
.container {
    max-width: 1200px; /* Largura máxima: 1200px */
    margin: 60px auto 40px; /* Margem: 60px auto 40px */
    padding: 0 20px; /* Espaçamento interno: 0 20px */
    clear: both; /* Impede que o elemento fique ao lado de elementos flutuantes: both */
}
.h2-title {
    font-size: 1.5rem; /* Tamanho da fonte: 1.5rem */
    color: #1a1a1a; /* Cor do texto: #1a1a1a */
    line-height: 1.4; /* Altura da linha do texto: 1.4 */
    margin-bottom: 24px; /* Margem inferior: 24px */
}
.h3-subtitle {
    font-size: 13pt !important; /* Tamanho da fonte: 13pt (forçado com !important) */
    line-height: 1.6 !important; /* Altura da linha do texto: 1.6 (forçado com !important) */
    font-weight: 500 !important; /* Peso da fonte: 500 (forçado com !important) */
    color: #4a5568 !important; /* Cor do texto: #4a5568 (forçado com !important) */
    margin: 0 auto 40px !important; /* Margem: 0 auto 40px (forçado com !important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    max-width: 1400px !important; /* Largura máxima: 1400px (forçado com !important) */
}
.sub-video {
    position: absolute; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative */
    right: 60px; /* Distância a partir do(a) direita: 60px */
    top: 60px; /* Distância a partir do(a) topo: 60px */
    margin-bottom: 16px;
}
.subtitle-video {
    font-size: 35pt; /* Tamanho da fonte: 35pt */
    color: #FFF; /* Cor do texto: #FFF */
    width: 350px; /* Largura: 350px */
}
.subtitle-button {
    display: block; /* Muda para block, ocupa a linha toda */
    background-color: #333; /* Cor de fundo: #333 */
    color: #FFF; /* Cor do texto: #FFF */
    border-radius: 10px; /* Arredonda os cantos: 10px */
    padding: 10px; /* Espaçamento interno: 10px */
    width: 240px; /* Largura: 240px */
    text-decoration: none; /* Remove sublinhado/decoração do texto */
    text-align: center; /* Centraliza o texto */
    font-size: 11pt; /* Tamanho da fonte: 11pt */
}
video {
    width: 100%; /* Ocupa 100% da largura do pai */
    border-radius: 20px; /* Arredonda os cantos: 20px */
    display: block;
    margin-bottom: 0 !important;
}
.map-galactix {
    background-image: url('../img/map_galactix.png?912'); /* Imagem de fundo: url('../img/map_galactix.png?912') */
    width: 212px; /* Largura: 212px */
    height: 60px; /* Altura: 60px */
    display: block; /* Muda para block, ocupa a linha toda */
}
.galactix-intro-transition {
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    padding: 32px 24px 32px 32px !important; /* Espaçamento interno: 80px 24px 100px 24px (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    margin: -24px 0 0 0 !important; /* 
    box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
}
.intro-asymmetric-grid {
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    max-width: 1200px !important; /* Largura máxima: 1200px (forçado com !important) */
    display: grid !important; /* Ativa grid nos filhos diretos (!important) */
    grid-template-columns: 1.2fr auto 1fr !important; /* Define as colunas do grid: 1.2fr auto 1fr (forçado com !important) */
    gap: 50px !important; /* Espaço de 50px entre os itens (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    text-align: left !important; /* Alinha o texto à esquerda (!important) */
}
.intro-left-block {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    align-items: flex-start !important; /* Alinha os filhos no início do eixo cruzado (!important) */
    gap: 16px !important; /* Espaço de 16px entre os itens (!important) */
    align-self: flex-start !important; /* Sobrescreve o alinhamento deste item no eixo cruzado: flex-start (forçado com !important) */
    transform: translateY(-10px) !important; /* Transformação (rotação, escala ou deslocamento): translateY(-20px) (forçado com !important) */
}
.intro-badge {
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
    font-size: 11px !important; /* Tamanho da fonte: 11px (forçado com !important) */
    font-weight: 700 !important; /* Deixa o texto em negrito (!important) */
    color: #4f46e5 !important; /* Cor do texto: #4f46e5 (forçado com !important) */
    letter-spacing: 1.5px !important; /* Espaçamento entre letras: 1.5px (forçado com !important) */
    text-transform: uppercase !important; /* Transforma o texto em maiúsculas (!important) */
    background: rgba(79, 70, 229, 0.08) !important; /* Cor de fundo: rgba(79, 70, 229, 0.08) (forçado com !important) */
    padding: 6px 14px !important; /* Espaçamento interno: 6px 14px (forçado com !important) */
    border-radius: 6px !important; /* Arredonda os cantos: 6px (forçado com !important) */
    border: 1px solid rgba(79, 70, 229, 0.2) !important; /* Borda: 1px solid rgba(79, 70, 229, 0.2) (forçado com !important) */
    display: inline-flex !important; /* Ativa flexbox mantendo o elemento inline (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    gap: 8px !important; /* Espaço de 8px entre os itens (!important) */
}
.led-dot {
    width: 6px !important; /* Largura: 6px (forçado com !important) */
    height: 6px !important; /* Altura: 6px (forçado com !important) */
    background-color: #6366f1 !important; /* Cor de fundo: #6366f1 (forçado com !important) */
    border-radius: 50% !important; /* Arredonda os cantos: 50% (forçado com !important) */
    display: inline-block !important; /* Vira inline-block, fica na linha mas aceita largura/altura (!important) */
    box-shadow: 0 0 8px #6366f1 !important; /* Sombra da caixa: 0 0 8px #6366f1 (forçado com !important) */
}
.intro-left-block .intro-badge {
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    top: -20px !important; /* Distância a partir do(a) topo: -20px (forçado com !important) */
}
.intro-title {
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
    font-size: 40px !important; /* Tamanho da fonte: 40px (forçado com !important) */
    color: #090d16 !important; /* Cor do texto: #090d16 (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    line-height: 1.25 !important; /* Altura da linha do texto: 1.25 (forçado com !important) */
    letter-spacing: -1.5px !important; /* Espaçamento entre letras: -1.5px (forçado com !important) */
    margin: 0 !important; /* Remove margem (!important) */
}
.intro-title b {
    color: #6366f1 !important; /* Cor do texto: #6366f1 (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
}
.intro-divider-line {
    width: 1px !important; /* Largura: 1px (forçado com !important) */
    height: 120px !important; /* Altura: 120px (forçado com !important) */
    background: linear-gradient(to bottom, transparent, rgba(15, 23, 42, 0.15), transparent) !important; /* Fundo em gradiente: linear-gradient(to bottom, transparent, rgba(15, 23, 42, 0.15), transparent) (forçado com !important) */
}
.intro-right-block {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
}
.intro-subtitle {
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
    font-size: 19px !important; /* Tamanho da fonte: 19px (forçado com !important) */
    color: #334155 !important; /* Cor do texto: #334155 (forçado com !important) */
    line-height: 1.75 !important; /* Altura da linha do texto: 1.75 (forçado com !important) */
    font-weight: 500 !important; /* Peso da fonte: 500 (forçado com !important) */
    letter-spacing: -0.3px !important; /* Espaçamento entre letras: -0.3px (forçado com !important) */
    margin: 0 !important; /* Remove margem (!important) */
}
.galactix-hero-section {
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    height: 75vh !important; /* Altura: 75vh (forçado com !important) */
    min-height: 500px !important; /* Altura mínima: 500px (forçado com !important) */
    max-height: 700px !important; /* Altura máxima: 700px (forçado com !important) */
    background-image: url('../../assets/img/background-commerce.jpg') !important; /* Imagem de fundo: url('../img/produto.jpg') (forçado com !important) */
    background-size: contain !important; /* Tamanho da imagem de fundo: Imagem cabe inteira dentro do espaço (!important) */
    background-position: center center !important; /* Posição da imagem de fundo: center center (forçado com !important) */
    background-repeat: no-repeat !important; /* Repetição da imagem de fundo: no-repeat (forçado com !important) */
    background-color: #eef2f6 !important; /* Cor de fundo: #eef2f6 (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: flex-end !important; /* Alinha os filhos no fim do eixo cruzado (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    margin-top: 0 !important;
}
.hero-content-wrapper {
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    max-width: 1350px !important; /* Largura máxima: 1350px (forçado com !important) */
    padding-bottom: 40px !important; /* Espaçamento interno inferior: 40px (forçado com !important) */
}
.hero-cta-wrapper {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
}
.btn-galactix-invisible {
    display: inline-block !important; /* Vira inline-block, fica na linha mas aceita largura/altura (!important) */
    width: 280px !important; /* Largura: 280px (forçado com !important) */
    height: 50px !important; /* Altura: 50px (forçado com !important) */
    text-indent: -9999px !important; /* text-indent: -9999px (forçado com !important) */
    cursor: pointer !important; /* Muda o cursor para indicar que é clicável (!important) */
    background: transparent !important; /* Remove a cor de fundo (!important) */
}
.galactix-modules-section {
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    background-color: #ebf1f6 !important; /* Cor de fundo: #ebf1f6 (forçado com !important) */
    padding: 32px 24px 20px 24px !important; /* Espaçamento interno: 100px 24px 20px 24px (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    margin: 0 !important; /* Remove margem (!important) */
    box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
}
.modules-container {
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    max-width: 1200px !important; /* Largura máxima: 1200px (forçado com !important) */
    display: grid !important; /* Ativa grid nos filhos diretos (!important) */
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important; /* Cria colunas automáticas que se ajustam à largura disponível: repeat(auto-fit, minmax(260px, 1fr)) (forçado com !important) */
    gap: 24px !important; /* Espaço de 24px entre os itens (!important) */
}
.interactive-module-card {
    background: rgba(255, 255, 255, 0.65) !important; /* Cor de fundo: rgba(255, 255, 255, 0.65) (forçado com !important) */
    backdrop-filter: blur(12px) !important; /* Desfoca o que fica atrás do elemento: blur(12px) (forçado com !important) */
    border: 1px solid rgba(255, 255, 255, 0.8) !important; /* Borda: 1px solid rgba(255, 255, 255, 0.8) (forçado com !important) */
    border-radius: 16px !important; /* Arredonda os cantos: 16px (forçado com !important) */
    padding: 32px 24px !important; /* Espaçamento interno: 32px 24px (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    align-items: flex-start !important; /* Alinha os filhos no início do eixo cruzado (!important) */
    text-align: left !important; /* Alinha o texto à esquerda (!important) */
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    overflow: hidden !important; /* Esconde o que ultrapassar os limites do elemento (!important) */
    box-shadow: 0 10px 30px rgba(148, 163, 184, 0.08) !important; /* Sombra da caixa: 0 10px 30px rgba(148, 163, 184, 0.08) (forçado com !important) */
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important; /* Anima a mudança de propriedade ao longo do tempo: all 0.4s cubic-bezier(0.16, 1, 0.3, 1) (forçado com !important) */
    cursor: pointer !important; /* Muda o cursor para indicar que é clicável (!important) */
}
.card-icon-wrapper {
    width: 44px !important; /* Largura: 44px (forçado com !important) */
    height: 44px !important; /* Altura: 44px (forçado com !important) */
    background: #ffffff !important; /* Cor de fundo: #ffffff (forçado com !important) */
    border-radius: 10px !important; /* Arredonda os cantos: 10px (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    color: #4f46e5 !important; /* Cor do texto: #4f46e5 (forçado com !important) */
    box-shadow: 0 4px 12px rgba(79, 70, 229, 0.06) !important; /* Sombra da caixa: 0 4px 12px rgba(79, 70, 229, 0.06) (forçado com !important) */
    margin-bottom: 24px !important; /* Margem inferior: 24px (forçado com !important) */
    transition: all 0.3s ease !important; /* Anima a mudança de propriedade ao longo do tempo: all 0.3s ease (forçado com !important) */
}
.card-icon-wrapper svg {
    width: 20px !important; /* Largura: 20px (forçado com !important) */
    height: 20px !important; /* Altura: 20px (forçado com !important) */
}
.module-card-title {
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
    font-size: 13px !important; /* Tamanho da fonte: 13px (forçado com !important) */
    font-weight: 700 !important; /* Deixa o texto em negrito (!important) */
    color: #475569 !important; /* Cor do texto: #475569 (forçado com !important) */
    letter-spacing: 1px !important; /* Espaçamento entre letras: 1px (forçado com !important) */
    text-transform: uppercase !important; /* Transforma o texto em maiúsculas (!important) */
    margin: 0 0 12px 0 !important; /* Margem: 0 0 12px 0 (forçado com !important) */
}
.module-card-title span {
    color: #4f46e5 !important; /* Cor do texto: #4f46e5 (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
}
.module-card-text {
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
    font-size: 14px !important; /* Tamanho da fonte: 14px (forçado com !important) */
    color: #334155 !important; /* Cor do texto: #334155 (forçado com !important) */
    line-height: 1.65 !important; /* Altura da linha do texto: 1.65 (forçado com !important) */
    font-weight: 400 !important; /* Peso normal da fonte (!important) */
    margin: 0 !important; /* Remove margem (!important) */
}
.card-hover-border {
    position: absolute !important; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative (!important) */
    bottom: 0 !important; /* Distância a partir do(a) base: 0 (forçado com !important) */
    left: 0 !important; /* Distância a partir do(a) esquerda: 0 (forçado com !important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    height: 4px !important; /* Altura: 4px (forçado com !important) */
    background: linear-gradient(90deg, #6366f1, #8b5cf6) !important; /* Fundo em gradiente: linear-gradient(90deg, #6366f1, #8b5cf6) (forçado com !important) */
    transform: scaleX(0) !important; /* Transformação (rotação, escala ou deslocamento): scaleX(0) (forçado com !important) */
    transition: transform 0.3s ease !important; /* Anima a mudança de propriedade ao longo do tempo: transform 0.3s ease (forçado com !important) */
    transform-origin: left !important; /* Ponto de referência da transformação: left (forçado com !important) */
}
.interactive-module-card:hover {
    transform: translateY(-6px) !important; /* Transformação (rotação, escala ou deslocamento): translateY(-6px) (forçado com !important) */
    box-shadow: 0 20px 40px rgba(79, 70, 229, 0.1) !important; /* Sombra da caixa: 0 20px 40px rgba(79, 70, 229, 0.1) (forçado com !important) */
    background: 
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),  
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),  
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),  
        #060913 !important; /* Fundo em gradiente: radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),  
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),  
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),  
        #060913 (forçado com !important) */
}
.interactive-module-card:hover .card-icon-wrapper {
    background: #4f46e5 !important; /* Cor de fundo: #4f46e5 (forçado com !important) */
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
}
.interactive-module-card:hover .card-hover-border {
    transform: scaleX(1) !important; /* Transformação (rotação, escala ou deslocamento): scaleX(1) (forçado com !important) */
}
.interactive-module-card:hover .module-card-text {
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
    opacity: 0.95 !important; /* Transparência do elemento (0 invisível, 1 opaco): 0.95 (forçado com !important) */
}
.interactive-module-card:hover .module-card-title {
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
}
.interactive-module-card:hover .module-card-title span {
    color: #6366f1 !important; /* Cor do texto: #6366f1 (forçado com !important) */
    text-shadow: 0 2px 10px rgba(99, 102, 241, 0.3) !important; /* Sombra no texto: 0 2px 10px rgba(99, 102, 241, 0.3) (forçado com !important) */
}
.interactive-module-card:hover .card-icon-wrapper {
    background: rgba(255, 255, 255, 0.15) !important; /* Cor de fundo: rgba(255, 255, 255, 0.15) (forçado com !important) */
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
    backdrop-filter: blur(4px) !important; /* Desfoca o que fica atrás do elemento: blur(4px) (forçado com !important) */
    border: 1px solid rgba(255, 255, 255, 0.2) !important; /* Borda: 1px solid rgba(255, 255, 255, 0.2) (forçado com !important) */
}
.galactix-deepdata-section {
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    background-color: #ebf1f6 !important; /* Cor de fundo: #ebf1f6 (forçado com !important) */
    padding: 32px 24px 32px 24px !important; /* Espaçamento interno: 100px 24px 30px 24px (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    margin: 0 !important; /* Remove margem (!important) */
    box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
}
.deepdata-grid-container {
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    max-width: 1200px !important; /* Largura máxima: 1200px (forçado com !important) */
    display: grid !important; /* Ativa grid nos filhos diretos (!important) */
    grid-template-columns: 1fr 1.1fr !important; /* Define as colunas do grid: 1fr 1.1fr (forçado com !important) */
    gap: 60px !important; /* Espaço de 60px entre os itens (!important) */
    align-items: start !important; /* start (!important) */
}
.deepdata-showcase-block {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    align-items: flex-start !important; /* Alinha os filhos no início do eixo cruzado (!important) */
    text-align: left !important; /* Alinha o texto à esquerda (!important) */
    position: sticky !important; /* Fica fixo ao rolar a página dentro dos limites do pai (!important) */
    top: 140px !important; /* Distância a partir do(a) topo: 140px (forçado com !important) */
}
.deepdata-brand-badge {
    font-size: 11px !important; /* Tamanho da fonte: 11px (forçado com !important) */
    font-weight: 700 !important; /* Deixa o texto em negrito (!important) */
    color: #4f46e5 !important; /* Cor do texto: #4f46e5 (forçado com !important) */
    letter-spacing: 1.5px !important; /* Espaçamento entre letras: 1.5px (forçado com !important) */
    text-transform: uppercase !important; /* Transforma o texto em maiúsculas (!important) */
    background: #ffffff !important; /* Cor de fundo: #ffffff (forçado com !important) */
    padding: 6px 14px !important; /* Espaçamento interno: 6px 14px (forçado com !important) */
    border-radius: 6px !important; /* Arredonda os cantos: 6px (forçado com !important) */
    border: 1px solid rgba(79, 70, 229, 0.15) !important; /* Borda: 1px solid rgba(79, 70, 229, 0.15) (forçado com !important) */
    display: inline-flex !important; /* Ativa flexbox mantendo o elemento inline (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    gap: 8px !important; /* Espaço de 8px entre os itens (!important) */
    margin-bottom: 24px !important; /* Margem inferior: 24px (forçado com !important) */
    box-shadow: 0 4px 12px rgba(148, 163, 184, 0.05) !important; /* Sombra da caixa: 0 4px 12px rgba(148, 163, 184, 0.05) (forçado com !important) */
}
.brand-dot {
    width: 6px !important; /* Largura: 6px (forçado com !important) */
    height: 6px !important; /* Altura: 6px (forçado com !important) */
    background-color: #4f46e5 !important; /* Cor de fundo: #4f46e5 (forçado com !important) */
    border-radius: 50% !important; /* Arredonda os cantos: 50% (forçado com !important) */
    display: inline-block !important; /* Vira inline-block, fica na linha mas aceita largura/altura (!important) */
}
.deepdata-main-title {
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
    font-size: 38px !important; /* Tamanho da fonte: 38px (forçado com !important) */
    color: #090d16 !important; /* Cor do texto: #090d16 (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    line-height: 1.3 !important; /* Altura da linha do texto: 1.3 (forçado com !important) */
    letter-spacing: -1.2px !important; /* Espaçamento entre letras: -1.2px (forçado com !important) */
    margin: 0 0 20px 0 !important; /* Margem: 0 0 20px 0 (forçado com !important) */
}
.deepdata-main-title span {
    color: #6366f1 !important; /* Cor do texto: #6366f1 (forçado com !important) */
}
.deepdata-description {
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
    font-size: 17px !important; /* Tamanho da fonte: 17px (forçado com !important) */
    color: #475569 !important; /* Cor do texto: #475569 (forçado com !important) */
    line-height: 1.7 !important; /* Altura da linha do texto: 1.7 (forçado com !important) */
    font-weight: 400 !important; /* Peso normal da fonte (!important) */
    margin: 0 !important; /* Remove margem (!important) */
}
.deepdata-features-grid {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    gap: 16px !important; /* Espaço de 16px entre os itens (!important) */
}
.feature-item-box {
    background: rgba(255, 255, 255, 0.5) !important; /* Cor de fundo: rgba(255, 255, 255, 0.5) (forçado com !important) */
    border: 1px solid rgba(255, 255, 255, 0.7) !important; /* Borda: 1px solid rgba(255, 255, 255, 0.7) (forçado com !important) */
    border-radius: 12px !important; /* Arredonda os cantos: 12px (forçado com !important) */
    padding: 20px 24px !important; /* Espaçamento interno: 20px 24px (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    gap: 20px !important; /* Espaço de 20px entre os itens (!important) */
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important; /* Anima a mudança de propriedade ao longo do tempo: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) (forçado com !important) */
}
.feature-icon-circle {
    width: 42px !important; /* Largura: 42px (forçado com !important) */
    height: 42px !important; /* Altura: 42px (forçado com !important) */
    background: #ffffff !important; /* Cor de fundo: #ffffff (forçado com !important) */
    border-radius: 50% !important; /* Arredonda os cantos: 50% (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    color: #4f46e5 !important; /* Cor do texto: #4f46e5 (forçado com !important) */
    box-shadow: 0 4px 10px rgba(79, 70, 229, 0.05) !important; /* Sombra da caixa: 0 4px 10px rgba(79, 70, 229, 0.05) (forçado com !important) */
    flex-shrink: 0 !important; /* Fator de encolhimento do item flex: 0 (forçado com !important) */
    transition: all 0.3s ease !important; /* Anima a mudança de propriedade ao longo do tempo: all 0.3s ease (forçado com !important) */
}
.feature-icon-circle svg {
    width: 18px !important; /* Largura: 18px (forçado com !important) */
    height: 18px !important; /* Altura: 18px (forçado com !important) */
}
.feature-text-content {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    gap: 4px !important; /* Espaço de 4px entre os itens (!important) */
    text-align: left !important; /* Alinha o texto à esquerda (!important) */
}
.feature-text-content h5 {
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
    font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
    font-weight: 700 !important; /* Deixa o texto em negrito (!important) */
    color: #1e293b !important; /* Cor do texto: #1e293b (forçado com !important) */
    margin: 0 !important; /* Remove margem (!important) */
}
.feature-text-content p {
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
    font-size: 14px !important; /* Tamanho da fonte: 14px (forçado com !important) */
    color: #64748b !important; /* Cor do texto: #64748b (forçado com !important) */
    margin: 0 !important; /* Remove margem (!important) */
    line-height: 1.5 !important; /* Altura da linha do texto: 1.5 (forçado com !important) */
}
.feature-item-box:hover {
    background: #ffffff !important; /* Cor de fundo: #ffffff (forçado com !important) */
    transform: translateX(6px) !important; /* Transformação (rotação, escala ou deslocamento): translateX(6px) (forçado com !important) */
    box-shadow: 0 10px 25px rgba(79, 70, 229, 0.06) !important; /* Sombra da caixa: 0 10px 25px rgba(79, 70, 229, 0.06) (forçado com !important) */
    border-color: rgba(79, 70, 229, 0.2) !important; /* Cor da borda: rgba(79, 70, 229, 0.2) (forçado com !important) */
}
.feature-item-box:hover .feature-icon-circle {
    background: #4f46e5 !important; /* Cor de fundo: #4f46e5 (forçado com !important) */
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
}
.form-contact input,
.form-contact select,
.form-contact .btn-send {
    box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    max-width: 100% !important; /* Não deixa ultrapassar 100% do pai (!important) */
    height: 54px !important; /* Altura: 54px (forçado com !important) */
}
.form-contact input,
.form-contact select {
    padding: 0 16px !important; /* Espaçamento interno: 0 16px (forçado com !important) */
    margin-bottom: 16px !important; /* Margem inferior: 16px (forçado com !important) */
    font-size: 15px !important; /* Tamanho da fonte: 15px (forçado com !important) */
    border-radius: 8px !important; /* Arredonda os cantos: 8px (forçado com !important) */
}
.form-contact .btn-send {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    margin-top: 8px !important; /* Margem superior: 8px (forçado com !important) */
    background: linear-gradient(135deg, #00a0e3 0%, #005c99 100%) !important; /* Fundo em gradiente: linear-gradient(135deg, #00a0e3 0%, #005c99 100%) (forçado com !important) */
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
    font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
    font-weight: 700 !important; /* Deixa o texto em negrito (!important) */
    border: 1px solid rgba(255, 255, 255, 0.1) !important; /* Borda: 1px solid rgba(255, 255, 255, 0.1) (forçado com !important) */
    border-radius: 8px !important; /* Arredonda os cantos: 8px (forçado com !important) */
    box-shadow: 0 8px 25px -5px rgba(0, 160, 227, 0.4) !important; /* Sombra da caixa: 0 8px 25px -5px rgba(0, 160, 227, 0.4) (forçado com !important) */
    cursor: pointer !important; /* Muda o cursor para indicar que é clicável (!important) */
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important; /* Anima a mudança de propriedade ao longo do tempo: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) (forçado com !important) */
}
.form-contact .btn-send:hover {
    transform: translateY(-3px) scale(1.01) !important; /* Transformação (rotação, escala ou deslocamento): translateY(-3px) scale(1.01) (forçado com !important) */
    box-shadow: 0 15px 35px -5px rgba(0, 160, 227, 0.6), inset 0 2px 2px rgba(255, 255, 255, 0.2) !important; /* Sombra da caixa: 0 15px 35px -5px rgba(0, 160, 227, 0.6), inset 0 2px 2px rgba(255, 255, 255, 0.2) (forçado com !important) */
}
.h2-mob {
    text-align: center; /* Centraliza o texto */
}
.container-geral {
    width: 1024px; /* Largura: 1024px */
    margin: 0 auto; /* Zera margem vertical e centraliza na horizontal */
    padding: 40px 10px 0; /* Espaçamento interno: 40px 10px 0 */
    clear: left; /* Impede que o elemento fique ao lado de elementos flutuantes: left */
}
.container-left {
    float: left; /* Flutua o elemento para a esquerda */
    width: 50%; /* Largura: 50% */
}
#container-marketplaces {
    margin-top: 50px; /* Margem superior: 50px */
}
#container-marketplaces p {
    display: none; /* Esconde o elemento e tira do fluxo */
}
#container-marketplaces .logo {
    float: left; /* Flutua o elemento para a esquerda */
    width: 120px; /* Largura: 120px */
    height: 50px; /* Altura: 50px */
}
.container-left b {
    color: #00a0e3; /* Cor do texto: #00a0e3 */
}
.container-right {
    float: left; /* Flutua o elemento para a esquerda */
    width: 40%; /* Largura: 40% */
    text-align: center; /* Centraliza o texto */
}
.container-left h3 {
    font-size: 12pt; /* Tamanho da fonte: 12pt */
    line-height: 26px; /* Altura da linha do texto: 26px */
    text-align: justify; /* Justifica o texto */
}
.container-left span {
    border-bottom: 1px solid #CCC; /* Borda inferior: 1px solid #CCC */
    display: block; /* Muda para block, ocupa a linha toda */
    width: 100%; /* Ocupa 100% da largura do pai */
    padding: 1px 0; /* Espaçamento interno: 1px 0 */
    margin-bottom: 10px; /* Margem inferior: 10px */
}
.container-left p {
    font-size: 10pt; /* Tamanho da fonte: 10pt */
    text-align: justify; /* Justifica o texto */
}
.container-right img {
    width: 350px; /* Largura: 350px */
    padding: 15px 10px 0; /* Espaçamento interno: 15px 10px 0 */
}
.left-1 {
    float: left; /* Flutua o elemento para a esquerda */
    width: 40%; /* Largura: 40% */
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
}
.left-1 h4 {
    color: #FFF; /* Cor do texto: #FFF */
    font-size: 24pt; /* Tamanho da fonte: 24pt */
    text-align: center; /* Centraliza o texto */
    padding: 0 0; /* Espaçamento interno: 0 0 */
}
.left-1 h5 {
    color: #FFF; /* Cor do texto: #FFF */
    font-size: 14pt; /* Tamanho da fonte: 14pt */
    padding: 10px 0; /* Espaçamento interno: 10px 0 */
}
h6 {
    color: #FFF; /* Cor do texto: #FFF */
    font-size: 12pt; /* Tamanho da fonte: 12pt */
    margin: 0; /* Remove margem */
    padding: 0; /* Remove espaçamento interno */
}
.right-1 {
    float: right; /* Flutua o elemento para a direita */
    width: 40%; /* Largura: 40% */
    padding: 50px 0; /* Espaçamento interno: 50px 0 */
}
.sab, .sab:hover {
    color: #FFF; /* Cor do texto: #FFF */
    clear: left; /* Impede que o elemento fique ao lado de elementos flutuantes: left */
    width: 100%; /* Ocupa 100% da largura do pai */
    display: block; /* Muda para block, ocupa a linha toda */
    margin-top: 15px; /* Margem superior: 15px */
    font-size: 12pt; /* Tamanho da fonte: 12pt */
    text-decoration: underline; /* Sublinha o texto */
}
.icon-header {
    background-image: url('../img/icones.png?99'); /* Imagem de fundo: url('../img/icones.png?99') */
    width: 20px; /* Largura: 20px */
    height: 30px; /* Altura: 30px */
    display: inline-block; /* Vira inline-block, fica na linha mas aceita largura/altura */
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
    left: 0; /* Distância a partir do(a) esquerda: 0 */
    top: 6px; /* Distância a partir do(a) topo: 6px */
    cursor: pointer; /* Muda o cursor para indicar que é clicável */
}
.i-send {
    background-position: -171px -7px; /* Posição da imagem de fundo: -171px -7px */
}
.i-login {
    background-position: -4px -7px; /* Posição da imagem de fundo: -4px -7px */
}
.i-contact {
    background-position: -31px -4px; /* Posição da imagem de fundo: -31px -4px */
    left: -1px; /* Distância a partir do(a) esquerda: -1px */
    top: 4px; /* Distância a partir do(a) topo: 4px */
}
.i-tags {
    background-position: -59px -6px; /* Posição da imagem de fundo: -59px -6px */
}
.i-mkt {
    background-position: -88px -6px; /* Posição da imagem de fundo: -88px -6px */
}
.i-erp {
    background-position: -138px -6px; /* Posição da imagem de fundo: -138px -6px */
}
.i-gear {
    background-position: -113px -6px; /* Posição da imagem de fundo: -113px -6px */
}
.ul-end {
    padding: 24px 0 0 !important; /* Espaçamento interno: 24px 0 0 (forçado com !important) */
}
header img {
    width: 220px; /* Largura: 220px */
    padding: 5px 0; /* Espaçamento interno: 5px 0 */
}
header input {
    border: none; /* Remove a borda */
    background: transparent; /* Remove a cor de fundo */
    border-radius: 5px; /* Arredonda os cantos: 5px */
    width: 100%; /* Ocupa 100% da largura do pai */
    text-align: left; /* Alinha o texto à esquerda */
    padding: 5px 5px; /* Espaçamento interno: 5px 5px */
    display: block; /* Muda para block, ocupa a linha toda */
}
.modal-box-cookie {
    background: rgba(0,0,0,0.8); /* Cor de fundo: rgba(0,0,0,0.8) */
    position: fixed; /* Tira do fluxo normal e fixa na tela mesmo com scroll */
    width: 100%; /* Ocupa 100% da largura do pai */
    height: 100%; /* Ocupa 100% da altura do pai */
    top: 0; /* Distância a partir do(a) topo: 0 */
    left: 0; /* Distância a partir do(a) esquerda: 0 */
    z-index: 9999; /* Camada de sobreposição (quanto maior, mais na frente): 9999 */
    display: none; /* Esconde o elemento e tira do fluxo */
}
.box-cookie-notification {
    width: 700px; /* Largura: 700px */
    margin: 40px auto; /* Margem: 40px auto */
    border: 1px solid #CCC; /* Borda: 1px solid #CCC */
    padding: 0; /* Remove espaçamento interno */
    background: #FFFF; /* Cor de fundo: #FFFF */
}
.box-cookie-notification img {
    width: 130px; /* Largura: 130px */
    display: block; /* Muda para block, ocupa a linha toda */
    float: left; /* Flutua o elemento para a esquerda */
    margin: 10px  15px 0; /* Margem: 10px  15px 0 */
}
.box-cookie-lines {
    float: left; /* Flutua o elemento para a esquerda */
    width: 100%; /* Ocupa 100% da largura do pai */
    border-bottom: 1px solid #CCC; /* Borda inferior: 1px solid #CCC */
}
.box-cookie-notification h3 {
    float: left; /* Flutua o elemento para a esquerda */
    padding-bottom: 12px; /* Espaçamento interno inferior: 12px */
    width: 70%; /* Largura: 70% */
    text-align: right; /* Alinha o texto à direita */
}
.box-cookie-notification-close {
    float: right; /* Flutua o elemento para a direita */
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
    font-size: 18pt; /* Tamanho da fonte: 18pt */
    top: 12px; /* Distância a partir do(a) topo: 12px */
    right: 9px; /* Distância a partir do(a) direita: 9px */
    cursor: pointer; /* Muda o cursor para indicar que é clicável */
}
.container-list-cookie {
    display: none; /* Esconde o elemento e tira do fluxo */
}
.container-privacidade {
    display: block; /* Muda para block, ocupa a linha toda */
}
.box-body-cookie-left {
    float: left; /* Flutua o elemento para a esquerda */
    width: 30%; /* Largura: 30% */
}
.container-list-cookie b {
    float: right; /* Flutua o elemento para a direita */
    color: green; /* Cor do texto: green */
    position: absolute; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative */
    right: 31px; /* Distância a partir do(a) direita: 31px */
    top: 20px; /* Distância a partir do(a) topo: 20px */
}
.switch-cookie {
    float: right; /* Flutua o elemento para a direita */
    position: absolute; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative */
    top: 10px; /* Distância a partir do(a) topo: 10px */
    right: 33px; /* Distância a partir do(a) direita: 33px */
}
.box-body-cookie-right {
    float: right; /* Flutua o elemento para a direita */
    width: 65%; /* Largura: 65% */
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
}
.box-body-cookie-left ul {
    list-style: none; /* Remove marcadores da lista */
    padding: 0; /* Remove espaçamento interno */
    margin: 10px 0 0; /* Margem: 10px 0 0 */
    border-right: 1px solid #CCC; /* Borda direita: 1px solid #CCC */
}
.box-body-cookie-left ul li {
    padding: 10px; /* Espaçamento interno: 10px */
    border-bottom: 1px solid #CCC; /* Borda inferior: 1px solid #CCC */
    font-size: 9pt; /* Tamanho da fonte: 9pt */
    cursor: pointer; /* Muda o cursor para indicar que é clicável */
    color: #000; /* Cor do texto: #000 */
}
.box-cookie {
    position: fixed; /* Tira do fluxo normal e fixa na tela mesmo com scroll */
    bottom: 10px; /* Distância a partir do(a) base: 10px */
    left: 15px; /* Distância a partir do(a) esquerda: 15px */
    z-index: 9999; /* Camada de sobreposição (quanto maior, mais na frente): 9999 */
    width: 1000px; /* Largura: 1000px */
    height: 165px; /* Altura: 165px */
    background: #FFF; /* Cor de fundo: #FFF */
    padding: 20px; /* Espaçamento interno: 20px */
    border: 1px solid #CCC; /* Borda: 1px solid #CCC */
}
.box-cookie p {
    color: #000; /* Cor do texto: #000 */
    font-size: 11pt; /* Tamanho da fonte: 11pt */
    line-height: 17px; /* Altura da linha do texto: 17px */
}
.box-cookie-close {
    position: absolute; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative */
    right: 16px; /* Distância a partir do(a) direita: 16px */
    font-size: 14pt; /* Tamanho da fonte: 14pt */
    top: 16px; /* Distância a partir do(a) topo: 16px */
    font-weight: 600; /* Peso semi-negrito */
    color: #666; /* Cor do texto: #666 */
    cursor: pointer; /* Muda o cursor para indicar que é clicável */
}
.box-cookie p a {
    color: #333; /* Cor do texto: #333 */
    font-size: 11pt; /* Tamanho da fonte: 11pt */
    text-decoration: underline; /* Sublinha o texto */
}
.box-cookie-whiter {
    background: #FFF; /* Cor de fundo: #FFF */
    float: left; /* Flutua o elemento para a esquerda */
}
.cookie-access {
    background: #333; /* Cor de fundo: #333 */
    color: #FFF; /* Cor do texto: #FFF */
}
.box-body-cookie-left ul li.cookie-access {
    color: #FFF; /* Cor do texto: #FFF */
}
.modal-promotions {
    position: fixed; /* Tira do fluxo normal e fixa na tela mesmo com scroll */
    width: 100%; /* Ocupa 100% da largura do pai */
    height: 100%; /* Ocupa 100% da altura do pai */
    top: 0; /* Distância a partir do(a) topo: 0 */
    left: 0; /* Distância a partir do(a) esquerda: 0 */
    z-index: 9999999; /* Camada de sobreposição (quanto maior, mais na frente): 9999999 */
    background: rgba(0,0,0,0.9); /* Cor de fundo: rgba(0,0,0,0.9) */
    display: none; /* Esconde o elemento e tira do fluxo */
}
.middle-promotions {
    width: 700px; /* Largura: 700px */
    margin: 2% auto; /* Margem: 2% auto */
    background: #FFF; /* Cor de fundo: #FFF */
    padding: 10px 30px; /* Espaçamento interno: 10px 30px */
    text-align: center; /* Centraliza o texto */
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
    max-height: 700px; /* Altura máxima: 700px */
    overflow: auto; /* Mostra barra de rolagem só quando necessário */
}
.promo-close {
    position: absolute; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative */
    top: 12px; /* Distância a partir do(a) topo: 12px */
    right: 17px; /* Distância a partir do(a) direita: 17px */
    font-size: 16pt; /* Tamanho da fonte: 16pt */
    color: #333; /* Cor do texto: #333 */
    font-weight: 600; /* Peso semi-negrito */
    cursor: pointer; /* Muda o cursor para indicar que é clicável */
}
.middle-promotions img {
    margin-bottom: 20px; /* Margem inferior: 20px */
    width: 210px; /* Largura: 210px */
}
.middle-promotions h2 {
    margin-bottom: 10px; /* Margem inferior: 10px */
    display: block; /* Muda para block, ocupa a linha toda */
    text-align: center; /* Centraliza o texto */
    font-size: 22pt; /* Tamanho da fonte: 22pt */
}
.middle-promotions p:nth-child(2) {
    font-weight: 600; /* Peso semi-negrito */
    font-size: 10pt; /* Tamanho da fonte: 10pt */
}
.middle-promotions p:nth-child(3) {
    font-weight: 600; /* Peso semi-negrito */
    font-size: 12pt; /* Tamanho da fonte: 12pt */
    padding: 0; /* Remove espaçamento interno */
    margin:0; /* Remove margem */
}
.middle-promotions p:nth-child(4) {
    font-weight: 600; /* Peso semi-negrito */
    font-size: 16pt; /* Tamanho da fonte: 16pt */
    padding: 5px 0; /* Espaçamento interno: 5px 0 */
    margin:0; /* Remove margem */
}
.middle-promotions p:nth-child(5) {
    font-weight: 600; /* Peso semi-negrito */
    font-size: 19pt; /* Tamanho da fonte: 19pt */
    color: #00a3e9; /* Cor do texto: #00a3e9 */
    padding: 0; /* Remove espaçamento interno */
    margin: 0; /* Remove margem */
    line-height: 33px; /* Altura da linha do texto: 33px */
}
.middle-promotions p:nth-child(6),.middle-promotions p:nth-child(7) {
    margin: 0; /* Remove margem */
    padding: 0; /* Remove espaçamento interno */
}
.middle-promotions h3 {
    padding: 0; /* Remove espaçamento interno */
    margin: 0; /* Remove margem */
}
footer .container-list-cookie .container-controller ul li a {
    color: #000; /* Cor do texto: #000 */
}
.footer-container-top {
    width:100%; /* Ocupa 100% da largura do pai */
    float:left; /* Flutua o elemento para a esquerda */
    border-bottom:1px solid #FFF; /* Borda inferior: 1px solid #FFF */
    margin-bottom:32px; /* Margem inferior: 32px */
}
.footer-col-1 {
    float:left; /* Flutua o elemento para a esquerda */
    width:25%; /* Largura: 20% */
    height:200px;

}
.footer-border{
    float:left;
    width:100%;
    border-bottom:1px solid #434343;
}
.footer-col-1 img:nth-child(1) {
    width:60px; /* Largura: 60px */
    display:block; /* Muda para block, ocupa a linha toda */
    margin:0 auto; /* Zera margem vertical e centraliza na horizontal */
}
.footer-col-1 img:nth-child(2) {
    width:60px; /* Largura: 60px */
    display:block; /* Muda para block, ocupa a linha toda */
    margin:20px auto; /* Margem: 20px auto */
}
.container-list-cookie {
    padding: 10px 30px 0 0; /* Espaçamento interno: 10px 30px 0 0 */
}
.container-list-cookie h4 {
    font-weight: 600; /* Peso semi-negrito */
    font-size:12pt; /* Tamanho da fonte: 12pt */
}
.container-list-cookie p {
    text-align: justify; /* Justifica o texto */
}
.box-cookie-footer-main {
    float: left; /* Flutua o elemento para a esquerda */
    width: 100%; /* Ocupa 100% da largura do pai */
    padding: 10px 0 7px; /* Espaçamento interno: 10px 0 7px */
}
.box-cookie-footer {
    float: left; /* Flutua o elemento para a esquerda */
    width: 100%; /* Ocupa 100% da largura do pai */
    border-top: 1px solid #CCC; /* Borda superior: 1px solid #CCC */
    padding: 10px 0 7px; /* Espaçamento interno: 10px 0 7px */
}
.box-cookie-footer a,.box-cookie-footer-main a {
    color: #000; /* Cor do texto: #000 */
    font-size: 11pt; /* Tamanho da fonte: 11pt */
    text-decoration: underline; /* Sublinha o texto */
}
.box-cookie-footer button,.box-cookie-footer-main button {
    border: 1px solid #CCC; /* Borda: 1px solid #CCC */
    padding: 12px 15px; /* Espaçamento interno: 12px 15px */
    margin-left: 20px; /* Margem esquerda: 20px */
    background: #333; /* Cor de fundo: #333 */
    color: #FFF; /* Cor do texto: #FFF */
    border-radius: 5px; /* Arredonda os cantos: 5px */
    cursor: pointer; /* Muda o cursor para indicar que é clicável */
}
.box-cookie-footer button:click {
    box-shadow: 0px 0px 8px #000; /* Sombra da caixa: 0px 0px 8px #000 */
    border: none; /* Remove a borda */
}
.error {
    color: #ce202c; /* Cor do texto: #ce202c */
    font-size:10pt; /* Tamanho da fonte: 10pt */
    font-style: italic; /* Estilo da fonte: italic */
    float: left; /* Flutua o elemento para a esquerda */
}
.modal {
    background: rgba(0,0,0,1); /* Cor de fundo: rgba(0,0,0,1) */
    position: fixed; /* Tira do fluxo normal e fixa na tela mesmo com scroll */
    width: 100%; /* Ocupa 100% da largura do pai */
    height: 100%; /* Ocupa 100% da altura do pai */
    left: 0; /* Distância a partir do(a) esquerda: 0 */
    top: 0; /* Distância a partir do(a) topo: 0 */
    display: block; /* Muda para block, ocupa a linha toda */
    z-index: 9999; /* Camada de sobreposição (quanto maior, mais na frente): 9999 */
}
.modal div {
    width:300px; /* Largura: 300px */
    margin:10% auto; /* Margem: 10% auto */
    text-align: center; /* Centraliza o texto */
}
.modal div p {
    color: #FFF; /* Cor do texto: #FFF */
    font-size: 14pt; /* Tamanho da fonte: 14pt */
    padding-top: 10px; /* Espaçamento interno superior: 10px */
}
.modal img {
    width:300px; /* Largura: 300px */
}
.content-suporte {
    width: 100%; /* Ocupa 100% da largura do pai */
    background: #eee; /* Cor de fundo: #eee */
    padding: 10px; /* Espaçamento interno: 10px */
}
.line-suporte {
    width:100%; /* Ocupa 100% da largura do pai */
}
.line-suporte a {
    font-weight:600; /* Peso semi-negrito */
    font-size:10pt; /* Tamanho da fonte: 10pt */
    color:#000; /* Cor do texto: #000 */
}
.line-suporte span {
    font-style: italic; /* Estilo da fonte: italic */
    font-size:8pt; /* Tamanho da fonte: 8pt */
}
.line-suporte p {
    font-size:11pt; /* Tamanho da fonte: 11pt */
    color:#000; /* Cor do texto: #000 */
}
.suporte {
    width:100%; /* Ocupa 100% da largura do pai */
    border:1px solid #CCC; /* Borda: 1px solid #CCC */
}
.suporte tr:nth-child(1) {
    background: #2acee6; /* Cor de fundo: #2acee6 */
    color: #FFF; /* Cor do texto: #FFF */
    padding:10px 0; /* Espaçamento interno: 10px 0 */
}
.suporte tr td:nth-child(1) {
    padding:10px 0; /* Espaçamento interno: 10px 0 */
}
.suporte tr {
    border-bottom: 1px solid #CCC; /* Borda inferior: 1px solid #CCC */
}
.btn-right {
    float: right; /* Flutua o elemento para a direita */
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
    top: -65px; /* Distância a partir do(a) topo: -65px */
}
.h4-conteudo {
    padding-top: 100px; /* Espaçamento interno superior: 100px */
}
.h4-conteudo h4 {
    font-size: 16pt; /* Tamanho da fonte: 16pt */
}
.h4-conteudo p {
    font-size: 12pt; /* Tamanho da fonte: 12pt */
}
.h4-conteudo a {
    font-size: 10pt; /* Tamanho da fonte: 10pt */
    font-weight: 600; /* Peso semi-negrito */
}
.a-logo-ascensus {
    background: #375172; /* Cor de fundo: #375172 */
    margin: 0 auto; /* Zera margem vertical e centraliza na horizontal */
    display: block; /* Muda para block, ocupa a linha toda */
    width: 216px; /* Largura: 216px */
    text-align: center; /* Centraliza o texto */
    border-radius: 15px; /* Arredonda os cantos: 15px */
    padding: 10px 0; /* Espaçamento interno: 10px 0 */
    box-shadow: 4px 4px 5px #CCC; /* Sombra da caixa: 4px 4px 5px #CCC */
}
.a-logo-ascensus img {
    width:100px; /* Largura: 100px */
}
.box-client {
    float: left; /* Flutua o elemento para a esquerda */
    width: 33%; /* Largura: 33% */
    text-align: center; /* Centraliza o texto */
    margin: 50px 0; /* Margem: 50px 0 */
}
.box-client span {
    display: block; /* Muda para block, ocupa a linha toda */
    width:100%; /* Ocupa 100% da largura do pai */
    font-size: 12pt; /* Tamanho da fonte: 12pt */
    padding-top: 20px; /* Espaçamento interno superior: 20px */
}
.footer-mob {
    float: right; /* Flutua o elemento para a direita */
}
#planos {
    width:1px; /* Largura: 1px */
    height:1px; /* Altura: 1px */
    visibility: hidden; /* Esconde o elemento mas mantém o espaço */
}
.back-line-planos {
    width:100%; /* Ocupa 100% da largura do pai */
    overflow:auto; /* Mostra barra de rolagem só quando necessário */
}
.sub-back-line-planos {
    width:1090px; /* Largura: 1090px */
    float:left; /* Flutua o elemento para a esquerda */
}
.glx-access-fill-black, .glx-access-fill-whiter {
    background:#000 !important; /* Cor de fundo: #000 (forçado com !important) */
    border:1px solid #000; /* Borda: 1px solid #000 */
    padding:10px 20px !important; /* Espaçamento interno: 10px 20px (forçado com !important) */
    margin-top: 0; /* Margem superior: 0 */
    display: inline-flex !important; /* Ativa flexbox mantendo o elemento inline (!important) */
    align-items: center; /* Centraliza os filhos no eixo cruzado (geralmente vertical) */
    gap: 6px; /* Espaço de 6px entre os itens */
    width: auto; /* Largura automática, ajusta ao conteúdo */
    line-height: 1; /* Altura da linha do texto: 1 */
}
a.glx-access-fill-black {
    color: #FFF !important; /* Cor do texto: #FFF (forçado com !important) */
}
.glx-access-fill-black .icon-header,
.glx-access-fill-whiter .icon-header {
    top: 0; /* Distância a partir do(a) topo: 0 */
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
}
.glx-access-fill-whiter {
    background:transparent !important; /* Remove a cor de fundo (!important) */
    color:#000 !important; /* Cor do texto: #000 (forçado com !important) */
}
a.glx-access-fill-whiter {
    color: #000 !important; /* Cor do texto: #000 (forçado com !important) */
    background:#FFF !important; /* Cor de fundo: #FFF (forçado com !important) */
}
.link,.link2 {
    border:2px solid #2acee6; /* Borda: 2px solid #2acee6 */
    padding:8px 15px; /* Espaçamento interno: 8px 15px */
    color: #2acee6; /* Cor do texto: #2acee6 */
    border-radius:5px; /* Arredonda os cantos: 5px */
    font-weight:600; /* Peso semi-negrito */
    text-align: center; /* Centraliza o texto */
}
a.link:hover {
    color: #FFF; /* Cor do texto: #FFF */
    text-decoration: none; /* Remove sublinhado/decoração do texto */
    color: #000; /* Cor do texto: #000 */
}
header ul.navs li a.link2 {
    color: #2acee6; /* Cor do texto: #2acee6 */
}
.link {
    border: 1px solid #FFF; /* Borda: 1px solid #FFF */
    color: #FFF; /* Cor do texto: #FFF */
    font-size: 14pt; /* Tamanho da fonte: 14pt */
    background: #000; /* Cor de fundo: #000 */
    width: 80%; /* Largura: 80% */
    display: block; /* Muda para block, ocupa a linha toda */
}
a.link:hover {
    color: #FFF; /* Cor do texto: #FFF */
}
.background-banner {
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    height: 500px !important; /* Altura: 980px (forçado com !important) */
    background: 
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913 !important; /* Fundo em gradiente: radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913 (forçado com !important) */
    overflow: visible !important; /* Deixa o conteúdo ultrapassar os limites sem cortar (!important) */
    padding-top: 0px !important; /* Espaçamento interno superior: 80px (forçado com !important) */
    box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    justify-content: flex-start !important; /* Alinha os filhos no início do eixo principal (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */

     justify-content: center !important;

    box-sizing: border-box !important;

    background: #060913 !important;
}
.background-banner > .banner-desktop {
    display: none !important; /* Esconde o elemento e tira do fluxo (!important) */
}
.background-banner .container-conteudo-vertical {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center 42%;

}
.background-banner .banner-textos-topo {
    margin-bottom: 0px !important; /* Margem inferior: 40px (forçado com !important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    max-width: 1000px !important; /* Largura máxima: 1000px (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    text-align: center !important; /* Centraliza o texto (!important) */
}
.background-banner h2 {
    color: #FFFFFF !important; /* Cor do texto: #FFFFFF (forçado com !important) */
    font-size: 26pt !important; /* Tamanho da fonte: 38pt (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    line-height: 1.25 !important; /* Altura da linha do texto: 1.25 (forçado com !important) */
    text-align: center !important; /* Centraliza o texto (!important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    display: block !important; /* Muda para block, ocupa a linha toda (!important) */
    letter-spacing: -0.5px !important; /* Espaçamento entre letras: -0.5px (forçado com !important) */
    margin: 0 0 25px 0 !important; /* Margem: 0 0 25px 0 (forçado com !important) */
    text-shadow: 0px 4px 40px rgba(255, 255, 255, 0.25) !important; /* Sombra no texto: 0px 4px 40px rgba(255, 255, 255, 0.25) (forçado com !important) */
}
.background-banner h3 {
    color: #b0c4de !important; /* Cor do texto: #b0c4de (forçado com !important) */
    font-size: 15pt !important; /* Tamanho da fonte: 15pt (forçado com !important) */
    font-weight: 400 !important; /* Peso normal da fonte (!important) */
    line-height: 1.6 !important; /* Altura da linha do texto: 1.6 (forçado com !important) */
    margin-top: 0px !important; /* Margem superior: 40px (forçado com !important) */
    text-align: center !important; /* Centraliza o texto (!important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    display: block !important; /* Muda para block, ocupa a linha toda (!important) */
    max-width: 750px !important; /* Largura máxima: 750px (forçado com !important) */
}
.background-banner .banner-imagem-meio {
    width: 250% !important; /* Largura: 250% (forçado com !important) */
    max-width: 1180px !important; /* Largura máxima: 1180px (forçado com !important) */
    margin-top: -168px; /* Margem superior: -168px */
    margin-bottom: 60px !important; /* Margem inferior: 60px (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    float: none !important; /* Remove flutuação (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
}
.background-banner .banner-monitores-vertical {
    display: block !important; /* Muda para block, ocupa a linha toda (!important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    height: auto !important; /* Altura automática, ajusta ao conteúdo (!important) */
    mix-blend-mode: screen !important; /* mix-blend-mode: screen (forçado com !important) */
    opacity: 1 !important; /* Transparência do elemento (0 invisível, 1 opaco): 1 (forçado com !important) */
    filter: drop-shadow(0px 30px 40px rgba(0, 0, 0, 0.7)) drop-shadow(0px 0px 25px rgba(0, 150, 255, 0.2)) !important; /* Filtro visual (blur, brilho, etc.): drop-shadow(0px 30px 40px rgba(0, 0, 0, 0.7)) drop-shadow(0px 0px 25px rgba(0, 150, 255, 0.2)) (forçado com !important) */
}
.background-banner .banner-btns-baixo {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: row !important; /* Alinha os filhos lado a lado na horizontal (!important) */
    gap: 20px !important; /* Espaço de 20px entre os itens (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    margin-bottom: 30px !important; /* Margem inferior: 30px (forçado com !important) */
}
.logo-galactix {
    display: block !important; /* Muda para block, ocupa a linha toda (!important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    max-width: 390px !important; /* Largura máxima: 390px (forçado com !important) */
    height: auto !important; /* Altura automática, ajusta ao conteúdo (!important) */
    margin: -240px auto 0 !important; /* Margem: -240px auto 0 (forçado com !important) */
    opacity: 0.9 !important; /* Transparência do elemento (0 invisível, 1 opaco): 0.9 (forçado com !important) */
    transition: transform 0.3s ease !important; /* Anima a mudança de propriedade ao longo do tempo: transform 0.3s ease (forçado com !important) */
    filter: drop-shadow(0px 0px 20px rgba(0, 195, 255, 0.4)) !important; /* Filtro visual (blur, brilho, etc.): drop-shadow(0px 0px 20px rgba(0, 195, 255, 0.4)) (forçado com !important) */
}
.logo-galactix:hover {
    transform: scale(1.02) !important; /* Transformação (rotação, escala ou deslocamento): scale(1.02) (forçado com !important) */
    opacity: 1 !important; /* Transparência do elemento (0 invisível, 1 opaco): 1 (forçado com !important) */
}
.background-banner-page {
    background: #00a0e3; /* Cor de fundo: #00a0e3 */
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
    top: 0; /* Distância a partir do(a) topo: 0 */
    width: 100%; /* Ocupa 100% da largura do pai */
    height: 300px; /* Altura: 300px */
    overflow: hidden; /* Esconde o que ultrapassar os limites do elemento */
}
.background-banner-page-left {
    float:left; /* Flutua o elemento para a esquerda */
    width:50% !important; /* Largura: 50% (forçado com !important) */
    padding-top:30px; /* Espaçamento interno superior: 30px */
}
.background-banner-page-left h2 {
    width: 80%; /* Largura: 80% */
    font-size: 20pt; /* Tamanho da fonte: 20pt */
    color: #FFF; /* Cor do texto: #FFF */
}
.background-banner-page-right {
    float:left; /* Flutua o elemento para a esquerda */
    width:50% !important; /* Largura: 50% (forçado com !important) */
}
.background-banner-page div {
    width: 1117px; /* Largura: 1117px */
    margin: 0 auto; /* Zera margem vertical e centraliza na horizontal */
}
.background-banner-page h2 {
    margin:0; /* Remove margem */
}
.background-banner-page h4 {
    font-size: 14pt; /* Tamanho da fonte: 14pt */
    width: 100%; /* Ocupa 100% da largura do pai */
    padding: 15px 0 0; /* Espaçamento interno: 15px 0 0 */
    margin: 0; /* Remove margem */
    line-height: 29px; /* Altura da linha do texto: 29px */
}
.background-banner h4,.background-banner-page h4 {
    color: #FFF; /* Cor do texto: #FFF */
    width: 70%; /* Largura: 70% */
    text-align: left; /* Alinha o texto à esquerda */
    font-size: 12pt; /* Tamanho da fonte: 12pt */
    line-height: 24px; /* Altura da linha do texto: 24px */
}
.container-banner2 {
    border-bottom:1px solid #CCC; /* Borda inferior: 1px solid #CCC */
    width:100%; /* Ocupa 100% da largura do pai */
    float:left; /* Flutua o elemento para a esquerda */
    box-shadow: 4px 4px 10px #CCC; /* Sombra da caixa: 4px 4px 10px #CCC */
    padding: 10px 0; /* Espaçamento interno: 10px 0 */
    text-align: center; /* Centraliza o texto */
}
.container-banner2 div {
    width: 1000px; /* Largura: 1000px */
    margin: 0 auto; /* Zera margem vertical e centraliza na horizontal */
}
.container-banner2 ul {
    cursor: pointer; /* Muda o cursor para indicar que é clicável */
    padding: 0; /* Remove espaçamento interno */
    margin: 0; /* Remove margem */
}
.container-banner2 ul li {
    list-style: none; /* Remove marcadores da lista */
    display: inline-block; /* Vira inline-block, fica na linha mas aceita largura/altura */
    width:150px; /* Largura: 150px */
}
.background-api {
    background-image: linear-gradient(90deg,#2acee6 0%,#ff99bb 100%)!important; /* Imagem de fundo: linear-gradient(90deg,#2acee6 0%,#ff99bb 100%) (forçado com !important) */
    width:100%; /* Ocupa 100% da largura do pai */
}
.background-api h2 {
    color: #FFF; /* Cor do texto: #FFF */
    font-size: 24pt; /* Tamanho da fonte: 24pt */
    padding: 10px 0 0; /* Espaçamento interno: 10px 0 0 */
}
.background-dev {
    background: #36393f; /* Cor de fundo: #36393f */
}
.background-dev h1 {
    color: #FFF; /* Cor do texto: #FFF */
}
.label-api {
    margin: 15px 1px 2px; /* Margem: 15px 1px 2px */
    display: block; /* Muda para block, ocupa a linha toda */
    position: absolute; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative */
    z-index: 9999; /* Camada de sobreposição (quanto maior, mais na frente): 9999 */
    background: #36393f; /* Cor de fundo: #36393f */
    padding: 6px 17px; /* Espaçamento interno: 6px 17px */
    top: -14px; /* Distância a partir do(a) topo: -14px */
    border-radius: 4px 0 0 4px; /* Arredonda os cantos: 4px 0 0 4px */
    color: #2acee6; /* Cor do texto: #2acee6 */
    width: 190px; /* Largura: 190px */
    text-align: center; /* Centraliza o texto */
}
.div-api {
    position:relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
    margin: 18px 0px; /* Margem: 18px 0px */
}
.div-api input {
    width:100%; /* Ocupa 100% da largura do pai */
    padding-left:200px; /* Espaçamento interno esquerda: 200px */
}
.div-api textarea {
    width:100%; /* Ocupa 100% da largura do pai */
    max-width: 100%; /* Não deixa ultrapassar 100% do pai */
    min-width:100%; /* Largura mínima: 100% */
}
.fw-bold {
    color:#FFF; /* Cor do texto: #FFF */
}
.form-label {
    color:#333; /* Cor do texto: #333 */
}
.background-api p {
    color: #FFF; /* Cor do texto: #FFF */
    line-height: 25px; /* Altura da linha do texto: 25px */
    text-align: justify; /* Justifica o texto */
    font-size: 12pt; /* Tamanho da fonte: 12pt */
}
.banner-mobile {
    display: none; /* Esconde o elemento e tira do fluxo */
}
.background-cinza {
    background:#eee; /* Cor de fundo: #eee */
    width:100%; /* Ocupa 100% da largura do pai */
    text-align: center; /* Centraliza o texto */
    padding:10px 0 50px; /* Espaçamento interno: 10px 0 50px */
}
.background-cinza h2 {
    font-size: 16pt; /* Tamanho da fonte: 16pt */
    padding-bottom: 10px; /* Espaçamento interno inferior: 10px */
    color: #000; /* Cor do texto: #000 */
}
.background-cinza h3 {
    color:#999; /* Cor do texto: #999 */
    font-size:14pt; /* Tamanho da fonte: 14pt */
}
.background-gray {
    background-image: linear-gradient(90deg,#201f1f 0%,#3d3c3c 100%)!important; /* Imagem de fundo: linear-gradient(90deg,#201f1f 0%,#3d3c3c 100%) (forçado com !important) */
    width:100%; /* Ocupa 100% da largura do pai */
    text-align: center; /* Centraliza o texto */
    padding:10px 0 50px; /* Espaçamento interno: 10px 0 50px */
    float: left; /* Flutua o elemento para a esquerda */
}
.background-gray h2 {
    padding-bottom: 10px; /* Espaçamento interno inferior: 10px */
    color: #FFF; /* Cor do texto: #FFF */
    clear: left; /* Impede que o elemento fique ao lado de elementos flutuantes: left */
    width: 70%; /* Largura: 70% */
    margin: 0 auto; /* Zera margem vertical e centraliza na horizontal */
}
.background-gray h3 {
    color:#FFF; /* Cor do texto: #FFF */
    font-size:14pt; /* Tamanho da fonte: 14pt */
}
.background-gray img {
    display:inline-block; /* Vira inline-block, fica na linha mas aceita largura/altura */
    width:180px; /* Largura: 180px */
    padding: 0 10px; /* Espaçamento interno: 0 10px */
}
.background-gray img.new-img-1 {
    width:100px; /* Largura: 100px */
}
.background-gray img.new-img-2 {
    width:80px; /* Largura: 80px */
}
.background-gray p {
    color:#FFF; /* Cor do texto: #FFF */
}
.img-glx {
    width:90%; /* Largura: 90% */
    padding-top: 10px; /* Espaçamento interno superior: 10px */
    margin:0 auto; /* Zera margem vertical e centraliza na horizontal */
}
.background-whiter {
    background: #FFF; /* Cor de fundo: #FFF */
    width:100%; /* Ocupa 100% da largura do pai */
    text-align: center; /* Centraliza o texto */
    padding:10px 0 50px; /* Espaçamento interno: 10px 0 50px */
}
.background-whiter h2 {
    font-size:20pt; /* Tamanho da fonte: 20pt */
    width: 90%; /* Largura: 90% */
    margin: 30px auto; /* Margem: 30px auto */
}
.background-whiter h3 {
    font-size: 14pt; /* Tamanho da fonte: 14pt */
    padding: 0; /* Remove espaçamento interno */
    margin: 20px auto 50px; /* Margem: 20px auto 50px */
    width: 90%; /* Largura: 90% */
}
.bl-left {
    float: left; /* Flutua o elemento para a esquerda */
    width:60%; /* Largura: 60% */
    margin-top:100px; /* Margem superior: 100px */
}
.bl-left img {
    display: block; /* Muda para block, ocupa a linha toda */
    width:60%; /* Largura: 60% */
    margin:0 auto; /* Zera margem vertical e centraliza na horizontal */
}
.bl-right {
    float: left; /* Flutua o elemento para a esquerda */
    width:40%; /* Largura: 40% */
    margin-top:100px; /* Margem superior: 100px */
    padding-top:40px; /* Espaçamento interno superior: 40px */
}
.bl-right h4 {
    font-size:14pt; /* Tamanho da fonte: 14pt */
    margin:50px 0 10px; /* Margem: 50px 0 10px */
}
.icon {
    background-image: url('../img/icon.png?1111'); /* Imagem de fundo: url('../img/icon.png?1111') */
    width:80px; /* Largura: 80px */
    height:80px; /* Altura: 80px */
    display:inline-block; /* Vira inline-block, fica na linha mas aceita largura/altura */
}
.sub-footer {
    background:#222; /* Cor de fundo: #222 */
    color: #FFF; /* Cor do texto: #FFF */
    width: 100%; /* Ocupa 100% da largura do pai */
    float: left; /* Flutua o elemento para a esquerda */
    padding: 10px 0 5px; /* Espaçamento interno: 10px 0 5px */
}
.sub-footer p {
    padding:5px 0 0; /* Espaçamento interno: 5px 0 0 */
    font-size:10pt; /* Tamanho da fonte: 10pt */
}
.footer-logo {
    display: block; /* Muda para block, ocupa a linha toda */
    float: left; /* Flutua o elemento para a esquerda */
    margin: -40px 0 5px 0; /* Margem: -40px 0 5px 0 */
    width: 200px; /* Largura: 200px */
    height: auto; /* Altura automática, ajusta ao conteúdo */
    background: none !important; /* Remove a cor de fundo (!important) */
}
.footer-logo img {
    width: 100%; /* Ocupa 100% da largura do pai */
    height: auto; /* Altura automática, ajusta ao conteúdo */
    display: block; /* Muda para block, ocupa a linha toda */
}
.facebook {
    width: 30px; /* Largura: 30px */
    height: 30px; /* Altura: 30px */
    display: inline-block; /* Vira inline-block, fica na linha mas aceita largura/altura */
    background-position:-120px -925px; /* Posição da imagem de fundo: -120px -925px */
    margin-top: 9px; /* Margem superior: 9px */
}
.menu {
    width: 30px; /* Largura: 30px */
    height: 30px; /* Altura: 30px */
    display: inline-block; /* Vira inline-block, fica na linha mas aceita largura/altura */
    background-position: -373px -785px; /* Posição da imagem de fundo: -373px -785px */
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
    top: 18px; /* Distância a partir do(a) topo: 18px */
    left: -5px; /* Distância a partir do(a) esquerda: -5px */
    display: none; /* Esconde o elemento e tira do fluxo */
}
.instagram {
    width: 40px; /* Largura: 40px */
    height: 31px; /* Altura: 31px */
    display: inline-block; /* Vira inline-block, fica na linha mas aceita largura/altura */
    background-position: -148px -923px; /* Posição da imagem de fundo: -148px -923px */
}
.afc {
    width: 150px; /* Largura: 150px */
    height: 72px; /* Altura: 72px */
    display: block; /* Muda para block, ocupa a linha toda */
    background-position: -346px -917px; /* Posição da imagem de fundo: -346px -917px */
    margin:-16px 28px 50px; /* Margem: -16px 28px 50px */
    float: right; /* Flutua o elemento para a direita */
}
.linkdin {
    width: 30px; /* Largura: 30px */
    height: 30px; /* Altura: 30px */
    display: inline-block; /* Vira inline-block, fica na linha mas aceita largura/altura */
    background-position:-189px -925px; /* Posição da imagem de fundo: -189px -925px */
}
.youtube {
    width: 45px; /* Largura: 45px */
    height: 30px; /* Altura: 30px */
    display: inline-block; /* Vira inline-block, fica na linha mas aceita largura/altura */
    background-position:-73px -923px; /* Posição da imagem de fundo: -73px -923px */
}
.home {
    width: 30px; /* Largura: 30px */
    height: 30px; /* Altura: 30px */
    display: inline-block; /* Vira inline-block, fica na linha mas aceita largura/altura */
    background-position: -197px -832px; /* Posição da imagem de fundo: -197px -832px */
}
.contact {
    width: 30px; /* Largura: 30px */
    height: 30px; /* Altura: 30px */
    display: inline-block; /* Vira inline-block, fica na linha mas aceita largura/altura */
    background-position: -248px -890px; /* Posição da imagem de fundo: -248px -890px */
}
.newcontact {
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
    top: 7px; /* Distância a partir do(a) topo: 7px */
}
.whatsapp {
    width: 30px; /* Largura: 30px */
    height: 30px; /* Altura: 30px */
    display: inline-block; /* Vira inline-block, fica na linha mas aceita largura/altura */
    background-position: -282px -890px; /* Posição da imagem de fundo: -282px -890px */
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
    top: 7px; /* Distância a partir do(a) topo: 7px */
}
.address {
    width: 30px; /* Largura: 30px */
    height: 30px; /* Altura: 30px */
    display: inline-block; /* Vira inline-block, fica na linha mas aceita largura/altura */
    background-position:-319px -891px; /* Posição da imagem de fundo: -319px -891px */
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
    top: 7px; /* Distância a partir do(a) topo: 7px */
}
.int-central {
    width: 30px; /* Largura: 30px */
    height: 30px; /* Altura: 30px */
    display: inline-block; /* Vira inline-block, fica na linha mas aceita largura/altura */
    background-position: -270px -832px; /* Posição da imagem de fundo: -270px -832px */
}
.compo {
    width: 30px; /* Largura: 30px */
    height: 30px; /* Altura: 30px */
    display: inline-block; /* Vira inline-block, fica na linha mas aceita largura/altura */
    background-position: -379px -832px; /* Posição da imagem de fundo: -379px -832px */
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
    left: 3px; /* Distância a partir do(a) esquerda: 3px */
}
.int-freight {
    width: 30px; /* Largura: 30px */
    height: 30px; /* Altura: 30px */
    display: inline-block; /* Vira inline-block, fica na linha mas aceita largura/altura */
    background-position: -277px -801px; /* Posição da imagem de fundo: -277px -801px */
}
.int-stock {
    width: 30px; /* Largura: 30px */
    height: 30px; /* Altura: 30px */
    display: inline-block; /* Vira inline-block, fica na linha mas aceita largura/altura */
    background-position: -336px -832px; /* Posição da imagem de fundo: -336px -832px */
}
.int-price {
    width: 30px; /* Largura: 30px */
    height: 30px; /* Altura: 30px */
    display: inline-block; /* Vira inline-block, fica na linha mas aceita largura/altura */
    background-position: -304px -832px; /* Posição da imagem de fundo: -304px -832px */
}
.int-func {
    width: 30px; /* Largura: 30px */
    height: 30px; /* Altura: 30px */
    display: inline-block; /* Vira inline-block, fica na linha mas aceita largura/altura */
    background-position: -379px -832px; /* Posição da imagem de fundo: -379px -832px */
}
.icon-catalog {
    background-position: 0 0; /* Posição da imagem de fundo: 0 0 */
}
.icon-orders {
    background-position: -74px 0; /* Posição da imagem de fundo: -74px 0 */
}
.icon-logistics {
    background-position: -176px 0; /* Posição da imagem de fundo: -176px 0 */
}
.icon-integration {
    background-position: -267px 0; /* Posição da imagem de fundo: -267px 0 */
}
.icon-lar {
    background-position: -15px -98px; /* Posição da imagem de fundo: -15px -98px */
    margin:0 40px; /* Margem: 0 40px */
}
.icon-lep {
    background-position: -100px -98px; /* Posição da imagem de fundo: -100px -98px */
    width: 140px; /* Largura: 140px */
    margin:0 40px; /* Margem: 0 40px */
}
.icon-macadeeva {
    background-position: -236px -98px; /* Posição da imagem de fundo: -236px -98px */
    margin:0 40px; /* Margem: 0 40px */
}
.icon-jafra {
    background-position: -323px -98px; /* Posição da imagem de fundo: -323px -98px */
    width: 170px; /* Largura: 170px */
    margin:0 40px; /* Margem: 0 40px */
}
.icon-dutra {
    background-position:0 -203px; /* Posição da imagem de fundo: 0 -203px */
    margin:0 30px; /* Margem: 0 30px */
}
.icon-quanthus {
    background-position: -19px -742px; /* Posição da imagem de fundo: -19px -742px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 150px; /* Largura: 150px */
}
.icon-mercadolivre {
    background-position:-119px -203px; /* Posição da imagem de fundo: -119px -203px */
    margin:0 30px; /* Margem: 0 30px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
}
.icon-amazon {
    background-position:-219px -197px; /* Posição da imagem de fundo: -219px -197px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 115px; /* Largura: 115px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
}
.icon-submarino {
    background-position: -353px -203px; /* Posição da imagem de fundo: -353px -203px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 114px; /* Largura: 114px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
}
.icon-americanas {
    background-position: -11px -285px; /* Posição da imagem de fundo: -11px -285px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 166px; /* Largura: 166px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
}
.icon-magazine {
    background-position: -200px -502px; /* Posição da imagem de fundo: -200px -502px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 150px; /* Largura: 150px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
}
.icon-vtex {
    background-position: -186px -291px; /* Posição da imagem de fundo: -186px -291px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 150px; /* Largura: 150px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 60px; /* Altura: 60px */
}
.icon-tray {
    background-position: -328px -291px; /* Posição da imagem de fundo: -328px -291px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 150px; /* Largura: 150px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 60px; /* Altura: 60px */
}
.icon-projec {
    background-position: -12px -359px; /* Posição da imagem de fundo: -12px -359px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 168px; /* Largura: 168px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 50px; /* Altura: 50px */
}
.icon-widecommerce {
    background-position: -175px -354px; /* Posição da imagem de fundo: -175px -354px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 168px; /* Largura: 168px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 50px; /* Altura: 50px */
}
.icon-magento {
    background-position: -343px -354px; /* Posição da imagem de fundo: -343px -354px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 168px; /* Largura: 168px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 50px; /* Altura: 50px */
}
.icon-bseller {
    background-position: 0 -451px; /* Posição da imagem de fundo: 0 -451px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 168px; /* Largura: 168px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 50px; /* Altura: 50px */
}
.icon-tiny {
    background-position: -159px -451px; /* Posição da imagem de fundo: -159px -451px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 102px; /* Largura: 102px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 50px; /* Altura: 50px */
}
.icon-bling {
    background-position:-283px -453px; /* Posição da imagem de fundo: -283px -453px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 102px; /* Largura: 102px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 50px; /* Altura: 50px */
}
.icon-sap {
    background-position:-61px -403px; /* Posição da imagem de fundo: -61px -403px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 86px; /* Largura: 86px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 50px; /* Altura: 50px */
}
.icon-millenium {
    background-position:-8px -521px; /* Posição da imagem de fundo: -8px -521px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 180px; /* Largura: 180px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 50px; /* Altura: 50px */
}
.icon-omie {
    background-position: -15px -833px; /* Posição da imagem de fundo: -15px -833px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 133px; /* Largura: 133px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 50px; /* Altura: 50px */
}
.icon-shopee {
    background-position: -149px -828px; /* Posição da imagem de fundo: -149px -828px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 150px; /* Largura: 150px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 50px; /* Altura: 50px */
}
.icon-martins {
    background-position: -277px -819px; /* Posição da imagem de fundo: -277px -819px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 192px; /* Largura: 192px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 55px; /* Altura: 55px */
}
.icon-intelipost {
    background-position: -354px -521px; /* Posição da imagem de fundo: -354px -521px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 160px; /* Largura: 160px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 50px; /* Altura: 50px */
}
.icon-correio {
    background-position: -354px -402px; /* Posição da imagem de fundo: -354px -402px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 160px; /* Largura: 160px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 50px; /* Altura: 50px */
}
.icon-olist {
    background-position: -397px -451px; /* Posição da imagem de fundo: -397px -451px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 87px; /* Largura: 87px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 50px; /* Altura: 50px */
}
.icon-frenet {
    background-position:-355px -12px; /* Posição da imagem de fundo: -355px -12px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 100px; /* Largura: 100px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 50px; /* Altura: 50px */
}
.icon-netshoes {
    background-position: -18px -570px; /* Posição da imagem de fundo: -18px -570px */
    margin: 0 18px; /* Margem: 0 18px */
    width: 158px; /* Largura: 158px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 50px; /* Altura: 50px */
}
.icon-shoptime {
    background-position: -194px -570px; /* Posição da imagem de fundo: -194px -570px */
    margin: 0 18px; /* Margem: 0 18px */
    width: 158px; /* Largura: 158px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 50px; /* Altura: 50px */
}
.icon-extra {
    background-position: -362px -570px; /* Posição da imagem de fundo: -362px -570px */
    margin: 0 18px; /* Margem: 0 18px */
    width: 158px; /* Largura: 158px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 50px; /* Altura: 50px */
}
.icon-pontofrio {
    background-position: -18px -621px; /* Posição da imagem de fundo: -18px -621px */
    margin: 0 30px; /* Margem: 0 30px */
    width:220px; /* Largura: 220px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 50px; /* Altura: 50px */
}
.icon-casabahia {
    background-position: -217px -625px; /* Posição da imagem de fundo: -217px -625px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 143px; /* Largura: 143px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 50px; /* Altura: 50px */
}
.icon-carrefour {
    background-position:-17px -685px; /* Posição da imagem de fundo: -17px -685px */
    margin: 0 30px; /* Margem: 0 30px */
    width:100px; /* Largura: 100px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 50px; /* Altura: 50px */
}
.icon-zoom {
    background-position: -128px -694px; /* Posição da imagem de fundo: -128px -694px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 130px; /* Largura: 130px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 50px; /* Altura: 50px */
}
.icon-buscape {
    background-position: -288px -703px; /* Posição da imagem de fundo: -288px -703px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 100px; /* Largura: 100px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 50px; /* Altura: 50px */
}
.icon-dafiti {
    background-position: -384px -715px; /* Posição da imagem de fundo: -384px -715px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 130px; /* Largura: 130px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 50px; /* Altura: 50px */
}
.icon-rdstation {
    background-position:-191px -757px; /* Posição da imagem de fundo: -191px -757px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 160px; /* Largura: 160px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 50px; /* Altura: 50px */
}
.icon-googleanalitics {
    background-position: -406px -639px; /* Posição da imagem de fundo: -406px -639px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 70px; /* Largura: 70px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 50px; /* Altura: 50px */
}
.icon-mailchilps {
    background-position: -379px -765px; /* Posição da imagem de fundo: -379px -765px */
    margin: 0 30px; /* Margem: 0 30px */
    width: 70px; /* Largura: 70px */
    -webkit-filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: grayscale(100%); /* Filtro visual (blur, brilho, etc.): grayscale(100%) */
    filter: gray; /* Filtro visual (blur, brilho, etc.): gray */
    height: 54px; /* Altura: 54px */
}
.channel {
    float:left; /* Flutua o elemento para a esquerda */
    width: 200px; /* Largura: 200px */
}
.channel p {
    font-size:12pt; /* Tamanho da fonte: 12pt */
    font-weight:600; /* Peso semi-negrito */
    margin-bottom: 20px; /* Margem inferior: 20px */
}
a.channel p {
    color: #000; /* Cor do texto: #000 */
}
.container-all {
    width:1000px; /* Largura: 1000px */
    margin:0 auto; /* Zera margem vertical e centraliza na horizontal */
    text-align: center; /* Centraliza o texto */
}
#container-marketplaces,#container-outros,#container-marketing,#container-ecommerce {
    float: left; /* Flutua o elemento para a esquerda */
    text-align: center; /* Centraliza o texto */
    width: 100%; /* Ocupa 100% da largura do pai */
}
.btn-view {
    background: #2acee6; /* Cor de fundo: #2acee6 */
    color: #FFF; /* Cor do texto: #FFF */
    font-weight: 600; /* Peso semi-negrito */
    padding:5px 20px; /* Espaçamento interno: 5px 20px */
    display: block; /* Muda para block, ocupa a linha toda */
    width:100px; /* Largura: 100px */
    margin:30px auto 0; /* Margem: 30px auto 0 */
}
.box2 {
    border: 1px solid #2acee6; /* Borda: 1px solid #2acee6 */
    border-radius: 10px; /* Arredonda os cantos: 10px */
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
    width: 220px; /* Largura: 220px */
    height: 230px; /* Altura: 230px */
    text-align: center; /* Centraliza o texto */
    box-shadow: 2px 2px 2px #2acee6; /* Sombra da caixa: 2px 2px 2px #2acee6 */
    margin: 20px 10px; /* Margem: 20px 10px */
    color: #000; /* Cor do texto: #000 */
    background: #FFF; /* Cor de fundo: #FFF */
    padding:10px 20px; /* Espaçamento interno: 10px 20px */
    float: left; /* Flutua o elemento para a esquerda */
}
.box3 {
    border: 1px solid #FFF; /* Borda: 1px solid #FFF */
    border-radius: 10px; /* Arredonda os cantos: 10px */
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
    width: 22%; /* Largura: 22% */
    height: 400px; /* Altura: 400px */
    text-align: center; /* Centraliza o texto */
    margin: 20px 10px; /* Margem: 20px 10px */
    color: #000; /* Cor do texto: #000 */
    background: transparent; /* Remove a cor de fundo */
    padding:10px 20px; /* Espaçamento interno: 10px 20px */
    float: left; /* Flutua o elemento para a esquerda */
}
.box4 {
    border: 1px solid #2acee6; /* Borda: 1px solid #2acee6 */
    border-radius: 10px; /* Arredonda os cantos: 10px */
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
    width: 220px; /* Largura: 220px */
    height: 280px; /* Altura: 280px */
    text-align: center; /* Centraliza o texto */
    margin: 20px 5px; /* Margem: 20px 5px */
    color: #000; /* Cor do texto: #000 */
    background: #FFF; /* Cor de fundo: #FFF */
    padding:10px 5px; /* Espaçamento interno: 10px 5px */
    float: left; /* Flutua o elemento para a esquerda */
}
.box4 h4 {
    font-size: 12pt; /* Tamanho da fonte: 12pt */
    height: 70px; /* Altura: 70px */
}
.channel-home-sub .box4 p {
    font-size: 12pt; /* Tamanho da fonte: 12pt */
    color: #000; /* Cor do texto: #000 */
}
.start {
    border:1px solid #da4f8e; /* Borda: 1px solid #da4f8e */
}
.start.box3 h4 {
    color: #da4f8e; /* Cor do texto: #da4f8e */
}
.btn-start,.btn-start:hover {
    border:1px solid #da4f8e; /* Borda: 1px solid #da4f8e */
    background: #da4f8e; /* Cor de fundo: #da4f8e */
    color: #FFF; /* Cor do texto: #FFF */
    padding: 10px 30px; /* Espaçamento interno: 10px 30px */
    margin-top: 10px; /* Margem superior: 10px */
}
.growth {
    border:1px solid #ffa558; /* Borda: 1px solid #ffa558 */
}
.growth.box3 h4 {
    color: #ffa558; /* Cor do texto: #ffa558 */
}
.btn-growth,.btn-growth:hover {
    border:1px solid #ffa558; /* Borda: 1px solid #ffa558 */
    background: #ffa558; /* Cor de fundo: #ffa558 */
    color: #FFF; /* Cor do texto: #FFF */
    padding: 10px 30px; /* Espaçamento interno: 10px 30px */
}
.btn-pro,.btn-pro:hover {
    border:1px solid #FFF; /* Borda: 1px solid #FFF */
    background: transparent; /* Remove a cor de fundo */
    color: #FFF; /* Cor do texto: #FFF */
    padding: 10px 30px; /* Espaçamento interno: 10px 30px */
}
.performance {
    border:1px solid #1191ca; /* Borda: 1px solid #1191ca */
}
.performance.box3 h4 {
    color: #1191ca; /* Cor do texto: #1191ca */
}
.btn-performance {
    border:1px solid #1191ca; /* Borda: 1px solid #1191ca */
    background: #1191ca; /* Cor de fundo: #1191ca */
    color: #FFF; /* Cor do texto: #FFF */
    padding: 10px 30px; /* Espaçamento interno: 10px 30px */
}
.box3 h4 {
    font-size: 18pt; /* Tamanho da fonte: 18pt */
    color: #FFF; /* Cor do texto: #FFF */
    margin: 0; /* Remove margem */
    padding: 15px 0; /* Espaçamento interno: 15px 0 */
    text-align: center; /* Centraliza o texto */
}
.box3 p:nth-child(2) {
    font-size: 12pt; /* Tamanho da fonte: 12pt */
    color: #FFF; /* Cor do texto: #FFF */
    margin: 0 0 10px; /* Margem: 0 0 10px */
    font-weight: 600; /* Peso semi-negrito */
}
.box3 p:nth-child(3) {
    font-size: 10pt; /* Tamanho da fonte: 10pt */
    color: #FFF; /* Cor do texto: #FFF */
}
.box3 p:nth-child(3) {
    font-size: 12pt; /* Tamanho da fonte: 12pt */
    color: #FFF; /* Cor do texto: #FFF */
    margin:0 0 30px; /* Margem: 0 0 30px */
}
.box3 p:nth-child(4) {
    font-size: 12pt; /* Tamanho da fonte: 12pt */
    color: #FFF; /* Cor do texto: #FFF */
    margin:0 0 20px; /* Margem: 0 0 20px */
}
.box3 p:nth-child(5) {
    font-size: 12pt; /* Tamanho da fonte: 12pt */
    color: #FFF; /* Cor do texto: #FFF */
    margin:0 0 20px; /* Margem: 0 0 20px */
}
.container-news .box2 {
    height: 370px; /* Altura: 370px */
    width:260px; /* Largura: 260px */
    margin: 0 10px 20px; /* Margem: 0 10px 20px */
    box-shadow:none; /* Remove sombra */
    border-radius: 5px; /* Arredonda os cantos: 5px */
    border:1px solid #FFF; /* Borda: 1px solid #FFF */
}
.box2 h4 {
    font-size: 12pt; /* Tamanho da fonte: 12pt */
    color: #333; /* Cor do texto: #333 */
    margin: 0; /* Remove margem */
    padding: 15px 0 0; /* Espaçamento interno: 15px 0 0 */
}
.container-news .box2 h4 {
    font-size: 14pt; /* Tamanho da fonte: 14pt */
}
.box2 p {
    font-size: 10pt; /* Tamanho da fonte: 10pt */
    color: #000; /* Cor do texto: #000 */
    text-align: justify; /* Justifica o texto */
    margin-top: 20px; /* Margem superior: 20px */
    display: block; /* Muda para block, ocupa a linha toda */
}
.container-news .box2 p {
    font-size: 12pt; /* Tamanho da fonte: 12pt */
}
.box {
    border: 1px solid #000; /* Borda: 1px solid #000 */
    border-radius: 10px; /* Arredonda os cantos: 10px */
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
    width: 22%; /* Largura: 22% */
    float: left; /* Flutua o elemento para a esquerda */
    height: 320px; /* Altura: 320px */
    text-align: center; /* Centraliza o texto */
    margin:0 17px 0 0; /* Margem: 0 17px 0 0 */
    color: #000; /* Cor do texto: #000 */
    background: #FFF; /* Cor de fundo: #FFF */
    padding: 0 8px; /* Espaçamento interno: 0 8px */
}
.galactix-hub-section {
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    background-color: #ebf1f6 !important; /* Cor de fundo: #ebf1f6 (forçado com !important) */
    padding: 32px 24px 40px 24px !important; /* Espaçamento interno: 80px 24px 100px 24px (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    margin: 0 !important; /* Remove margem (!important) */
    box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
}
.hub-container-grid {
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    max-width: 1200px !important; /* Largura máxima: 1200px (forçado com !important) */
    display: grid !important; /* Ativa grid nos filhos diretos (!important) */
    grid-template-columns: 1.2fr 1fr !important; /* Define as colunas do grid: 1.2fr 1fr (forçado com !important) */
    gap: 60px !important; /* Espaço de 60px entre os itens (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
}
.hub-content-column {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    align-items: flex-start !important; /* Alinha os filhos no início do eixo cruzado (!important) */
    text-align: left !important; /* Alinha o texto à esquerda (!important) */
}
.hub-brand-badge {
    font-size: 11px !important; /* Tamanho da fonte: 11px (forçado com !important) */
    font-weight: 700 !important; /* Deixa o texto em negrito (!important) */
    color: #4f46e5 !important; /* Cor do texto: #4f46e5 (forçado com !important) */
    letter-spacing: 1.5px !important; /* Espaçamento entre letras: 1.5px (forçado com !important) */
    text-transform: uppercase !important; /* Transforma o texto em maiúsculas (!important) */
    background: #ffffff !important; /* Cor de fundo: #ffffff (forçado com !important) */
    padding: 6px 14px !important; /* Espaçamento interno: 6px 14px (forçado com !important) */
    border-radius: 6px !important; /* Arredonda os cantos: 6px (forçado com !important) */
    border: 1px solid rgba(79, 70, 229, 0.15) !important; /* Borda: 1px solid rgba(79, 70, 229, 0.15) (forçado com !important) */
    display: inline-flex !important; /* Ativa flexbox mantendo o elemento inline (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    gap: 8px !important; /* Espaço de 8px entre os itens (!important) */
    margin-bottom: 20px !important; /* Margem inferior: 20px (forçado com !important) */
}
.hub-dot {
    width: 6px !important; /* Largura: 6px (forçado com !important) */
    height: 6px !important; /* Altura: 6px (forçado com !important) */
    background-color: #4f46e5 !important; /* Cor de fundo: #4f46e5 (forçado com !important) */
    border-radius: 50% !important; /* Arredonda os cantos: 50% (forçado com !important) */
}
.hub-main-title {
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
    font-size: 36px !important; /* Tamanho da fonte: 36px (forçado com !important) */
    color: #090d16 !important; /* Cor do texto: #090d16 (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    line-height: 1.3 !important; /* Altura da linha do texto: 1.3 (forçado com !important) */
    letter-spacing: -1.2px !important; /* Espaçamento entre letras: -1.2px (forçado com !important) */
    margin: 0 0 16px 0 !important; /* Margem: 0 0 16px 0 (forçado com !important) */
}
.hub-sub-title {
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
    font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
    color: #475569 !important; /* Cor do texto: #475569 (forçado com !important) */
    line-height: 1.65 !important; /* Altura da linha do texto: 1.65 (forçado com !important) */
    font-weight: 400 !important; /* Peso normal da fonte (!important) */
    margin: 0 0 40px 0 !important; /* Margem: 0 0 40px 0 (forçado com !important) */
}
.hub-tech-showcase {
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    height: 180px !important; /* Altura: 180px (forçado com !important) */
    background: linear-gradient(135deg, #090d16 0%, #1e293b 100%) !important; /* Fundo em gradiente: linear-gradient(135deg, #090d16 0%, #1e293b 100%) (forçado com !important) */
    border-radius: 16px !important; /* Arredonda os cantos: 16px (forçado com !important) */
    border: 1px solid rgba(255, 255, 255, 0.08) !important; /* Borda: 1px solid rgba(255, 255, 255, 0.08) (forçado com !important) */
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    overflow: hidden !important; /* Esconde o que ultrapassar os limites do elemento (!important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    box-shadow: inset 0 0 40px rgba(99, 102, 241, 0.15) !important; /* Sombra da caixa: inset 0 0 40px rgba(99, 102, 241, 0.15) (forçado com !important) */
}
.hub-core {
    padding: 10px 24px !important; /* Espaçamento interno: 10px 24px (forçado com !important) */
    background: linear-gradient(135deg, #6366f1, #4f46e5) !important; /* Fundo em gradiente: linear-gradient(135deg, #6366f1, #4f46e5) (forçado com !important) */
    border-radius: 100px !important; /* Arredonda os cantos: 100px (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    gap: 10px !important; /* Espaço de 10px entre os itens (!important) */
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
    z-index: 5 !important; /* Camada de sobreposição (quanto maior, mais na frente): 5 (forçado com !important) */
    animation: pulse-core 2s infinite alternate !important; /* Aplica a animação: pulse-core 2s infinite alternate (forçado com !important) */
}
.hub-core svg {
    width: 20px !important; /* Largura: 20px (forçado com !important) */
    height: 20px !important; /* Altura: 20px (forçado com !important) */
}
.hub-core-text {
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
    font-size: 15px !important; /* Tamanho da fonte: 15px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    letter-spacing: 1.5px !important; /* Espaçamento entre letras: 1.5px (forçado com !important) */
    text-transform: uppercase !important; /* Transforma o texto em maiúsculas (!important) */
}
.hub-main-title span {
    color: #4f46e5 !important; /* Cor do texto: #4f46e5 (forçado com !important) */
}
.orbital-ring {
    position: absolute !important; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative (!important) */
    border-radius: 50% !important; /* Arredonda os cantos: 50% (forçado com !important) */
    top: 50% !important; /* Distância a partir do(a) topo: 50% (forçado com !important) */
    left: 50% !important; /* Distância a partir do(a) esquerda: 50% (forçado com !important) */
}
.ring-inner {
    width: 130px !important; /* Largura: 130px (forçado com !important) */
    height: 130px !important; /* Altura: 130px (forçado com !important) */
    border: 1px dashed rgba(255, 255, 255, 0.2) !important; /* Borda: 1px dashed rgba(255, 255, 255, 0.2) (forçado com !important) */
    animation: spin-right 20s linear infinite !important; /* Aplica a animação: spin-right 20s linear infinite (forçado com !important) */
}
.ring-outer {
    width: 220px !important; /* Largura: 220px (forçado com !important) */
    height: 220px !important; /* Altura: 220px (forçado com !important) */
    border: 1px solid rgba(255, 255, 255, 0.05) !important; /* Borda: 1px solid rgba(255, 255, 255, 0.05) (forçado com !important) */
    background: radial-gradient(circle, transparent 40%, rgba(99, 102, 241, 0.04) 100%) !important; /* Fundo em gradiente: radial-gradient(circle, transparent 40%, rgba(99, 102, 241, 0.04) 100%) (forçado com !important) */
    transform: translate(-50%, -50%) !important; /* Transformação (rotação, escala ou deslocamento): translate(-50%, -50%) (forçado com !important) */
}
.hub-tag {
    position: absolute !important; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative (!important) */
    background: rgba(255, 255, 255, 0.08) !important; /* Cor de fundo: rgba(255, 255, 255, 0.08) (forçado com !important) */
    backdrop-filter: blur(8px) !important; /* Desfoca o que fica atrás do elemento: blur(8px) (forçado com !important) */
    -webkit-backdrop-filter: blur(8px) !important; /* -webkit-backdrop-filter: blur(8px) (forçado com !important) */
    border: 1px solid rgba(255, 255, 255, 0.15) !important; /* Borda: 1px solid rgba(255, 255, 255, 0.15) (forçado com !important) */
    color: #f8fafc !important; /* Cor do texto: #f8fafc (forçado com !important) */
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
    font-size: 11px !important; /* Tamanho da fonte: 11px (forçado com !important) */
    font-weight: 600 !important; /* Peso semi-negrito (!important) */
    padding: 8px 14px !important; /* Espaçamento interno: 8px 14px (forçado com !important) */
    border-radius: 100px !important; /* Arredonda os cantos: 100px (forçado com !important) */
    text-transform: uppercase !important; /* Transforma o texto em maiúsculas (!important) */
    letter-spacing: 0.5px !important; /* Espaçamento entre letras: 0.5px (forçado com !important) */
    z-index: 4 !important; /* Camada de sobreposição (quanto maior, mais na frente): 4 (forçado com !important) */
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.25) !important; /* Sombra da caixa: 0 6px 16px rgba(0, 0, 0, 0.25) (forçado com !important) */
    display: inline-flex !important; /* Ativa flexbox mantendo o elemento inline (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    gap: 8px !important; /* Espaço de 8px entre os itens (!important) */
}
.hub-tag svg {
    width: 15px !important; /* Largura: 15px (forçado com !important) */
    height: 15px !important; /* Altura: 15px (forçado com !important) */
    color: #818cf8 !important; /* Cor do texto: #818cf8 (forçado com !important) */
}
.tag-1 {
    top: 15%; /* Distância a partir do(a) topo: 15% */
    left: 8%; /* Distância a partir do(a) esquerda: 8% */
}
.tag-2 {
    bottom: 15%; /* Distância a partir do(a) base: 15% */
    right: 8%; /* Distância a partir do(a) direita: 8% */
}
.tag-3 {
    top: 18%; /* Distância a partir do(a) topo: 18% */
    right: 12%; /* Distância a partir do(a) direita: 12% */
}
/* Define os quadros da animação "spin-right" */
@keyframes spin-right {
    0% {
        transform: translate(-50%, -50%) rotate(0deg); /* Transformação (rotação, escala ou deslocamento): translate(-50%, -50%) rotate(0deg) */
    }
    100% {
        transform: translate(-50%, -50%) rotate(360deg); /* Transformação (rotação, escala ou deslocamento): translate(-50%, -50%) rotate(360deg) */
    }
}
/* Define os quadros da animação "pulse-core" */
@keyframes pulse-core {
    0% {
        box-shadow: 0 0 15px rgba(99, 102, 241, 0.4), 0 0 0 0 rgba(99, 102, 241, 0.15); /* Sombra da caixa: 0 0 15px rgba(99, 102, 241, 0.4), 0 0 0 0 rgba(99, 102, 241, 0.15) */
    }
    100% {
        box-shadow: 0 0 25px rgba(99, 102, 241, 0.7), 0 0 0 12px rgba(99, 102, 241, 0.1); /* Sombra da caixa: 0 0 25px rgba(99, 102, 241, 0.7), 0 0 0 12px rgba(99, 102, 241, 0.1) */
    }
}
.hub-metrics-column {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    gap: 20px !important; /* Espaço de 20px entre os itens (!important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
}
.metric-glass-card {
    background: rgba(255, 255, 255, 0.65) !important; /* Cor de fundo: rgba(255, 255, 255, 0.65) (forçado com !important) */
    backdrop-filter: blur(12px) !important; /* Desfoca o que fica atrás do elemento: blur(12px) (forçado com !important) */
    -webkit-backdrop-filter: blur(12px) !important; /* -webkit-backdrop-filter: blur(12px) (forçado com !important) */
    border: 1px solid rgba(255, 255, 255, 0.8) !important; /* Borda: 1px solid rgba(255, 255, 255, 0.8) (forçado com !important) */
    border-radius: 16px !important; /* Arredonda os cantos: 16px (forçado com !important) */
    padding: 24px 32px !important; /* Espaçamento interno: 24px 32px (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    align-items: flex-start !important; /* Alinha os filhos no início do eixo cruzado (!important) */
    text-align: left !important; /* Alinha o texto à esquerda (!important) */
    box-shadow: 0 10px 30px rgba(148, 163, 184, 0.06) !important; /* Sombra da caixa: 0 10px 30px rgba(148, 163, 184, 0.06) (forçado com !important) */
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important; /* Anima a mudança de propriedade ao longo do tempo: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) (forçado com !important) */
}
.metric-number-row {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: baseline !important; /* Alinha os filhos pela linha de base do texto (!important) */
    line-height: 1 !important; /* Altura da linha do texto: 1 (forçado com !important) */
    margin-bottom: 8px !important; /* Margem inferior: 8px (forçado com !important) */
}
.metric-plus {
    font-size: 32px !important; /* Tamanho da fonte: 32px (forçado com !important) */
    font-weight: 700 !important; /* Deixa o texto em negrito (!important) */
    margin-right: 2px !important; /* Margem direita: 2px (forçado com !important) */
}
.metric-value {
    font-size: 52px !important; /* Tamanho da fonte: 52px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    letter-spacing: -2px !important; /* Espaçamento entre letras: -2px (forçado com !important) */
}
.metric-label {
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
    font-size: 14px !important; /* Tamanho da fonte: 14px (forçado com !important) */
    font-weight: 600 !important; /* Peso semi-negrito (!important) */
    color: #475569 !important; /* Cor do texto: #475569 (forçado com !important) */
    text-transform: uppercase !important; /* Transforma o texto em maiúsculas (!important) */
    letter-spacing: 0.5px !important; /* Espaçamento entre letras: 0.5px (forçado com !important) */
    margin: 0 !important; /* Remove margem (!important) */
}
.border-pink {
    border-left: 5px solid #4f46e5 !important; /* Borda esquerda: 5px solid #4f46e5 (forçado com !important) */
}
.border-pink .metric-number-row {
    color: #4f46e5 !important; /* Cor do texto: #4f46e5 (forçado com !important) */
}
.border-green {
    border-left: 5px solid #0ea5e9 !important; /* Borda esquerda: 5px solid #0ea5e9 (forçado com !important) */
}
.border-green .metric-number-row {
    color: #0ea5e9 !important; /* Cor do texto: #0ea5e9 (forçado com !important) */
}
.border-yellow {
    border-left: 5px solid #8b5cf6 !important; /* Borda esquerda: 5px solid #8b5cf6 (forçado com !important) */
}
.border-yellow .metric-number-row {
    color: #8b5cf6 !important; /* Cor do texto: #8b5cf6 (forçado com !important) */
}
.metric-glass-card:hover {
    transform: translateX(6px) !important; /* Transformação (rotação, escala ou deslocamento): translateX(6px) (forçado com !important) */
    background: #ffffff !important; /* Cor de fundo: #ffffff (forçado com !important) */
    box-shadow: 0 15px 35px rgba(148, 163, 184, 0.12) !important; /* Sombra da caixa: 0 15px 35px rgba(148, 163, 184, 0.12) (forçado com !important) */
}
.galactix-cta-section {
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    background-color: #ebf1f6 !important; /* Cor de fundo: #ebf1f6 (forçado com !important) */
    padding: 0 20px !important; /* Espaçamento interno: 40px 24px 120px 24px (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    margin: 0px 0 10px 0 !important; /* Remove margem (!important) */
    box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
}
.cta-banner-container {
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    max-width: 1200px !important; /* Largura máxima: 1200px (forçado com !important) */
    background: #090d16 !important; /* Cor de fundo: #090d16 (forçado com !important) */
    border-radius: 24px !important; /* Arredonda os cantos: 24px (forçado com !important) */
    padding: 60px 40px !important; /* Espaçamento interno: 60px 40px (forçado com !important) */
    text-align: center !important; /* Centraliza o texto (!important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    box-shadow: 0 25px 60px rgba(9, 13, 22, 0.25) !important; /* Sombra da caixa: 0 25px 60px rgba(9, 13, 22, 0.25) (forçado com !important) */
}
.cta-title {
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
    font-size: 32px !important; /* Tamanho da fonte: 32px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
    letter-spacing: -1px !important; /* Espaçamento entre letras: -1px (forçado com !important) */
    margin: 0 0 12px 0 !important; /* Margem: 0 0 12px 0 (forçado com !important) */
}
.cta-subtitle {
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
    font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
    color: #94a3b8 !important; /* Cor do texto: #94a3b8 (forçado com !important) */
    max-width: 640px !important; /* Largura máxima: 640px (forçado com !important) */
    line-height: 1.6 !important; /* Altura da linha do texto: 1.6 (forçado com !important) */
    font-weight: 400 !important; /* Peso normal da fonte (!important) */
    margin: 0 0 32px 0 !important; /* Margem: 0 0 32px 0 (forçado com !important) */
}
.cta-button-expert {
    background: linear-gradient(135deg, #007aff, #0056b3) !important; /* Fundo em gradiente: linear-gradient(135deg, #007aff, #0056b3) (forçado com !important) */
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
    font-family: 'Inter', sans-serif !important; /* Define a fonte usada: 'Inter', sans-serif (forçado com !important) */
    font-size: 15px !important; /* Tamanho da fonte: 15px (forçado com !important) */
    font-weight: 700 !important; /* Deixa o texto em negrito (!important) */
    padding: 14px 36px !important; /* Espaçamento interno: 14px 36px (forçado com !important) */
    border-radius: 100px !important; /* Arredonda os cantos: 100px (forçado com !important) */
    display: inline-flex !important; /* Ativa flexbox mantendo o elemento inline (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    gap: 10px !important; /* Espaço de 10px entre os itens (!important) */
    cursor: pointer !important; /* Muda o cursor para indicar que é clicável (!important) */
    text-decoration: none !important; /* Remove sublinhado/decoração do texto (!important) */
    border: 1px solid rgba(255, 255, 255, 0.15) !important; /* Borda: 1px solid rgba(255, 255, 255, 0.15) (forçado com !important) */
    box-shadow: 0 4px 15px rgba(0, 122, 255, 0.3), 
                inset 0 1px 1px rgba(255, 255, 255, 0.2) !important; /* Sombra da caixa: 0 4px 15px rgba(0, 122, 255, 0.3), 
                inset 0 1px 1px rgba(255, 255, 255, 0.2) (forçado com !important) */
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important; /* Anima a mudança de propriedade ao longo do tempo: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) (forçado com !important) */
}
.cta-button-expert svg {
    width: 18px !important; /* Largura: 18px (forçado com !important) */
    height: 18px !important; /* Altura: 18px (forçado com !important) */
}
.cta-button-expert:hover {
    transform: translateY(-2px) scale(1.03) !important; /* Transformação (rotação, escala ou deslocamento): translateY(-2px) scale(1.03) (forçado com !important) */
    background: linear-gradient(135deg, #0088ff, #0066cc) !important; /* Fundo em gradiente: linear-gradient(135deg, #0088ff, #0066cc) (forçado com !important) */
    box-shadow: 0 8px 25px rgba(0, 122, 255, 0.5), 
                inset 0 1px 1px rgba(255, 255, 255, 0.3) !important; /* Sombra da caixa: 0 8px 25px rgba(0, 122, 255, 0.5), 
                inset 0 1px 1px rgba(255, 255, 255, 0.3) (forçado com !important) */
}
.cta-button-expert:active {
    transform: translateY(0) scale(0.98) !important; /* Transformação (rotação, escala ou deslocamento): translateY(0) scale(0.98) (forçado com !important) */
    box-shadow: 0 2px 8px rgba(0, 122, 255, 0.4) !important; /* Sombra da caixa: 0 2px 8px rgba(0, 122, 255, 0.4) (forçado com !important) */
}
.hero-solucoes {
    margin-bottom: 0px !important; /* Margem inferior: 0px (forçado com !important) */
    background: 
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913 !important; /* Fundo em gradiente: radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913 (forçado com !important) */
    padding: 70px 20px 40px 20px !important; /* Espaçamento interno: 70px 20px 90px 20px (forçado com !important) */
    text-align: center !important; /* Centraliza o texto (!important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
}
.hero-solucoes .container {
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    max-width: 900px !important; /* Largura máxima: 900px (forçado com !important) */
    margin: 0 auto !important; /* Zera margem vertical e centraliza na horizontal (!important) */
}
.hero-solucoes h1 {
    color: #FFFFFF !important; /* Cor do texto: #FFFFFF (forçado com !important) */
    font-size: 52px !important; /* Tamanho da fonte: 52px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    line-height: 1.15 !important; /* Altura da linha do texto: 1.15 (forçado com !important) */
    margin: 0 auto 24px auto !important; /* Margem: 0 auto 24px auto (forçado com !important) */
    letter-spacing: -1px !important; /* Espaçamento entre letras: -1px (forçado com !important) */
    text-shadow: 0 4px 20px rgba(0,0,0,0.5) !important; /* Sombra no texto: 0 4px 20px rgba(0,0,0,0.5) (forçado com !important) */
    background: none !important; /* Remove a cor de fundo (!important) */
    -webkit-text-fill-color: initial !important; /* Cor de preenchimento do texto (usado com gradiente): initial (forçado com !important) */
}
.hero-solucoes p {
    color: #cbd5e1 !important; /* Cor do texto: #cbd5e1 (forçado com !important) */
    font-size: 20px !important; /* Tamanho da fonte: 20px (forçado com !important) */
    font-weight: 400 !important; /* Peso normal da fonte (!important) */
    line-height: 1.6 !important; /* Altura da linha do texto: 1.6 (forçado com !important) */
    margin: 0 auto 0 auto !important; /* Margem: 0 auto 0 auto (forçado com !important) */
    max-width: 750px !important; /* Largura máxima: 750px (forçado com !important) */
}
.hero-ctas {
    margin-top: 40px !important; /* Margem superior: 40px (forçado com !important) */
}
.solucoes-desafios {
    padding-top: 0px !important; /* Espaçamento interno superior: 80px (forçado com !important) */
    padding-bottom: 35px !important; /* Espaçamento interno inferior: 35px (forçado com !important) */
    display: flow-root !important; /* Define display: flow-root (!important) */
    height: auto !important; /* Altura automática, ajusta ao conteúdo (!important) */
    min-height: max-content !important; /* Altura mínima: max-content (forçado com !important) */
    background-color: #ffffff !important; /* Cor de fundo: #ffffff (forçado com !important) */
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    z-index: 1 !important; /* Camada de sobreposição (quanto maior, mais na frente): 1 (forçado com !important) */
}
.desafios-header {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    text-align: center !important; /* Centraliza o texto (!important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    max-width: 100% !important; /* Não deixa ultrapassar 100% do pai (!important) */
    margin-top: -16px !important; /* Margem superior: 0 (forçado com !important) */
    margin-bottom: 48px !important; /* Margem inferior: 48px (forçado com !important) */
    margin-left: auto !important; /* Margem esquerda: auto (forçado com !important) */
    margin-right: auto !important; /* Margem direita: auto (forçado com !important) */
}
.desafios-header .tag-secao {
    align-self: flex-start !important; /* Sobrescreve o alinhamento deste item no eixo cruzado: flex-start (forçado com !important) */
    background: rgba(0, 160, 227, 0.1) !important; /* Cor de fundo: rgba(0, 160, 227, 0.1) (forçado com !important) */
    color: #00a0e3 !important; /* Cor do texto: #00a0e3 (forçado com !important) */
    padding: 6px 16px !important; /* Espaçamento interno: 6px 16px (forçado com !important) */
    border-radius: 20px !important; /* Arredonda os cantos: 20px (forçado com !important) */
    font-size: 13px !important; /* Tamanho da fonte: 13px (forçado com !important) */
    font-weight: 700 !important; /* Deixa o texto em negrito (!important) */
    text-transform: uppercase !important; /* Transforma o texto em maiúsculas (!important) */
    letter-spacing: 1.2px !important; /* Espaçamento entre letras: 1.2px (forçado com !important) */
    margin-bottom: 24px !important; /* Margem inferior: 24px (forçado com !important) */
}
.desafios-header h2 {
    max-width: 800px !important; /* Largura máxima: 800px (forçado com !important) */
    font-size: 42px !important; /* Tamanho da fonte: 42px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    color: #0f172a !important; /* Cor do texto: #0f172a (forçado com !important) */
    margin-bottom: 16px !important; /* Margem inferior: 16px (forçado com !important) */
    line-height: 1.2 !important; /* Altura da linha do texto: 1.2 (forçado com !important) */
    letter-spacing: -1px !important; /* Espaçamento entre letras: -1px (forçado com !important) */
}
.desafios-header p {
    max-width: 700px !important; /* Largura máxima: 700px (forçado com !important) */
    font-size: 18px !important; /* Tamanho da fonte: 18px (forçado com !important) */
    color: #64748b !important; /* Cor do texto: #64748b (forçado com !important) */
    line-height: 1.6 !important; /* Altura da linha do texto: 1.6 (forçado com !important) */
}
.desafios-grid {
    display: grid !important; /* Ativa grid nos filhos diretos (!important) */
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)) !important; /* Cria colunas automáticas que se ajustam à largura disponível: repeat(auto-fit, minmax(340px, 1fr)) (forçado com !important) */
    gap: 32px !important; /* Espaço de 32px entre os itens (!important) */
    align-items: stretch !important; /* Estica os filhos para preencher o eixo cruzado (!important) */
    padding-bottom: 0 !important; /* Espaçamento interno inferior: 0 (forçado com !important) */
}
.card-desafio {
    background: #ffffff !important; /* Cor de fundo: #ffffff (forçado com !important) */
    border: 1px solid #f1f5f9 !important; /* Borda: 1px solid #f1f5f9 (forçado com !important) */
    border-radius: 16px !important; /* Arredonda os cantos: 16px (forçado com !important) */
    padding: 40px 32px 0 32px !important; /* Espaçamento interno: 40px 32px 0 32px (forçado com !important) */
    box-shadow: 0 4px 6px -1px rgba(15, 23, 42, 0.05), 0 2px 4px -1px rgba(15, 23, 42, 0.03) !important; /* Sombra da caixa: 0 4px 6px -1px rgba(15, 23, 42, 0.05), 0 2px 4px -1px rgba(15, 23, 42, 0.03) (forçado com !important) */
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important; /* Anima a mudança de propriedade ao longo do tempo: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.4s cubic-bezier(0.4, 0, 0.2, 1) (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    overflow: hidden !important; /* Esconde o que ultrapassar os limites do elemento (!important) */
    height: 100% !important; /* Ocupa 100% da altura do pai (!important) */
    z-index: 2 !important; /* Camada de sobreposição (quanto maior, mais na frente): 2 (forçado com !important) */
}
.card-desafio::before {
    content: "" !important; /* Conteúdo inserido via CSS: "" (forçado com !important) */
    position: absolute !important; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative (!important) */
    top: 0 !important; /* Distância a partir do(a) topo: 0 (forçado com !important) */
    left: 0 !important; /* Distância a partir do(a) esquerda: 0 (forçado com !important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    height: 4px !important; /* Altura: 4px (forçado com !important) */
    background: #00a0e3 !important; /* Cor de fundo: #00a0e3 (forçado com !important) */
    transform: scaleX(0) !important; /* Transformação (rotação, escala ou deslocamento): scaleX(0) (forçado com !important) */
    transform-origin: left !important; /* Ponto de referência da transformação: left (forçado com !important) */
    transition: transform 0.4s ease !important; /* Anima a mudança de propriedade ao longo do tempo: transform 0.4s ease (forçado com !important) */
}
.card-desafio:hover {
    transform: translateY(-8px) !important; /* Transformação (rotação, escala ou deslocamento): translateY(-8px) (forçado com !important) */
    box-shadow: 0 20px 25px -5px rgba(15, 23, 42, 0.1), 0 10px 10px -5px rgba(15, 23, 42, 0.04) !important; /* Sombra da caixa: 0 20px 25px -5px rgba(15, 23, 42, 0.1), 0 10px 10px -5px rgba(15, 23, 42, 0.04) (forçado com !important) */
}
.card-desafio:hover::before {
    transform: scaleX(1) !important; /* Transformação (rotação, escala ou deslocamento): scaleX(1) (forçado com !important) */
}
.desafio-icon {
    width: 64px !important; /* Largura: 64px (forçado com !important) */
    height: 64px !important; /* Altura: 64px (forçado com !important) */
    border-radius: 16px !important; /* Arredonda os cantos: 16px (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    margin-bottom: 32px !important; /* Margem inferior: 32px (forçado com !important) */
    transition: transform 0.3s ease !important; /* Anima a mudança de propriedade ao longo do tempo: transform 0.3s ease (forçado com !important) */
}
.card-desafio:hover .desafio-icon {
    transform: scale(1.1) !important; /* Transformação (rotação, escala ou deslocamento): scale(1.1) (forçado com !important) */
}
.desafio-icon.bg-blue {
    background: rgba(0, 160, 227, 0.1) !important; /* Cor de fundo: rgba(0, 160, 227, 0.1) (forçado com !important) */
}
.desafio-icon.bg-green {
    background: rgba(16, 185, 129, 0.1) !important; /* Cor de fundo: rgba(16, 185, 129, 0.1) (forçado com !important) */
}
.desafio-icon.bg-purple {
    background: rgba(139, 92, 246, 0.1) !important; /* Cor de fundo: rgba(139, 92, 246, 0.1) (forçado com !important) */
}
.card-desafio h3 {
    font-size: 22px !important; /* Tamanho da fonte: 22px (forçado com !important) */
    font-weight: 700 !important; /* Deixa o texto em negrito (!important) */
    color: #0f172a !important; /* Cor do texto: #0f172a (forçado com !important) */
    margin-bottom: 6px !important; /* Margem inferior: 6px (forçado com !important) */
    line-height: 1.3 !important; /* Altura da linha do texto: 1.3 (forçado com !important) */
    letter-spacing: -0.5px !important; /* Espaçamento entre letras: -0.5px (forçado com !important) */
    min-height: 58px !important; /* Altura mínima: 58px (forçado com !important) */
}
.desafio-dor {
    font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
    color: #64748b !important; /* Cor do texto: #64748b (forçado com !important) */
    margin-bottom: 32px !important; /* Margem inferior: 32px (forçado com !important) */
    line-height: 1.6 !important; /* Altura da linha do texto: 1.6 (forçado com !important) */
    min-height: 78px !important; /* Altura mínima: 78px (forçado com !important) */
    flex-grow: 0 !important; /* Fator de crescimento do item flex: 0 (forçado com !important) */
}
.desafio-cura {
    flex-grow: 1 !important; /* Fator de crescimento do item flex: 1 (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    justify-content: flex-start !important; /* Alinha os filhos no início do eixo principal (!important) */
    margin-left: -32px !important; /* Margem esquerda: -32px (forçado com !important) */
    margin-right: -32px !important; /* Margem direita: -32px (forçado com !important) */
    margin-bottom: 0 !important; /* Margem inferior: 0 (forçado com !important) */
    padding: 24px 32px 40px 32px !important; /* Espaçamento interno: 24px 32px 40px 32px (forçado com !important) */
    background: #f8fafc !important; /* Cor de fundo: #f8fafc (forçado com !important) */
    border-top: 1px solid #f1f5f9 !important; /* Borda superior: 1px solid #f1f5f9 (forçado com !important) */
    border-radius: 0 0 16px 16px !important; /* Arredonda os cantos: 0 0 16px 16px (forçado com !important) */
    font-size: 14.5px !important; /* Tamanho da fonte: 14.5px (forçado com !important) */
    color: #334155 !important; /* Cor do texto: #334155 (forçado com !important) */
    line-height: 1.6 !important; /* Altura da linha do texto: 1.6 (forçado com !important) */
}
.desafio-cura strong {
    color: #00a0e3 !important; /* Cor do texto: #00a0e3 (forçado com !important) */
    display: block !important; /* Muda para block, ocupa a linha toda (!important) */
    margin-bottom: 10px !important; /* Margem inferior: 10px (forçado com !important) */
    font-size: 12px !important; /* Tamanho da fonte: 12px (forçado com !important) */
    text-transform: uppercase !important; /* Transforma o texto em maiúsculas (!important) */
    letter-spacing: 1px !important; /* Espaçamento entre letras: 1px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
}
header {
    position: fixed !important; /* Tira do fluxo normal e fixa na tela mesmo com scroll (!important) */
    top: 0 !important; /* Distância a partir do(a) topo: 0 (forçado com !important) */
    left: 0 !important; /* Distância a partir do(a) esquerda: 0 (forçado com !important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    z-index: 9999 !important; /* Camada de sobreposição (quanto maior, mais na frente): 9999 (forçado com !important) */
}
.solucoes-integracoes {
    padding: 16px 0 !important; /* Espaçamento interno: 16px 0 (forçado com !important) */
    background: #f8fafc !important; /* Cor de fundo: #f8fafc (forçado com !important) */
    border-top: 1px solid #e2e8f0 !important; /* Borda superior: 1px solid #e2e8f0 (forçado com !important) */
    border-bottom: 1px solid #e2e8f0 !important; /* Borda inferior: 1px solid #e2e8f0 (forçado com !important) */
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    overflow: hidden !important; /* Esconde o que ultrapassar os limites do elemento (!important) */
    margin-top: 0 !important; /* Margem superior: 0 (forçado com !important) */
    margin-bottom: 35px !important; /* Margem inferior: 35px (forçado com !important) */
    clear: both !important; /* Impede que o elemento fique ao lado de elementos flutuantes: both (forçado com !important) */
}
.marquee-container {
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    overflow: hidden !important; /* Esconde o que ultrapassar os limites do elemento (!important) */
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
}
.marquee-container::before,
.marquee-container::after {
    content: "" !important; /* Conteúdo inserido via CSS: "" (forçado com !important) */
    position: absolute !important; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative (!important) */
    top: 0 !important; /* Distância a partir do(a) topo: 0 (forçado com !important) */
    width: 120px !important; /* Largura: 120px (forçado com !important) */
    height: 100% !important; /* Ocupa 100% da altura do pai (!important) */
    z-index: 2 !important; /* Camada de sobreposição (quanto maior, mais na frente): 2 (forçado com !important) */
}
.marquee-container::before {
    left: 0 !important; /* Distância a partir do(a) esquerda: 0 (forçado com !important) */
    background: linear-gradient(to right, #f8fafc 0%, transparent 100%) !important; /* Fundo em gradiente: linear-gradient(to right, #f8fafc 0%, transparent 100%) (forçado com !important) */
}
.marquee-container::after {
    right: 0 !important; /* Distância a partir do(a) direita: 0 (forçado com !important) */
    background: linear-gradient(to left, #f8fafc 0%, transparent 100%) !important; /* Fundo em gradiente: linear-gradient(to left, #f8fafc 0%, transparent 100%) (forçado com !important) */
}
.marquee-track {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    width: max-content !important; /* Largura: max-content (forçado com !important) */
    animation: scrollMarquee 35s linear infinite !important; /* Aplica a animação: scrollMarquee 35s linear infinite (forçado com !important) */
}
.marquee-track:hover {
    animation-play-state: paused !important; /* animation-play-state: paused (forçado com !important) */
}
.marquee-item {
    font-size: 20px !important; /* Tamanho da fonte: 20px (forçado com !important) */
    font-weight: 700 !important; /* Deixa o texto em negrito (!important) */
    color: #94a3b8 !important; /* Cor do texto: #94a3b8 (forçado com !important) */
    padding: 0 40px !important; /* Espaçamento interno: 0 40px (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    transition: color 0.3s ease !important; /* Anima a mudança de propriedade ao longo do tempo: color 0.3s ease (forçado com !important) */
    cursor: default !important; /* Volta o cursor ao padrão (!important) */
    letter-spacing: -0.5px !important; /* Espaçamento entre letras: -0.5px (forçado com !important) */
    white-space: nowrap !important; /* Impede quebra de linha do texto (!important) */
}
.marquee-item:hover {
    color: #00a0e3 !important; /* Cor do texto: #00a0e3 (forçado com !important) */
}
/* Define os quadros da animação "scrollMarquee" */
@keyframes scrollMarquee {
    0% {
        transform: translateX(0); /* Transformação (rotação, escala ou deslocamento): translateX(0) */
    }
    100% {
        transform: translateX(-50%); /* Transformação (rotação, escala ou deslocamento): translateX(-50%) */
    }
}
.solucoes-cta {
    background: linear-gradient(135deg, #090914 0%, #110c2e 100%) !important; /* Fundo em gradiente: linear-gradient(135deg, #090914 0%, #110c2e 100%) (forçado com !important) */
    padding: 100px 20px !important; /* Espaçamento interno: 100px 20px (forçado com !important) */
    text-align: center !important; /* Centraliza o texto (!important) */
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    overflow: hidden !important; /* Esconde o que ultrapassar os limites do elemento (!important) */
    z-index: 1 !important; /* Camada de sobreposição (quanto maior, mais na frente): 1 (forçado com !important) */
}
.solucoes-cta::before {
    content: "" !important; /* Conteúdo inserido via CSS: "" (forçado com !important) */
    position: absolute !important; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative (!important) */
    top: -200px !important; /* Distância a partir do(a) topo: -200px (forçado com !important) */
    left: 50% !important; /* Distância a partir do(a) esquerda: 50% (forçado com !important) */
    transform: translateX(-50%) !important; /* Transformação (rotação, escala ou deslocamento): translateX(-50%) (forçado com !important) */
    width: 800px !important; /* Largura: 800px (forçado com !important) */
    height: 400px !important; /* Altura: 400px (forçado com !important) */
    background: radial-gradient(ellipse at center, rgba(0, 160, 227, 0.15) 0%, rgba(128, 43, 226, 0.05) 50%, transparent 70%) !important; /* Fundo em gradiente: radial-gradient(ellipse at center, rgba(0, 160, 227, 0.15) 0%, rgba(128, 43, 226, 0.05) 50%, transparent 70%) (forçado com !important) */
    z-index: -1 !important; /* Camada de sobreposição (quanto maior, mais na frente): -1 (forçado com !important) */
    pointer-events: none !important; /* Impede clique e interação com o elemento (!important) */
}
.solucoes-cta .container {
    max-width: 800px !important; /* Largura máxima: 800px (forçado com !important) */
    margin: 0 auto !important; /* Zera margem vertical e centraliza na horizontal (!important) */
}
.solucoes-cta h2 {
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
    font-size: 40px !important; /* Tamanho da fonte: 40px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    line-height: 1.2 !important; /* Altura da linha do texto: 1.2 (forçado com !important) */
    margin-bottom: 24px !important; /* Margem inferior: 24px (forçado com !important) */
    letter-spacing: -1px !important; /* Espaçamento entre letras: -1px (forçado com !important) */
}
.solucoes-cta p {
    color: #cbd5e1 !important; /* Cor do texto: #cbd5e1 (forçado com !important) */
    font-size: 18px !important; /* Tamanho da fonte: 18px (forçado com !important) */
    line-height: 1.6 !important; /* Altura da linha do texto: 1.6 (forçado com !important) */
    margin-bottom: 40px !important; /* Margem inferior: 40px (forçado com !important) */
}
.cta-buttons {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    gap: 16px !important; /* Espaço de 16px entre os itens (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    flex-wrap: wrap !important; /* Permite os itens quebrarem para a linha de baixo (!important) */
}
.cta-buttons .btn-primary {
    background: #00a0e3 !important; /* Cor de fundo: #00a0e3 (forçado com !important) */
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
    padding: 14px 32px !important; /* Espaçamento interno: 14px 32px (forçado com !important) */
    border-radius: 8px !important; /* Arredonda os cantos: 8px (forçado com !important) */
    font-weight: 600 !important; /* Peso semi-negrito (!important) */
    font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
    text-decoration: none !important; /* Remove sublinhado/decoração do texto (!important) */
    transition: all 0.3s ease !important; /* Anima a mudança de propriedade ao longo do tempo: all 0.3s ease (forçado com !important) */
    animation: pulseShadow 2s infinite alternate ease-in-out !important; /* Aplica a animação: pulseShadow 2s infinite alternate ease-in-out (forçado com !important) */
}
/* Define os quadros da animação "pulseShadow" */
@keyframes pulseShadow {
    0% {
        box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3); /* Sombra da caixa: 0 4px 15px rgba(0, 160, 227, 0.3) */
    }
    100% {
        box-shadow: 0 4px 25px rgba(0, 160, 227, 0.6), 0 0 12px rgba(0, 160, 227, 0.2); /* Sombra da caixa: 0 4px 25px rgba(0, 160, 227, 0.6), 0 0 12px rgba(0, 160, 227, 0.2) */
    }
}
.cta-buttons .btn-primary:hover {
    background: #008cc9 !important; /* Cor de fundo: #008cc9 (forçado com !important) */
    transform: translateY(-2px) !important; /* Transformação (rotação, escala ou deslocamento): translateY(-2px) (forçado com !important) */
    box-shadow: 0 6px 20px rgba(0, 160, 227, 0.5) !important; /* Sombra da caixa: 0 6px 20px rgba(0, 160, 227, 0.5) (forçado com !important) */
}
.cta-buttons .btn-secondary {
    background: transparent !important; /* Remove a cor de fundo (!important) */
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
    padding: 14px 32px !important; /* Espaçamento interno: 14px 32px (forçado com !important) */
    border-radius: 8px !important; /* Arredonda os cantos: 8px (forçado com !important) */
    font-weight: 600 !important; /* Peso semi-negrito (!important) */
    font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
    text-decoration: none !important; /* Remove sublinhado/decoração do texto (!important) */
    border: 1px solid rgba(255, 255, 255, 0.2) !important; /* Borda: 1px solid rgba(255, 255, 255, 0.2) (forçado com !important) */
    transition: all 0.3s ease !important; /* Anima a mudança de propriedade ao longo do tempo: all 0.3s ease (forçado com !important) */
}
.cta-buttons .btn-secondary:hover {
    background: rgba(255, 255, 255, 0.05) !important; /* Cor de fundo: rgba(255, 255, 255, 0.05) (forçado com !important) */
    border-color: rgba(255, 255, 255, 0.5) !important; /* Cor da borda: rgba(255, 255, 255, 0.5) (forçado com !important) */
}
main.page-recursos {
    flex: 1 0 auto !important; /* Define grow/shrink/basis do item flex: 1 0 auto (forçado com !important) */
    background-color: #f8fafc !important; /* Cor de fundo: #f8fafc (forçado com !important) */
    margin-bottom: 0 !important; /* Margem inferior: 0 (forçado com !important) */
    padding-bottom: 0 !important; /* Espaçamento interno inferior: 0 (forçado com !important) */
}
footer {
    flex-shrink: 0 !important; /* Fator de encolhimento do item flex: 0 (forçado com !important) */
    margin-top: 0 !important; /* Margem superior: 0 (forçado com !important) */
}
html {
    scroll-behavior: smooth !important; /* scroll-behavior: smooth (forçado com !important) */
}
/* Define os quadros da animação "fadeUp" */
@keyframes fadeUp {
    from {
        opacity: 0; /* Transparência do elemento (0 invisível, 1 opaco): 0 */
        transform: translateY(20px); /* Transformação (rotação, escala ou deslocamento): translateY(20px) */
    }
    to {
        opacity: 1; /* Transparência do elemento (0 invisível, 1 opaco): 1 */
        transform: translateY(0); /* Transformação (rotação, escala ou deslocamento): translateY(0) */
    }
}
.fade-up-1 {
    animation: fadeUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards; /* Aplica a animação: fadeUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards */
}
.fade-up-2 {
    animation: fadeUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.1s forwards; /* Aplica a animação: fadeUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.1s forwards */
    opacity: 0; /* Transparência do elemento (0 invisível, 1 opaco): 0 */
}
.fade-up-3 {
    animation: fadeUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.2s forwards; /* Aplica a animação: fadeUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.2s forwards */
    opacity: 0; /* Transparência do elemento (0 invisível, 1 opaco): 0 */
}
.card-animate {
    animation: fadeUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards; /* Aplica a animação: fadeUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards */
    opacity: 0; /* Transparência do elemento (0 invisível, 1 opaco): 0 */
}
.hero-recursos {
    background: 
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913 !important; /* Fundo em gradiente: radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913 (forçado com !important) */
    padding: 60px 20px 30px 20px !important; /* Espaçamento interno: 60px 20px 30px 20px (forçado com !important) */
    text-align: center !important; /* Centraliza o texto (!important) */
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important; /* Borda inferior: 1px solid rgba(255, 255, 255, 0.05) (forçado com !important) */
}
.hero-recursos .container {
    max-width: 900px !important; /* Largura máxima: 900px (forçado com !important) */
    margin: 0 auto !important; /* Zera margem vertical e centraliza na horizontal (!important) */
}
.hero-recursos h1 {
    color: #FFFFFF !important; /* Cor do texto: #FFFFFF (forçado com !important) */
    font-size: 52px !important; /* Tamanho da fonte: 52px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    letter-spacing: -0.04em !important; /* Espaçamento entre letras: -0.04em (forçado com !important) */
    margin-bottom: 16px !important; /* Margem inferior: 16px (forçado com !important) */
    line-height: 1.1 !important; /* Altura da linha do texto: 1.1 (forçado com !important) */
}
.hero-recursos p {
    color: #94a3b8 !important; /* Cor do texto: #94a3b8 (forçado com !important) */
    font-size: 19px !important; /* Tamanho da fonte: 19px (forçado com !important) */
    max-width: 650px !important; /* Largura máxima: 650px (forçado com !important) */
    margin: 0 auto 0 auto !important; /* Margem: 0 auto 0 auto (forçado com !important) */
    line-height: 1.6 !important; /* Altura da linha do texto: 1.6 (forçado com !important) */
}
.recursos-nav-wrapper {
    margin-top: 24px !important; /* Margem superior: 24px (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
}
.recursos-nav {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-wrap: wrap !important; /* Permite os itens quebrarem para a linha de baixo (!important) */
    gap: 12px !important; /* Espaço de 12px entre os itens (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    list-style: none !important; /* Remove marcadores da lista (!important) */
    padding: 0 !important; /* Remove espaçamento interno (!important) */
    margin: 0 !important; /* Remove margem (!important) */
}
.recursos-nav a {
    display: inline-flex !important; /* Ativa flexbox mantendo o elemento inline (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    padding: 8px 20px !important; /* Espaçamento interno: 8px 20px (forçado com !important) */
    background: rgba(255, 255, 255, 0.04) !important; /* Cor de fundo: rgba(255, 255, 255, 0.04) (forçado com !important) */
    border: 1px solid rgba(255, 255, 255, 0.08) !important; /* Borda: 1px solid rgba(255, 255, 255, 0.08) (forçado com !important) */
    border-radius: 30px !important; /* Arredonda os cantos: 30px (forçado com !important) */
    color: #94a3b8 !important; /* Cor do texto: #94a3b8 (forçado com !important) */
    text-decoration: none !important; /* Remove sublinhado/decoração do texto (!important) */
    font-weight: 600 !important; /* Peso semi-negrito (!important) */
    font-size: 14px !important; /* Tamanho da fonte: 14px (forçado com !important) */
    transition: all 0.2s ease !important; /* Anima a mudança de propriedade ao longo do tempo: all 0.2s ease (forçado com !important) */
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    z-index: 20 !important; /* Camada de sobreposição (quanto maior, mais na frente): 20 (forçado com !important) */
    cursor: pointer !important; /* Muda o cursor para indicar que é clicável (!important) */
    pointer-events: auto !important; /* Eventos de ponteiro: auto (forçado com !important) */
}
.recursos-nav a:hover, 
.recursos-nav a.active {
    background: #00a0e3 !important; /* Cor de fundo: #00a0e3 (forçado com !important) */
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
    border-color: #00a0e3 !important; /* Cor da borda: #00a0e3 (forçado com !important) */
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3) !important; /* Sombra da caixa: 0 4px 15px rgba(0, 160, 227, 0.3) (forçado com !important) */
}
.recursos-secao {
    padding-top: 16px !important; /* Espaçamento interno superior: 40px (forçado com !important) */
    padding-bottom: 16px !important; /* Espaçamento interno inferior: 50px (forçado com !important) */
    padding-left: 20px !important; /* Espaçamento interno esquerda: 20px (forçado com !important) */
    padding-right: 20px !important; /* Espaçamento interno direita: 20px (forçado com !important) */
    scroll-margin-top: 100px !important; /* scroll-margin-top: 100px (forçado com !important) */
}
.secao-header {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    max-width: 1100px !important; /* Largura máxima: 1100px (forçado com !important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    margin: 0px auto 24px auto !important; /* Margem: 10px auto 30px auto (forçado com !important) */
}
.secao-header .tag-secao {
    align-self: flex-start !important; /* Sobrescreve o alinhamento deste item no eixo cruzado: flex-start (forçado com !important) */
    display: inline-flex !important; /* Ativa flexbox mantendo o elemento inline (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    padding: 6px 14px !important; /* Espaçamento interno: 6px 14px (forçado com !important) */
    border-radius: 20px !important; /* Arredonda os cantos: 20px (forçado com !important) */
    font-size: 12px !important; /* Tamanho da fonte: 12px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    text-transform: uppercase !important; /* Transforma o texto em maiúsculas (!important) */
    letter-spacing: 1px !important; /* Espaçamento entre letras: 1px (forçado com !important) */
    margin-bottom: 8px !important; /* Margem inferior: 8px (forçado com !important) */
    background: rgba(0, 160, 227, 0.1) !important; /* Cor de fundo: rgba(0, 160, 227, 0.1) (forçado com !important) */
    color: #00a0e3 !important; /* Cor do texto: #00a0e3 (forçado com !important) */
}
.secao-header h2 {
    font-size: 36px !important; /* Tamanho da fonte: 36px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    color: #0f172a !important; /* Cor do texto: #0f172a (forçado com !important) */
    letter-spacing: -0.03em !important; /* Espaçamento entre letras: -0.03em (forçado com !important) */
    margin-bottom: 12px !important; /* Margem inferior: 12px (forçado com !important) */
    line-height: 1.15 !important; /* Altura da linha do texto: 1.15 (forçado com !important) */
    text-align: center !important; /* Centraliza o texto (!important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    max-width: 800px !important; /* Largura máxima: 800px (forçado com !important) */
}
.secao-header p {
    font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
    color: #64748b !important; /* Cor do texto: #64748b (forçado com !important) */
    line-height: 1.6 !important; /* Altura da linha do texto: 1.6 (forçado com !important) */
    text-align: center !important; /* Centraliza o texto (!important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    max-width: 700px !important; /* Largura máxima: 700px (forçado com !important) */
}
.bento-grid {
    display: grid !important; /* Ativa grid nos filhos diretos (!important) */
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important; /* Cria colunas automáticas que se ajustam à largura disponível: repeat(auto-fit, minmax(280px, 1fr)) (forçado com !important) */
    gap: 20px !important; /* Espaço de 20px entre os itens (!important) */
    max-width: 1100px !important; /* Largura máxima: 1100px (forçado com !important) */
    margin: 0 auto 10px auto !important; /* Margem: 0 auto 10px auto (forçado com !important) */
}
.grid-2-cols {
    grid-template-columns: repeat(2, 1fr) !important; /* Define as colunas do grid: repeat(2, 1fr) (forçado com !important) */
}
.bento-grid .destaque {
    grid-column: span 2 !important; /* Define em quais colunas o item começa e termina: span 2 (forçado com !important) */
}
.bento-card {
    background-color: #ffffff !important; /* Cor de fundo: #ffffff (forçado com !important) */
    border: 1px solid #e2e8f0 !important; /* Borda: 1px solid #e2e8f0 (forçado com !important) */
    border-radius: 24px !important; /* Arredonda os cantos: 24px (forçado com !important) */
    padding: 40px !important; /* Espaçamento interno: 40px (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    text-decoration: none !important; /* Remove sublinhado/decoração do texto (!important) */
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important; /* Anima a mudança de propriedade ao longo do tempo: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) (forçado com !important) */
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03) !important; /* Sombra da caixa: 0 4px 20px rgba(0, 0, 0, 0.03) (forçado com !important) */
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    overflow: hidden !important; /* Esconde o que ultrapassar os limites do elemento (!important) */
}
a.bento-card:hover {
    transform: translateY(-6px) !important; /* Transformação (rotação, escala ou deslocamento): translateY(-6px) (forçado com !important) */
    border-color: #00a0e3 !important; /* Cor da borda: #00a0e3 (forçado com !important) */
    box-shadow: 0 20px 40px rgba(0, 160, 227, 0.15) !important; /* Sombra da caixa: 0 20px 40px rgba(0, 160, 227, 0.15) (forçado com !important) */
}
.bento-card.static-card {
    cursor: default !important; /* Volta o cursor ao padrão (!important) */
}
.bento-card.static-card:hover {
    transform: translateY(-2px) !important; /* Transformação (rotação, escala ou deslocamento): translateY(-2px) (forçado com !important) */
    border-color: rgba(148, 163, 184, 0.3) !important; /* Cor da borda: rgba(148, 163, 184, 0.3) (forçado com !important) */
    box-shadow: 0 8px 20px -5px rgba(0, 0, 0, 0.06) !important; /* Sombra da caixa: 0 8px 20px -5px rgba(0, 0, 0, 0.06) (forçado com !important) */
}
.bento-card.destaque {
    background-color: #030712 !important; /* Cor de fundo: #030712 (forçado com !important) */
    border: 1px solid rgba(255, 255, 255, 0.1) !important; /* Borda: 1px solid rgba(255, 255, 255, 0.1) (forçado com !important) */
}
.bento-card.destaque:hover {
    border-color: rgba(0, 160, 227, 0.4) !important; /* Cor da borda: rgba(0, 160, 227, 0.4) (forçado com !important) */
    box-shadow: 0 20px 40px rgba(0, 160, 227, 0.15) !important; /* Sombra da caixa: 0 20px 40px rgba(0, 160, 227, 0.15) (forçado com !important) */
}
.bento-card.destaque h3 {
    color: #f9fafb !important; /* Cor do texto: #f9fafb (forçado com !important) */
    font-size: 28px !important; /* Tamanho da fonte: 28px (forçado com !important) */
}
.bento-card.destaque p {
    color: #9ca3af !important; /* Cor do texto: #9ca3af (forçado com !important) */
    font-size: 17px !important; /* Tamanho da fonte: 17px (forçado com !important) */
    max-width: 450px !important; /* Largura máxima: 450px (forçado com !important) */
}
.bento-icon {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    width: 52px !important; /* Largura: 52px (forçado com !important) */
    height: 52px !important; /* Altura: 52px (forçado com !important) */
    border-radius: 14px !important; /* Arredonda os cantos: 14px (forçado com !important) */
    margin-bottom: 24px !important; /* Margem inferior: 24px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
}
.bento-card h3 {
    font-size: 22px !important; /* Tamanho da fonte: 22px (forçado com !important) */
    font-weight: 700 !important; /* Deixa o texto em negrito (!important) */
    color: #111827 !important; /* Cor do texto: #111827 (forçado com !important) */
    margin: 0 0 12px 0 !important; /* Margem: 0 0 12px 0 (forçado com !important) */
    letter-spacing: -0.5px !important; /* Espaçamento entre letras: -0.5px (forçado com !important) */
}
.bento-card p {
    font-size: 15px !important; /* Tamanho da fonte: 15px (forçado com !important) */
    color: #6b7280 !important; /* Cor do texto: #6b7280 (forçado com !important) */
    line-height: 1.6 !important; /* Altura da linha do texto: 1.6 (forçado com !important) */
    margin: 0 !important; /* Remove margem (!important) */
}
.recursos-secao.dark-mode {
    background: #060913 !important; /* Cor de fundo: #060913 (forçado com !important) */
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    border-top: 1px solid rgba(255, 255, 255, 0.05) !important; /* Borda superior: 1px solid rgba(255, 255, 255, 0.05) (forçado com !important) */
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important; /* Borda inferior: 1px solid rgba(255, 255, 255, 0.05) (forçado com !important) */
    padding-top: 60px !important; /* Espaçamento interno superior: 60px (forçado com !important) */
    padding-bottom: 60px !important; /* Espaçamento interno inferior: 60px (forçado com !important) */
}
.split-layout {
    display: grid !important; /* Ativa grid nos filhos diretos (!important) */
    grid-template-columns: 1fr 1fr !important; /* Define as colunas do grid: 1fr 1fr (forçado com !important) */
    gap: 48px !important; /* Espaço de 48px entre os itens (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    max-width: 1100px !important; /* Largura máxima: 1100px (forçado com !important) */
    margin: 0 auto !important; /* Zera margem vertical e centraliza na horizontal (!important) */
}
.split-text {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    align-items: flex-start !important; /* Alinha os filhos no início do eixo cruzado (!important) */
}
.split-cards {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    gap: 20px !important; /* Espaço de 20px entre os itens (!important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
}
.split-text h2 {
    font-size: 38px !important; /* Tamanho da fonte: 38px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    letter-spacing: -0.03em !important; /* Espaçamento entre letras: -0.03em (forçado com !important) */
    line-height: 1.15 !important; /* Altura da linha do texto: 1.15 (forçado com !important) */
    margin-bottom: 16px !important; /* Margem inferior: 16px (forçado com !important) */
    text-align: left !important; /* Alinha o texto à esquerda (!important) */
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
}
.split-text p {
    font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
    line-height: 1.6 !important; /* Altura da linha do texto: 1.6 (forçado com !important) */
    text-align: left !important; /* Alinha o texto à esquerda (!important) */
    color: #94a3b8 !important; /* Cor do texto: #94a3b8 (forçado com !important) */
}
.split-text .tag-secao,
.recursos-secao.dark-mode .glow-tag {
    display: inline-flex !important; /* Ativa flexbox mantendo o elemento inline (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    padding: 6px 14px !important; /* Espaçamento interno: 6px 14px (forçado com !important) */
    border-radius: 20px !important; /* Arredonda os cantos: 20px (forçado com !important) */
    font-size: 12px !important; /* Tamanho da fonte: 12px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    text-transform: uppercase !important; /* Transforma o texto em maiúsculas (!important) */
    letter-spacing: 1px !important; /* Espaçamento entre letras: 1px (forçado com !important) */
    margin-bottom: 16px !important; /* Margem inferior: 16px (forçado com !important) */
    background: rgba(139, 92, 246, 0.15) !important; /* Cor de fundo: rgba(139, 92, 246, 0.15) (forçado com !important) */
    border: 1px solid rgba(139, 92, 246, 0.3) !important; /* Borda: 1px solid rgba(139, 92, 246, 0.3) (forçado com !important) */
    color: #a78bfa !important; /* Cor do texto: #a78bfa (forçado com !important) */
    box-shadow: 0 0 15px rgba(139, 92, 246, 0.2) !important; /* Sombra da caixa: 0 0 15px rgba(139, 92, 246, 0.2) (forçado com !important) */
}
.feature-list {
    list-style: none !important; /* Remove marcadores da lista (!important) */
    padding: 0 !important; /* Remove espaçamento interno (!important) */
    margin: 24px 0 32px 0 !important; /* Margem: 24px 0 32px 0 (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    gap: 12px !important; /* Espaço de 12px entre os itens (!important) */
}
.feature-list li {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    font-size: 15px !important; /* Tamanho da fonte: 15px (forçado com !important) */
    font-weight: 600 !important; /* Peso semi-negrito (!important) */
    color: #cbd5e1 !important; /* Cor do texto: #cbd5e1 (forçado com !important) */
}
.feature-list li svg {
    width: 18px !important; /* Largura: 18px (forçado com !important) */
    height: 18px !important; /* Altura: 18px (forçado com !important) */
    margin-right: 10px !important; /* Margem direita: 10px (forçado com !important) */
    stroke: #00a0e3 !important; /* Cor do traço do SVG: #00a0e3 (forçado com !important) */
}
.bento-card.dark-card {
    background: rgba(255, 255, 255, 0.02) !important; /* Cor de fundo: rgba(255, 255, 255, 0.02) (forçado com !important) */
    border: 1px solid rgba(255, 255, 255, 0.06) !important; /* Borda: 1px solid rgba(255, 255, 255, 0.06) (forçado com !important) */
    backdrop-filter: blur(10px) !important; /* Desfoca o que fica atrás do elemento: blur(10px) (forçado com !important) */
}
.bento-card.dark-card h3 {
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
}
.bento-card.dark-card p {
    color: #94a3b8 !important; /* Cor do texto: #94a3b8 (forçado com !important) */
}
.bento-card.dark-card.static-card:hover {
    background: rgba(255, 255, 255, 0.04) !important; /* Cor de fundo: rgba(255, 255, 255, 0.04) (forçado com !important) */
    border-color: rgba(255, 255, 255, 0.15) !important; /* Cor da borda: rgba(255, 255, 255, 0.15) (forçado com !important) */
}
.text-gradient-animated {
    background: linear-gradient(135deg, #00a0e3 0%, #006eb6 100%) !important; /* Fundo em gradiente: linear-gradient(135deg, #00a0e3 0%, #006eb6 100%) (forçado com !important) */
    -webkit-background-clip: text !important; /* Recorta o fundo no formato do texto (efeito de gradiente no texto) (!important) */
    -webkit-text-fill-color: transparent !important; /* Cor de preenchimento do texto (usado com gradiente): transparent (forçado com !important) */
    display: inline-block !important; /* Vira inline-block, fica na linha mas aceita largura/altura (!important) */
}
.section-grid-bg {
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    background-color: #f8fafc !important; /* Cor de fundo: #f8fafc (forçado com !important) */
    background-image: 
        linear-gradient(rgba(0, 160, 227, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 160, 227, 0.04) 1px, transparent 1px) !important; /* Imagem de fundo: linear-gradient(rgba(0, 160, 227, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 160, 227, 0.04) 1px, transparent 1px) (forçado com !important) */
    background-size: 30px 30px !important; /* Tamanho da imagem de fundo: 30px 30px (!important) */
}
.card-logistica {
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
}
.card-top-border {
    position: absolute !important; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative (!important) */
    top: 0 !important; /* Distância a partir do(a) topo: 0 (forçado com !important) */
    left: 0 !important; /* Distância a partir do(a) esquerda: 0 (forçado com !important) */
    right: 0 !important; /* Distância a partir do(a) direita: 0 (forçado com !important) */
    height: 4px !important; /* Altura: 4px (forçado com !important) */
    border-radius: 24px 24px 0 0 !important; /* Arredonda os cantos: 24px 24px 0 0 (forçado com !important) */
    background: linear-gradient(90deg, #00a0e3, #00d2ff) !important; /* Fundo em gradiente: linear-gradient(90deg, #00a0e3, #00d2ff) (forçado com !important) */
    opacity: 0 !important; /* Transparência do elemento (0 invisível, 1 opaco): 0 (forçado com !important) */
    transition: opacity 0.3s ease !important; /* Anima a mudança de propriedade ao longo do tempo: opacity 0.3s ease (forçado com !important) */
}
.bento-card:hover .card-top-border,
.card-logistica:hover .card-top-border {
    opacity: 1 !important; /* Transparência do elemento (0 invisível, 1 opaco): 1 (forçado com !important) */
}
.status-badge {
    position: absolute !important; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative (!important) */
    top: 32px !important; /* Distância a partir do(a) topo: 32px (forçado com !important) */
    right: 32px !important; /* Distância a partir do(a) direita: 32px (forçado com !important) */
    font-size: 10px !important; /* Tamanho da fonte: 10px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    text-transform: uppercase !important; /* Transforma o texto em maiúsculas (!important) */
    letter-spacing: 0.5px !important; /* Espaçamento entre letras: 0.5px (forçado com !important) */
    color: #64748b !important; /* Cor do texto: #64748b (forçado com !important) */
    background: #f1f5f9 !important; /* Cor de fundo: #f1f5f9 (forçado com !important) */
    padding: 6px 12px !important; /* Espaçamento interno: 6px 12px (forçado com !important) */
    border-radius: 20px !important; /* Arredonda os cantos: 20px (forçado com !important) */
    border: 1px solid #e2e8f0 !important; /* Borda: 1px solid #e2e8f0 (forçado com !important) */
}
.mini-benefits {
    list-style: none !important; /* Remove marcadores da lista (!important) */
    padding: 16px 0 0 0 !important; /* Espaçamento interno: 16px 0 0 0 (forçado com !important) */
    margin: auto 0 0 0 !important; /* Margem: auto 0 0 0 (forçado com !important) */
    border-top: 1px solid #f1f5f9 !important; /* Borda superior: 1px solid #f1f5f9 (forçado com !important) */
}
.mini-benefits li {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    font-size: 13px !important; /* Tamanho da fonte: 13px (forçado com !important) */
    font-weight: 600 !important; /* Peso semi-negrito (!important) */
    color: #10b981 !important; /* Cor do texto: #10b981 (forçado com !important) */
}
.mini-benefits li svg {
    width: 16px !important; /* Largura: 16px (forçado com !important) */
    height: 16px !important; /* Altura: 16px (forçado com !important) */
    margin-right: 8px !important; /* Margem direita: 8px (forçado com !important) */
    stroke: #10b981 !important; /* Cor do traço do SVG: #10b981 (forçado com !important) */
}
.cta-wrapper {
    margin-top: 32px !important; /* Margem superior: 32px (forçado com !important) */
}
.btn-recursos {
    display: inline-flex !important; /* Ativa flexbox mantendo o elemento inline (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    gap: 12px !important; /* Espaço de 12px entre os itens (!important) */
    padding: 16px 36px !important; /* Espaçamento interno: 16px 36px (forçado com !important) */
    background: linear-gradient(135deg, #00a0e3 0%, #005c99 100%) !important; /* Fundo em gradiente: linear-gradient(135deg, #00a0e3 0%, #005c99 100%) (forçado com !important) */
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
    font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
    font-weight: 700 !important; /* Deixa o texto em negrito (!important) */
    text-decoration: none !important; /* Remove sublinhado/decoração do texto (!important) */
    border-radius: 12px !important; /* Arredonda os cantos: 12px (forçado com !important) */
    box-shadow: 0 8px 25px -5px rgba(0, 160, 227, 0.5), inset 0 2px 2px rgba(255, 255, 255, 0.2) !important; /* Sombra da caixa: 0 8px 25px -5px rgba(0, 160, 227, 0.5), inset 0 2px 2px rgba(255, 255, 255, 0.2) (forçado com !important) */
    border: 1px solid rgba(255, 255, 255, 0.1) !important; /* Borda: 1px solid rgba(255, 255, 255, 0.1) (forçado com !important) */
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important; /* Anima a mudança de propriedade ao longo do tempo: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) (forçado com !important) */
    cursor: pointer !important; /* Muda o cursor para indicar que é clicável (!important) */
}
.btn-recursos:hover {
    transform: translateY(-3px) scale(1.02) !important; /* Transformação (rotação, escala ou deslocamento): translateY(-3px) scale(1.02) (forçado com !important) */
    box-shadow: 0 15px 35px -5px rgba(0, 160, 227, 0.6), inset 0 2px 2px rgba(255, 255, 255, 0.3) !important; /* Sombra da caixa: 0 15px 35px -5px rgba(0, 160, 227, 0.6), inset 0 2px 2px rgba(255, 255, 255, 0.3) (forçado com !important) */
}
.btn-recursos svg {
    transition: transform 0.3s ease !important; /* Anima a mudança de propriedade ao longo do tempo: transform 0.3s ease (forçado com !important) */
}
.btn-recursos:hover svg {
    transform: translateX(4px) !important; /* Transformação (rotação, escala ou deslocamento): translateX(4px) (forçado com !important) */
}
.recursos-cta {
    background: #04060d !important; /* Cor de fundo: #04060d (forçado com !important) */
    padding: 40px 20px !important; /* Espaçamento interno: 80px 20px (forçado com !important) */
    text-align: center !important; /* Centraliza o texto (!important) */
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    overflow: hidden !important; /* Esconde o que ultrapassar os limites do elemento (!important) */
    margin-bottom: 0 !important; /* Margem inferior: 0 (forçado com !important) */
    border-bottom: none !important; /* Borda inferior: none (forçado com !important) */
}
.recursos-cta::before {
    content: '' !important; /* Conteúdo inserido via CSS: '' (forçado com !important) */
    position: absolute !important; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative (!important) */
    top: -50% !important; /* Distância a partir do(a) topo: -50% (forçado com !important) */
    left: 50% !important; /* Distância a partir do(a) esquerda: 50% (forçado com !important) */
    transform: translateX(-50%) !important; /* Transformação (rotação, escala ou deslocamento): translateX(-50%) (forçado com !important) */
    width: 600px !important; /* Largura: 600px (forçado com !important) */
    height: 600px !important; /* Altura: 600px (forçado com !important) */
    background: radial-gradient(circle, rgba(0, 160, 227, 0.15) 0%, transparent 70%) !important; /* Fundo em gradiente: radial-gradient(circle, rgba(0, 160, 227, 0.15) 0%, transparent 70%) (forçado com !important) */
    pointer-events: none !important; /* Impede clique e interação com o elemento (!important) */
}
.recursos-cta .container {
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    z-index: 2 !important; /* Camada de sobreposição (quanto maior, mais na frente): 2 (forçado com !important) */
    max-width: 680px !important; /* Largura máxima: 680px (forçado com !important) */
    margin: 0 auto !important; /* Zera margem vertical e centraliza na horizontal (!important) */
}
.recursos-cta h2 {
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
    font-size: 36px !important; /* Tamanho da fonte: 36px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    letter-spacing: -0.03em !important; /* Espaçamento entre letras: -0.03em (forçado com !important) */
    margin-bottom: 16px !important; /* Margem inferior: 16px (forçado com !important) */
    line-height: 1.2 !important; /* Altura da linha do texto: 1.2 (forçado com !important) */
}
.recursos-cta p {
    color: #94a3b8 !important; /* Cor do texto: #94a3b8 (forçado com !important) */
    font-size: 17px !important; /* Tamanho da fonte: 17px (forçado com !important) */
    margin-bottom: 32px !important; /* Margem inferior: 32px (forçado com !important) */
    line-height: 1.6 !important; /* Altura da linha do texto: 1.6 (forçado com !important) */
}
html {
    scroll-behavior: smooth !important; /* scroll-behavior: smooth (forçado com !important) */
}
main.page-integrations, main.page-recursos {
    flex: 1 0 auto !important; /* Define grow/shrink/basis do item flex: 1 0 auto (forçado com !important) */
    background-color: #ffffff !important; /* Cor de fundo: #ffffff (forçado com !important) */
    margin-bottom: 0 !important; /* Margem inferior: 0 (forçado com !important) */
    padding-bottom: 0 !important; /* Espaçamento interno inferior: 0 (forçado com !important) */
}
footer {
    flex-shrink: 0 !important; /* Fator de encolhimento do item flex: 0 (forçado com !important) */
    margin-top: 0 !important; /* Margem superior: 0 (forçado com !important) */
}
/* Define os quadros da animação "fadeUp" */
@keyframes fadeUp {
    from {
        opacity: 0; /* Transparência do elemento (0 invisível, 1 opaco): 0 */
        transform: translateY(20px); /* Transformação (rotação, escala ou deslocamento): translateY(20px) */
    }
    to {
        opacity: 1; /* Transparência do elemento (0 invisível, 1 opaco): 1 */
        transform: translateY(0); /* Transformação (rotação, escala ou deslocamento): translateY(0) */
    }
}
.fade-up-1 {
    animation: fadeUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards; /* Aplica a animação: fadeUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards */
}
.fade-up-2 {
    animation: fadeUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.1s forwards; /* Aplica a animação: fadeUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.1s forwards */
    opacity: 0; /* Transparência do elemento (0 invisível, 1 opaco): 0 */
}
.fade-up-3 {
    animation: fadeUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.2s forwards; /* Aplica a animação: fadeUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.2s forwards */
    opacity: 0; /* Transparência do elemento (0 invisível, 1 opaco): 0 */
}
.card-animate {
    animation: fadeUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards; /* Aplica a animação: fadeUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards */
    opacity: 0; /* Transparência do elemento (0 invisível, 1 opaco): 0 */
}
.hero-produto {
    background: radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%), 
                radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%), 
                radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%), 
                #060913 !important; /* Fundo em gradiente: radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%), 
                radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%), 
                radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%), 
                #060913 (forçado com !important) */
    padding: 80px 20px 80px 20px !important; /* Espaçamento interno: 140px 20px 80px 20px (forçado com !important) */
    text-align: center !important; /* Centraliza o texto (!important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important; /* Borda inferior: 1px solid rgba(255, 255, 255, 0.05) (forçado com !important) */
}
.hero-produto .container {
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    max-width: 900px !important; /* Largura máxima: 900px (forçado com !important) */
    margin: 0 auto !important; /* Zera margem vertical e centraliza na horizontal (!important) */
}
.hero-produto h1 {
    color: #FFFFFF !important; /* Cor do texto: #FFFFFF (forçado com !important) */
    font-size: 52px !important; /* Tamanho da fonte: 52px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    line-height: 1.15 !important; /* Altura da linha do texto: 1.15 (forçado com !important) */
    margin: 0 auto 20px auto !important; /* Margem: 0 auto 20px auto (forçado com !important) */
    letter-spacing: -1px !important; /* Espaçamento entre letras: -1px (forçado com !important) */
    text-shadow: 0 4px 20px rgba(0,0,0,0.5) !important; /* Sombra no texto: 0 4px 20px rgba(0,0,0,0.5) (forçado com !important) */
    text-wrap: balance !important; /* Distribui o texto de forma mais equilibrada entre as linhas (!important) */
}
.hero-produto p {
    color: #cbd5e1 !important; /* Cor do texto: #cbd5e1 (forçado com !important) */
    font-size: 20px !important; /* Tamanho da fonte: 20px (forçado com !important) */
    font-weight: 400 !important; /* Peso normal da fonte (!important) */
    line-height: 1.6 !important; /* Altura da linha do texto: 1.6 (forçado com !important) */
    margin: 0 auto 40px auto !important; /* Margem: 0 auto 40px auto (forçado com !important) */
    max-width: 750px !important; /* Largura máxima: 750px (forçado com !important) */
    text-wrap: pretty !important; /* pretty (!important) */
}

/* Bloco mestre do componente visual de prova social */
.hero-visual-proof {
    /* Ativa o flexbox para organizar os elementos filhos */
    display: flex !important; 
    /* Altera a direção do flex para empilhar de cima para baixo (em coluna) */
    flex-direction: column !important; 
    /* Centraliza os itens horizontalmente (no eixo X) */
    align-items: center !important; 
    /* Centraliza o bloco inteiro no eixo vertical */
    justify-content: center !important; 
    /* Adiciona um espaço exato de 12px entre os avatares (em cima) e o texto (embaixo) */
    gap: 12px !important; 
    /* Empurra o bloco 32px para baixo, afastando-o do subtítulo do Hero */
    margin-top: 32px !important; 
    /* Desativa interações do mouse no elemento (não clicável) */
    pointer-events: none !important; 
}

/* Agrupa os círculos para manterem a sobreposição lateral */
.avatar-cluster {
    /* Mantém os círculos alinhados na horizontal (lado a lado) */
    display: flex !important; 
    /* Alinha os círculos verticalmente ao centro */
    align-items: center !important; 
    /* Centraliza o cluster de avatares horizontalmente */
    justify-content: center !important; 
    gap: 16px !important;
    margin-bottom: 30px;
}

/* Base geométrica compartilhada por todos os círculos */
.avatar-circle {
    /* Define a largura do círculo em 42 pixels */
    width: 42px !important; 
    /* Define a altura do círculo em 42 pixels */
    height: 42px !important; 
    /* Arredonda as bordas em 50% para formar uma esfera perfeita */
    border-radius: 50% !important; 
    /* Adiciona uma borda sólida com a cor de fundo do site para criar o corte na sobreposição */
    border: 2px solid #060913 !important; 
    /* Puxa o círculo 12px para a esquerda, forçando a sobreposição sobre o item anterior */
    margin-left: 0 !important; 
    /* Ativa flexbox internamente para alinhar as siglas */
    display: flex !important; 
    /* Centraliza o texto verticalmente */
    align-items: center !important; 
    /* Centraliza o texto horizontalmente */
    justify-content: center !important; 
    /* Projeta sombra preta para dar profundidade e destaque em relação ao fundo */
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3) !important; 
}

/* Zera a margem negativa do primeiro círculo para ele não deslocar o alinhamento */
.avatar-cluster .avatar-circle:nth-child(1) {
    margin-left: 0 !important;
}

/* Círculo 1 (Mercado Livre) - Vidro translúcido amarelo */
.avatar-circle.c1 { 
    background: rgba(255, 230, 0, 0.08) !important; 
    color: #ffe600 !important; 
    font-weight: 800 !important; 
    font-size: 13px !important; 
    box-shadow: inset 0 0 0 1px rgba(255, 230, 0, 0.3), 0 4px 10px rgba(0, 0, 0, 0.3) !important; 
}

/* Círculo 2 (Amazon) - Vidro translúcido laranja */
.avatar-circle.c2 { 
    background: rgba(255, 153, 0, 0.08) !important; 
    color: #ff9900 !important; 
    font-weight: 800 !important; 
    font-size: 11px !important; 
    letter-spacing: -0.5px !important; /* Ajusta o espaço entre as letras para caberem no círculo */
    box-shadow: inset 0 0 0 1px rgba(255, 153, 0, 0.3), 0 4px 10px rgba(0, 0, 0, 0.3) !important; 
}

/* Círculo 3 (Magalu) - Vidro translúcido azul */
.avatar-circle.c3 { 
    background: rgba(0, 160, 227, 0.08) !important; 
    color: #00a0e3 !important; 
    font-weight: 800 !important; 
    font-size: 11px !important; 
    letter-spacing: -0.5px !important;
    box-shadow: inset 0 0 0 1px rgba(0, 160, 227, 0.3), 0 4px 10px rgba(0, 0, 0, 0.3) !important; 
}

/* Círculo numérico final (+50) - Vidro translúcido neutro */
.avatar-circle.avatar-plus {
    background: rgba(255, 255, 255, 0.08) !important; 
    color: #ffffff !important; 
    font-size: 13px !important; 
    font-weight: 700 !important; 
    backdrop-filter: blur(8px) !important; 
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.2), 0 4px 10px rgba(0, 0, 0, 0.3) !important; 
}

/* Estilização do texto de autoridade posicionado abaixo dos avatares */
.proof-text {
    color: #94a3b8 !important; 
    font-size: 15px !important; /* Ajustado para 15px para manter proporção centralizada elegante */
    font-weight: 400 !important; 
    text-align: center !important; /* Força centralização do texto */
}

/* Realce tipográfico na palavra-chave do texto */
.proof-text strong {
    color: #ffffff !important; 
    font-weight: 700 !important; 
}

.story-section {
    padding: 10px 20px !important; /* Espaçamento interno: 10px 20px (forçado com !important) */
}
.bg-gray {
    background-color: #f8fafc !important; /* Cor de fundo: #f8fafc (forçado com !important) */
}
.bg-white {
    background-color: #ffffff !important; /* Cor de fundo: #ffffff (forçado com !important) */
}
.story-section.bg-gray {
    padding-top: 32px !important; /* Espaçamento interno superior: 100px (forçado com !important) */
    padding-bottom: 10px !important; /* Espaçamento interno inferior: 10px (forçado com !important) */
}
.story-section.bg-white {
    padding-top: 30px !important; /* Espaçamento interno superior: 30px (forçado com !important) */
}
.story-grid {
    display: grid !important; /* Ativa grid nos filhos diretos (!important) */
    grid-template-columns: 1fr 1fr !important; /* Define as colunas do grid: 1fr 1fr (forçado com !important) */
    gap: 60px !important; /* Espaço de 60px entre os itens (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    max-width: 1100px !important; /* Largura máxima: 1100px (forçado com !important) */
    margin: 0 auto !important; /* Zera margem vertical e centraliza na horizontal (!important) */
}
.badge-max {
    display: inline-block !important; /* Vira inline-block, fica na linha mas aceita largura/altura (!important) */
    background: linear-gradient(135deg, #e0f2fe 0%, #bae6fd 100%) !important; /* Fundo em gradiente: linear-gradient(135deg, #e0f2fe 0%, #bae6fd 100%) (forçado com !important) */
    color: #0284c7 !important; /* Cor do texto: #0284c7 (forçado com !important) */
    font-size: 13px !important; /* Tamanho da fonte: 13px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    text-transform: uppercase !important; /* Transforma o texto em maiúsculas (!important) */
    letter-spacing: 1.5px !important; /* Espaçamento entre letras: 1.5px (forçado com !important) */
    padding: 6px 18px !important; /* Espaçamento interno: 6px 18px (forçado com !important) */
    border-radius: 100px !important; /* Arredonda os cantos: 100px (forçado com !important) */
    margin-bottom: 24px !important; /* Margem inferior: 24px (forçado com !important) */
    box-shadow: 0 4px 10px rgba(2, 132, 199, 0.1) !important; /* Sombra da caixa: 0 4px 10px rgba(2, 132, 199, 0.1) (forçado com !important) */
    border: 1px solid rgba(56, 189, 248, 0.4) !important; /* Borda: 1px solid rgba(56, 189, 248, 0.4) (forçado com !important) */
}
.story-text h2 {
    font-size: 38px !important; /* Tamanho da fonte: 38px (forçado com !important) */
    color: #0f172a !important; /* Cor do texto: #0f172a (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    line-height: 1.2 !important; /* Altura da linha do texto: 1.2 (forçado com !important) */
    margin-bottom: 24px !important; /* Margem inferior: 24px (forçado com !important) */
    letter-spacing: -1px !important; /* Espaçamento entre letras: -1px (forçado com !important) */
    text-wrap: balance !important; /* Distribui o texto de forma mais equilibrada entre as linhas (!important) */
}
.story-text p {
    font-size: 18px !important; /* Tamanho da fonte: 18px (forçado com !important) */
    color: #475569 !important; /* Cor do texto: #475569 (forçado com !important) */
    line-height: 1.65 !important; /* Altura da linha do texto: 1.65 (forçado com !important) */
    margin-bottom: 16px !important; /* Margem inferior: 16px (forçado com !important) */
    text-wrap: pretty !important; /* pretty (!important) */
}
.story-features {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    gap: 20px !important; /* Espaço de 20px entre os itens (!important) */
}
.feature-card {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: flex-start !important; /* Alinha os filhos no início do eixo cruzado (!important) */
    gap: 16px !important; /* Espaço de 16px entre os itens (!important) */
    background: #ffffff !important; /* Cor de fundo: #ffffff (forçado com !important) */
    border: 1px solid #e2e8f0 !important; /* Borda: 1px solid #e2e8f0 (forçado com !important) */
    padding: 24px !important; /* Espaçamento interno: 24px (forçado com !important) */
    border-radius: 16px !important; /* Arredonda os cantos: 16px (forçado com !important) */
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05) !important; /* Sombra da caixa: 0 4px 6px -1px rgba(0, 0, 0, 0.05) (forçado com !important) */
}
.icon-circle {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    width: 32px !important; /* Largura: 32px (forçado com !important) */
    height: 32px !important; /* Altura: 32px (forçado com !important) */
    border-radius: 50% !important; /* Arredonda os cantos: 50% (forçado com !important) */
    background: #dcfce7 !important; /* Cor de fundo: #dcfce7 (forçado com !important) */
    color: #16a34a !important; /* Cor do texto: #16a34a (forçado com !important) */
    font-weight: bold !important; /* Deixa o texto em negrito (!important) */
    flex-shrink: 0 !important; /* Fator de encolhimento do item flex: 0 (forçado com !important) */
}
.icon-circle svg {
    width: 18px !important; /* Largura: 18px (forçado com !important) */
    height: 18px !important; /* Altura: 18px (forçado com !important) */
    stroke-width: 3 !important; /* Espessura do traço do SVG: 3 (forçado com !important) */
}
.feature-content h4 {
    font-size: 18px !important; /* Tamanho da fonte: 18px (forçado com !important) */
    color: #0f172a !important; /* Cor do texto: #0f172a (forçado com !important) */
    margin: 0 0 6px 0 !important; /* Margem: 0 0 6px 0 (forçado com !important) */
    font-weight: 700 !important; /* Deixa o texto em negrito (!important) */
}
.feature-content p {
    font-size: 15px !important; /* Tamanho da fonte: 15px (forçado com !important) */
    color: #64748b !important; /* Cor do texto: #64748b (forçado com !important) */
    margin: 0 !important; /* Remove margem (!important) */
    line-height: 1.5 !important; /* Altura da linha do texto: 1.5 (forçado com !important) */
}
.highlight-card {
    background: #ffffff !important; /* Cor de fundo: #ffffff (forçado com !important) */
    border: 1px solid #e2e8f0 !important; /* Borda: 1px solid #e2e8f0 (forçado com !important) */
    padding: 40px !important; /* Espaçamento interno: 40px (forçado com !important) */
    border-radius: 20px !important; /* Arredonda os cantos: 20px (forçado com !important) */
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08) !important; /* Sombra da caixa: 0 10px 30px -5px rgba(0, 0, 0, 0.08) (forçado com !important) */
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
}
.icon-bolt {
    background: #e0f2fe !important; /* Cor de fundo: #e0f2fe (forçado com !important) */
    width: 48px !important; /* Largura: 48px (forçado com !important) */
    height: 48px !important; /* Altura: 48px (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    border-radius: 12px !important; /* Arredonda os cantos: 12px (forçado com !important) */
    margin-bottom: 24px !important; /* Margem inferior: 24px (forçado com !important) */
}
.icon-bolt svg {
    width: 24px !important; /* Largura: 24px (forçado com !important) */
    height: 24px !important; /* Altura: 24px (forçado com !important) */
    color: #0284c7 !important; /* Cor do texto: #0284c7 (forçado com !important) */
    stroke-width: 2 !important; /* Espessura do traço do SVG: 2 (forçado com !important) */
}
.highlight-card .quote {
    font-size: 22px !important; /* Tamanho da fonte: 22px (forçado com !important) */
    color: #0f172a !important; /* Cor do texto: #0f172a (forçado com !important) */
    font-weight: 600 !important; /* Peso semi-negrito (!important) */
    font-style: italic !important; /* Estilo da fonte: italic (forçado com !important) */
    line-height: 1.5 !important; /* Altura da linha do texto: 1.5 (forçado com !important) */
    margin-bottom: 24px !important; /* Margem inferior: 24px (forçado com !important) */
}
.quote-author {
    border-top: 1px solid #f1f5f9 !important; /* Borda superior: 1px solid #f1f5f9 (forçado com !important) */
    padding-top: 20px !important; /* Espaçamento interno superior: 20px (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
}
.quote-author strong {
    color: #00a0e3 !important; /* Cor do texto: #00a0e3 (forçado com !important) */
    font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
}
.quote-author span {
    color: #94a3b8 !important; /* Cor do texto: #94a3b8 (forçado com !important) */
    font-size: 14px !important; /* Tamanho da fonte: 14px (forçado com !important) */
}
.tech-divider-section {
    background: radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%), 
                radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%), 
                radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%), 
                #060913 !important; /* Fundo em gradiente: radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%), 
                radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%), 
                radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%), 
                #060913 (forçado com !important) */
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    padding: 60px 0 40px 0 !important; /* Espaçamento interno: 60px 0 80px 0 (forçado com !important) */
    overflow: hidden !important; /* Esconde o que ultrapassar os limites do elemento (!important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
}
.badge-dark-wrapper {
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    max-width: 1100px !important; /* Largura máxima: 1100px (forçado com !important) */
    margin: 0 auto 30px auto !important; /* Margem: 0 auto 30px auto (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    justify-content: flex-start !important; /* Alinha os filhos no início do eixo principal (!important) */
    padding: 0 20px !important; /* Espaçamento interno: 0 20px (forçado com !important) */
    box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    z-index: 2 !important; /* Camada de sobreposição (quanto maior, mais na frente): 2 (forçado com !important) */
}
.badge-dark-outline {
    display: inline-flex !important; /* Ativa flexbox mantendo o elemento inline (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    gap: 10px !important; /* Espaço de 10px entre os itens (!important) */
    background-color: rgba(56, 189, 248, 0.1) !important; /* Cor de fundo: rgba(56, 189, 248, 0.1) (forçado com !important) */
    color: #38bdf8 !important; /* Cor do texto: #38bdf8 (forçado com !important) */
    font-size: 13px !important; /* Tamanho da fonte: 13px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    text-transform: uppercase !important; /* Transforma o texto em maiúsculas (!important) */
    letter-spacing: 1.5px !important; /* Espaçamento entre letras: 1.5px (forçado com !important) */
    padding: 8px 18px !important; /* Espaçamento interno: 8px 18px (forçado com !important) */
    border-radius: 100px !important; /* Arredonda os cantos: 100px (forçado com !important) */
    border: 1px solid rgba(56, 189, 248, 0.3) !important; /* Borda: 1px solid rgba(56, 189, 248, 0.3) (forçado com !important) */
}
.pulse-dot {
    width: 8px !important; /* Largura: 8px (forçado com !important) */
    height: 8px !important; /* Altura: 8px (forçado com !important) */
    background-color: #10b981 !important; /* Cor de fundo: #10b981 (forçado com !important) */
    border-radius: 50% !important; /* Arredonda os cantos: 50% (forçado com !important) */
    box-shadow: 0 0 10px #10b981 !important; /* Sombra da caixa: 0 0 10px #10b981 (forçado com !important) */
    animation: pulseGlow 1.5s infinite !important; /* Aplica a animação: pulseGlow 1.5s infinite (forçado com !important) */
}
/* Define os quadros da animação "pulseGlow" */
@keyframes pulseGlow {
    0% {
        transform: scale(0.95); /* Transformação (rotação, escala ou deslocamento): scale(0.95) */
        box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7); /* Sombra da caixa: 0 0 0 0 rgba(16, 185, 129, 0.7) */
    }
    70% {
        transform: scale(1); /* Transformação (rotação, escala ou deslocamento): scale(1) */
        box-shadow: 0 0 0 10px rgba(16, 185, 129, 0); /* Sombra da caixa: 0 0 0 10px rgba(16, 185, 129, 0) */
    }
    100% {
        transform: scale(0.95); /* Transformação (rotação, escala ou deslocamento): scale(0.95) */
        box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); /* Sombra da caixa: 0 0 0 0 rgba(16, 185, 129, 0) */
    }
}
.glow-line-top, .glow-line-bottom {
    position: absolute !important; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative (!important) */
    left: 0 !important; /* Distância a partir do(a) esquerda: 0 (forçado com !important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    height: 1px !important; /* Altura: 1px (forçado com !important) */
    background: linear-gradient(90deg, transparent, rgba(0, 160, 227, 0.8), transparent) !important; /* Fundo em gradiente: linear-gradient(90deg, transparent, rgba(0, 160, 227, 0.8), transparent) (forçado com !important) */
    box-shadow: 0 0 15px rgba(0, 160, 227, 0.5) !important; /* Sombra da caixa: 0 0 15px rgba(0, 160, 227, 0.5) (forçado com !important) */
}
.glow-line-top {
    top: 0 !important; /* Distância a partir do(a) topo: 0 (forçado com !important) */
}
.glow-line-bottom {
    bottom: 0 !important; /* Distância a partir do(a) base: 0 (forçado com !important) */
}
.tech-divider-content {
    text-align: center !important; /* Centraliza o texto (!important) */
    margin-bottom: 50px !important; /* Margem inferior: 50px (forçado com !important) */
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    z-index: 2 !important; /* Camada de sobreposição (quanto maior, mais na frente): 2 (forçado com !important) */
}
.tech-divider-content h3 {
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
    font-size: 36px !important; /* Tamanho da fonte: 36px (forçado com !important) */
    font-weight: 400 !important; /* Peso normal da fonte (!important) */
    max-width: 800px !important; /* Largura máxima: 800px (forçado com !important) */
    margin: 0 auto !important; /* Zera margem vertical e centraliza na horizontal (!important) */
    line-height: 1.3 !important; /* Altura da linha do texto: 1.3 (forçado com !important) */
    text-wrap: balance !important; /* Distribui o texto de forma mais equilibrada entre as linhas (!important) */
}
.tech-divider-content h3 strong {
    color: #00a0e3 !important; /* Cor do texto: #00a0e3 (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
}
.data-marquee-container {
    width: 100vw !important; /* Largura de 100vw em relação à viewport (!important) */
    overflow: hidden !important; /* Esconde o que ultrapassar os limites do elemento (!important) */
    background: rgba(255, 255, 255, 0.03) !important; /* Cor de fundo: rgba(255, 255, 255, 0.03) (forçado com !important) */
    border-top: 1px solid rgba(255, 255, 255, 0.05) !important; /* Borda superior: 1px solid rgba(255, 255, 255, 0.05) (forçado com !important) */
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important; /* Borda inferior: 1px solid rgba(255, 255, 255, 0.05) (forçado com !important) */
    padding: 20px 0 !important; /* Espaçamento interno: 20px 0 (forçado com !important) */
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent) !important; /* mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent) (forçado com !important) */
    -webkit-mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent) !important; /* -webkit-mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent) (forçado com !important) */
}
.data-marquee {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    width: max-content !important; /* Largura: max-content (forçado com !important) */
    animation: scrollMarquee 30s linear infinite !important; /* Aplica a animação: scrollMarquee 30s linear infinite (forçado com !important) */
}
.data-marquee span {
    color: #94a3b8 !important; /* Cor do texto: #94a3b8 (forçado com !important) */
    font-size: 18px !important; /* Tamanho da fonte: 18px (forçado com !important) */
    font-weight: 600 !important; /* Peso semi-negrito (!important) */
    white-space: nowrap !important; /* Impede quebra de linha do texto (!important) */
    display: inline-flex !important; /* Ativa flexbox mantendo o elemento inline (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
}
.data-marquee span.dot {
    color: #00a0e3 !important; /* Cor do texto: #00a0e3 (forçado com !important) */
    margin: 0 40px !important; /* Margem: 0 40px (forçado com !important) */
    font-size: 24px !important; /* Tamanho da fonte: 24px (forçado com !important) */
}
.marquee-icon {
    width: 20px !important; /* Largura: 20px (forçado com !important) */
    height: 20px !important; /* Altura: 20px (forçado com !important) */
    margin-right: 8px !important; /* Margem direita: 8px (forçado com !important) */
    color: #00a0e3 !important; /* Cor do texto: #00a0e3 (forçado com !important) */
}
/* Define os quadros da animação "scrollMarquee" */
@keyframes scrollMarquee {
    0% {
        transform: translateX(0); /* Transformação (rotação, escala ou deslocamento): translateX(0) */
    }
    100% {
        transform: translateX(-50%); /* Transformação (rotação, escala ou deslocamento): translateX(-50%) */
    }
}
.tech-divider-actions {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    gap: 16px !important; /* Espaço de 16px entre os itens (!important) */
    margin-top: 32px !important; /* Margem superior: 32px (forçado com !important) */
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    z-index: 3 !important; /* Camada de sobreposição (quanto maior, mais na frente): 3 (forçado com !important) */
}
.integration-section {
    margin-top: -20px;
    padding: 40px 20px 80px 20px !important; /* Espaçamento interno: 20px 20px 80px 20px (forçado com !important) */
    scroll-margin-top: 100px !important; /* scroll-margin-top: 100px (forçado com !important) */
    background: #f8fafc !important; /* Cor de fundo: #f8fafc (forçado com !important) */
}
.integration-header .badge-max {
    align-self: flex-start !important; /* Sobrescreve o alinhamento deste item no eixo cruzado: flex-start (forçado com !important) */
    transform: translateX(-125px) translateY(-10px) !important; /* Transformação (rotação, escala ou deslocamento): translateX(-125px) translateY(-10px) (forçado com !important) */
    margin-bottom: 24px !important; /* Margem inferior: 24px (forçado com !important) */
}
.integration-header {
    text-align: center !important; /* Centraliza o texto (!important) */
    max-width: 850px !important; /* Largura máxima: 850px (forçado com !important) */
    margin: 0 auto 48px auto !important; /* Margem: 0 auto 48px auto (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
}
.integration-header h2 {
    font-size: 46px !important; /* Tamanho da fonte: 46px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    margin-bottom: 20px !important; /* Margem inferior: 20px (forçado com !important) */
    text-wrap: balance !important; /* Distribui o texto de forma mais equilibrada entre as linhas (!important) */
    letter-spacing: -1.5px !important; /* Espaçamento entre letras: -1.5px (forçado com !important) */
    line-height: 1.15 !important; /* Altura da linha do texto: 1.15 (forçado com !important) */
    background: linear-gradient(135deg, #0f172a 30%, #00a0e3 100%) !important; /* Fundo em gradiente: linear-gradient(135deg, #0f172a 30%, #00a0e3 100%) (forçado com !important) */
    -webkit-background-clip: text !important; /* Recorta o fundo no formato do texto (efeito de gradiente no texto) (!important) */
    -webkit-text-fill-color: transparent !important; /* Cor de preenchimento do texto (usado com gradiente): transparent (forçado com !important) */
    background-clip: text !important; /* background-clip: text (forçado com !important) */
    color: transparent !important; /* Cor do texto: transparent (forçado com !important) */
}
.integration-header p {
    font-size: 20px !important; /* Tamanho da fonte: 20px (forçado com !important) */
    color: #475569 !important; /* Cor do texto: #475569 (forçado com !important) */
    line-height: 1.65 !important; /* Altura da linha do texto: 1.65 (forçado com !important) */
    text-wrap: pretty !important; /* pretty (!important) */
    max-width: 700px !important; /* Largura máxima: 700px (forçado com !important) */
    margin: 0 !important; /* Remove margem (!important) */
}
.integration-header p strong {
    color: #0284c7 !important; /* Cor do texto: #0284c7 (forçado com !important) */
    font-weight: 700 !important; /* Deixa o texto em negrito (!important) */
}
.filter-nav-pills {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-wrap: wrap !important; /* Permite os itens quebrarem para a linha de baixo (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    gap: 12px !important; /* Espaço de 12px entre os itens (!important) */
    margin: 0 auto 48px auto !important; /* Margem: 0 auto 48px auto (forçado com !important) */
    max-width: 900px !important; /* Largura máxima: 900px (forçado com !important) */
}
.filter-nav-pills .pill {
    background: #ffffff !important; /* Cor de fundo: #ffffff (forçado com !important) */
    border: 1px solid #cbd5e1 !important; /* Borda: 1px solid #cbd5e1 (forçado com !important) */
    color: #475569 !important; /* Cor do texto: #475569 (forçado com !important) */
    padding: 10px 24px !important; /* Espaçamento interno: 10px 24px (forçado com !important) */
    border-radius: 50px !important; /* Arredonda os cantos: 50px (forçado com !important) */
    font-size: 15px !important; /* Tamanho da fonte: 15px (forçado com !important) */
    font-weight: 600 !important; /* Peso semi-negrito (!important) */
    cursor: pointer !important; /* Muda o cursor para indicar que é clicável (!important) */
    transition: all 0.3s ease !important; /* Anima a mudança de propriedade ao longo do tempo: all 0.3s ease (forçado com !important) */
    outline: none !important; /* Remove o contorno de foco (!important) */
}
.filter-nav-pills .pill:hover {
    border-color: #00a0e3 !important; /* Cor da borda: #00a0e3 (forçado com !important) */
    color: #00a0e3 !important; /* Cor do texto: #00a0e3 (forçado com !important) */
    transform: translateY(-2px) !important; /* Transformação (rotação, escala ou deslocamento): translateY(-2px) (forçado com !important) */
}
.filter-nav-pills .pill.active {
    background: #00a0e3 !important; /* Cor de fundo: #00a0e3 (forçado com !important) */
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
    border-color: #00a0e3 !important; /* Cor da borda: #00a0e3 (forçado com !important) */
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3) !important; /* Sombra da caixa: 0 4px 15px rgba(0, 160, 227, 0.3) (forçado com !important) */
}
.modern-logos-grid {
    display: grid !important; /* Ativa grid nos filhos diretos (!important) */
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important; /* Cria colunas automáticas que se ajustam à largura disponível: repeat(auto-fit, minmax(220px, 1fr)) (forçado com !important) */
    gap: 24px !important; /* Espaço de 24px entre os itens (!important) */
    max-width: 1000px !important; /* Largura máxima: 1000px (forçado com !important) */
    margin: 0 auto !important; /* Zera margem vertical e centraliza na horizontal (!important) */
}
.logo-box {
    background: #ffffff !important; /* Cor de fundo: #ffffff (forçado com !important) */
    border: 1px solid #e2e8f0 !important; /* Borda: 1px solid #e2e8f0 (forçado com !important) */
    border-radius: 16px !important; /* Arredonda os cantos: 16px (forçado com !important) */
    height: 120px !important; /* Altura: 120px (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    font-weight: 700 !important; /* Deixa o texto em negrito (!important) */
    font-size: 20px !important; /* Tamanho da fonte: 20px (forçado com !important) */
    color: #64748b !important; /* Cor do texto: #64748b (forçado com !important) */
    box-shadow: 0 4px 6px -1px rgba(0,0,0,0.02) !important; /* Sombra da caixa: 0 4px 6px -1px rgba(0,0,0,0.02) (forçado com !important) */
    padding: 20px !important; /* Espaçamento interno: 20px (forçado com !important) */
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important; /* Anima a mudança de propriedade ao longo do tempo: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) (forçado com !important) */
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    overflow: hidden !important; /* Esconde o que ultrapassar os limites do elemento (!important) */
}
.logo-box::before {
    content: '' !important; /* Conteúdo inserido via CSS: '' (forçado com !important) */
    position: absolute !important; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative (!important) */
    top: 0 !important; /* Distância a partir do(a) topo: 0 (forçado com !important) */
    left: 0 !important; /* Distância a partir do(a) esquerda: 0 (forçado com !important) */
    right: 0 !important; /* Distância a partir do(a) direita: 0 (forçado com !important) */
    height: 4px !important; /* Altura: 4px (forçado com !important) */
    background: #00a0e3 !important; /* Cor de fundo: #00a0e3 (forçado com !important) */
    transform: scaleX(0) !important; /* Transformação (rotação, escala ou deslocamento): scaleX(0) (forçado com !important) */
    transition: transform 0.3s ease !important; /* Anima a mudança de propriedade ao longo do tempo: transform 0.3s ease (forçado com !important) */
}
.logo-box:hover::before {
    transform: scaleX(1) !important; /* Transformação (rotação, escala ou deslocamento): scaleX(1) (forçado com !important) */
}
.logo-box:hover {
    transform: translateY(-5px) !important; /* Transformação (rotação, escala ou deslocamento): translateY(-5px) (forçado com !important) */
    box-shadow: 0 20px 25px -5px rgba(0,160,227,0.1), 0 10px 10px -5px rgba(0,160,227,0.04) !important; /* Sombra da caixa: 0 20px 25px -5px rgba(0,160,227,0.1), 0 10px 10px -5px rgba(0,160,227,0.04) (forçado com !important) */
    border-color: #bae6fd !important; /* Cor da borda: #bae6fd (forçado com !important) */
    color: #0f172a !important; /* Cor do texto: #0f172a (forçado com !important) */
}
.logo-box img {
    max-width: 85% !important; /* Largura máxima: 85% (forçado com !important) */
    max-height: 50px !important; /* Altura máxima: 50px (forçado com !important) */
    object-fit: contain !important; /* Encaixa a imagem inteira no espaço (!important) */
    transition: transform 0.3s ease !important; /* Anima a mudança de propriedade ao longo do tempo: transform 0.3s ease (forçado com !important) */
}
.logo-box:hover img {
    transform: scale(1.05) !important; /* Transformação (rotação, escala ou deslocamento): scale(1.05) (forçado com !important) */
}
.btn-galactix-primary {
    display: inline-flex !important; /* Ativa flexbox mantendo o elemento inline (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    background-color: #00a0e3 !important; /* Cor de fundo: #00a0e3 (forçado com !important) */
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
    font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
    font-weight: 700 !important; /* Deixa o texto em negrito (!important) */
    padding: 16px 32px !important; /* Espaçamento interno: 16px 32px (forçado com !important) */
    border-radius: 100px !important; /* Arredonda os cantos: 100px (forçado com !important) */
    text-decoration: none !important; /* Remove sublinhado/decoração do texto (!important) */
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important; /* Anima a mudança de propriedade ao longo do tempo: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) (forçado com !important) */
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3) !important; /* Sombra da caixa: 0 4px 15px rgba(0, 160, 227, 0.3) (forçado com !important) */
    border: 1px solid #00a0e3 !important; /* Borda: 1px solid #00a0e3 (forçado com !important) */
    gap: 8px !important; /* Espaço de 8px entre os itens (!important) */
}
.btn-galactix-primary:hover {
    background-color: #0284c7 !important; /* Cor de fundo: #0284c7 (forçado com !important) */
    transform: translateY(-3px) !important; /* Transformação (rotação, escala ou deslocamento): translateY(-3px) (forçado com !important) */
    box-shadow: 0 12px 24px rgba(0, 160, 227, 0.5) !important; /* Sombra da caixa: 0 12px 24px rgba(0, 160, 227, 0.5) (forçado com !important) */
}
.btn-galactix-outline {
    display: inline-flex !important; /* Ativa flexbox mantendo o elemento inline (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    background-color: transparent !important; /* Remove a cor de fundo (!important) */
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
    font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
    font-weight: 600 !important; /* Peso semi-negrito (!important) */
    padding: 16px 32px !important; /* Espaçamento interno: 16px 32px (forçado com !important) */
    border-radius: 100px !important; /* Arredonda os cantos: 100px (forçado com !important) */
    text-decoration: none !important; /* Remove sublinhado/decoração do texto (!important) */
    transition: all 0.3s ease !important; /* Anima a mudança de propriedade ao longo do tempo: all 0.3s ease (forçado com !important) */
    border: 1px solid rgba(255, 255, 255, 0.2) !important; /* Borda: 1px solid rgba(255, 255, 255, 0.2) (forçado com !important) */
}
.btn-galactix-outline:hover {
    background-color: rgba(255, 255, 255, 0.05) !important; /* Cor de fundo: rgba(255, 255, 255, 0.05) (forçado com !important) */
    border-color: #ffffff !important; /* Cor da borda: #ffffff (forçado com !important) */
    transform: translateY(-3px) !important; /* Transformação (rotação, escala ou deslocamento): translateY(-3px) (forçado com !important) */
}
.final-cta-section {
    background-color: #060913 !important; /* Cor de fundo: #060913 (forçado com !important) */
    padding: 120px 20px !important; /* Espaçamento interno: 120px 20px (forçado com !important) */
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    overflow: hidden !important; /* Esconde o que ultrapassar os limites do elemento (!important) */
    text-align: center !important; /* Centraliza o texto (!important) */
    border-top: 1px solid rgba(255, 255, 255, 0.05) !important; /* Borda superior: 1px solid rgba(255, 255, 255, 0.05) (forçado com !important) */
}
.cta-glow-bg {
    position: absolute !important; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative (!important) */
    top: 50% !important; /* Distância a partir do(a) topo: 50% (forçado com !important) */
    left: 50% !important; /* Distância a partir do(a) esquerda: 50% (forçado com !important) */
    transform: translate(-50%, -50%) !important; /* Transformação (rotação, escala ou deslocamento): translate(-50%, -50%) (forçado com !important) */
    width: 800px !important; /* Largura: 800px (forçado com !important) */
    height: 600px !important; /* Altura: 600px (forçado com !important) */
    background: radial-gradient(circle, rgba(0,160,227,0.15) 0%, rgba(6,9,19,0) 70%) !important; /* Fundo em gradiente: radial-gradient(circle, rgba(0,160,227,0.15) 0%, rgba(6,9,19,0) 70%) (forçado com !important) */
    z-index: 1 !important; /* Camada de sobreposição (quanto maior, mais na frente): 1 (forçado com !important) */
    border-radius: 50% !important; /* Arredonda os cantos: 50% (forçado com !important) */
    pointer-events: none !important; /* Impede clique e interação com o elemento (!important) */
}
.final-cta-content {
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    z-index: 2 !important; /* Camada de sobreposição (quanto maior, mais na frente): 2 (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    max-width: 800px !important; /* Largura máxima: 800px (forçado com !important) */
    margin: 0 auto !important; /* Zera margem vertical e centraliza na horizontal (!important) */
}
.final-cta-content .badge-dark-outline {
    position: absolute !important; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative (!important) */
    top: -40px !important; /* Distância a partir do(a) topo: -40px (forçado com !important) */
    left: -150px !important; /* Distância a partir do(a) esquerda: -150px (forçado com !important) */
    margin-bottom: 0 !important; /* Margem inferior: 0 (forçado com !important) */
    white-space: nowrap !important; /* Impede quebra de linha do texto (!important) */
}
.final-cta-content h2 {
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
    font-size: 48px !important; /* Tamanho da fonte: 48px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    margin: 0 0 20px 0 !important; /* Margem: 0 0 20px 0 (forçado com !important) */
    line-height: 1.15 !important; /* Altura da linha do texto: 1.15 (forçado com !important) */
    letter-spacing: -1.5px !important; /* Espaçamento entre letras: -1.5px (forçado com !important) */
    text-wrap: balance !important; /* Distribui o texto de forma mais equilibrada entre as linhas (!important) */
}
.final-cta-content p {
    color: #94a3b8 !important; /* Cor do texto: #94a3b8 (forçado com !important) */
    font-size: 20px !important; /* Tamanho da fonte: 20px (forçado com !important) */
    font-weight: 400 !important; /* Peso normal da fonte (!important) */
    line-height: 1.6 !important; /* Altura da linha do texto: 1.6 (forçado com !important) */
    margin: 0 0 48px 0 !important; /* Margem: 0 0 48px 0 (forçado com !important) */
    text-wrap: pretty !important; /* pretty (!important) */
}
.pulse-hover svg {
    width: 20px !important; /* Largura: 20px (forçado com !important) */
    height: 20px !important; /* Altura: 20px (forçado com !important) */
    transition: transform 0.3s ease !important; /* Anima a mudança de propriedade ao longo do tempo: transform 0.3s ease (forçado com !important) */
}
.pulse-hover:hover svg {
    transform: translateX(6px) !important; /* Transformação (rotação, escala ou deslocamento): translateX(6px) (forçado com !important) */
}
.logo-box.hide-logo {
    display: none !important; /* Esconde o elemento e tira do fluxo (!important) */
}
.channel-news {
    clear: left; /* Impede que o elemento fique ao lado de elementos flutuantes: left */
    padding: 80px 0 20px; /* Espaçamento interno: 80px 0 20px */
}
.news {
    background-position: -16px -248px; /* Posição da imagem de fundo: -16px -248px */
    width: 210px; /* Largura: 210px */
    height: 130px; /* Altura: 130px */
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
    display: block; /* Muda para block, ocupa a linha toda */
    margin: 0 auto; /* Zera margem vertical e centraliza na horizontal */
}
.via {
    background-position: -232px -244px; /* Posição da imagem de fundo: -232px -244px */
    height: 77px; /* Altura: 77px */
    width: 100px; /* Largura: 100px */
    display: block; /* Muda para block, ocupa a linha toda */
    margin: 0 auto; /* Zera margem vertical e centraliza na horizontal */
    position: inherit; /* inherit */
}
.meli {
    background-position: -335px -244px; /* Posição da imagem de fundo: -335px -244px */
    height: 77px; /* Altura: 77px */
    width: 100px; /* Largura: 100px */
    display: block; /* Muda para block, ocupa a linha toda */
    margin: 0 auto; /* Zera margem vertical e centraliza na horizontal */
    position: inherit; /* inherit */
}
.americana {
    background-position: -235px -363px; /* Posição da imagem de fundo: -235px -363px */
    height: 40px; /* Altura: 40px */
    width: 118px; /* Largura: 118px */
    display: block; /* Muda para block, ocupa a linha toda */
    margin: 0 auto; /* Zera margem vertical e centraliza na horizontal */
    position: inherit; /* inherit */
    margin-top: 23px; /* Margem superior: 23px */
}
.amazon {
    background-position: -353px -321px; /* Posição da imagem de fundo: -353px -321px */
    height: 78px; /* Altura: 78px */
    width: 84px; /* Largura: 84px */
    display: block; /* Muda para block, ocupa a linha toda */
    margin: 0 auto; /* Zera margem vertical e centraliza na horizontal */
    position: inherit; /* inherit */
}
.magalu {
    background-position: -229px -334px; /* Posição da imagem de fundo: -229px -334px */
    height: 31px; /* Altura: 31px */
    width: 118px; /* Largura: 118px */
    display: block; /* Muda para block, ocupa a linha toda */
    margin: 23px auto 0; /* Margem: 23px auto 0 */
    position: inherit; /* inherit */
}
.olist {
    background-position: -228px -398px; /* Posição da imagem de fundo: -228px -398px */
    height: 49px; /* Altura: 49px */
    width: 118px; /* Largura: 118px */
    display: block; /* Muda para block, ocupa a linha toda */
    margin: 0 auto; /* Zera margem vertical e centraliza na horizontal */
    position: inherit; /* inherit */
}
.shopee {
    background-position: -343px -398px; /* Posição da imagem de fundo: -343px -398px */
    height: 71px; /* Altura: 71px */
    width: 84px; /* Largura: 84px */
    display: block; /* Muda para block, ocupa a linha toda */
    margin: 0 auto; /* Zera margem vertical e centraliza na horizontal */
    position: inherit; /* inherit */
}
.riachuelo {
    background-position: -225px -441px; /* Posição da imagem de fundo: -225px -441px */
    height: 38px; /* Altura: 38px */
    width: 118px; /* Largura: 118px */
    display: block; /* Muda para block, ocupa a linha toda */
    margin: 13px auto 0; /* Margem: 13px auto 0 */
    position: inherit; /* inherit */
}
.fastshop {
    background-position: -225px -474px; /* Posição da imagem de fundo: -225px -474px */
    height: 54px; /* Altura: 54px */
    width: 118px; /* Largura: 118px */
    display: block; /* Muda para block, ocupa a linha toda */
    margin: 0 auto; /* Zera margem vertical e centraliza na horizontal */
    position: inherit; /* inherit */
}
.carrefour {
    background-position: -343px -479px; /* Posição da imagem de fundo: -343px -479px */
    height: 71px; /* Altura: 71px */
    width: 84px; /* Largura: 84px */
    display: block; /* Muda para block, ocupa a linha toda */
    margin: 0 auto; /* Zera margem vertical e centraliza na horizontal */
    position: inherit; /* inherit */
}
.btn-dark {
    background: #2acee6; /* Cor de fundo: #2acee6 */
    color: #FFF; /* Cor do texto: #FFF */
    padding: 10px 40px; /* Espaçamento interno: 10px 40px */
}
.btn-dark:hover {
    background: #2acee6; /* Cor de fundo: #2acee6 */
    color: #FFF; /* Cor do texto: #FFF */
    padding: 10px 40px; /* Espaçamento interno: 10px 40px */
}
.channel-home {
    margin-top: 90px; /* Margem superior: 90px */
}
.channel-home-x {
    margin-top: 30px; /* Margem superior: 30px */
}
.channel-home h2.title-glx {
    padding-top: 0; /* Espaçamento interno superior: 0 */
    padding-bottom: 0; /* Espaçamento interno inferior: 0 */
}
.channel-home h3.sub-title-glx {
    margin-bottom: 20px; /* Margem inferior: 20px */
}
.channel-home h3 {
    margin-bottom: 90px; /* Margem inferior: 90px */
    font-size: 12pt; /* Tamanho da fonte: 12pt */
}
.channel-home-sub {
    width: 980px; /* Largura: 980px */
    margin: 0 auto; /* Zera margem vertical e centraliza na horizontal */
}
.channel-home-sub p {
    color: #FFF; /* Cor do texto: #FFF */
    font-size: 16pt; /* Tamanho da fonte: 16pt */
}
.channels {
    float: left; /* Flutua o elemento para a esquerda */
    width: 190px; /* Largura: 190px */
    height: 150px; /* Altura: 150px */
    text-align: center; /* Centraliza o texto */
}
.channels p {
    display: none; /* Esconde o elemento e tira do fluxo */
}
.box-float span:nth-child(1) {
    font-size: 40pt; /* Tamanho da fonte: 40pt */
}
.box-float span:nth-child(2) {
    font-size: 60pt; /* Tamanho da fonte: 60pt */
}
.box-float span:nth-child(3) {
    font-size: 12pt; /* Tamanho da fonte: 12pt */
    display: block; /* Muda para block, ocupa a linha toda */
    clear: left; /* Impede que o elemento fique ao lado de elementos flutuantes: left */
}
.planos-box {
    border: 1px solid #CCC; /* Borda: 1px solid #CCC */
    border-radius: 10px; /* Arredonda os cantos: 10px */
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
    width: 100%; /* Ocupa 100% da largura do pai */
    height: 250px; /* Altura: 250px */
    text-align: center; /* Centraliza o texto */
    padding: 10px; /* Espaçamento interno: 10px */
    margin: 40px 0; /* Margem: 40px 0 */
}
.planos-box h7 {
    font-size: 12pt; /* Tamanho da fonte: 12pt */
    color: #2acee6; /* Cor do texto: #2acee6 */
    font-weight: 600; /* Peso semi-negrito */
}
.planos-box h5 {
    font-size: 10pt; /* Tamanho da fonte: 10pt */
}
.planos-box span {
    font-size: 8pt; /* Tamanho da fonte: 8pt */
    color: #333; /* Cor do texto: #333 */
}
footer {
    background: #000000; /* Cor de fundo: #000000 */
    width: 100%; /* Ocupa 100% da largura do pai */
    float: left; /* Flutua o elemento para a esquerda */
    padding: 0; /* Espaçamento interno: 50px 0 */
}
footer ul li:nth-child(1) {
    font-weight: 600; /* Peso semi-negrito */
    font-size: 12pt; /* Tamanho da fonte: 12pt */
}
footer ul li {
    list-style: none; /* Remove marcadores da lista */
    color: #FFF; /* Cor do texto: #FFF */
    padding: 5px 0; /* Espaçamento interno: 5px 0 */
    font-size: 10pt; /* Tamanho da fonte: 10pt */
}
footer ul li a {
    color: #FFF; /* Cor do texto: #FFF */
    text-decoration: none; /* Remove sublinhado/decoração do texto */
}
footer ul li a:hover {
    color: #FFF; /* Cor do texto: #FFF */
}
.background-whiter form {
    width: 70%; /* Largura: 70% */
    margin: 20px auto; /* Margem: 20px auto */
    text-align: center; /* Centraliza o texto */
}
.sem-margin {
    padding: 0; /* Remove espaçamento interno */
    margin: 0; /* Remove margem */
    color: #2acee6; /* Cor do texto: #2acee6 */
}
#loading {
    width: 100%; /* Ocupa 100% da largura do pai */
    height: 100%; /* Ocupa 100% da altura do pai */
    background: #333; /* Cor de fundo: #333 */
    position: fixed; /* Tira do fluxo normal e fixa na tela mesmo com scroll */
    left: 0; /* Distância a partir do(a) esquerda: 0 */
    top: 0; /* Distância a partir do(a) topo: 0 */
    display: none; /* Esconde o elemento e tira do fluxo */
}
#loading p {
    color: #FFF; /* Cor do texto: #FFF */
    text-align: center; /* Centraliza o texto */
    font-size: 12pt; /* Tamanho da fonte: 12pt */
    margin: 20% auto; /* Margem: 20% auto */
}
.form {
    background: #FFF; /* Cor de fundo: #FFF */
    padding: 15px 10px; /* Espaçamento interno: 15px 10px */
    border: 1px solid #CCC; /* Borda: 1px solid #CCC */
    margin-top: 22px; /* Margem superior: 22px */
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
}
.form h3 {
    margin: 0; /* Remove margem */
    padding: 0; /* Remove espaçamento interno */
    font-size: 14pt; /* Tamanho da fonte: 14pt */
}
.form input, .form textarea, .form select {
    border: none; /* Remove a borda */
    width: 100%; /* Ocupa 100% da largura do pai */
    color: #7d7575; /* Cor do texto: #7d7575 */
    display: block; /* Muda para block, ocupa a linha toda */
    padding: 10px; /* Espaçamento interno: 10px */
    border-bottom: 1px solid #CCC; /* Borda inferior: 1px solid #CCC */
}
.form textarea {
    max-width: 100%; /* Não deixa ultrapassar 100% do pai */
    min-width: 100%; /* Largura mínima: 100% */
    height: 100px; /* Altura: 100px */
    max-height: 100px; /* Altura máxima: 100px */
    min-height: 100px; /* Altura mínima: 100px */
}
.background-gray input, .background-gray textarea, .background-gray select {
    width: 100%; /* Ocupa 100% da largura do pai */
    height: 30px; /* Altura: 30px */
    color: #FFF; /* Cor do texto: #FFF */
    display: block; /* Muda para block, ocupa a linha toda */
    padding: 10px 0 10px 10px; /* Espaçamento interno: 10px 0 10px 10px */
    border: 1px solid #CCC; /* Borda: 1px solid #CCC */
    background: #3d3c3c; /* Cor de fundo: #3d3c3c */
    margin: 15px 0; /* Margem: 15px 0 */
    border-radius: 5px; /* Arredonda os cantos: 5px */
}
.background-gray select {
    height: 50px; /* Altura: 50px */
    width: 102.3%; /* Largura: 102.3% */
}
.btn-send, .btn-send-prom {
    background: #2acee6; /* Cor de fundo: #2acee6 */
    border: 1px solid #2acee6; /* Borda: 1px solid #2acee6 */
    width: 150px; /* Largura: 150px */
    color: #FFF; /* Cor do texto: #FFF */
    padding: 10px; /* Espaçamento interno: 10px */
    margin-top: 20px; /* Margem superior: 20px */
    border-radius: 5px; /* Arredonda os cantos: 5px */
}
.btn-send {
    padding-top: 5px; /* Espaçamento interno superior: 5px */
}
.quadmenu-caret {
    position: absolute; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative */
    right: 7px; /* Distância a partir do(a) direita: 7px */
    font-weight: 600; /* Peso semi-negrito */
    color: #FFF; /* Cor do texto: #FFF */
    font-size: 6pt; /* Tamanho da fonte: 6pt */
    top: 9px; /* Distância a partir do(a) topo: 9px */
}
.background-submenu {
    position: absolute; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative */
    background: #333; /* Cor de fundo: #333 */
    width: 400px; /* Largura: 400px */
    top: 25px; /* Distância a partir do(a) topo: 25px */
    display: none; /* Esconde o elemento e tira do fluxo */
    border-radius: 0; /* Arredonda os cantos: 0 */
    padding-top: 30px; /* Espaçamento interno superior: 30px */
}
.btn-componentes {
    border: 1px solid #2acee6; /* Borda: 1px solid #2acee6 */
    background: transparent; /* Remove a cor de fundo */
    margin: 5px 0; /* Margem: 5px 0 */
    color: #2acee6; /* Cor do texto: #2acee6 */
    cursor: pointer; /* Muda o cursor para indicar que é clicável */
}
.btn-componentes:hover {
    border: 1px solid #2acee6; /* Borda: 1px solid #2acee6 */
    background: transparent; /* Remove a cor de fundo */
    margin: 5px 0; /* Margem: 5px 0 */
    color: #2acee6; /* Cor do texto: #2acee6 */
    cursor: pointer; /* Muda o cursor para indicar que é clicável */
}
.btn-fill {
    background: #2acee6; /* Cor de fundo: #2acee6 */
    color: #FFF; /* Cor do texto: #FFF */
    border: 1px solid #FFF; /* Borda: 1px solid #FFF */
}
.container-btn {
    width: 700px; /* Largura: 700px */
    margin: 20px auto 20px; /* Margem: 20px auto 20px */
}
.background-black {
    background: #201f1f; /* Cor de fundo: #201f1f */
}
.background-black table tr {
    border-bottom: 1px solid #CCC; /* Borda inferior: 1px solid #CCC */
}
.background-black table td:nth-child(1) {
    width: 20%; /* Largura: 20% */
    font-family: "Source Code Pro", Consolas, Menlo, Monaco, Courier; /* Define a fonte usada: "Source Code Pro", Consolas, Menlo, Monaco, Courier */
    padding: 10px; /* Espaçamento interno: 10px */
    text-align: justify; /* Justifica o texto */
}
.background-black table td:nth-child(2) {
    width: 80%; /* Largura: 80% */
    font-family: "Source Code Pro", Consolas, Menlo, Monaco, Courier; /* Define a fonte usada: "Source Code Pro", Consolas, Menlo, Monaco, Courier */
    padding: 10px; /* Espaçamento interno: 10px */
    text-align: justify; /* Justifica o texto */
}
.background-black table.tb-limits td:nth-child(1) {
    width: 30%; /* Largura: 30% */
    font-family: "Source Code Pro", Consolas, Menlo, Monaco, Courier; /* Define a fonte usada: "Source Code Pro", Consolas, Menlo, Monaco, Courier */
    padding: 10px; /* Espaçamento interno: 10px */
    text-align: justify; /* Justifica o texto */
}
.background-black table.tb-limits td:nth-child(2) {
    width: 40%; /* Largura: 40% */
    font-family: "Source Code Pro", Consolas, Menlo, Monaco, Courier; /* Define a fonte usada: "Source Code Pro", Consolas, Menlo, Monaco, Courier */
    padding: 10px; /* Espaçamento interno: 10px */
    text-align: justify; /* Justifica o texto */
}
.background-black table.tb-limits td:nth-child(3) {
    width: 30%; /* Largura: 30% */
    font-family: "Source Code Pro", Consolas, Menlo, Monaco, Courier; /* Define a fonte usada: "Source Code Pro", Consolas, Menlo, Monaco, Courier */
    padding: 10px; /* Espaçamento interno: 10px */
    text-align: justify; /* Justifica o texto */
}
.background-black table.tb-api td:nth-child(1) {
    width: 30%; /* Largura: 30% */
    font-family: "Source Code Pro", Consolas, Menlo, Monaco, Courier; /* Define a fonte usada: "Source Code Pro", Consolas, Menlo, Monaco, Courier */
    padding: 10px; /* Espaçamento interno: 10px */
    text-align: justify; /* Justifica o texto */
}
.background-black table.tb-api td:nth-child(2) {
    width: 50%; /* Largura: 50% */
    font-family: "Source Code Pro", Consolas, Menlo, Monaco, Courier; /* Define a fonte usada: "Source Code Pro", Consolas, Menlo, Monaco, Courier */
    padding: 10px; /* Espaçamento interno: 10px */
    text-align: justify; /* Justifica o texto */
}
.background-black table.tb-api td:nth-child(3) {
    width: 30%; /* Largura: 30% */
    font-family: "Source Code Pro", Consolas, Menlo, Monaco, Courier; /* Define a fonte usada: "Source Code Pro", Consolas, Menlo, Monaco, Courier */
    padding: 10px; /* Espaçamento interno: 10px */
    text-align: justify; /* Justifica o texto */
}
.background-whiter  .search {
    width: 100px; /* Largura: 100px */
    border: 1px solid #CCC; /* Borda: 1px solid #CCC */
    height: 20px; /* Altura: 20px */
    max-height: 20px; /* Altura máxima: 20px */
    min-height: 60px; /* Altura mínima: 60px */
    padding: 25px; /* Espaçamento interno: 25px */
    font-size: 14pt; /* Tamanho da fonte: 14pt */
    margin: 25px 0; /* Margem: 25px 0 */
}
.bg-whiter {
    background: #FFF; /* Cor de fundo: #FFF */
    padding: 15px 30px; /* Espaçamento interno: 15px 30px */
    min-height: 700px; /* Altura mínima: 700px */
    overflow: auto; /* Mostra barra de rolagem só quando necessário */
}
.bg-whiter h4 {
    font-size: 18pt; /* Tamanho da fonte: 18pt */
    color: #2acee6; /* Cor do texto: #2acee6 */
    padding-bottom: 30px; /* Espaçamento interno inferior: 30px */
    border-bottom: 1px solid #CCC; /* Borda inferior: 1px solid #CCC */
    margin-bottom: 30px; /* Margem inferior: 30px */
}
.bg-whiter h5 {
    font-size: 14pt; /* Tamanho da fonte: 14pt */
    color: #333; /* Cor do texto: #333 */
}
.bg-whiter p {
    line-height: 25px; /* Altura da linha do texto: 25px */
    font-size: 12pt; /* Tamanho da fonte: 12pt */
    text-align: justify; /* Justifica o texto */
    color: #333; /* Cor do texto: #333 */
}
.background-contact {
    background-image: linear-gradient(90deg,#2acee6 0%,#ff99bb 100%)!important; /* Imagem de fundo: linear-gradient(90deg,#2acee6 0%,#ff99bb 100%) (forçado com !important) */
    width: 100%; /* Ocupa 100% da largura do pai */
}
p.justify {
    text-align: justify; /* Justifica o texto */
    font-size: 12pt; /* Tamanho da fonte: 12pt */
}
.ul-list ul {
    padding: 10px; /* Espaçamento interno: 10px */
}
.ul-list ul li {
    list-style: none; /* Remove marcadores da lista */
    font-size: 11pt; /* Tamanho da fonte: 11pt */
    color: #FFF; /* Cor do texto: #FFF */
    padding: 10px 0; /* Espaçamento interno: 10px 0 */
    cursor: pointer; /* Muda o cursor para indicar que é clicável */
}
.ul-list ul li:nth-child(1) {
    color: #2acee6; /* Cor do texto: #2acee6 */
    font-weight: 600; /* Peso semi-negrito */
    font-size: 12pt; /* Tamanho da fonte: 12pt */
    padding: 5px 0; /* Espaçamento interno: 5px 0 */
}
.ul-list-selected {
    border: 1px solid #FFF; /* Borda: 1px solid #FFF */
}
.ul-list ul li.ul-list-selected {
    padding: 8px 15px; /* Espaçamento interno: 8px 15px */
}
.bg {
    background: #eee; /* Cor de fundo: #eee */
}
#content-autenticacao, #content-ambiente, #content-code, #content-paginacao, #content-limit, #content-product, #content-orders, #content-transport, #content-freight, #content-stock {
    display: none; /* Esconde o elemento e tira do fluxo */
}
.content-pg {
    color: #E6ECF1; /* Cor do texto: #E6ECF1 */
    margin: 32px 0px; /* Margem: 32px 0px */
    display: block; /* Muda para block, ocupa a linha toda */
    hyphens: none; /* hyphens: none */
    padding: 10px 60px; /* Espaçamento interno: 10px 60px */
    overflow: auto; /* Mostra barra de rolagem só quando necessário */
    tab-size: 2; /* tab-size: 2 */
    direction: ltr; /* direction: ltr */
    font-size: 14px; /* Tamanho da fonte: 14px */
    background: #183055; /* Cor de fundo: #183055 */
    text-align: left; /* Alinha o texto à esquerda */
    word-break: normal; /* Controla quebra de palavras longas: normal */
    -ms-hyphens: none; /* -ms-hyphens: none */
    font-family: "Source Code Pro", Consolas, Menlo, Monaco, Courier; /* Define a fonte usada: "Source Code Pro", Consolas, Menlo, Monaco, Courier */
    line-height: 1.4; /* Altura da linha do texto: 1.4 */
    word-spacing: normal; /* word-spacing: normal */
    -moz-tab-size: 2; /* -moz-tab-size: 2 */
    border-radius: 3px; /* Arredonda os cantos: 3px */
    -webkit-hyphens: none; /* -webkit-hyphens: none */
}
.content-pg span {
    font: inherit; /* font: inherit */
    padding: 0px 0px; /* Espaçamento interno: 0px 0px */
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
    word-wrap: normal; /* word-wrap: normal */
    counter-increment: line; /* counter-increment: line */
    color: #FFF; /* Cor do texto: #FFF */
    display: block; /* Muda para block, ocupa a linha toda */
}
.content-inf {
    background: #eee; /* Cor de fundo: #eee */
    border-left: 4px solid #2acee6; /* Borda esquerda: 4px solid #2acee6 */
    font-family: "Source Code Pro", Consolas, Menlo, Monaco, Courier; /* Define a fonte usada: "Source Code Pro", Consolas, Menlo, Monaco, Courier */
    font-size: 12pt; /* Tamanho da fonte: 12pt */
    padding: 30px; /* Espaçamento interno: 30px */
    margin-bottom: 10px; /* Margem inferior: 10px */
}
.center {
    text-align: justify; /* Justifica o texto */
    line-height: 30px; /* Altura da linha do texto: 30px */
    font-size: 12pt; /* Tamanho da fonte: 12pt */
}
.ceo img {
    border-radius: 100px; /* Arredonda os cantos: 100px */
    margin-top: 40px; /* Margem superior: 40px */
}
.ceo h2 {
    font-size: 24pt; /* Tamanho da fonte: 24pt */
    padding: 0; /* Remove espaçamento interno */
    margin: 0; /* Remove margem */
}
.ceo h3 {
    font-size: 14pt; /* Tamanho da fonte: 14pt */
    padding: 10px 0 50px; /* Espaçamento interno: 10px 0 50px */
    margin: 0; /* Remove margem */
}
.cultura ul {
    margin: 0; /* Remove margem */
    padding: 0 20px; /* Espaçamento interno: 0 20px */
}
.cultura ul li {
    list-style: none; /* Remove marcadores da lista */
    padding: 5px 0; /* Espaçamento interno: 5px 0 */
    margin: 0; /* Remove margem */
}
.socios img {
    border-radius: 100px; /* Arredonda os cantos: 100px */
    margin-top: 40px; /* Margem superior: 40px */
}
.socios p {
    text-align: justify; /* Justifica o texto */
    font-size: 10pt; /* Tamanho da fonte: 10pt */
    line-height: 25px; /* Altura da linha do texto: 25px */
}
.prices {
    width: 100%; /* Ocupa 100% da largura do pai */
    border: 1px solid #CCC; /* Borda: 1px solid #CCC */
    background: #FFF; /* Cor de fundo: #FFF */
}
.prices tr:nth-child(1) {
    width: 100%; /* Ocupa 100% da largura do pai */
    background: #333; /* Cor de fundo: #333 */
    color: #FFF; /* Cor do texto: #FFF */
}
.prices tr td {
    width: 25%; /* Largura: 25% */
}
.prices tr:nth-child(1) td:nth-child(1) {
    background: #FFF; /* Cor de fundo: #FFF */
    color: #666; /* Cor do texto: #666 */
}
.prices tr:nth-child(1n + 1) td {
    padding: 20px 0; /* Espaçamento interno: 20px 0 */
    border-bottom: 1px solid #CCC; /* Borda inferior: 1px solid #CCC */
}
.prices tr:nth-child(1) tr:nth-child(2n+1) {
    background: #FFF; /* Cor de fundo: #FFF */
    color: #666; /* Cor do texto: #666 */
}
.prices tr:nth-child(1) h6 {
    font-size: 16pt; /* Tamanho da fonte: 16pt */
}
.prices tr:nth-child(1) span {
    padding: 0; /* Remove espaçamento interno */
    display: block; /* Muda para block, ocupa a linha toda */
    width: 90%; /* Largura: 90% */
    font-size: 10pt; /* Tamanho da fonte: 10pt */
    text-align: justify; /* Justifica o texto */
    text-align: center; /* Centraliza o texto */
    margin: 0 auto 10px; /* Margem: 0 auto 10px */
}
.prices h6 {
    font-size: 11pt; /* Tamanho da fonte: 11pt */
}
#business {
    left: -34px; /* Distância a partir do(a) esquerda: -34px */
    width: 250px; /* Largura: 250px */
}
#solucoes {
    left: -66px; /* Distância a partir do(a) esquerda: -66px */
    width: 300px; /* Largura: 300px */
}
#recursos {
    left: -150px; /* Distância a partir do(a) esquerda: -150px */
}
.api-form {
    background: #F5F5F5; /* Cor de fundo: #F5F5F5 */
    padding: 15px 10px; /* Espaçamento interno: 15px 10px */
    border: 1px solid #E3E3E3; /* Borda: 1px solid #E3E3E3 */
    margin-bottom: 10px; /* Margem inferior: 10px */
    border-radius: 4px; /* Arredonda os cantos: 4px */
}
.response-ok {
    color: rgb(73,204,144); /* Cor do texto: rgb(73,204,144) */
    background-color: rgba(73,204,144,.3) !important; /* Cor de fundo: rgba(73,204,144,.3) (forçado com !important) */
    border: 1px solid rgb(73,204,144); /* Borda: 1px solid rgb(73,204,144) */
}
.response-fail {
    border: 1px solid rgb(185,74,72); /* Borda: 1px solid rgb(185,74,72) */
    color: rgb(185,74,72); /* Cor do texto: rgb(185,74,72) */
    background-color: rgba(185,74,72,.3) !important; /* Cor de fundo: rgba(185,74,72,.3) (forçado com !important) */
}
pre {
    min-height: 150px !important; /* Altura mínima: 150px (forçado com !important) */
}
#textbody, #body {
    min-height: 350px !important; /* Altura mínima: 350px (forçado com !important) */
    width: 100%; /* Ocupa 100% da largura do pai */
}
.background-banner-page div label h2 {
    font-size: 19pt; /* Tamanho da fonte: 19pt */
}
.margem-auto {
    margin-top: 410px; /* Margem superior: 410px */
}
main.page-sobre {
    padding-top: 20px !important; /* Espaçamento interno superior: 20px (forçado com !important) */
    margin-top: 0 !important; /* Margem superior: 0 (forçado com !important) */
}
.container-sobre.wrapper-hero,
.sobre-bento-manifesto {
    padding-top: 0 !important; /* Espaçamento interno superior: 0 (forçado com !important) */
    margin-top: 0 !important; /* Margem superior: 0 (forçado com !important) */
}
.sobre-arquitetura {
    margin-top: 60px !important; /* Margem superior: 60px (forçado com !important) */
}
.sobre-bento-manifesto {
    margin-bottom: 0 !important; /* Margem inferior: 0 (forçado com !important) */
    padding-bottom: 0 !important; /* Espaçamento interno inferior: 0 (forçado com !important) */
}
.page-sobre {
    background-color: #fafcff; /* Cor de fundo: #fafcff */
    overflow: hidden; /* Esconde o que ultrapassar os limites do elemento */
    font-family: 'Inter', sans-serif; /* Define a fonte usada: 'Inter', sans-serif */
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
}
.container-sobre {
    width: 100%; /* Ocupa 100% da largura do pai */
    max-width: 1400px; /* Largura máxima: 1400px */
    margin: 0 auto; /* Zera margem vertical e centraliza na horizontal */
    padding: 0 40px; /* Espaçamento interno: 0 40px */
    box-sizing: border-box; /* Padding e borda passam a contar dentro da largura/altura definida */
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
    z-index: 2; /* Camada de sobreposição (quanto maior, mais na frente): 2 */
}
.text-center {
    text-align: center; /* Centraliza o texto */
}
.texto-justificado {
    text-align: justify; /* Justifica o texto */
}
.sobre-hero {
    padding: 240px 0 80px 0; /* Espaçamento interno: 240px 0 80px 0 */
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
    background-color: #ffffff; /* Cor de fundo: #ffffff */
    overflow: hidden; /* Esconde o que ultrapassar os limites do elemento */
}
.grid-pattern-bg {
    position: absolute; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative */
    top: 0; /* Distância a partir do(a) topo: 0 */
    left: 0; /* Distância a partir do(a) esquerda: 0 */
    right: 0; /* Distância a partir do(a) direita: 0 */
    bottom: 0; /* Distância a partir do(a) base: 0 */
    background-image: linear-gradient(rgba(0, 153, 255, 0.04) 1px, transparent 1px), 
                      linear-gradient(90deg, rgba(0, 153, 255, 0.04) 1px, transparent 1px); /* Imagem de fundo: linear-gradient(rgba(0, 153, 255, 0.04) 1px, transparent 1px), 
                      linear-gradient(90deg, rgba(0, 153, 255, 0.04) 1px, transparent 1px) */
    background-size: 40px 40px; /* Tamanho da imagem de fundo: 40px 40px */
    z-index: 0; /* Camada de sobreposição (quanto maior, mais na frente): 0 */
    mask-image: radial-gradient(circle at center, black 40%, transparent 80%); /* mask-image: radial-gradient(circle at center, black 40%, transparent 80%) */
    -webkit-mask-image: radial-gradient(circle at center, black 40%, transparent 80%); /* -webkit-mask-image: radial-gradient(circle at center, black 40%, transparent 80%) */
}
.glow-orb {
    position: absolute; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative */
    border-radius: 50%; /* Arredonda os cantos: 50% */
    filter: blur(80px); /* Filtro visual (blur, brilho, etc.): blur(80px) */
    z-index: 1; /* Camada de sobreposição (quanto maior, mais na frente): 1 */
    opacity: 0.6; /* Transparência do elemento (0 invisível, 1 opaco): 0.6 */
    pointer-events: none; /* Impede clique e interação com o elemento */
}
.orb-1 {
    width: 400px; /* Largura: 400px */
    height: 400px; /* Altura: 400px */
    background: rgba(0, 153, 255, 0.15); /* Cor de fundo: rgba(0, 153, 255, 0.15) */
    top: 10%; /* Distância a partir do(a) topo: 10% */
    left: 15%; /* Distância a partir do(a) esquerda: 15% */
    animation: floatOrb 12s infinite alternate ease-in-out; /* Aplica a animação: floatOrb 12s infinite alternate ease-in-out */
}
.orb-2 {
    width: 500px; /* Largura: 500px */
    height: 500px; /* Altura: 500px */
    background: rgba(0, 51, 204, 0.08); /* Cor de fundo: rgba(0, 51, 204, 0.08) */
    bottom: -10%; /* Distância a partir do(a) base: -10% */
    right: 10%; /* Distância a partir do(a) direita: 10% */
    animation: floatOrb 15s infinite alternate-reverse ease-in-out; /* Aplica a animação: floatOrb 15s infinite alternate-reverse ease-in-out */
}
/* Define os quadros da animação "floatOrb" */
@keyframes floatOrb {
    0% {
        transform: translate(0, 0) scale(1); /* Transformação (rotação, escala ou deslocamento): translate(0, 0) scale(1) */
    }
    100% {
        transform: translate(30px, -50px) scale(1.1); /* Transformação (rotação, escala ou deslocamento): translate(30px, -50px) scale(1.1) */
    }
}
.wrapper-hero {
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
    z-index: 5; /* Camada de sobreposição (quanto maior, mais na frente): 5 */
    padding-top: 100px; /* Espaçamento interno superior: 100px */
}
.hero-title {
    font-size: 52px; /* Tamanho da fonte: 52px */
    color: #0f172a; /* Cor do texto: #0f172a */
    line-height: 1.15; /* Altura da linha do texto: 1.15 */
    margin: 0 0 24px 0; /* Margem: 0 0 24px 0 */
    font-weight: 800; /* Peso bem pesado, quase preto */
    letter-spacing: -1.5px; /* Espaçamento entre letras: -1.5px */
}
.text-gradient-animated {
    background: linear-gradient(to right, #0f172a, #0099ff, #0f172a); /* Fundo em gradiente: linear-gradient(to right, #0f172a, #0099ff, #0f172a) */
    background-size: 200% auto; /* Tamanho da imagem de fundo: 200% auto */
    -webkit-background-clip: text; /* Recorta o fundo no formato do texto (efeito de gradiente no texto) */
    -webkit-text-fill-color: transparent; /* Cor de preenchimento do texto (usado com gradiente): transparent */
    background-clip: text; /* background-clip: text */
    animation: shineText 4s linear infinite; /* Aplica a animação: shineText 4s linear infinite */
}
/* Define os quadros da animação "shineText" */
@keyframes shineText {
    to {
        background-position: 200% center; /* Posição da imagem de fundo: 200% center */
    }
}
.hero-subtitle {
    font-size: 20px; /* Tamanho da fonte: 20px */
    color: #475569; /* Cor do texto: #475569 */
    max-width: 780px; /* Largura máxima: 780px */
    margin: 0 auto 40px auto; /* Margem: 0 auto 40px auto */
    line-height: 1.6; /* Altura da linha do texto: 1.6 */
}
.hero-cta-group {
    display: flex; /* Ativa flexbox nos filhos diretos */
    justify-content: center; /* Centraliza os filhos no eixo principal (geralmente horizontal) */
    gap: 20px; /* Espaço de 20px entre os itens */
}
.btn-primary-glow {
    background-color: #0099ff; /* Cor de fundo: #0099ff */
    color: #ffffff; /* Cor do texto: #ffffff */
    padding: 16px 36px; /* Espaçamento interno: 16px 36px */
    border-radius: 8px; /* Arredonda os cantos: 8px */
    font-size: 16px; /* Tamanho da fonte: 16px */
    font-weight: 600; /* Peso semi-negrito */
    text-decoration: none; /* Remove sublinhado/decoração do texto */
    box-shadow: 0 8px 24px rgba(0, 153, 255, 0.3); /* Sombra da caixa: 0 8px 24px rgba(0, 153, 255, 0.3) */
    transition: all 0.3s ease; /* Anima a mudança de propriedade ao longo do tempo: all 0.3s ease */
}
.btn-primary-glow:hover {
    background-color: #0088e6; /* Cor de fundo: #0088e6 */
    transform: translateY(-3px); /* Transformação (rotação, escala ou deslocamento): translateY(-3px) */
    box-shadow: 0 12px 32px rgba(0, 153, 255, 0.4); /* Sombra da caixa: 0 12px 32px rgba(0, 153, 255, 0.4) */
}
.btn-secondary-outline {
    background-color: transparent; /* Remove a cor de fundo */
    color: #0f172a; /* Cor do texto: #0f172a */
    padding: 16px 36px; /* Espaçamento interno: 16px 36px */
    border-radius: 8px; /* Arredonda os cantos: 8px */
    font-size: 16px; /* Tamanho da fonte: 16px */
    font-weight: 600; /* Peso semi-negrito */
    text-decoration: none; /* Remove sublinhado/decoração do texto */
    border: 1px solid #cbd5e1; /* Borda: 1px solid #cbd5e1 */
    transition: all 0.3s ease; /* Anima a mudança de propriedade ao longo do tempo: all 0.3s ease */
}
.btn-secondary-outline:hover {
    border-color: #0099ff; /* Cor da borda: #0099ff */
    color: #0099ff; /* Cor do texto: #0099ff */
    background-color: rgba(0, 153, 255, 0.03); /* Cor de fundo: rgba(0, 153, 255, 0.03) */
}
.sobre-bento-manifesto {
    padding: 12vh 0 6vh 0; /* Espaçamento interno: 12vh 0 6vh 0 */
}
.container-sobre {
    width: 100%; /* Ocupa 100% da largura do pai */
    max-width: 1200px; /* Largura máxima: 1200px */
    margin: 0 auto; /* Zera margem vertical e centraliza na horizontal */
    padding: 0 40px; /* Espaçamento interno: 0 40px */
    box-sizing: border-box; /* Padding e borda passam a contar dentro da largura/altura definida */
    position: relative; /* Mantém no fluxo normal e vira referência para filhos absolutos */
    z-index: 2; /* Camada de sobreposição (quanto maior, mais na frente): 2 */
}
.bento-grid {
    display: grid !important; /* Ativa grid nos filhos diretos (!important) */
    grid-template-columns: 2fr 1fr !important; /* Define as colunas do grid: 2fr 1fr (forçado com !important) */
    gap: 32px; /* Espaço de 32px entre os itens */
    align-items: stretch !important; /* Estica os filhos para preencher o eixo cruzado (!important) */
}
.bento-card, 
.bento-large, 
.tech-box {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    height: 100% !important; /* Ocupa 100% da altura do pai (!important) */
    box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
}
.bento-card {
    background: #ffffff; /* Cor de fundo: #ffffff */
    border-radius: 24px; /* Arredonda os cantos: 24px */
    padding: 48px; /* Espaçamento interno: 48px */
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03); /* Sombra da caixa: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03) */
    border: 1px solid #f1f5f9; /* Borda: 1px solid #f1f5f9 */
    transition: transform 0.3s ease, box-shadow 0.3s ease; /* Anima a mudança de propriedade ao longo do tempo: transform 0.3s ease, box-shadow 0.3s ease */
}
.bento-card:hover {
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.05), 0 10px 10px -5px rgba(0, 0, 0, 0.02); /* Sombra da caixa: 0 20px 25px -5px rgba(0, 0, 0, 0.05), 0 10px 10px -5px rgba(0, 0, 0, 0.02) */
    transform: translateY(-4px); /* Transformação (rotação, escala ou deslocamento): translateY(-4px) */
}
.bento-large h2 {
    font-size: 32px; /* Tamanho da fonte: 32px */
    color: #0f172a; /* Cor do texto: #0f172a */
    line-height: 1.2; /* Altura da linha do texto: 1.2 */
    letter-spacing: -0.5px; /* Espaçamento entre letras: -0.5px */
    margin-top: 0 !important; /* Margem superior: 0 (forçado com !important) */
    margin-bottom: 24px !important; /* Margem inferior: 24px (forçado com !important) */
}
.bento-large p {
    font-size: 16px; /* Tamanho da fonte: 16px */
    color: #475569; /* Cor do texto: #475569 */
    line-height: 1.8; /* Altura da linha do texto: 1.8 */
    margin: 0 0 20px 0; /* Margem: 0 0 20px 0 */
}
.bento-large p:last-child,
.bento-large p:last-of-type {
    margin-bottom: 0 !important; /* Margem inferior: 0 (forçado com !important) */
}
.tech-box {
    background: #0f172a !important; /* Cor de fundo: #0f172a (forçado com !important) */
    background-image: linear-gradient(145deg, #0f172a 0%, #1e293b 100%) !important; /* Imagem de fundo: linear-gradient(145deg, #0f172a 0%, #1e293b 100%) (forçado com !important) */
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
    border: 1px solid #334155 !important; /* Borda: 1px solid #334155 (forçado com !important) */
    padding: 48px !important; /* Espaçamento interno: 48px (forçado com !important) */
    border-radius: 24px; /* Arredonda os cantos: 24px */
}
.icon-pulse {
    width: 48px; /* Largura: 48px */
    height: 48px; /* Altura: 48px */
    color: #0099ff; /* Cor do texto: #0099ff */
    margin-bottom: 24px; /* Margem inferior: 24px */
    filter: drop-shadow(0px 0px 8px rgba(0, 153, 255, 0.6)); /* Filtro visual (blur, brilho, etc.): drop-shadow(0px 0px 8px rgba(0, 153, 255, 0.6)) */
}
.tech-box h3 {
    font-size: 24px; /* Tamanho da fonte: 24px */
    margin-top: 0; /* Margem superior: 0 */
    margin-bottom: 16px; /* Margem inferior: 16px */
    color: #ffffff; /* Cor do texto: #ffffff */
}
.tech-box p {
    color: #94a3b8; /* Cor do texto: #94a3b8 */
    font-size: 15px; /* Tamanho da fonte: 15px */
    line-height: 1.7; /* Altura da linha do texto: 1.7 */
    margin: 0; /* Remove margem */
}
.tech-box svg {
    color: #0099ff; /* Cor do texto: #0099ff */
    width: 48px; /* Largura: 48px */
    height: 48px; /* Altura: 48px */
    margin-bottom: 24px; /* Margem inferior: 24px */
}
.sobre-arquitetura {
    padding: 20px 0 40px 0; /* Espaçamento interno: 20px 0 40px 0 */
    margin-top: 0; /* Margem superior: 0 */
}
.cabecalho-secao {
    margin-bottom: 56px; /* Margem inferior: 56px */
}
.titulo-secao {
    font-size: 36px; /* Tamanho da fonte: 36px */
    color: #0f172a; /* Cor do texto: #0f172a */
    margin: 0 0 16px 0; /* Margem: 0 0 16px 0 */
    font-weight: 800; /* Peso bem pesado, quase preto */
    letter-spacing: -0.5px; /* Espaçamento entre letras: -0.5px */
}
.subtitulo-secao {
    font-size: 18px; /* Tamanho da fonte: 18px */
    color: #64748b; /* Cor do texto: #64748b */
    max-width: 600px; /* Largura máxima: 600px */
    margin: 0 auto; /* Zera margem vertical e centraliza na horizontal */
}
.grid-3-col {
    display: grid; /* Ativa grid nos filhos diretos */
    grid-template-columns: repeat(3, 1fr); /* Define as colunas do grid: repeat(3, 1fr) */
    gap: 32px; /* Espaço de 32px entre os itens */
    align-items: start; /* start */
    width: 100%; /* Ocupa 100% da largura do pai */
}
.card-tecnologia {
    background: transparent; /* Remove a cor de fundo */
    padding: 32px 0; /* Espaçamento interno: 32px 0 */
    border-top: 2px solid #e2e8f0; /* Borda superior: 2px solid #e2e8f0 */
    transition: border-color 0.3s ease; /* Anima a mudança de propriedade ao longo do tempo: border-color 0.3s ease */
}
.card-tecnologia:hover {
    border-top-color: #0099ff; /* border-top-color: #0099ff */
}
.icon-micro {
    font-size: 28px; /* Tamanho da fonte: 28px */
    margin-bottom: 20px; /* Margem inferior: 20px */
}
.card-tecnologia h3 {
    font-size: 20px; /* Tamanho da fonte: 20px */
    color: #0f172a; /* Cor do texto: #0f172a */
    margin: 0 0 16px 0; /* Margem: 0 0 16px 0 */
    font-weight: 700; /* Deixa o texto em negrito */
}
.card-tecnologia p {
    font-size: 15px; /* Tamanho da fonte: 15px */
    color: #475569; /* Cor do texto: #475569 */
    line-height: 1.7; /* Altura da linha do texto: 1.7 */
    margin: 0; /* Remove margem */
    text-align: justify; /* Justifica o texto */
}
.grid-3-col .bento-card {
    height: auto !important; /* Altura automática, ajusta ao conteúdo (!important) */
    min-height: 240px !important; /* Altura mínima: 240px (forçado com !important) */
    padding: 32px !important; /* Espaçamento interno: 32px (forçado com !important) */
    justify-content: flex-start !important; /* Alinha os filhos no início do eixo principal (!important) */
}
.grid-3-col .bento-card p {
    font-size: 14px !important; /* Tamanho da fonte: 14px (forçado com !important) */
    line-height: 1.6 !important; /* Altura da linha do texto: 1.6 (forçado com !important) */
    color: #475569 !important; /* Cor do texto: #475569 (forçado com !important) */
}
.sobre-imersao {
    width: 100% !important;
    background: #0f172a !important; /* Cor dark transferida para cá */
    padding: 80px 20px 100px 20px !important; /* Espaçamento interno perfeito */
    margin: 0 !important;
    position: relative !important; 
    z-index: 10 !important;
}
.imersao-box {
    background: transparent !important; /* Remove a cor da caixa, pois o fundo de fora já é escuro */
    border-radius: 0 !important; /* Tira o formato de "cartãozinho" */
    box-shadow: none !important; /* Remove sombras desnecessárias */
    padding: 0 !important; 
    
    /* A mágica do alinhamento: Trava a largura máxima para o texto não esticar demais e centraliza na tela */
    max-width: 1100px !important; 
    margin: 0 auto !important; 
}
.imersao-header h2 {
    font-size: 36px; /* Tamanho da fonte: 36px */
    margin: 0 0 16px 0; /* Margem: 0 0 16px 0 */
    font-weight: 800; /* Peso bem pesado, quase preto */
    color: #ffffff;
}
.imersao-header p {
    font-size: 18px; /* Tamanho da fonte: 18px */
    color: #94a3b8; /* Cor do texto: #94a3b8 */
    margin: 0 0 64px 0; /* Margem: 0 0 64px 0 */
}
.grid-numeros-premium {
    display: grid; /* Ativa grid nos filhos diretos */
    grid-template-columns: repeat(3, 1fr); /* Define as colunas do grid: repeat(3, 1fr) */
    gap: 40px; /* Espaço de 40px entre os itens */
    border-top: 1px solid rgba(255, 255, 255, 0.1); /* Borda superior: 1px solid rgba(255, 255, 255, 0.1) */
    padding-top: 64px; /* Espaçamento interno superior: 64px */
}
.num-destaque {
    display: block; /* Muda para block, ocupa a linha toda */
    font-size: 56px; /* Tamanho da fonte: 56px */
    font-weight: 800; /* Peso bem pesado, quase preto */
    background: linear-gradient(135deg, #ffffff 0%, #94a3b8 100%); /* Fundo em gradiente: linear-gradient(135deg, #ffffff 0%, #94a3b8 100%) */
    -webkit-background-clip: text; /* Recorta o fundo no formato do texto (efeito de gradiente no texto) */
    -webkit-text-fill-color: transparent; /* Cor de preenchimento do texto (usado com gradiente): transparent */
    margin-bottom: 8px; /* Margem inferior: 8px */
}
.num-texto {
    font-size: 16px; /* Tamanho da fonte: 16px */
    color: #0099ff; /* Cor do texto: #0099ff */
    font-weight: 600; /* Peso semi-negrito */
    letter-spacing: 0.5px; /* Espaçamento entre letras: 0.5px */
    text-transform: uppercase; /* Transforma o texto em maiúsculas */
}
.sobre-grid-4 {
    display: grid; /* Ativa grid nos filhos diretos */
    grid-template-columns: repeat(2, 1fr); /* Define as colunas do grid: repeat(2, 1fr) */
    gap: 32px; /* Espaço de 32px entre os itens */
    margin-top: 40px; /* Margem superior: 40px */
}
.sobre-card {
    background: #ffffff; /* Cor de fundo: #ffffff */
    border-radius: 24px; /* Arredonda os cantos: 24px */
    padding: 32px; /* Espaçamento interno: 32px */
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03); /* Sombra da caixa: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03) */
    border: 1px solid #f1f5f9; /* Borda: 1px solid #f1f5f9 */
    display: flex; /* Ativa flexbox nos filhos diretos */
    flex-direction: column; /* Empilha os filhos na vertical */
    align-items: flex-start; /* Alinha os filhos no início do eixo cruzado */
    text-align: left; /* Alinha o texto à esquerda */
    transition: transform 0.3s ease, box-shadow 0.3s ease; /* Anima a mudança de propriedade ao longo do tempo: transform 0.3s ease, box-shadow 0.3s ease */
}
.sobre-card:hover {
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.05), 0 10px 10px -5px rgba(0, 0, 0, 0.02); /* Sombra da caixa: 0 20px 25px -5px rgba(0, 0, 0, 0.05), 0 10px 10px -5px rgba(0, 0, 0, 0.02) */
    transform: translateY(-4px); /* Transformação (rotação, escala ou deslocamento): translateY(-4px) */
}
.sobre-card-icon {
    font-size: 26px; /* Tamanho da fonte: 26px */
    margin-bottom: 16px; /* Margem inferior: 16px */
    background: #f8fafc; /* Cor de fundo: #f8fafc */
    width: 52px; /* Largura: 52px */
    height: 52px; /* Altura: 52px */
    display: flex; /* Ativa flexbox nos filhos diretos */
    align-items: center; /* Centraliza os filhos no eixo cruzado (geralmente vertical) */
    justify-content: center; /* Centraliza os filhos no eixo principal (geralmente horizontal) */
    border-radius: 12px; /* Arredonda os cantos: 12px */
    border: 1px solid #e2e8f0; /* Borda: 1px solid #e2e8f0 */
}
.sobre-card h3 {
    font-size: 19px; /* Tamanho da fonte: 19px */
    color: #0f172a; /* Cor do texto: #0f172a */
    font-weight: 700; /* Deixa o texto em negrito */
    margin: 0 0 8px 0; /* Margem: 0 0 8px 0 */
    letter-spacing: -0.5px; /* Espaçamento entre letras: -0.5px */
}
.sobre-card p {
    color: #475569; /* Cor do texto: #475569 */
    font-size: 14px; /* Tamanho da fonte: 14px */
    line-height: 1.6; /* Altura da linha do texto: 1.6 */
    margin: 0; /* Remove margem */
}
.foguete-clone-wrapper {
    position: fixed !important; /* Tira do fluxo normal e fixa na tela mesmo com scroll (!important) */
    z-index: 999999 !important; /* Camada de sobreposição (quanto maior, mais na frente): 999999 (forçado com !important) */
    pointer-events: none !important; /* Impede clique e interação com o elemento (!important) */
    margin: 0 !important; /* Remove margem (!important) */
    will-change: transform; /* Avisa o navegador para otimizar a propriedade: transform */
    transform-origin: center center; /* Ponto de referência da transformação: center center */
}
.tremor-ativo {
    animation: tremorMotor 0.1s infinite; /* Aplica a animação: tremorMotor 0.1s infinite */
    filter: drop-shadow(0 0 20px #00a0e3) drop-shadow(0 0 40px #00ffff); /* Filtro visual (blur, brilho, etc.): drop-shadow(0 0 20px #00a0e3) drop-shadow(0 0 40px #00ffff) */
}
/* Define os quadros da animação "tremorMotor" */
@keyframes tremorMotor {
    0%, 100% {
        transform: translate(0, 0); /* Transformação (rotação, escala ou deslocamento): translate(0, 0) */
    }
    25% {
        transform: translate(-2px, 2px); /* Transformação (rotação, escala ou deslocamento): translate(-2px, 2px) */
    }
    50% {
        transform: translate(2px, -2px); /* Transformação (rotação, escala ou deslocamento): translate(2px, -2px) */
    }
    75% {
        transform: translate(-1px, 1px); /* Transformação (rotação, escala ou deslocamento): translate(-1px, 1px) */
    }
}
.foguete-clone-wrapper {
    position: fixed !important; /* Tira do fluxo normal e fixa na tela mesmo com scroll (!important) */
    z-index: 999999 !important; /* Camada de sobreposição (quanto maior, mais na frente): 999999 (forçado com !important) */
    pointer-events: none !important; /* Impede clique e interação com o elemento (!important) */
    margin: 0 !important; /* Remove margem (!important) */
    will-change: transform; /* Avisa o navegador para otimizar a propriedade: transform */
    transform-origin: center center; /* Ponto de referência da transformação: center center */
}
.tremor-ativo {
    animation: tremorMotor 0.1s infinite; /* Aplica a animação: tremorMotor 0.1s infinite */
    filter: drop-shadow(0 0 20px #00a0e3) drop-shadow(0 0 40px #00ffff); /* Filtro visual (blur, brilho, etc.): drop-shadow(0 0 20px #00a0e3) drop-shadow(0 0 40px #00ffff) */
}
/* Define os quadros da animação "tremorMotor" */
@keyframes tremorMotor {
    0%, 100% {
        transform: translate(0, 0); /* Transformação (rotação, escala ou deslocamento): translate(0, 0) */
    }
    25% {
        transform: translate(-2px, 2px); /* Transformação (rotação, escala ou deslocamento): translate(-2px, 2px) */
    }
    50% {
        transform: translate(2px, -2px); /* Transformação (rotação, escala ou deslocamento): translate(2px, -2px) */
    }
    75% {
        transform: translate(-1px, 1px); /* Transformação (rotação, escala ou deslocamento): translate(-1px, 1px) */
    }
}
.foguete-voo-contorno {
    animation: vooTrajetoSupremo 10s linear forwards !important; /* Aplica a animação: vooTrajetoSupremo 10s linear forwards (forçado com !important) */
}
/* Define os quadros da animação "vooTrajetoSupremo" */
@keyframes vooTrajetoSupremo {
    0% {
        transform: translate(0vw, 0vh) rotate(0deg) scale(1); /* Transformação (rotação, escala ou deslocamento): translate(0vw, 0vh) rotate(0deg) scale(1) */
    }
    4% {
        transform: translate(9vw, -6vh) rotate(45deg) scale(1.15); /* Transformação (rotação, escala ou deslocamento): translate(9vw, -6vh) rotate(45deg) scale(1.15) */
    }
    8% {
        transform: translate(18vw, -6vh) rotate(90deg) scale(1.3); /* Transformação (rotação, escala ou deslocamento): translate(18vw, -6vh) rotate(90deg) scale(1.3) */
    }
    12% {
        transform: translate(25vw, 0vh) rotate(115deg) scale(1.3); /* Transformação (rotação, escala ou deslocamento): translate(25vw, 0vh) rotate(115deg) scale(1.3) */
    }
    16% {
        transform: translate(25vw, 12vh) rotate(135deg) scale(1.3); /* Transformação (rotação, escala ou deslocamento): translate(25vw, 12vh) rotate(135deg) scale(1.3) */
    }
    20% {
        transform: translate(25vw, 25vh) rotate(135deg) scale(1.3); /* Transformação (rotação, escala ou deslocamento): translate(25vw, 25vh) rotate(135deg) scale(1.3) */
    }
    24% {
        transform: translate(25vw, 40vh) rotate(155deg) scale(1.3); /* Transformação (rotação, escala ou deslocamento): translate(25vw, 40vh) rotate(155deg) scale(1.3) */
    }
    28% {
        transform: translate(18vw, 48vh) rotate(180deg) scale(1.3); /* Transformação (rotação, escala ou deslocamento): translate(18vw, 48vh) rotate(180deg) scale(1.3) */
    }
    32% {
        transform: translate(8vw, 52vh) rotate(205deg) scale(1.3); /* Transformação (rotação, escala ou deslocamento): translate(8vw, 52vh) rotate(205deg) scale(1.3) */
    }
    36% {
        transform: translate(-2vw, 52vh) rotate(225deg) scale(1.3); /* Transformação (rotação, escala ou deslocamento): translate(-2vw, 52vh) rotate(225deg) scale(1.3) */
    }
    44% {
        transform: translate(-42vw, 52vh) rotate(225deg) scale(1.3); /* Transformação (rotação, escala ou deslocamento): translate(-42vw, 52vh) rotate(225deg) scale(1.3) */
    }
    48% {
        transform: translate(-50vw, 48vh) rotate(250deg) scale(1.3); /* Transformação (rotação, escala ou deslocamento): translate(-50vw, 48vh) rotate(250deg) scale(1.3) */
    }
    52% {
        transform: translate(-58vw, 40vh) rotate(270deg) scale(1.3); /* Transformação (rotação, escala ou deslocamento): translate(-58vw, 40vh) rotate(270deg) scale(1.3) */
    }
    56% {
        transform: translate(-58vw, 28vh) rotate(315deg) scale(1.3); /* Transformação (rotação, escala ou deslocamento): translate(-58vw, 28vh) rotate(315deg) scale(1.3) */
    }
    64% {
        transform: translate(-58vw, 5vh) rotate(315deg) scale(1.3); /* Transformação (rotação, escala ou deslocamento): translate(-58vw, 5vh) rotate(315deg) scale(1.3) */
    }
    68% {
        transform: translate(-58vw, -6vh) rotate(340deg) scale(1.3); /* Transformação (rotação, escala ou deslocamento): translate(-58vw, -6vh) rotate(340deg) scale(1.3) */
    }
    72% {
        transform: translate(-48vw, -12vh) rotate(360deg) scale(1.3); /* Transformação (rotação, escala ou deslocamento): translate(-48vw, -12vh) rotate(360deg) scale(1.3) */
    }
    76% {
        transform: translate(-36vw, -12vh) rotate(405deg) scale(1.3); /* Transformação (rotação, escala ou deslocamento): translate(-36vw, -12vh) rotate(405deg) scale(1.3) */
    }
    82% {
        transform: translate(-18vw, -12vh) rotate(405deg) scale(1.25); /* Transformação (rotação, escala ou deslocamento): translate(-18vw, -12vh) rotate(405deg) scale(1.25) */
    }
    86% {
        transform: translate(-8vw, -6vh) rotate(380deg) scale(1.15); /* Transformação (rotação, escala ou deslocamento): translate(-8vw, -6vh) rotate(380deg) scale(1.15) */
    }
    90% {
        transform: translate(-1vw, -1vh) rotate(360deg) scale(1.05); /* Transformação (rotação, escala ou deslocamento): translate(-1vw, -1vh) rotate(360deg) scale(1.05) */
    }
    93% {
        transform: translate(3vw, 3vh) rotate(360deg) scale(1); /* Transformação (rotação, escala ou deslocamento): translate(3vw, 3vh) rotate(360deg) scale(1) */
    }
    95% {
        transform: translate(3.5vw, 3.5vh) rotate(360deg) scale(1); /* Transformação (rotação, escala ou deslocamento): translate(3.5vw, 3.5vh) rotate(360deg) scale(1) */
    }
    100% {
        transform: translate(0vw, 0vh) rotate(360deg) scale(1); /* Transformação (rotação, escala ou deslocamento): translate(0vw, 0vh) rotate(360deg) scale(1) */
    }
}
.plasma-trail {
    position: fixed; /* Tira do fluxo normal e fixa na tela mesmo com scroll */
    width: 14px; /* Largura: 14px */
    height: 14px; /* Altura: 14px */
    background: #00ffff; /* Cor de fundo: #00ffff */
    border-radius: 50%; /* Arredonda os cantos: 50% */
    pointer-events: none; /* Impede clique e interação com o elemento */
    z-index: 999998; /* Camada de sobreposição (quanto maior, mais na frente): 999998 */
    box-shadow: 0 0 10px #00a0e3, 0 0 20px #00ffff; /* Sombra da caixa: 0 0 10px #00a0e3, 0 0 20px #00ffff */
    animation: fadePlasma 0.5s ease-out forwards; /* Aplica a animação: fadePlasma 0.5s ease-out forwards */
}
/* Define os quadros da animação "fadePlasma" */
@keyframes fadePlasma {
    0% {
        opacity: 1; /* Transparência do elemento (0 invisível, 1 opaco): 1 */
        transform: translate(-50%, -50%) scale(0.8); /* Transformação (rotação, escala ou deslocamento): translate(-50%, -50%) scale(0.8) */
    }
    100% {
        opacity: 0; /* Transparência do elemento (0 invisível, 1 opaco): 0 */
        transform: translate(var(--tx), var(--ty)) scale(2.5); /* Transformação (rotação, escala ou deslocamento): translate(var(--tx), var(--ty)) scale(2.5) */
        filter: blur(5px); /* Filtro visual (blur, brilho, etc.): blur(5px) */
    }
}
.page-contato {
    padding: 32px 0 0px 0 !important; /* Espaçamento interno: 60px 0 120px 0 (forçado com !important) */
    background: radial-gradient(circle at top, rgba(0, 153, 255, 0.03) 0%, #fafcff 40%); /* Fundo em gradiente: radial-gradient(circle at top, rgba(0, 153, 255, 0.03) 0%, #fafcff 40%) */
    min-height: 75vh; /* Altura mínima: 75vh */
}
.container-contato {
    width: 100%; /* Ocupa 100% da largura do pai */
    max-width: 1200px; /* Largura máxima: 1200px */
    margin: 0 auto; /* Zera margem vertical e centraliza na horizontal */
    padding: 0 24px; /* Espaçamento interno: 0 24px */
    box-sizing: border-box; /* Padding e borda passam a contar dentro da largura/altura definida */
}
.contato-header-center {
    max-width: 760px; /* Largura máxima: 760px */
    margin: 0 auto 48px auto !important; /* Margem: 0 auto 48px auto (forçado com !important) */
    text-align: center; /* Centraliza o texto */
}
.text-gradient-animated {
    background: linear-gradient(to right, #0f172a, #0099ff, #0f172a); /* Fundo em gradiente: linear-gradient(to right, #0f172a, #0099ff, #0f172a) */
    background-size: 200% auto; /* Tamanho da imagem de fundo: 200% auto */
    -webkit-background-clip: text; /* Recorta o fundo no formato do texto (efeito de gradiente no texto) */
    -webkit-text-fill-color: transparent; /* Cor de preenchimento do texto (usado com gradiente): transparent */
    background-clip: text; /* background-clip: text */
    animation: shineText 4s linear infinite; /* Aplica a animação: shineText 4s linear infinite */
}
/* Define os quadros da animação "shineText" */
@keyframes shineText {
    to {
        background-position: 200% center; /* Posição da imagem de fundo: 200% center */
    }
}
.split-contato-grid {
    display: grid; /* Ativa grid nos filhos diretos */
    grid-template-columns: 1fr 1.2fr; /* Define as colunas do grid: 1fr 1.2fr */
    gap: 40px; /* Espaço de 40px entre os itens */
    align-items: stretch; /* Estica os filhos para preencher o eixo cruzado */
}
.bento-card {
    background: #ffffff; /* Cor de fundo: #ffffff */
    border-radius: 24px; /* Arredonda os cantos: 24px */
    padding: 40px; /* Espaçamento interno: 40px */
    box-shadow: 0 10px 30px -10px rgba(0, 153, 255, 0.05), 0 1px 3px rgba(0, 0, 0, 0.02); /* Sombra da caixa: 0 10px 30px -10px rgba(0, 153, 255, 0.05), 0 1px 3px rgba(0, 0, 0, 0.02) */
    border: 1px solid #f1f5f9; /* Borda: 1px solid #f1f5f9 */
}
.badge-contato, .badge-premium {
    display: inline-block; /* Vira inline-block, fica na linha mas aceita largura/altura */
    background: rgba(0, 153, 255, 0.08); /* Cor de fundo: rgba(0, 153, 255, 0.08) */
    color: #0099ff; /* Cor do texto: #0099ff */
    padding: 6px 14px; /* Espaçamento interno: 6px 14px */
    border-radius: 100px; /* Arredonda os cantos: 100px */
    font-size: 12px; /* Tamanho da fonte: 12px */
    font-weight: 700; /* Deixa o texto em negrito */
    text-transform: uppercase; /* Transforma o texto em maiúsculas */
    letter-spacing: 0.5px; /* Espaçamento entre letras: 0.5px */
    margin-bottom: 20px; /* Margem inferior: 20px */
}
.hero-title {
    font-size: 52px; /* Tamanho da fonte: 52px */
    color: #0f172a; /* Cor do texto: #0f172a */
    font-weight: 800; /* Peso bem pesado, quase preto */
    letter-spacing: -1.5px; /* Espaçamento entre letras: -1.5px */
    margin: 0 0 24px 0; /* Margem: 0 0 24px 0 */
    line-height: 1.15; /* Altura da linha do texto: 1.15 */
}
.hero-subtitle {
    font-size: 20px; /* Tamanho da fonte: 20px */
    color: #475569; /* Cor do texto: #475569 */
    line-height: 1.6; /* Altura da linha do texto: 1.6 */
}
.col-title {
    font-size: 32px; /* Tamanho da fonte: 32px */
    color: #0f172a; /* Cor do texto: #0f172a */
    font-weight: 800; /* Peso bem pesado, quase preto */
    letter-spacing: -1px; /* Espaçamento entre letras: -1px */
    margin: 0 0 12px 0; /* Margem: 0 0 12px 0 */
}
.col-description {
    color: #64748b; /* Cor do texto: #64748b */
    font-size: 15px; /* Tamanho da fonte: 15px */
    line-height: 1.6; /* Altura da linha do texto: 1.6 */
    margin: 0 0 40px 0; /* Margem: 0 0 40px 0 */
}
.canais-contato-list {
    display: flex; /* Ativa flexbox nos filhos diretos */
    flex-direction: column; /* Empilha os filhos na vertical */
    gap: 24px; /* Espaço de 24px entre os itens */
}
.canal-item {
    display: flex; /* Ativa flexbox nos filhos diretos */
    align-items: center; /* Centraliza os filhos no eixo cruzado (geralmente vertical) */
    gap: 16px; /* Espaço de 16px entre os itens */
}
.canal-icon {
    color: #0099ff; /* Cor do texto: #0099ff */
    background: rgba(0, 153, 255, 0.06); /* Cor de fundo: rgba(0, 153, 255, 0.06) */
    width: 48px; /* Largura: 48px */
    height: 48px; /* Altura: 48px */
    min-width: 48px; /* Largura mínima: 48px */
    min-height: 48px; /* Altura mínima: 48px */
    flex-shrink: 0; /* Fator de encolhimento do item flex: 0 */
    display: flex; /* Ativa flexbox nos filhos diretos */
    align-items: center; /* Centraliza os filhos no eixo cruzado (geralmente vertical) */
    justify-content: center; /* Centraliza os filhos no eixo principal (geralmente horizontal) */
    border-radius: 50%; /* Arredonda os cantos: 50% */
    border: 1px solid rgba(0, 153, 255, 0.1); /* Borda: 1px solid rgba(0, 153, 255, 0.1) */
    transition: all 0.3s ease; /* Anima a mudança de propriedade ao longo do tempo: all 0.3s ease */
}
.canal-item:hover .canal-icon {
    background: #0099ff; /* Cor de fundo: #0099ff */
    color: #ffffff; /* Cor do texto: #ffffff */
    transform: scale(1.05); /* Transformação (rotação, escala ou deslocamento): scale(1.05) */
}
.canal-texts span {
    display: block; /* Muda para block, ocupa a linha toda */
    font-size: 13px; /* Tamanho da fonte: 13px */
    color: #64748b; /* Cor do texto: #64748b */
    margin-bottom: 2px; /* Margem inferior: 2px */
}
.canal-texts strong {
    font-size: 16px; /* Tamanho da fonte: 16px */
    color: #0f172a; /* Cor do texto: #0f172a */
    font-weight: 600; /* Peso semi-negrito */
}
.contato-form-column {
    display: flex; /* Ativa flexbox nos filhos diretos */
    flex-direction: column; /* Empilha os filhos na vertical */
    height: 100%; /* Ocupa 100% da altura do pai */
}
.form-main-box {
    height: 100%; /* Ocupa 100% da altura do pai */
    display: flex; /* Ativa flexbox nos filhos diretos */
    flex-direction: column; /* Empilha os filhos na vertical */
}
.form-title {
    font-size: 24px; /* Tamanho da fonte: 24px */
    color: #0f172a; /* Cor do texto: #0f172a */
    font-weight: 700; /* Deixa o texto em negrito */
    margin: 0 0 8px 0; /* Margem: 0 0 8px 0 */
    letter-spacing: -0.5px; /* Espaçamento entre letras: -0.5px */
}
.form-subtitle {
    color: #64748b; /* Cor do texto: #64748b */
    font-size: 15px; /* Tamanho da fonte: 15px */
    margin-bottom: 32px; /* Margem inferior: 32px */
    line-height: 1.6; /* Altura da linha do texto: 1.6 */
}
.galactix-form {
    display: flex; /* Ativa flexbox nos filhos diretos */
    flex-direction: column; /* Empilha os filhos na vertical */
    flex-grow: 1; /* Fator de crescimento do item flex: 1 */
    gap: 20px; /* Espaço de 20px entre os itens */
    margin-top: 24px; /* Margem superior: 24px */
}
.input-row-2 {
    display: grid; /* Ativa grid nos filhos diretos */
    grid-template-columns: 1fr 1fr; /* Define as colunas do grid: 1fr 1fr */
    gap: 20px; /* Espaço de 20px entre os itens */
}
.input-group {
    width: 100%; /* Ocupa 100% da largura do pai */
}
.input-group input, .input-group select, .input-group textarea {
    width: 100%; /* Ocupa 100% da largura do pai */
    font-family: 'Inter', sans-serif; /* Define a fonte usada: 'Inter', sans-serif */
    font-size: 15px; /* Tamanho da fonte: 15px */
    color: #0f172a; /* Cor do texto: #0f172a */
    background-color: #f8fafc; /* Cor de fundo: #f8fafc */
    border: 1px solid #e2e8f0; /* Borda: 1px solid #e2e8f0 */
    border-radius: 12px; /* Arredonda os cantos: 12px */
    padding: 16px; /* Espaçamento interno: 16px */
    box-sizing: border-box; /* Padding e borda passam a contar dentro da largura/altura definida */
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); /* Anima a mudança de propriedade ao longo do tempo: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) */
}
.input-group input:focus, .input-group select:focus, .input-group textarea:focus {
    outline: none; /* Remove o contorno de foco */
    border-color: #0099ff; /* Cor da borda: #0099ff */
    background-color: #ffffff; /* Cor de fundo: #ffffff */
    box-shadow: 0 0 0 4px rgba(0, 153, 255, 0.15); /* Sombra da caixa: 0 0 0 4px rgba(0, 153, 255, 0.15) */
}
.input-group select {
    cursor: pointer; /* Muda o cursor para indicar que é clicável */
    appearance: none; /* appearance: none */
    -webkit-appearance: none; /* -webkit-appearance: none */
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e"); /* Imagem de fundo: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e") */
    background-repeat: no-repeat; /* Repetição da imagem de fundo: no-repeat */
    background-position: right 16px center; /* Posição da imagem de fundo: right 16px center */
    background-size: 16px; /* Tamanho da imagem de fundo: 16px */
    padding-right: 40px; /* Espaçamento interno direita: 40px */
    color: #64748b; /* Cor do texto: #64748b */
}
.char-counter {
    display: block !important; /* Muda para block, ocupa a linha toda (!important) */
    text-align: right !important; /* Alinha o texto à direita (!important) */
    font-size: 12px !important; /* Tamanho da fonte: 12px (forçado com !important) */
    color: #64748b !important; /* Cor do texto: #64748b (forçado com !important) */
    margin-top: 6px !important; /* Margem superior: 6px (forçado com !important) */
    font-weight: 500 !important; /* Peso da fonte: 500 (forçado com !important) */
    transition: color 0.3s ease !important; /* Anima a mudança de propriedade ao longo do tempo: color 0.3s ease (forçado com !important) */
}
.char-counter.limite-proximo {
    color: #f59e0b !important; /* Cor do texto: #f59e0b (forçado com !important) */
}
.char-counter.limite-atingido {
    color: #ef4444 !important; /* Cor do texto: #ef4444 (forçado com !important) */
}
.galactix-form .btn-modern-primary {
    margin-top: auto; /* Margem superior: auto */
    width: 100%; /* Ocupa 100% da largura do pai */
    font-family: 'Inter', sans-serif; /* Define a fonte usada: 'Inter', sans-serif */
    background: #0099ff; /* Cor de fundo: #0099ff */
    color: #ffffff; /* Cor do texto: #ffffff */
    padding: 16px 32px; /* Espaçamento interno: 16px 32px */
    border-radius: 12px; /* Arredonda os cantos: 12px */
    font-size: 16px; /* Tamanho da fonte: 16px */
    font-weight: 600; /* Peso semi-negrito */
    border: none; /* Remove a borda */
    cursor: pointer; /* Muda o cursor para indicar que é clicável */
    box-shadow: 0 10px 20px -5px rgba(0, 153, 255, 0.3); /* Sombra da caixa: 0 10px 20px -5px rgba(0, 153, 255, 0.3) */
    transition: all 0.2s ease; /* Anima a mudança de propriedade ao longo do tempo: all 0.2s ease */
}
.galactix-form .btn-modern-primary:hover {
    background: #0088e6; /* Cor de fundo: #0088e6 */
    transform: translateY(-2px); /* Transformação (rotação, escala ou deslocamento): translateY(-2px) */
    box-shadow: 0 12px 24px -5px rgba(0, 153, 255, 0.4); /* Sombra da caixa: 0 12px 24px -5px rgba(0, 153, 255, 0.4) */
}
.full-width-footer-card {
    /* Mágica da expansão: Ignora o container e ocupa a tela toda */
    width: 100vw !important;
    position: relative !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    
    /* Remove a aparência de "cartão" e cola as bordas */
    border-radius: 0 !important; 
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
    
    /* Espaçamentos finais e colagem no rodapé */
    margin-top: 64px !important; 
    margin-bottom: 0 !important; /* ATUALIZADO: Aniquila o espaço em branco final! */
    padding: 64px 20px !important; 
    height: auto !important; 
    min-height: 0 !important; 
}
.partner-support-box {
    background: #0f172a !important; /* Cor de fundo: #0f172a (forçado com !important) */
    background-image: linear-gradient(145deg, #0f172a 0%, #1e293b 100%) !important; /* Imagem de fundo: linear-gradient(145deg, #0f172a 0%, #1e293b 100%) (forçado com !important) */
    border: 1px solid #334155 !important; /* Borda: 1px solid #334155 (forçado com !important) */
}
.partner-header-row {
    display: flex; /* Ativa flexbox nos filhos diretos */
    align-items: center; /* Centraliza os filhos no eixo cruzado (geralmente vertical) */
    justify-content: space-between; /* Espalha os filhos com espaço igual entre eles */
    gap: 40px; /* Espaço de 40px entre os itens */
    max-width: 1100px !important;
    width: 100% !important;
    margin: 0 auto !important;
}
.partner-text-left {
    max-width: 70%; /* Largura máxima: 70% */
    text-align: left; /* Alinha o texto à esquerda */
    display: flex; /* Ativa flexbox nos filhos diretos */
    flex-direction: column; /* Empilha os filhos na vertical */
    justify-content: flex-start; /* Alinha os filhos no início do eixo principal */
}
.partner-action-right {
    min-width: 240px; /* Largura mínima: 240px */
}
.badge-partner {
    display: inline-block; /* Vira inline-block, fica na linha mas aceita largura/altura */
    align-self: flex-start; /* Sobrescreve o alinhamento deste item no eixo cruzado: flex-start */
    background: rgba(255, 255, 255, 0.1); /* Cor de fundo: rgba(255, 255, 255, 0.1) */
    color: #ffffff; /* Cor do texto: #ffffff */
    padding: 6px 14px; /* Espaçamento interno: 6px 14px */
    border-radius: 100px; /* Arredonda os cantos: 100px */
    font-size: 11px; /* Tamanho da fonte: 11px */
    font-weight: 700; /* Deixa o texto em negrito */
    text-transform: uppercase; /* Transforma o texto em maiúsculas */
    letter-spacing: 0.5px; /* Espaçamento entre letras: 0.5px */
    margin-top: -20px !important; /* Margem superior: -20px (forçado com !important) */
    margin-bottom: 20px !important; /* Margem inferior: 20px (forçado com !important) */
}
.partner-support-box h3 {
    font-size: 20px; /* Tamanho da fonte: 20px */
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
    font-weight: 700; /* Deixa o texto em negrito */
    margin: 0 0 12px 0; /* Margem: 0 0 12px 0 */
    letter-spacing: -0.5px; /* Espaçamento entre letras: -0.5px */
    line-height: 1.4; /* Altura da linha do texto: 1.4 */
}
.partner-support-box p {
    color: #94a3b8; /* Cor do texto: #94a3b8 */
    font-size: 14px; /* Tamanho da fonte: 14px */
    line-height: 1.6; /* Altura da linha do texto: 1.6 */
    margin: 0; /* Remove margem */
}
.btn-modern-outline {
    display: flex; /* Ativa flexbox nos filhos diretos */
    align-items: center; /* Centraliza os filhos no eixo cruzado (geralmente vertical) */
    justify-content: center; /* Centraliza os filhos no eixo principal (geralmente horizontal) */
    text-decoration: none; /* Remove sublinhado/decoração do texto */
    width: 100%; /* Ocupa 100% da largura do pai */
    font-family: 'Inter', sans-serif; /* Define a fonte usada: 'Inter', sans-serif */
    background: transparent; /* Remove a cor de fundo */
    color: #0099ff; /* Cor do texto: #0099ff */
    padding: 14px 32px; /* Espaçamento interno: 14px 32px */
    border-radius: 12px; /* Arredonda os cantos: 12px */
    font-size: 15px; /* Tamanho da fonte: 15px */
    font-weight: 600; /* Peso semi-negrito */
    border: 1px solid #0099ff; /* Borda: 1px solid #0099ff */
    box-sizing: border-box; /* Padding e borda passam a contar dentro da largura/altura definida */
    transition: all 0.2s ease; /* Anima a mudança de propriedade ao longo do tempo: all 0.2s ease */
}
.btn-modern-outline:hover {
    background: #0099ff; /* Cor de fundo: #0099ff */
    color: #ffffff; /* Cor do texto: #ffffff */
}
.contato-info-column, 
.form-main-box {
    justify-content: flex-start !important; /* Alinha os filhos no início do eixo principal (!important) */
}
.contato-info-column {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    justify-content: flex-start !important; /* Alinha os filhos no início do eixo principal (!important) */
}
.contato-info-column .col-description {
    flex-grow: 0 !important; /* Fator de crescimento do item flex: 0 (forçado com !important) */
    margin-bottom: 40px !important; /* Margem inferior: 40px (forçado com !important) */
}
.canais-contato-list {
    margin-top: 0 !important; /* Margem superior: 0 (forçado com !important) */
    flex-grow: 0 !important; /* Fator de crescimento do item flex: 0 (forçado com !important) */
    margin-bottom: auto !important; /* Margem inferior: auto (forçado com !important) */
}

/* VALIDAÇÃO DE CAMPOS */

/* Quando o JavaScript detectar um erro de envio, ele injeta essa classe */
.galactix-form .erro-validacao {
    border-color: #ef4444 !important; /* Vermelho vivo */
    background-color: #fef2f2 !important; /* Fundo vermelho claro */
}

/* A sombra de foco quando o campo está com erro */
.galactix-form .erro-validacao:focus {
    box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.15) !important;
}

/* Troca a cor da setinha do Select para vermelho no erro */
.galactix-form select.erro-validacao {
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ef4444' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e") !important;
}

/* Deixa o texto do placeholder avermelhado */
.galactix-form .erro-validacao::placeholder {
    color: #f87171 !important;
}

.sobre-grid-4 {
    display: grid; /* Ativa grid nos filhos diretos */
    grid-template-columns: repeat(2, 1fr); /* Define as colunas do grid: repeat(2, 1fr) */
    gap: 32px; /* Espaço de 32px entre os itens */
    margin-top: 40px; /* Margem superior: 40px */
}
.sobre-card {
    background: #ffffff; /* Cor de fundo: #ffffff */
    border-radius: 24px; /* Arredonda os cantos: 24px */
    padding: 32px; /* Espaçamento interno: 32px */
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03); /* Sombra da caixa: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03) */
    border: 1px solid #f1f5f9; /* Borda: 1px solid #f1f5f9 */
    display: flex; /* Ativa flexbox nos filhos diretos */
    flex-direction: column; /* Empilha os filhos na vertical */
    align-items: flex-start; /* Alinha os filhos no início do eixo cruzado */
    text-align: left; /* Alinha o texto à esquerda */
    transition: transform 0.3s ease, box-shadow 0.3s ease; /* Anima a mudança de propriedade ao longo do tempo: transform 0.3s ease, box-shadow 0.3s ease */
}
.sobre-card:hover {
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.05), 0 10px 10px -5px rgba(0, 0, 0, 0.02); /* Sombra da caixa: 0 20px 25px -5px rgba(0, 0, 0, 0.05), 0 10px 10px -5px rgba(0, 0, 0, 0.02) */
    transform: translateY(-4px); /* Transformação (rotação, escala ou deslocamento): translateY(-4px) */
}
.sobre-card-icon {
    font-size: 26px; /* Tamanho da fonte: 26px */
    margin-bottom: 16px; /* Margem inferior: 16px */
    background: #f8fafc; /* Cor de fundo: #f8fafc */
    width: 52px; /* Largura: 52px */
    height: 52px; /* Altura: 52px */
    display: flex; /* Ativa flexbox nos filhos diretos */
    align-items: center; /* Centraliza os filhos no eixo cruzado (geralmente vertical) */
    justify-content: center; /* Centraliza os filhos no eixo principal (geralmente horizontal) */
    border-radius: 12px; /* Arredonda os cantos: 12px */
    border: 1px solid #e2e8f0; /* Borda: 1px solid #e2e8f0 */
}
.sobre-card h3 {
    font-size: 19px; /* Tamanho da fonte: 19px */
    color: #0f172a; /* Cor do texto: #0f172a */
    font-weight: 700; /* Deixa o texto em negrito */
    margin: 0 0 8px 0; /* Margem: 0 0 8px 0 */
    letter-spacing: -0.5px; /* Espaçamento entre letras: -0.5px */
}
.sobre-card p {
    color: #475569; /* Cor do texto: #475569 */
    font-size: 14px; /* Tamanho da fonte: 14px */
    line-height: 1.6; /* Altura da linha do texto: 1.6 */
    margin: 0; /* Remove margem */
}
main.page-contato,
.container-contato {
    padding-bottom: 0 !important; /* Espaçamento interno inferior: 0 (forçado com !important) */
    margin-bottom: 0 !important; /* Margem inferior: 0 (forçado com !important) */
}

footer {
    margin-top: 0 !important; /* Margem superior: 0 (forçado com !important) */
}
.drill {
    display: none; /* Esconde o elemento e tira do fluxo */
}
.sweatshirt {
    background-position: -7px 0; /* Posição da imagem de fundo: -7px 0 */
    height: 246px; /* Altura: 246px */
    top: 53px; /* Distância a partir do(a) topo: 53px */
    left: -85px; /* Distância a partir do(a) esquerda: -85px */
}
.channel-home-sub {
    width: 100%; /* Ocupa 100% da largura do pai */
}
.channels {
    width: 160px; /* Largura: 160px */
}
.background-banner div span {
    left: -170px; /* Distância a partir do(a) esquerda: -170px */
}
.background-whiter h2 {
    font-size: 20pt; /* Tamanho da fonte: 20pt */
    width: 70%; /* Largura: 70% */
}
.background-whiter h3 {
    font-size: 14pt; /* Tamanho da fonte: 14pt */
    width: 80%; /* Largura: 80% */
}
.box {
    height: 300px; /* Altura: 300px */
}
.container-news .box2 {
    height: 264px; /* Altura: 264px */
    width: 100%; /* Ocupa 100% da largura do pai */
    margin: 5px 0; /* Margem: 5px 0 */
}
.container-news .box2 h4 {
    font-size: 12pt; /* Tamanho da fonte: 12pt */
}
.hero-produto {
    background: 
  radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
  radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
  radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
  #060913 !important; /* Fundo em gradiente: radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
  radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
  radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
  #060913 (forçado com !important) */
    padding: 50px 20px 40px 20px; /* Espaçamento interno: 50px 20px 100px 20px */
    text-align: center; /* Centraliza o texto */
    display: flex; /* Ativa flexbox nos filhos diretos */
    align-items: center; /* Centraliza os filhos no eixo cruzado (geralmente vertical) */
    justify-content: center; /* Centraliza os filhos no eixo principal (geralmente horizontal) */
}
.hero-produto .container {
    width: 100%; /* Ocupa 100% da largura do pai */
    max-width: 900px; /* Largura máxima: 900px */
    margin-top: 0; /* Margem superior: 0 */
    margin-right: auto; /* Margem direita: auto */
    margin-bottom: 0; /* Margem inferior: 0 */
    margin-left: auto; /* Margem esquerda: auto */
}
.hero-produto h1 {
    color: #FFFFFF !important; /* Cor do texto: #FFFFFF (forçado com !important) */
    font-size: 52px !important; /* Tamanho da fonte: 52px (forçado com !important) */
    font-weight: 800; /* Peso bem pesado, quase preto */
    line-height: 1.15; /* Altura da linha do texto: 1.15 */
    margin: 0 auto 24px auto !important; /* Margem: 0 auto 24px auto (forçado com !important) */
    letter-spacing: -1px; /* Espaçamento entre letras: -1px */
    text-shadow: 0 4px 20px rgba(0,0,0,0.5); /* Sombra no texto: 0 4px 20px rgba(0,0,0,0.5) */
}
.hero-produto p {
    color: #cbd5e1 !important; /* Cor do texto: #cbd5e1 (forçado com !important) */
    font-size: 20px !important; /* Tamanho da fonte: 20px (forçado com !important) */
    font-weight: 400 !important; /* Peso normal da fonte (!important) */
    line-height: 1.6 !important; /* Altura da linha do texto: 1.6 (forçado com !important) */
    margin: 0 auto 40px auto !important; /* Margem: 0 auto 40px auto (forçado com !important) */
    max-width: 750px !important; /* Largura máxima: 750px (forçado com !important) */
}
.hero-buttons {
    display: flex; /* Ativa flexbox nos filhos diretos */
    gap: 16px; /* Espaço de 16px entre os itens */
    justify-content: center; /* Centraliza os filhos no eixo principal (geralmente horizontal) */
    align-items: center; /* Centraliza os filhos no eixo cruzado (geralmente vertical) */
}
.hero-buttons a {
    display: inline-flex; /* Ativa flexbox mantendo o elemento inline */
    align-items: center; /* Centraliza os filhos no eixo cruzado (geralmente vertical) */
    justify-content: center; /* Centraliza os filhos no eixo principal (geralmente horizontal) */
    height: 52px; /* Altura: 52px */
    padding-top: 0; /* Espaçamento interno superior: 0 */
    padding-right: 32px; /* Espaçamento interno direita: 32px */
    padding-bottom: 0; /* Espaçamento interno inferior: 0 */
    padding-left: 32px; /* Espaçamento interno esquerda: 32px */
    font-size: 16px; /* Tamanho da fonte: 16px */
    font-weight: 600; /* Peso semi-negrito */
    border-radius: 8px; /* Arredonda os cantos: 8px */
    text-decoration: none; /* Remove sublinhado/decoração do texto */
    transition: all 0.3s ease; /* Anima a mudança de propriedade ao longo do tempo: all 0.3s ease */
}
.hero-buttons .btn-primary {
    background-color: #00a0e3 !important; /* Cor de fundo: #00a0e3 (forçado com !important) */
    color: #FFFFFF !important; /* Cor do texto: #FFFFFF (forçado com !important) */
    border: 1px solid #00a0e3 !important; /* Borda: 1px solid #00a0e3 (forçado com !important) */
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3) !important; /* Sombra da caixa: 0 4px 15px rgba(0, 160, 227, 0.3) (forçado com !important) */
}
.hero-buttons .btn-primary:hover {
    background-color: #008cc6 !important; /* Cor de fundo: #008cc6 (forçado com !important) */
    box-shadow: 0 6px 20px rgba(0, 160, 227, 0.5) !important; /* Sombra da caixa: 0 6px 20px rgba(0, 160, 227, 0.5) (forçado com !important) */
    transform: translateY(-2px); /* Transformação (rotação, escala ou deslocamento): translateY(-2px) */
}
.hero-buttons .btn-secundary {
    background-color: transparent !important; /* Remove a cor de fundo (!important) */
    color: #FFFFFF !important; /* Cor do texto: #FFFFFF (forçado com !important) */
    border: 1px solid rgba(255, 255, 255, 0.3) !important; /* Borda: 1px solid rgba(255, 255, 255, 0.3) (forçado com !important) */
}
.hero-buttons .btn-secundary:hover {
    background-color: rgba(255, 255, 255, 0.05) !important; /* Cor de fundo: rgba(255, 255, 255, 0.05) (forçado com !important) */
    border-color: #FFFFFF !important; /* Cor da borda: #FFFFFF (forçado com !important) */
    transform: translateY(-2px); /* Transformação (rotação, escala ou deslocamento): translateY(-2px) */
}
.dor-produto {
    background-color: #f8fafc !important; /* Cor de fundo: #f8fafc (forçado com !important) */
    padding: 40px 20px 32px 20px !important; /* Espaçamento interno: 120px 20px (forçado com !important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    overflow: hidden !important; /* Esconde o que ultrapassar os limites do elemento (!important) */
}
.dor-produto .container {
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    max-width: 1200px !important; /* Largura máxima: 1200px (forçado com !important) */
    margin: 0 auto !important; /* Zera margem vertical e centraliza na horizontal (!important) */
}
.dor-grid {
    display: grid !important; /* Ativa grid nos filhos diretos (!important) */
    grid-template-columns: 1fr 1fr !important; /* Define as colunas do grid: 1fr 1fr (forçado com !important) */
    gap: 80px !important; /* Espaço de 80px entre os itens (!important) */
    align-items: flex-start !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
}
.dor-texto-esq {
    text-align: left !important; /* Alinha o texto à esquerda (!important) */
}
.dor-texto-esq .tag-secao {
    display: inline-block !important; /* Vira inline-block, fica na linha mas aceita largura/altura (!important) */
    background-color: #e0f2fe !important; /* Cor de fundo: #e0f2fe (forçado com !important) */
    color: #0284c7 !important; /* Cor do texto: #0284c7 (forçado com !important) */
    font-size: 13px !important; /* Tamanho da fonte: 13px (forçado com !important) */
    font-weight: 700 !important; /* Deixa o texto em negrito (!important) */
    text-transform: uppercase !important; /* Transforma o texto em maiúsculas (!important) */
    letter-spacing: 1.5px !important; /* Espaçamento entre letras: 1.5px (forçado com !important) */
    padding: 6px 16px !important; /* Espaçamento interno: 6px 16px (forçado com !important) */
    border-radius: 100px !important; /* Arredonda os cantos: 100px (forçado com !important) */
    margin-bottom: 24px !important; /* Margem inferior: 24px (forçado com !important) */
}
.dor-texto-esq h2 {
    color: #0f172a !important; /* Cor do texto: #0f172a (forçado com !important) */
    font-size: 46px !important; /* Tamanho da fonte: 46px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    line-height: 1.15 !important; /* Altura da linha do texto: 1.15 (forçado com !important) */
    margin: 0 0 24px 0 !important; /* Margem: 0 0 24px 0 (forçado com !important) */
    letter-spacing: -1.5px !important; /* Espaçamento entre letras: -1.5px (forçado com !important) */
}
.dor-texto-esq p {
    color: #475569 !important; /* Cor do texto: #475569 (forçado com !important) */
    font-size: 20px !important; /* Tamanho da fonte: 20px (forçado com !important) */
    font-weight: 400 !important; /* Peso normal da fonte (!important) */
    line-height: 1.8 !important; /* Altura da linha do texto: 1.8 (forçado com !important) */
    margin: 0 !important; /* Remove margem (!important) */
    max-width: 95% !important; /* Largura máxima: 95% (forçado com !important) */
}
.dor-visual-dir {
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
}
.dor-glow-bg {
    position: absolute !important; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative (!important) */
    width: 300px !important; /* Largura: 300px (forçado com !important) */
    height: 300px !important; /* Altura: 300px (forçado com !important) */
    background: radial-gradient(circle, rgba(0,160,227,0.15) 0%, rgba(248,250,252,0) 70%) !important; /* Fundo em gradiente: radial-gradient(circle, rgba(0,160,227,0.15) 0%, rgba(248,250,252,0) 70%) (forçado com !important) */
    border-radius: 50% !important; /* Arredonda os cantos: 50% (forçado com !important) */
    z-index: 1 !important; /* Camada de sobreposição (quanto maior, mais na frente): 1 (forçado com !important) */
    transform: translate(-30px, -30px) !important; /* Transformação (rotação, escala ou deslocamento): translate(-30px, -30px) (forçado com !important) */
}
.dor-card-flutuante {
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    z-index: 2 !important; /* Camada de sobreposição (quanto maior, mais na frente): 2 (forçado com !important) */
    background-color: #ffffff !important; /* Cor de fundo: #ffffff (forçado com !important) */
    padding: 48px 40px !important; /* Espaçamento interno: 48px 40px (forçado com !important) */
    border-radius: 16px !important; /* Arredonda os cantos: 16px (forçado com !important) */
    border: 1px solid #e2e8f0 !important; /* Borda: 1px solid #e2e8f0 (forçado com !important) */
    box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.08), 0 10px 15px -5px rgba(0, 0, 0, 0.03) !important; /* Sombra da caixa: 0 20px 40px -10px rgba(0, 0, 0, 0.08), 0 10px 15px -5px rgba(0, 0, 0, 0.03) (forçado com !important) */
}
.dor-card-flutuante .card-icon {
    width: 56px !important; /* Largura: 56px (forçado com !important) */
    height: 56px !important; /* Altura: 56px (forçado com !important) */
    background-color: #f0f9ff !important; /* Cor de fundo: #f0f9ff (forçado com !important) */
    border-radius: 12px !important; /* Arredonda os cantos: 12px (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    margin-bottom: 24px !important; /* Margem inferior: 24px (forçado com !important) */
}
.dor-card-flutuante .card-texto {
    color: #1e293b !important; /* Cor do texto: #1e293b (forçado com !important) */
    font-size: 24px !important; /* Tamanho da fonte: 24px (forçado com !important) */
    font-weight: 600 !important; /* Peso semi-negrito (!important) */
    line-height: 1.5 !important; /* Altura da linha do texto: 1.5 (forçado com !important) */
    margin: 0 0 32px 0 !important; /* Margem: 0 0 32px 0 (forçado com !important) */
    font-style: italic !important; /* Estilo da fonte: italic (forçado com !important) */
}
.dor-card-flutuante .card-rodape {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    border-top: 1px solid #f1f5f9 !important; /* Borda superior: 1px solid #f1f5f9 (forçado com !important) */
    padding-top: 16px !important; /* Espaçamento interno superior: 16px (forçado com !important) */
}
.card-rodape .card-autor {
    color: #00a0e3 !important; /* Cor do texto: #00a0e3 (forçado com !important) */
    font-weight: 700 !important; /* Deixa o texto em negrito (!important) */
    font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
    margin-bottom: 4px !important; /* Margem inferior: 4px (forçado com !important) */
}
.card-rodape .card-cargo {
    color: #64748b !important; /* Cor do texto: #64748b (forçado com !important) */
    font-size: 14px !important; /* Tamanho da fonte: 14px (forçado com !important) */
}
.solucao-produto {
    background: 
  radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
  radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
  radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
  #060913 !important; /* Fundo em gradiente: radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
  radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
  radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
  #060913 (forçado com !important) */
    padding: 120px 20px 40px 20px !important; /* Espaçamento interno: 120px 20px (forçado com !important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
}
.solucao-produto .container {
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    max-width: 1200px !important; /* Largura máxima: 1200px (forçado com !important) */
    margin: 0 auto !important; /* Zera margem vertical e centraliza na horizontal (!important) */
}
.solucao-cabecalho {
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    text-align: center !important; /* Centraliza o texto (!important) */
    max-width: 800px !important; /* Largura máxima: 800px (forçado com !important) */
    margin: 60px auto 100px auto !important; /* Margem: 60px auto 100px auto (forçado com !important) */
    padding: 0 !important; /* Remove espaçamento interno (!important) */
}
.solucao-cabecalho .tag-secao-dark {
    position: absolute !important; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative (!important) */
    top: -120px !important; /* Distância a partir do(a) topo: -120px (forçado com !important) */
    left: -250px !important; /* Distância a partir do(a) esquerda: -250px (forçado com !important) */
    white-space: nowrap !important; /* Impede quebra de linha do texto (!important) */
    background-color: rgba(56, 189, 248, 0.1) !important; /* Cor de fundo: rgba(56, 189, 248, 0.1) (forçado com !important) */
    color: #38bdf8 !important; /* Cor do texto: #38bdf8 (forçado com !important) */
    font-size: 12px !important; /* Tamanho da fonte: 12px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    text-transform: uppercase !important; /* Transforma o texto em maiúsculas (!important) */
    letter-spacing: 1px !important; /* Espaçamento entre letras: 1px (forçado com !important) */
    padding: 6px 16px !important; /* Espaçamento interno: 6px 16px (forçado com !important) */
    border-radius: 100px !important; /* Arredonda os cantos: 100px (forçado com !important) */
    border: 1px solid rgba(56, 189, 248, 0.3) !important; /* Borda: 1px solid rgba(56, 189, 248, 0.3) (forçado com !important) */
    margin: 0 !important; /* Remove margem (!important) */
}
.solucao-cabecalho h2 {
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
    font-size: 46px !important; /* Tamanho da fonte: 46px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    line-height: 1.2 !important; /* Altura da linha do texto: 1.2 (forçado com !important) */
    margin: -30px auto 24px auto !important; /* Margem: -30px auto 24px auto (forçado com !important) */
    letter-spacing: -1px !important; /* Espaçamento entre letras: -1px (forçado com !important) */
    text-align: center !important; /* Centraliza o texto (!important) */
}
.solucao-cabecalho p {
    color: #cbd5e1 !important; /* Cor do texto: #cbd5e1 (forçado com !important) */
    font-size: 20px !important; /* Tamanho da fonte: 20px (forçado com !important) */
    font-weight: 400 !important; /* Peso normal da fonte (!important) */
    line-height: 1.6 !important; /* Altura da linha do texto: 1.6 (forçado com !important) */
    margin: 0 auto !important; /* Zera margem vertical e centraliza na horizontal (!important) */
    text-align: center !important; /* Centraliza o texto (!important) */
    max-width: 720px !important; /* Largura máxima: 720px (forçado com !important) */
}
.solucao-grid {
    display: grid !important; /* Ativa grid nos filhos diretos (!important) */
    grid-template-columns: 1fr 1fr !important; /* Define as colunas do grid: 1fr 1fr (forçado com !important) */
    gap: 32px !important; /* Espaço de 32px entre os itens (!important) */
}
.solucao-card {
    background-color: #111827 !important; /* Cor de fundo: #111827 (forçado com !important) */
    border: 1px solid #1e293b !important; /* Borda: 1px solid #1e293b (forçado com !important) */
    border-radius: 16px !important; /* Arredonda os cantos: 16px (forçado com !important) */
    padding: 40px !important; /* Espaçamento interno: 40px (forçado com !important) */
    transition: all 0.4s ease !important; /* Anima a mudança de propriedade ao longo do tempo: all 0.4s ease (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    align-items: flex-start !important; /* Alinha os filhos no início do eixo cruzado (!important) */
}
.solucao-card:hover {
    background-color: #151e32 !important; /* Cor de fundo: #151e32 (forçado com !important) */
    border-color: #00a0e3 !important; /* Cor da borda: #00a0e3 (forçado com !important) */
    transform: translateY(-5px) !important; /* Transformação (rotação, escala ou deslocamento): translateY(-5px) (forçado com !important) */
    box-shadow: 0 10px 30px rgba(0, 160, 227, 0.1) !important; /* Sombra da caixa: 0 10px 30px rgba(0, 160, 227, 0.1) (forçado com !important) */
}
.solucao-card .icone-wrapper {
    width: 48px !important; /* Largura: 48px (forçado com !important) */
    height: 48px !important; /* Altura: 48px (forçado com !important) */
    background-color: rgba(0, 160, 227, 0.1) !important; /* Cor de fundo: rgba(0, 160, 227, 0.1) (forçado com !important) */
    border-radius: 12px !important; /* Arredonda os cantos: 12px (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    margin-bottom: 24px !important; /* Margem inferior: 24px (forçado com !important) */
    border: 1px solid rgba(0, 160, 227, 0.2) !important; /* Borda: 1px solid rgba(0, 160, 227, 0.2) (forçado com !important) */
}
.solucao-card h3 {
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
    font-size: 22px !important; /* Tamanho da fonte: 22px (forçado com !important) */
    font-weight: 700 !important; /* Deixa o texto em negrito (!important) */
    margin: 0 0 16px 0 !important; /* Margem: 0 0 16px 0 (forçado com !important) */
    line-height: 1.3 !important; /* Altura da linha do texto: 1.3 (forçado com !important) */
    text-align: left !important; /* Alinha o texto à esquerda (!important) */
}
.solucao-card p {
    color: #94a3b8 !important; /* Cor do texto: #94a3b8 (forçado com !important) */
    font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
    line-height: 1.7 !important; /* Altura da linha do texto: 1.7 (forçado com !important) */
    margin: 0 !important; /* Remove margem (!important) */
    text-align: left !important; /* Alinha o texto à esquerda (!important) */
}
.diferenciais-produto {
    background-color: #ffffff !important; /* Cor de fundo: #ffffff (forçado com !important) */
    padding: 40px 20px !important; /* Espaçamento interno: 120px 20px (forçado com !important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
}
.diferenciais-produto .container {
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    max-width: 1200px !important; /* Largura máxima: 1200px (forçado com !important) */
    margin: 0 auto !important; /* Zera margem vertical e centraliza na horizontal (!important) */
}
.dif-grid {
    display: grid !important; /* Ativa grid nos filhos diretos (!important) */
    grid-template-columns: 1fr 1.2fr !important; /* Define as colunas do grid: 1fr 1.2fr (forçado com !important) */
    gap: 80px !important; /* Espaço de 80px entre os itens (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
}
.dif-texto {
    text-align: left !important; /* Alinha o texto à esquerda (!important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    align-items: flex-start !important; /* Alinha os filhos no início do eixo cruzado (!important) */
}
.dif-texto .tag-secao-light {
    display: inline-block !important; /* Vira inline-block, fica na linha mas aceita largura/altura (!important) */
    background-color: #f1f5f9 !important; /* Cor de fundo: #f1f5f9 (forçado com !important) */
    color: #475569 !important; /* Cor do texto: #475569 (forçado com !important) */
    font-size: 14px !important; /* Tamanho da fonte: 14px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    text-transform: uppercase !important; /* Transforma o texto em maiúsculas (!important) */
    letter-spacing: 2px !important; /* Espaçamento entre letras: 2px (forçado com !important) */
    padding: 8px 20px !important; /* Espaçamento interno: 8px 20px (forçado com !important) */
    border-radius: 100px !important; /* Arredonda os cantos: 100px (forçado com !important) */
    margin-top: 0px; /* Margem superior: -120px */
    margin-bottom: 50px; /* Margem inferior: 50px */
}
.dif-texto h2 {
    color: #0f172a !important; /* Cor do texto: #0f172a (forçado com !important) */
    font-size: 42px !important; /* Tamanho da fonte: 42px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    line-height: 1.2 !important; /* Altura da linha do texto: 1.2 (forçado com !important) */
    margin: 0 0 24px 0 !important; /* Margem: 0 0 24px 0 (forçado com !important) */
    letter-spacing: -1px !important; /* Espaçamento entre letras: -1px (forçado com !important) */
}
.dif-texto p {
    color: #475569 !important; /* Cor do texto: #475569 (forçado com !important) */
    font-size: 20px !important; /* Tamanho da fonte: 20px (forçado com !important) */
    font-weight: 400 !important; /* Peso normal da fonte (!important) */
    line-height: 1.8 !important; /* Altura da linha do texto: 1.8 (forçado com !important) */
    margin: 0 !important; /* Remove margem (!important) */
}
.dif-checklist {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    gap: 20px !important; /* Espaço de 20px entre os itens (!important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
}
.check-item {
    background-color: #ffffff !important; /* Cor de fundo: #ffffff (forçado com !important) */
    border: 1px solid #e2e8f0 !important; /* Borda: 1px solid #e2e8f0 (forçado com !important) */
    border-left: 4px solid #e2e8f0 !important; /* Borda esquerda: 4px solid #e2e8f0 (forçado com !important) */
    border-radius: 12px !important; /* Arredonda os cantos: 12px (forçado com !important) */
    padding: 24px 32px !important; /* Espaçamento interno: 24px 32px (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    gap: 24px !important; /* Espaço de 24px entre os itens (!important) */
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important; /* Anima a mudança de propriedade ao longo do tempo: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) (forçado com !important) */
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.03) !important; /* Sombra da caixa: 0 4px 6px -1px rgba(0, 0, 0, 0.03) (forçado com !important) */
}
.check-item:hover {
    border-left: 4px solid #10b981 !important; /* Borda esquerda: 4px solid #10b981 (forçado com !important) */
    border-color: #cbd5e1 !important; /* Cor da borda: #cbd5e1 (forçado com !important) */
    transform: translateX(8px) !important; /* Transformação (rotação, escala ou deslocamento): translateX(8px) (forçado com !important) */
    box-shadow: 0 12px 24px -5px rgba(0, 0, 0, 0.08) !important; /* Sombra da caixa: 0 12px 24px -5px rgba(0, 0, 0, 0.08) (forçado com !important) */
}
.check-icon {
    flex-shrink: 0 !important; /* Fator de encolhimento do item flex: 0 (forçado com !important) */
    width: 48px !important; /* Largura: 48px (forçado com !important) */
    height: 48px !important; /* Altura: 48px (forçado com !important) */
    background-color: #10b981 !important; /* Cor de fundo: #10b981 (forçado com !important) */
    border-radius: 50% !important; /* Arredonda os cantos: 50% (forçado com !important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    box-shadow: 0 4px 12px rgba(16, 185, 129, 0.4) !important; /* Sombra da caixa: 0 4px 12px rgba(16, 185, 129, 0.4) (forçado com !important) */
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important; /* Anima a mudança de propriedade ao longo do tempo: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1) (forçado com !important) */
}
.check-icon svg {
    stroke: #ffffff !important; /* Cor do traço do SVG: #ffffff (forçado com !important) */
}
.check-item:hover .check-icon {
    transform: scale(1.1) !important; /* Transformação (rotação, escala ou deslocamento): scale(1.1) (forçado com !important) */
}
.check-conteudo {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    text-align: left !important; /* Alinha o texto à esquerda (!important) */
}
.check-conteudo h4 {
    color: #0f172a !important; /* Cor do texto: #0f172a (forçado com !important) */
    font-size: 20px !important; /* Tamanho da fonte: 20px (forçado com !important) */
    font-weight: 700 !important; /* Deixa o texto em negrito (!important) */
    margin: 0 0 4px 0 !important; /* Margem: 0 0 4px 0 (forçado com !important) */
}
.check-conteudo p {
    color: #64748b !important; /* Cor do texto: #64748b (forçado com !important) */
    font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
    line-height: 1.5 !important; /* Altura da linha do texto: 1.5 (forçado com !important) */
    margin: 0 !important; /* Remove margem (!important) */
}
.cta-produto {
    background-color: #0b0f19 !important; /* Cor de fundo: #0b0f19 (forçado com !important) */
    padding: 120px 20px !important; /* Espaçamento interno: 120px 20px (forçado com !important) */
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    overflow: hidden !important; /* Esconde o que ultrapassar os limites do elemento (!important) */
}
.cta-produto .container {
    width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    max-width: 900px !important; /* Largura máxima: 900px (forçado com !important) */
    margin: 0 auto !important; /* Zera margem vertical e centraliza na horizontal (!important) */
    position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    z-index: 2 !important; /* Camada de sobreposição (quanto maior, mais na frente): 2 (forçado com !important) */
}
.cta-conteudo {
    text-align: center !important; /* Centraliza o texto (!important) */
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
}
.cta-glow {
    position: absolute !important; /* Tira do fluxo e posiciona em relação ao pai mais próximo com position relative (!important) */
    top: 50% !important; /* Distância a partir do(a) topo: 50% (forçado com !important) */
    left: 50% !important; /* Distância a partir do(a) esquerda: 50% (forçado com !important) */
    transform: translate(-50%, -50%) !important; /* Transformação (rotação, escala ou deslocamento): translate(-50%, -50%) (forçado com !important) */
    width: 600px !important; /* Largura: 600px (forçado com !important) */
    height: 400px !important; /* Altura: 400px (forçado com !important) */
    background: radial-gradient(circle, rgba(0,160,227,0.15) 0%, rgba(11,15,25,0) 70%) !important; /* Fundo em gradiente: radial-gradient(circle, rgba(0,160,227,0.15) 0%, rgba(11,15,25,0) 70%) (forçado com !important) */
    z-index: -1 !important; /* Camada de sobreposição (quanto maior, mais na frente): -1 (forçado com !important) */
    border-radius: 50% !important; /* Arredonda os cantos: 50% (forçado com !important) */
}
.cta-conteudo h2 {
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
    font-size: 48px !important; /* Tamanho da fonte: 48px (forçado com !important) */
    font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
    line-height: 1.2 !important; /* Altura da linha do texto: 1.2 (forçado com !important) */
    margin: 0 0 24px 0 !important; /* Margem: 0 0 24px 0 (forçado com !important) */
    letter-spacing: -1.5px !important; /* Espaçamento entre letras: -1.5px (forçado com !important) */
}
.cta-conteudo p {
    color: #94a3b8 !important; /* Cor do texto: #94a3b8 (forçado com !important) */
    font-size: 22px !important; /* Tamanho da fonte: 22px (forçado com !important) */
    font-weight: 400 !important; /* Peso normal da fonte (!important) */
    line-height: 1.6 !important; /* Altura da linha do texto: 1.6 (forçado com !important) */
    margin: 0 0 48px 0 !important; /* Margem: 0 0 48px 0 (forçado com !important) */
    max-width: 700px !important; /* Largura máxima: 700px (forçado com !important) */
}
.btn-cta-primario {
    display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    gap: 12px !important; /* Espaço de 12px entre os itens (!important) */
    background-color: #00a0e3 !important; /* Cor de fundo: #00a0e3 (forçado com !important) */
    color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
    font-size: 18px !important; /* Tamanho da fonte: 18px (forçado com !important) */
    font-weight: 700 !important; /* Deixa o texto em negrito (!important) */
    text-decoration: none !important; /* Remove sublinhado/decoração do texto (!important) */
    padding: 20px 40px !important; /* Espaçamento interno: 20px 40px (forçado com !important) */
    border-radius: 100px !important; /* Arredonda os cantos: 100px (forçado com !important) */
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important; /* Anima a mudança de propriedade ao longo do tempo: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) (forçado com !important) */
    box-shadow: 0 10px 25px rgba(0, 160, 227, 0.4) !important; /* Sombra da caixa: 0 10px 25px rgba(0, 160, 227, 0.4) (forçado com !important) */
}
.btn-cta-primario:hover {
    background-color: #0284c7 !important; /* Cor de fundo: #0284c7 (forçado com !important) */
    transform: translateY(-3px) scale(1.02) !important; /* Transformação (rotação, escala ou deslocamento): translateY(-3px) scale(1.02) (forçado com !important) */
    box-shadow: 0 15px 35px rgba(0, 160, 227, 0.6) !important; /* Sombra da caixa: 0 15px 35px rgba(0, 160, 227, 0.6) (forçado com !important) */
}
.btn-cta-primario:hover svg {
    transform: translateX(4px) !important; /* Transformação (rotação, escala ou deslocamento): translateX(4px) (forçado com !important) */
    transition: transform 0.3s ease !important; /* Anima a mudança de propriedade ao longo do tempo: transform 0.3s ease (forçado com !important) */
}
.raio-strike-svg {
    position: fixed; /* Tira do fluxo normal e fixa na tela mesmo com scroll */
    top: 0; /* Distância a partir do(a) topo: 0 */
    left: 0; /* Distância a partir do(a) esquerda: 0 */
    width: 100vw; /* Largura de 100vw em relação à viewport */
    height: 100vh; /* Altura: 100vh */
    pointer-events: none; /* Impede clique e interação com o elemento */
    z-index: 999999; /* Camada de sobreposição (quanto maior, mais na frente): 999999 */
}
.raio-strike-path {
    fill: none; /* fill: none */
    stroke: #00ffff; /* Cor do traço do SVG: #00ffff */
    stroke-width: 4; /* Espessura do traço do SVG: 4 */
    filter: drop-shadow(0 0 10px #00ffff) drop-shadow(0 0 30px #00a0e3) drop-shadow(0 0 60px #ffffff); /* Filtro visual (blur, brilho, etc.): drop-shadow(0 0 10px #00ffff) drop-shadow(0 0 30px #00a0e3) drop-shadow(0 0 60px #ffffff) */
    animation: flashStrike 0.4s ease-out forwards; /* Aplica a animação: flashStrike 0.4s ease-out forwards */
}
/* Define os quadros da animação "flashStrike" */
@keyframes flashStrike {
    0% {
        opacity: 0; /* Transparência do elemento (0 invisível, 1 opaco): 0 */
        stroke-width: 12px; /* Espessura do traço do SVG: 12px */
        filter: brightness(3); /* Filtro visual (blur, brilho, etc.): brightness(3) */
    }
    10% {
        opacity: 1; /* Transparência do elemento (0 invisível, 1 opaco): 1 */
    }
    20% {
        opacity: 0; /* Transparência do elemento (0 invisível, 1 opaco): 0 */
    }
    30% {
        opacity: 1; /* Transparência do elemento (0 invisível, 1 opaco): 1 */
        stroke-width: 4px; /* Espessura do traço do SVG: 4px */
        filter: brightness(1); /* Filtro visual (blur, brilho, etc.): brightness(1) */
    }
    100% {
        opacity: 0; /* Transparência do elemento (0 invisível, 1 opaco): 0 */
    }
}
.raio-flash-overlay {
    position: fixed; /* Tira do fluxo normal e fixa na tela mesmo com scroll */
    top: 0; /* Distância a partir do(a) topo: 0 */
    left: 0; /* Distância a partir do(a) esquerda: 0 */
    width: 100vw; /* Largura de 100vw em relação à viewport */
    height: 100vh; /* Altura: 100vh */
    background: rgba(255, 255, 255, 0.85); /* Cor de fundo: rgba(255, 255, 255, 0.85) */
    pointer-events: none; /* Impede clique e interação com o elemento */
    z-index: 999998; /* Camada de sobreposição (quanto maior, mais na frente): 999998 */
    animation: tempestadeFlash 0.5s ease-out forwards; /* Aplica a animação: tempestadeFlash 0.5s ease-out forwards */
}
/* Define os quadros da animação "tempestadeFlash" */
@keyframes tempestadeFlash {
    0% {
        opacity: 1; /* Transparência do elemento (0 invisível, 1 opaco): 1 */
    }
    15% {
        opacity: 0; /* Transparência do elemento (0 invisível, 1 opaco): 0 */
    }
    25% {
        opacity: 0.9; /* Transparência do elemento (0 invisível, 1 opaco): 0.9 */
    }
    100% {
        opacity: 0; /* Transparência do elemento (0 invisível, 1 opaco): 0 */
    }
}
.logo-box.hide-logo {
    display: none !important; /* Esconde o elemento e tira do fluxo (!important) */
}



/* Regras aplicadas em telas a partir de 1400px (desktop) */
@media (min-width: 1400px) {
    .background-nav .container {
        max-width: 1850px !important; /* Largura máxima: 1850px (forçado com !important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    }
    .galactix-cta-section {
        margin-top: 0 !important; /* Margem superior: 0 (forçado com !important) */
        margin-bottom: 0 !important; /* Margem inferior: 0 (forçado com !important) */
        padding: 0 !important; /* Remove espaçamento interno (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        overflow-x: hidden !important; /* Esconde rolagem horizontal (evita scroll lateral) (!important) */
    }
    .cta-banner-container {
        max-width: 100% !important; /* Não deixa ultrapassar 100% do pai (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        border-radius: 0 !important; /* Arredonda os cantos: 0 (forçado com !important) */
        padding: 120px 20px !important; /* Espaçamento interno: 120px 20px (forçado com !important) */
        margin: 0 !important; /* Remove margem (!important) */
    }
    .page-sobre .container-sobre {
        max-width: 1480px !important; /* Largura máxima: 1480px (forçado com !important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        padding: 0 60px !important; /* Espaçamento interno: 0 60px (forçado com !important) */
    }
    .sobre-bento-manifesto .bento-grid {
        display: grid !important; /* Ativa grid nos filhos diretos (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        max-width: none !important; /* Largura máxima: none (forçado com !important) */
        grid-template-columns: 1.6fr 1fr !important; /* Define as colunas do grid: 1.6fr 1fr (forçado com !important) */
        gap: 40px !important; /* Espaço de 40px entre os itens (!important) */
    }
    .sobre-arquitetura {
        margin-top: 25px !important; /* Margem superior: 25px (forçado com !important) */
    }
    .sobre-bento-manifesto .bento-grid > div {
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        height: 100% !important; /* Ocupa 100% da altura do pai (!important) */
    }
    .bento-large, .tech-box {
        padding: 64px !important; /* Espaçamento interno: 64px (forçado com !important) */
        min-height: 520px !important; /* Altura mínima: 520px (forçado com !important) */
    }
    .bento-large h2 {
        font-size: 46px !important; /* Tamanho da fonte: 46px (forçado com !important) */
        line-height: 1.2 !important; /* Altura da linha do texto: 1.2 (forçado com !important) */
        margin-bottom: 32px !important; /* Margem inferior: 32px (forçado com !important) */
        letter-spacing: -0.5px !important; /* Espaçamento entre letras: -0.5px (forçado com !important) */
    }
    .bento-large p {
        font-size: 18px !important; /* Tamanho da fonte: 18px (forçado com !important) */
        line-height: 1.8 !important; /* Altura da linha do texto: 1.8 (forçado com !important) */
        margin-bottom: 24px !important; /* Margem inferior: 24px (forçado com !important) */
    }
    .tech-box h3 {
        font-size: 30px !important; /* Tamanho da fonte: 30px (forçado com !important) */
        margin-bottom: 20px !important; /* Margem inferior: 20px (forçado com !important) */
    }
    .tech-box p {
        font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
        line-height: 1.7 !important; /* Altura da linha do texto: 1.7 (forçado com !important) */
    }
    .tech-box svg {
        width: 64px !important; /* Largura: 64px (forçado com !important) */
        height: 64px !important; /* Altura: 64px (forçado com !important) */
        margin-bottom: 32px !important; /* Margem inferior: 32px (forçado com !important) */
    }
    .container-contato {
        max-width: 1480px !important; /* Largura máxima: 1480px (forçado com !important) */
        padding: 0 60px !important; /* Espaçamento interno: 0 60px (forçado com !important) */
    }
    .split-contato-grid {
        gap: 64px !important; /* Espaço de 64px entre os itens (!important) */
    }
    .contato-info-column, .form-main-box {
        padding: 64px !important; /* Espaçamento interno: 64px (forçado com !important) */
    }
    .contato-header-center {
        max-width: 900px !important; /* Largura máxima: 900px (forçado com !important) */
    }
    .contato-header-center .hero-title {
        font-size: 64px !important; /* Tamanho da fonte: 64px (forçado com !important) */
        margin-bottom: 24px !important; /* Margem inferior: 24px (forçado com !important) */
    }
    .contato-header-center .hero-subtitle {
        font-size: 22px !important; /* Tamanho da fonte: 22px (forçado com !important) */
    }
    .col-title {
        font-size: 40px !important; /* Tamanho da fonte: 40px (forçado com !important) */
        margin-bottom: 16px !important; /* Margem inferior: 16px (forçado com !important) */
    }
    .col-description {
        font-size: 18px !important; /* Tamanho da fonte: 18px (forçado com !important) */
        line-height: 1.8 !important; /* Altura da linha do texto: 1.8 (forçado com !important) */
        margin-bottom: 48px !important; /* Margem inferior: 48px (forçado com !important) */
    }
    .canal-icon {
        width: 56px !important; /* Largura: 56px (forçado com !important) */
        height: 56px !important; /* Altura: 56px (forçado com !important) */
    }
    .canal-texts span {
        font-size: 15px !important; /* Tamanho da fonte: 15px (forçado com !important) */
    }
    .canal-texts strong {
        font-size: 18px !important; /* Tamanho da fonte: 18px (forçado com !important) */
    }
    .form-title {
        font-size: 32px !important; /* Tamanho da fonte: 32px (forçado com !important) */
        margin-bottom: 12px !important; /* Margem inferior: 12px (forçado com !important) */
    }
    .form-subtitle {
        font-size: 18px !important; /* Tamanho da fonte: 18px (forçado com !important) */
        line-height: 1.8 !important; /* Altura da linha do texto: 1.8 (forçado com !important) */
        margin-bottom: 40px !important; /* Margem inferior: 40px (forçado com !important) */
    }
    .galactix-form {
        gap: 24px !important; /* Espaço de 24px entre os itens (!important) */
    }
    .input-group input, .input-group select, .input-group textarea {
        padding: 20px !important; /* Espaçamento interno: 20px (forçado com !important) */
        font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
    }
    .galactix-form .btn-modern-primary {
        padding: 20px 40px !important; /* Espaçamento interno: 20px 40px (forçado com !important) */
        font-size: 18px !important; /* Tamanho da fonte: 18px (forçado com !important) */
    }
    .full-width-footer-card {
        width: 100vw !important; /* Largura de 100vw em relação à viewport (!important) */
        position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
        /*left: 50% !important;  Distância a partir do(a) esquerda: 50% (forçado com !important) */
        /*right: 50% !important; /* Distância a partir do(a) direita: 50% (forçado com !important) */
        /*margin-left: -50vw !important; /* Margem esquerda: -50vw (forçado com !important) */
        /*margin-right: -50vw !important; /* Margem direita: -50vw (forçado com !important) */
       
        border-radius: 0 !important; /* Arredonda os cantos: 0 (forçado com !important) */
        border: none !important; /* Remove a borda (!important) */
        padding: 60px 20px !important; /* Espaçamento interno: 60px 20px (forçado com !important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
        margin-bottom: 0px !important; /* Margem inferior: -140px (forçado com !important) */
                min-height: 250px !important;
    
    }
    .partner-header-row {
        max-width: 1100px !important; /* Largura máxima: 1100px (forçado com !important) */
        margin: 0 auto !important; /* Zera margem vertical e centraliza na horizontal (!important) */
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        justify-content: space-between !important; /* Espalha os filhos com espaço igual entre eles (!important) */
        align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
        flex-wrap: wrap !important; /* Permite os itens quebrarem para a linha de baixo (!important) */
        gap: 32px !important; /* Espaço de 32px entre os itens (!important) */
    }
    .partner-text-left h3 {
        color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
        font-size: 32px !important; /* Tamanho da fonte: 32px (forçado com !important) */
        font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
        margin-bottom: 12px !important; /* Margem inferior: 12px (forçado com !important) */
        letter-spacing: -0.5px !important; /* Espaçamento entre letras: -0.5px (forçado com !important) */
    }
    .partner-text-left p {
        color: #94a3b8 !important; /* Cor do texto: #94a3b8 (forçado com !important) */
        font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
        line-height: 1.6 !important; /* Altura da linha do texto: 1.6 (forçado com !important) */
    }
    .badge-partner {
        background: rgba(255, 255, 255, 0.1) !important; /* Cor de fundo: rgba(255, 255, 255, 0.1) (forçado com !important) */
        color: #e2e8f0 !important; /* Cor do texto: #e2e8f0 (forçado com !important) */
        padding: 6px 14px !important; /* Espaçamento interno: 6px 14px (forçado com !important) */
        border-radius: 20px !important; /* Arredonda os cantos: 20px (forçado com !important) */
        font-size: 12px !important; /* Tamanho da fonte: 12px (forçado com !important) */
        font-weight: 700 !important; /* Deixa o texto em negrito (!important) */
        text-transform: uppercase !important; /* Transforma o texto em maiúsculas (!important) */
        letter-spacing: 1.5px !important; /* Espaçamento entre letras: 1.5px (forçado com !important) */
        display: inline-block !important; /* Vira inline-block, fica na linha mas aceita largura/altura (!important) */
        margin-bottom: 20px !important; /* Margem inferior: 20px (forçado com !important) */
    }
    .partner-action-right .btn-modern-outline {
        border: 2px solid #00a0e3 !important; /* Borda: 2px solid #00a0e3 (forçado com !important) */
        color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
        padding: 14px 28px !important; /* Espaçamento interno: 14px 28px (forçado com !important) */
        border-radius: 8px !important; /* Arredonda os cantos: 8px (forçado com !important) */
        text-decoration: none !important; /* Remove sublinhado/decoração do texto (!important) */
        font-weight: 600 !important; /* Peso semi-negrito (!important) */
        transition: all 0.3s ease !important; /* Anima a mudança de propriedade ao longo do tempo: all 0.3s ease (forçado com !important) */
        display: inline-block !important; /* Vira inline-block, fica na linha mas aceita largura/altura (!important) */
        white-space: nowrap !important; /* Impede quebra de linha do texto (!important) */
    }
    .partner-action-right .btn-modern-outline:hover {
        background: #00a0e3 !important; /* Cor de fundo: #00a0e3 (forçado com !important) */
        transform: translateY(-2px) !important; /* Transformação (rotação, escala ou deslocamento): translateY(-2px) (forçado com !important) */
        box-shadow: 0 4px 15px rgba(0, 160, 227, 0.4) !important; /* Sombra da caixa: 0 4px 15px rgba(0, 160, 227, 0.4) (forçado com !important) */
    }
    main .page-contato, .container-contato {
        padding-bottom: 0 !important; /* Espaçamento interno inferior: 0 (forçado com !important) */
        margin-bottom: 0 !important; /* Margem inferior: 0 (forçado com !important) */
    }
    footer {
        margin-top: 0 !important; /* Margem superior: 0 (forçado com !important) */
        position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
        z-index: 10 !important; /* Camada de sobreposição (quanto maior, mais na frente): 10 (forçado com !important) */
    }
}
/* Regras aplicadas em telas de até 992px (mobile/tablet) */
@media (max-width: 992px) {
    body {
        padding-top: 95px !important; /* Espaçamento interno superior: 105px — igual à altura real do header fixo (40px de top + 65px do header-mob), pra não sobrar fresta (forçado com !important) */
    }
    .container {
        width: 100% !important; /* Ocupa 100% da largura do pai — sem isso o container ficava preso nos 1200px fixos da regra original e cortava tudo (forçado com !important) */
        max-width: 100vw !important; /* Não deixa ultrapassar a largura da tela, como segurança extra (forçado com !important) */
        padding: 0 20px !important; /* Espaçamento interno: 0 20px (forçado com !important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
    }
    html, body {
        overflow-x: hidden !important; /* Esconde rolagem horizontal — rede de segurança pra qualquer outro elemento de largura fixa que ainda exista nessa faixa (forçado com !important) */
        max-width: 100% !important; /* Não deixa ultrapassar 100% do pai (forçado com !important) */
    }
    header, .header-mob {
        z-index: 9999999 !important; /* Camada de sobreposição (quanto maior, mais na frente): 9999999 (forçado com !important) */
        pointer-events: auto !important; /* Eventos de ponteiro: auto (forçado com !important) */
    }
    .header-mob .menu {
        position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
        z-index: 9999999 !important; /* Camada de sobreposição (quanto maior, mais na frente): 9999999 (forçado com !important) */
        pointer-events: auto !important; /* Eventos de ponteiro: auto (forçado com !important) */
        cursor: pointer !important; /* Muda o cursor para indicar que é clicável (!important) */
    }
    main, .page-contato {
        position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
        z-index: 1 !important; /* Camada de sobreposição (quanto maior, mais na frente): 1 (forçado com !important) */
    }
    .background-nav {
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
        position: fixed !important; /* Tira do fluxo normal e fixa na tela mesmo com scroll (!important) */
        top: 95px !important; /* Distância a partir do(a) topo: 105px — desce o menu pra começar exatamente onde o header termina (40px + 65px), sem ficar por baixo dele (forçado com !important) */
        left: 0 !important; /* Distância a partir do(a) esquerda: 0 (forçado com !important) */
        right: auto !important; /* Distância a partir do(a) direita: auto (forçado com !important) */
        width: 320px !important; /* Largura: 320px (forçado com !important) */
        max-width: 85vw !important; /* Largura máxima: 85vw (forçado com !important) */
        height: calc(100vh - 95px) !important; /* Altura: calc(100vh - 105px) — ajustada pro mesmo valor do top, pra terminar exatamente no fim da tela (forçado com !important) */
        background-color: #ffffff !important; /* Cor de fundo: #ffffff (forçado com !important) */
        box-shadow: 8px 0 25px rgba(0, 0, 0, 0.15) !important; /* Sombra da caixa: 8px 0 25px rgba(0, 0, 0, 0.15) (forçado com !important) */
        z-index: 99999 !important; /* Camada de sobreposição (quanto maior, mais na frente): 99999 (forçado com !important) */
        padding-top: 0 !important; /* Espaçamento interno superior: 0 (forçado com !important) */
        margin-top: 0 !important; /* Margem superior: 0 (forçado com !important) */
        overflow-y: auto !important; /* Rolagem vertical: auto (forçado com !important) */
        transform: translateX(-100%) !important; /* Transformação (rotação, escala ou deslocamento): translateX(-100%) (forçado com !important) */
        transition: transform 0.60s cubic-bezier(0.16, 1, 0.3, 1) !important; /* Anima a mudança de propriedade ao longo do tempo: transform 0.60s cubic-bezier(0.16, 1, 0.3, 1) (forçado com !important) */
    }
    .background-nav.menu-aberto {
        transform: translateX(0) !important; /* Transformação (rotação, escala ou deslocamento): translateX(0) (forçado com !important) */
    }
    .background-nav .container {
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        max-width: 100% !important; /* Não deixa ultrapassar 100% do pai (!important) */
        padding: 0 !important; /* Remove espaçamento interno (!important) */
        margin: 0 !important; /* Remove margem (!important) */
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
        height: auto !important; /* Altura automática, ajusta ao conteúdo (!important) */
    }
    ul.navs {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        align-items: stretch !important; /* Estica os filhos para preencher o eixo cruzado (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        height: auto !important; /* Altura automática, ajusta ao conteúdo (!important) */
        margin: 0 !important; /* Remove margem (!important) */
        padding: 0 !important; /* Remove espaçamento interno (!important) */
    }
    ul.navs > li:nth-child(1) {
        display: none !important; /* Esconde o elemento e tira do fluxo (!important) */
    }
    ul.navs > li {
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        height: auto !important; /* Altura automática, ajusta ao conteúdo (!important) */
        border-bottom: 1px solid #f1f5f9 !important; /* Borda inferior: 1px solid #f1f5f9 (forçado com !important) */
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        align-items: flex-start !important; /* Alinha os filhos no início do eixo cruzado (!important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
    }
    ul.navs > li > a {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
        justify-content: flex-start !important; /* Alinha os filhos no início do eixo principal (!important) */
        padding: 16px 24px !important; /* Espaçamento interno: 16px 24px (forçado com !important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        height: auto !important; /* Altura automática, ajusta ao conteúdo (!important) */
        color: #334155 !important; /* Cor do texto: #334155 (forçado com !important) */
        font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
    }
    .submenu-1 {
        display: none !important; /* Esconde o elemento e tira do fluxo (!important) */
        position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        background: #f8fafc !important; /* Cor de fundo: #f8fafc (forçado com !important) */
        padding: 4px 0 !important; /* Espaçamento interno: 4px 0 (forçado com !important) */
        margin: 0 !important; /* Remove margem (!important) */
        box-shadow: none !important; /* Remove sombra (!important) */
        border: none !important; /* Remove a borda (!important) */
        border-radius: 0 !important; /* Arredonda os cantos: 0 (forçado com !important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
    }
    .submenu-1::before {
        display: none !important; /* Esconde o elemento e tira do fluxo (!important) */
    }
    ul.navs > li:hover .submenu-1 {
        display: none !important; /* Esconde o elemento e tira do fluxo (!important) */
    }
    ul.navs > li.ativo .submenu-1 {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    }
    .submenu-1 a {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        padding: 12px 40px !important; /* Espaçamento interno: 12px 40px (forçado com !important) */
        text-align: left !important; /* Alinha o texto à esquerda (!important) */
        color: #475569 !important; /* Cor do texto: #475569 (forçado com !important) */
        font-size: 15px !important; /* Tamanho da fonte: 15px (forçado com !important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
        justify-content: flex-start !important; /* Alinha os filhos no início do eixo principal (!important) */
        font-weight: 500 !important; /* Peso da fonte: 500 (forçado com !important) */
        transform: none !important; /* Transformação (rotação, escala ou deslocamento): none (forçado com !important) */
    }
    .mega-menu-solucoes {
        display: none !important; /* Esconde o elemento e tira do fluxo (!important) */
        position: relative !important; /* Mantém no fluxo normal (!important) */
        top: auto !important; /* Remove posicionamento do desktop (!important) */
        left: auto !important; /* Remove posicionamento do desktop (!important) */
        transform: none !important; /* Remove centralização do desktop (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        min-width: 0 !important; /* Remove largura mínima do desktop (!important) */
        max-width: none !important; /* Remove limite de largura do desktop (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        background: #f8fafc !important; /* Cor de fundo (forçado com !important) */
        box-shadow: none !important; /* Remove sombra (!important) */
        border: none !important; /* Remove a borda (!important) */
        border-radius: 0 !important; /* Arredonda os cantos: 0 (forçado com !important) */
        padding: 4px 0 16px !important; /* Espaçamento interno (forçado com !important) */
        box-sizing: border-box !important; /* Padding e borda contam dentro da largura/altura (!important) */
    }
    ul.navs > li:hover .mega-menu-solucoes {
        display: none !important; /* No mobile a abertura é por clique, não hover (!important) */
    }
    ul.navs > li.ativo .mega-menu-solucoes {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
    }
    .mega-menu-columns {
        flex-direction: column !important; /* Empilha as colunas na vertical (!important) */
        gap: 0 !important; /* Remove espaço entre colunas (!important) */
        padding: 0 24px !important; /* Espaçamento interno lateral (forçado com !important) */
    }
    .mega-menu-col {
        min-width: 0 !important; /* Remove largura mínima do desktop (!important) */
        margin-bottom: 14px !important; /* Espaço entre grupos (forçado com !important) */
    }
    .mega-menu-col-title {
        margin-bottom: 6px !important; /* Margem inferior (forçado com !important) */
    }
    .mega-menu-col a {
        padding: 8px 0 !important; /* Espaçamento interno (forçado com !important) */
        white-space: normal !important; /* Permite quebra de linha no mobile (!important) */
    }
    .mega-menu-promo {
        margin: 4px 24px 0 !important; /* Margem (forçado com !important) */
        flex: none !important; /* Remove largura fixa do desktop (!important) */
    }
    ul.navs > li.ul-end {
        margin-left: 0 !important; /* Margem esquerda: 0 (forçado com !important) */
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        padding: 24px !important; /* Espaçamento interno: 24px (forçado com !important) */
        gap: 12px !important; /* Espaço de 12px entre os itens (!important) */
        background: #ffffff !important; /* Cor de fundo: #ffffff (forçado com !important) */
    }
    li.ul-end a.glx-access {
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
        justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    }

    .header-top {
        width: 100% !important;
        height: 30px !important; /* Altura exata da barra */
        z-index: 9999999 !important; /* Camada máxima */
        /* position/top removidos: o <header> pai já é fixed e empilha os filhos em coluna, então header-top não precisa se fixar sozinho */
    }

    .header-mob {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        justify-content: space-between !important; /* Espalha os filhos com espaço igual entre eles (!important) */
        align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        height: 65px !important; /* Altura: 65px (forçado com !important) */
        background: #ffffff !important; /* Cor de fundo: #ffffff (forçado com !important) */
        padding: 0 20px !important; /* Espaçamento interno: 0 20px (forçado com !important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
        border-bottom: 1px solid #e2e8f0 !important; /* Borda inferior: 1px solid #e2e8f0 (forçado com !important) */
        z-index: 9999999 !important;
        /* position/top removidos: estava fixo em top:30px "no chute" e não acompanhava quando header-top sumia no breakpoint de 768px, criando o vão */
    }
    .header-mob img {
        height: auto !important; /* Altura: 28px (forçado com !important) */
        width: 160px !important; /* Largura automática, ajusta ao conteúdo (!important) */
        object-fit: contain !important;
    }
    .header-mob .menu {
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
        width: 30px !important; /* Largura: 30px (forçado com !important) */
        height: 30px !important; /* Altura: 30px (forçado com !important) */
        transform: translateY(-18px) !important; /* Transformação (rotação, escala ou deslocamento): translateY(-34px) (forçado com !important) */
        margin: 0 !important; /* Remove margem (!important) */
        padding: 0 !important; /* Remove espaçamento interno (!important) */
        background-color: transparent !important; /* Remove a cor de fundo (!important) */
        border: none !important; /* Remove a borda (!important) */
        box-shadow: none !important; /* Remove sombra (!important) */
        outline: none !important; /* Remove o contorno de foco (!important) */
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='2' y='4' width='20' height='2.5' rx='1.25' fill='%230d1117'/%3E%3Crect x='2' y='10.75' width='20' height='2.5' rx='1.25' fill='%230d1117'/%3E%3Crect x='2' y='17.5' width='20' height='2.5' rx='1.25' fill='%230d1117'/%3E%3C/svg%3E") !important; /* Imagem de fundo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='2' y='4' width='20' height='2.5' rx='1.25' fill='%230d1117'/%3E%3Crect x='2' y='10.75' width='20' height='2.5' rx='1.25' fill='%230d1117'/%3E%3Crect x='2' y='17.5' width='20' height='2.5' rx='1.25' fill='%230d1117'/%3E%3C/svg%3E") (forçado com !important) */
        background-repeat: no-repeat !important; /* Repetição da imagem de fundo: no-repeat (forçado com !important) */
        background-position: center center !important; /* Posição da imagem de fundo: center center (forçado com !important) */
        background-size: contain !important; /* Tamanho da imagem de fundo: Imagem cabe inteira dentro do espaço (!important) */
    }
    .header-mob .menu * {
        display: none !important; /* Esconde o elemento e tira do fluxo (!important) */
    }
    .header-mob .menu::before, .header-mob .menu::after {
        display: none !important; /* Esconde o elemento e tira do fluxo (!important) */
        content: none !important; /* Conteúdo inserido via CSS: none (forçado com !important) */
        background: transparent !important; /* Remove a cor de fundo (!important) */
        border: none !important; /* Remove a borda (!important) */
        height: 0 !important; /* Altura: 0 (forçado com !important) */
        width: 0 !important; /* Largura: 0 (forçado com !important) */
    }
    .hero-title {
        font-size: 42px; /* Tamanho da fonte: 42px */
    }
    .banner-textos-topo .texto-1 {
        font-size: 38px !important; /* Tamanho da fonte: 38px (forçado com !important) */
        line-height: 1.2 !important; /* Altura da linha do texto: 1.2 (forçado com !important) */
    }
    .banner-textos-topo h3 {
        font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
        line-height: 1.5 !important; /* Altura da linha do texto: 1.5 (forçado com !important) */
    }
    .bento-grid {
        grid-template-columns: 1fr !important; /* Define as colunas do grid: 1fr (forçado com !important) */
        gap: 24px; /* Espaço de 24px entre os itens */
    }
    .bento-large {
        grid-column: span 1; /* Define em quais colunas o item começa e termina: span 1 */
    }
    .bento-card, .tech-box {
        padding: 32px !important; /* Espaçamento interno: 32px (forçado com !important) */
        height: auto !important; /* Altura automática, ajusta ao conteúdo (!important) */
    }
    .bento-card p, .bento-large p, .texto-justificado, .card-tecnologia p {
        text-align: left !important; /* Alinha o texto à esquerda (!important) */
        line-height: 1.6 !important; /* Altura da linha do texto: 1.6 (forçado com !important) */
        font-size: 15px !important; /* Tamanho da fonte: 15px (forçado com !important) */
    }
    .bento-card h2, #json-bento-titulo {
        font-size: 28px !important; /* Tamanho da fonte: 28px (forçado com !important) */
        line-height: 1.3 !important; /* Altura da linha do texto: 1.3 (forçado com !important) */
        margin-bottom: 20px !important; /* Margem inferior: 20px (forçado com !important) */
        text-align: left !important; /* Alinha o texto à esquerda (!important) */
    }

    .sub-video {
        position: absolute !important;
        top: 72% !important; /* Empurra o bloco inteiro para baixo (ajuste este valor se quiser mais alto/baixo) */
        left: 50% !important; /* Centraliza no eixo X */
        right: auto !important; /* Anula o distanciamento da direita que vinha do desktop */
        transform: translate(-50%, -50%) !important; /* Puxa o próprio eixo da div para o centro exato */
        width: 90% !important; /* Impede que textos encostem na beira da tela */
        display: flex !important; /* Ativa flexbox interno para alinhar texto e botão */
        flex-direction: column !important; /* Empilha um em cima do outro */
        align-items: center !important; /* Centraliza tudo no meio */
        justify-content: center !important;
        z-index: 10 !important; /* Garante que fique acima da tag <video> */
    }
    .subtitle-video {
        font-size: 22px !important; /* Reduz o letreiro gigante de 35pt para caber na tela pequena */
        line-height: 1.3 !important; /* Melhora o respiro entre as linhas do texto */
        text-align: center !important; /* Centraliza o texto */
        width: 100% !important;
        margin: 0 0 16px 0 !important; /* Abre 16px de distância entre a frase e o botão */
    }

    .subtitle-button {
        width: auto !important; /* Anula a largura engessada de 240px do desktop */
        padding: 12px 28px !important; /* Estofa o botão para um clique perfeito no touch (UX) */
        font-size: 14px !important; /* Reduz discretamente a fonte do botão */
        margin: 0 !important; /* Limpa margens perdidas */
    }    

    .grid-3-col, .grid-numeros-premium, .sobre-grid-4 {
        grid-template-columns: 1fr; /* Define as colunas do grid: 1fr */
        gap: 32px; /* Espaço de 32px entre os itens */
    }
    .split-contato-grid {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        gap: 24px !important; /* Espaço de 24px entre os itens (!important) */
    }
    .galactix-form, .input-row-2 {
        grid-template-columns: 1fr; /* Define as colunas do grid: 1fr */
        gap: 16px; /* Espaço de 16px entre os itens */
    }
    .galactix-form .btn-modern-primary {
        margin-top: 24px; /* Margem superior: 24px */
    }
    .partner-header-row {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        text-align: center !important; /* Centraliza o texto (!important) */
        gap: 20px !important; /* Espaço de 20px entre os itens (!important) */
    }
    .partner-text-left {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
        max-width: 100%; /* Não deixa ultrapassar 100% do pai */
    }
    .partner-action-right {
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    }
    .full-width-footer-card {
        padding: 24px !important; /* Espaçamento interno: 24px (forçado com !important) */
        margin-top: 24px !important; /* Margem superior: 24px (forçado com !important) */
    }
    main.page-sobre {
        padding-top: 0 !important; /* Espaçamento interno superior: 0 (forçado com !important) */
        margin-top: 0 !important; /* Margem superior: 0 (forçado com !important) */
    }
    .container-sobre.wrapper-hero {
        padding-top: 15px !important; /* Espaçamento interno superior: 15px (forçado com !important) */
        margin-top: 0 !important; /* Margem superior: 0 (forçado com !important) */
    }
    .sobre-bento-manifesto {
        padding-top: 0 !important; /* Espaçamento interno superior: 0 (forçado com !important) */
        margin-top: 0 !important; /* Margem superior: 0 (forçado com !important) */
    }
    .story-grid {
        grid-template-columns: 1fr !important; /* Define as colunas do grid: 1fr (forçado com !important) */
        gap: 40px !important; /* Espaço de 40px entre os itens (!important) */
    }
    .integration-header .badge-max {
        transform: translate(0, 0) !important; /* Transformação (rotação, escala ou deslocamento): translate(0, 0) (forçado com !important) */
        align-self: center !important; /* Sobrescreve o alinhamento deste item no eixo cruzado: center (forçado com !important) */
        margin-bottom: 16px !important; /* Margem inferior: 16px (forçado com !important) */
    }
    .integration-header h2 {
        font-size: 36px !important; /* Tamanho da fonte: 36px (forçado com !important) */
    }
    .final-cta-content .badge-dark-outline {
        position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
        top: 0 !important; /* Distância a partir do(a) topo: 0 (forçado com !important) */
        left: 0 !important; /* Distância a partir do(a) esquerda: 0 (forçado com !important) */
        align-self: center !important; /* Sobrescreve o alinhamento deste item no eixo cruzado: center (forçado com !important) */
        margin-bottom: 24px !important; /* Margem inferior: 24px (forçado com !important) */
    }
    #json-deepdata-descricao br {
        display: none !important; /* Esconde o elemento e tira do fluxo (!important) */
    }
    #json-deepdata-titulo, #json-intro-titulo {
        text-align: center !important; /* Centraliza o texto (!important) */
        font-size: 28px !important; /* Tamanho da fonte: 28px (forçado com !important) */
        line-height: 1.25 !important; /* Altura da linha do texto: 1.25 (forçado com !important) */
        margin-top: 16px !important; /* Margem superior: 16px (forçado com !important) */
        margin-bottom: 16px !important; /* Margem inferior: 16px (forçado com !important) */
        text-wrap: balance !important; /* Distribui o texto de forma mais equilibrada entre as linhas (!important) */
    }
    #json-deepdata-descricao, #json-intro-subtitulo {
        text-align: left !important; /* Alinha o texto à esquerda (!important) */
        font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
        line-height: 1.65 !important; /* Altura da linha do texto: 1.65 (forçado com !important) */
        color: #475569 !important; /* Cor do texto: #475569 (forçado com !important) */
        margin-bottom: 32px !important; /* Margem inferior: 32px (forçado com !important) */
        text-wrap: pretty !important; /* pretty (!important) */
    }

    /* 1. Reduz o espaçamento inferior da seção de imersão/métricas */
    .sobre-imersao {
        padding-bottom: 24px !important;
        margin-bottom: 0 !important;
    }

    /* 2. Neutraliza margens e paddings inferiores da caixa do card */
    .imersao-box {
        margin-bottom: 0 !important;
        padding-bottom: 24px !important;
    }

    /* 3. Remove espaçamentos extras da tag principal da página */
    main.page-sobre {
        padding-bottom: 0 !important;
        margin-bottom: 0 !important;
    }

    /* 4. Remove margens residuais da grade de números */
    .grid-numeros-premium {
        margin-bottom: 0 !important;
    }

    /* 5. Remove o padding de 120px da seção dos cards no celular */
    .sobre-arquitetura {
        padding-bottom: 24px !important;
        margin-top: 32px !important;
    }

}


/* Regras aplicadas em telas de até 768px (mobile/tablet) */
@media (max-width: 768px) {
    html, body {
        overflow-x: hidden !important; 
        width: 100vw !important; 
        max-width: 100% !important; 
        margin: 0 !important; 
        padding: 0 !important; 
    }
    *, *::before, *::after {
        box-sizing: border-box !important; 
    }

    p, h1, h2, h3, h4, h5, h6, span {
        max-width: 100% !important; 
        word-wrap: break-word !important; 
        overflow-wrap: break-word !important; 
        white-space: normal !important; 
    }
    .container {
        width: 100% !important; 
        max-width: 100vw !important; 
        padding: 0 20px !important; 
        box-sizing: border-box !important; 
        overflow-x: hidden !important; 
    }

    /* Apenas ajustamos o tamanho da logo para caber na tela do celular */
    .header-mob img {
        width: 130px !important; /* Menor para o celular */
        height: auto !important; 
        display: block !important; 
        margin: 0 !important; 
        transform: translateY(0) !important; /* Alinhamento zerado */
        pointer-events: none !important; 
    }

    /* ícone do menu no celular */
    .header-mob .menu {
        display: block !important; 
        width: 28px !important; 
        height: 28px !important; 
        transform: translateY(-18px) !important;
        margin: 0 !important; 
        padding: 0 !important; 
        background-color: transparent !important; 
        border: none !important; 
        box-shadow: none !important; 
        outline: none !important; 
    }

    /* MATA QUALQUER MARGEM EXTERNA DA CAIXA ESCURA NO CELULAR */
    .background-banner, main, .hero-produto, .page-integrations {
        margin-top: 0 !important;
    }

    .container-showcase-float {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        gap: 16px !important; /* Espaço de 16px entre os itens (!important) */
        margin-top: 30px !important; /* Margem superior: 30px (forçado com !important) */
        padding: 0 20px !important; /* Espaçamento interno: 0 20px (forçado com !important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
    }
    .showcase-col-box {
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
        margin: 0 !important; /* Remove margem (!important) */
    }
    .background-banner {
        padding: 80px 0 0 0px !important; /* Espaçamento interno: 80px 0 0 0px (forçado com !important) */
        height: auto !important; /* Altura automática, ajusta ao conteúdo (!important) */
        min-height: 0 !important; /* Altura mínima: 0 (forçado com !important) */
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
        position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
        width: 100vw !important; /* Largura de 100vw em relação à viewport (!important) */
        max-width: 100% !important; /* Não deixa ultrapassar 100% do pai (!important) */
        overflow: hidden !important; /* Esconde o que ultrapassar os limites do elemento (!important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
    }
    .container-conteudo-vertical {
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
        text-align: center !important; /* Centraliza o texto (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        max-width: 100% !important; /* Não deixa ultrapassar 100% do pai (!important) */
        padding: 0 15px !important; /* Espaçamento interno: 0 15px (forçado com !important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
        position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
        z-index: 10 !important; /* Camada de sobreposição (quanto maior, mais na frente): 10 (forçado com !important) */
    }
    .banner-textos-topo {
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        max-width: 100% !important; /* Não deixa ultrapassar 100% do pai (!important) */
        margin-top: 0 !important; /* Margem superior: 0 (forçado com !important) */
        margin-bottom: 30px !important; /* Margem inferior: 30px (forçado com !important) */
        position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
        z-index: 5 !important; /* Camada de sobreposição (quanto maior, mais na frente): 5 (forçado com !important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
    }
    .banner-textos-topo h2.texto-1, .texto-1 {
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        font-size: 28px !important; /* Tamanho da fonte: 28px (forçado com !important) */
        line-height: 1.25 !important; /* Altura da linha do texto: 1.25 (forçado com !important) */
        font-weight: 800 !important; /* Peso bem pesado, quase preto (!important) */
        color: #ffffff !important; /* Cor do texto: #ffffff (forçado com !important) */
        margin: 0 auto 15px auto !important; /* Margem: 0 auto 15px auto (forçado com !important) */
        text-align: center !important; /* Centraliza o texto (!important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
        white-space: normal !important; /* Permite quebra de linha normal (!important) */
        word-wrap: break-word !important; /* word-wrap: break-word (forçado com !important) */
    }
    .banner-textos-topo h3 {
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        max-width: 100% !important; /* Não deixa ultrapassar 100% do pai (!important) */
        font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
        line-height: 1.5 !important; /* Altura da linha do texto: 1.5 (forçado com !important) */
        color: #cbd5e1 !important; /* Cor do texto: #cbd5e1 (forçado com !important) */
        margin: 0 auto !important; /* Zera margem vertical e centraliza na horizontal (!important) */
        padding: 0 10px !important; /* Espaçamento interno: 0 10px (forçado com !important) */
        text-align: center !important; /* Centraliza o texto (!important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
        white-space: normal !important; /* Permite quebra de linha normal (!important) */
        word-break: break-word !important; /* Controla quebra de palavras longas: break-word (forçado com !important) */
        overflow-wrap: anywhere !important; /* Controla quebra de palavras longas: anywhere (forçado com !important) */
    }
    .banner-imagem-meio {
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
        text-align: center !important; /* Centraliza o texto (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        margin-top: 0 !important; /* Margem superior: 0 (forçado com !important) */
        position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
        z-index: 1 !important; /* Camada de sobreposição (quanto maior, mais na frente): 1 (forçado com !important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
    }
    .banner-monitores-vertical, .banner-imagem-meio img:not(.logo-galactix) {
        display: inline-block !important; /* Vira inline-block, fica na linha mas aceita largura/altura (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        max-width: 420px !important; /* Largura máxima: 420px (forçado com !important) */
        height: auto !important; /* Altura automática, ajusta ao conteúdo (!important) */
        margin: 0 auto !important; /* Zera margem vertical e centraliza na horizontal (!important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
    }
    .logo-galactix {
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
        width: 75% !important; /* Largura: 75% (forçado com !important) */
        max-width: 300px !important; /* Largura máxima: 300px (forçado com !important) */
        height: auto!important; /* Altura automática, ajusta ao conteúdo (!important) */
        margin: -70px auto -90px auto !important; /* Margem: -70px auto -90px auto (forçado com !important) */
        position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
        z-index: 20 !important; /* Camada de sobreposição (quanto maior, mais na frente): 20 (forçado com !important) */
    }
    .h2-title {
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        font-size: 20px !important; /* Tamanho da fonte: 20px (forçado com !important) */
        line-height: 1.4 !important; /* Altura da linha do texto: 1.4 (forçado com !important) */
        text-align: center !important; /* Centraliza o texto (!important) */
        margin: 40px auto 20px auto !important; /* Margem: 40px auto 20px auto (forçado com !important) */
        padding: 0 !important; /* Remove espaçamento interno (!important) */
    }
    .h3-subtitle {
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
        line-height: 1.5 !important; /* Altura da linha do texto: 1.5 (forçado com !important) */
        text-align: center !important; /* Centraliza o texto (!important) */
        margin: 0 auto 40px auto !important; /* Margem: 0 auto 40px auto (forçado com !important) */
        padding: 0 !important; /* Remove espaçamento interno (!important) */
    }
    .container-showcase-float + .container + .container {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
        padding-bottom: 40px !important; /* Espaçamento interno inferior: 40px (forçado com !important) */
    }
    .video-sources, .lazy-video {
        order: 1 !important; /* Ordem do item no flex/grid: 1 (forçado com !important) */
        position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        height: auto !important; /* Altura automática, ajusta ao conteúdo (!important) */
        border-radius: 12px !important; /* Arredonda os cantos: 12px (forçado com !important) */
        margin: 0 auto 24px auto !important; /* Margem: 0 auto 24px auto (forçado com !important) */
        z-index: 5 !important; /* Camada de sobreposição (quanto maior, mais na frente): 5 (forçado com !important) */
        transform: none !important; /* Transformação (rotação, escala ou deslocamento): none (forçado com !important) */
        top: auto !important; /* Distância a partir do(a) topo: auto (forçado com !important) */
        left: auto !important; /* Distância a partir do(a) esquerda: auto (forçado com !important) */
        right: auto !important; /* Distância a partir do(a) direita: auto (forçado com !important) */
        bottom: auto !important; /* Distância a partir do(a) base: auto (forçado com !important) */
    }
    .sub-video {
        order: 2 !important; /* Ordem do item no flex/grid: 2 (forçado com !important) */
        position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
        justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        background: transparent !important; /* Remove a cor de fundo (!important) */
        padding: 0 !important; /* Remove espaçamento interno (!important) */
        margin: 0 !important; /* Remove margem (!important) */
        z-index: 10 !important; /* Camada de sobreposição (quanto maior, mais na frente): 10 (forçado com !important) */
        min-height: auto !important; /* Altura mínima: auto (forçado com !important) */
        transform: none !important; /* Transformação (rotação, escala ou deslocamento): none (forçado com !important) */
        top: auto !important; /* Distância a partir do(a) topo: auto (forçado com !important) */
        bottom: auto !important; /* Distância a partir do(a) base: auto (forçado com !important) */
        left: auto !important; /* Distância a partir do(a) esquerda: auto (forçado com !important) */
        right: auto !important; /* Distância a partir do(a) direita: auto (forçado com !important) */
    }
    .subtitle-video {
        color: #0f172a !important; /* Cor do texto: #0f172a (forçado com !important) */
        font-size: 22px !important; /* Tamanho da fonte: 22px (forçado com !important) */
        line-height: 1.3 !important; /* Altura da linha do texto: 1.3 (forçado com !important) */
        text-align: center !important; /* Centraliza o texto (!important) */
        margin: 0 auto 16px auto !important; /* Margem: 0 auto 16px auto (forçado com !important) */
        text-shadow: none !important; /* Sombra no texto: none (forçado com !important) */
        position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        transform: none !important; /* Transformação (rotação, escala ou deslocamento): none (forçado com !important) */
        right: auto !important; /* Distância a partir do(a) direita: auto (forçado com !important) */
        left: auto !important; /* Distância a partir do(a) esquerda: auto (forçado com !important) */
    }
    .subtitle-button, .sub-video a {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
        align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        max-width: 280px !important; /* Largura máxima: 280px (forçado com !important) */
        margin: 0 auto !important; /* Zera margem vertical e centraliza na horizontal (!important) */
        padding: 14px 20px !important; /* Espaçamento interno: 14px 20px (forçado com !important) */
        position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
        transform: none !important; /* Transformação (rotação, escala ou deslocamento): none (forçado com !important) */
    }
    .galactix-intro-transition {
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        overflow: hidden !important; /* Esconde o que ultrapassar os limites do elemento (!important) */
    }
    .intro-asymmetric-grid {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        gap: 20px !important; /* Espaço de 20px entre os itens (!important) */
        padding: 30px 0 0 0 !important; /* Espaçamento interno: 30px 0 0 0 (forçado com !important) */
    }
    .intro-left-block, .intro-right-block {
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
        text-align: center !important; /* Centraliza o texto (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    }
    .intro-badge {
        display: inline-block !important; /* Vira inline-block, fica na linha mas aceita largura/altura (!important) */
        margin-bottom: 24px !important; /* Margem inferior: 24px (forçado com !important) */
    }
    .intro-title {
        font-size: 24px !important; /* Tamanho da fonte: 24px (forçado com !important) */
        margin-bottom: 16px !important; /* Margem inferior: 16px (forçado com !important) */
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
    }
    .intro-divider-line {
        display: none !important; /* Esconde o elemento e tira do fluxo (!important) */
    }
    .intro-subtitle {
        margin-bottom: 0 !important; /* Margem inferior: 0 (forçado com !important) */
        padding-bottom: 0 !important; /* Espaçamento interno inferior: 0 (forçado com !important) */
    }
    .modules-container, .deepdata-grid-container, .hub-container-grid, .hub-metrics-column {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        gap: 20px !important; /* Espaço de 20px entre os itens (!important) */
        padding: 0 !important; /* Remove espaçamento interno (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    }
    .interactive-module-card, .metric-glass-card {
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        margin: 0 !important; /* Remove margem (!important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
    }
    .deepdata-main-title, .hub-main-title {
        font-size: 24px !important; /* Tamanho da fonte: 24px (forçado com !important) */
        line-height: 1.3 !important; /* Altura da linha do texto: 1.3 (forçado com !important) */
        text-align: center !important; /* Centraliza o texto (!important) */
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    }
    .feature-item-box {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
        gap: 12px !important; /* Espaço de 12px entre os itens (!important) */
        text-align: center !important; /* Centraliza o texto (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    }
    .feature-icon-circle {
        margin: 0 auto !important; /* Zera margem vertical e centraliza na horizontal (!important) */
    }
    .hub-tech-showcase {
        transform: scale(0.8) !important; /* Transformação (rotação, escala ou deslocamento): scale(0.8) (forçado com !important) */
        margin: 10px auto !important; /* Margem: 10px auto (forçado com !important) */
    }
    .galactix-hero-section {
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        margin: 5px 0 5px 0 !important; /* Margem: 15px 0 25px 0 (forçado com !important) */
        height: 38vw !important; /* Altura: 50vw (forçado com !important) */
        min-height: 130px !important; /* Altura mínima: 180px (forçado com !important) */
        background-size: contain !important; /* Tamanho da imagem de fundo: Imagem cabe inteira dentro do espaço (!important) */
        background-position: center center !important; /* Posição da imagem de fundo: center center (forçado com !important) */
        background-repeat: no-repeat !important; /* Repetição da imagem de fundo: no-repeat (forçado com !important) */
        border-radius: 0 !important; /* Arredonda os cantos: 0 (forçado com !important) */
        box-shadow: none !important; /* Remove sombra (!important) */
        padding: 0 !important; /* Remove espaçamento interno (!important) */
    }
    .hero-content-wrapper, .hero-cta-wrapper {
        padding: 0 !important; /* Remove espaçamento interno (!important) */
        margin: 0 !important; /* Remove margem (!important) */
        min-height: 0 !important; /* Altura mínima: 0 (forçado com !important) */
    }
    .galactix-modules-section {
        padding-top: 0 !important; /* Espaçamento interno superior: 0 (forçado com !important) */
        margin-top: 10px !important; /* Margem superior: 10px (forçado com !important) */
    }
    .galactix-cta-section {
        padding: 0 20px !important; /* Espaçamento interno: 0 20px (forçado com !important) */
        margin: 40px 0 !important; /* Margem: 40px 0 (forçado com !important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
    }
    .cta-banner-container {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
        padding: 40px 20px !important; /* Espaçamento interno: 40px 20px (forçado com !important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        border-radius: 16px !important; /* Arredonda os cantos: 16px (forçado com !important) */
        text-align: center !important; /* Centraliza o texto (!important) */
        height: auto !important; /* Altura automática, ajusta ao conteúdo (!important) */
        overflow: hidden !important; /* Esconde o que ultrapassar os limites do elemento (!important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
    }
    .cta-title {
        font-size: 24px !important; /* Tamanho da fonte: 24px (forçado com !important) */
        margin-bottom: 12px !important; /* Margem inferior: 12px (forçado com !important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    }
    .cta-subtitle {
        font-size: 15px !important; /* Tamanho da fonte: 15px (forçado com !important) */
        margin-bottom: 24px !important; /* Margem inferior: 24px (forçado com !important) */
        color: #cbd5e1 !important; /* Cor do texto: #cbd5e1 (forçado com !important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    }
    .cta-button-expert {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        max-width: 280px !important; /* Largura máxima: 280px (forçado com !important) */
        margin: 0 auto !important; /* Zera margem vertical e centraliza na horizontal (!important) */
    }
    .background-gray {
        padding: 40px 0 !important; /* Espaçamento interno: 40px 0 (forçado com !important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
    }
    .background-gray .container {
        gap: 30px !important; /* Espaço de 30px entre os itens (!important) */
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
    }
    .left-1, .right-1 {
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        max-width: 100% !important; /* Não deixa ultrapassar 100% do pai (!important) */
        float: none !important; /* Remove flutuação (!important) */
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
        text-align: center !important; /* Centraliza o texto (!important) */
        margin: 0 !important; /* Remove margem (!important) */
        padding: 0 !important; /* Remove espaçamento interno (!important) */
    }
    .left-1 h4 {
        font-size: 22px !important; /* Tamanho da fonte: 22px (forçado com !important) */
        margin-bottom: 15px !important; /* Margem inferior: 15px (forçado com !important) */
    }
    .left-1 div {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
        gap: 15px !important; /* Espaço de 15px entre os itens (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    }
    .form-contact {
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
    }
    .form-contact input, .form-contact select, .form-contact button {
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
        margin-bottom: 15px !important; /* Margem inferior: 15px (forçado com !important) */
    }
    footer {
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        overflow: hidden !important; /* Esconde o que ultrapassar os limites do elemento (!important) */
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
    }
    footer .container {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        gap: 24px !important; /* Espaço de 24px entre os itens (!important) */
        padding: 30px 20px !important; /* Espaçamento interno: 30px 20px (forçado com !important) */
        text-align: center !important; /* Centraliza o texto (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        margin: 0 auto !important; /* Zera margem vertical e centraliza na horizontal (!important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
    }
    .footer-container-top {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
        gap: 15px !important; /* Espaço de 15px entre os itens (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    }
    .footer-col-1 {
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        text-align: center !important; /* Centraliza o texto (!important) */
        margin-bottom: 15px !important; /* Margem inferior: 15px (forçado com !important) */
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
        float: none !important; /* Remove flutuação (!important) */
    }
    .footer-col-1 img {
        max-width: 150px !important; /* Largura máxima: 150px (forçado com !important) */
        margin: 10px auto !important; /* Margem: 10px auto (forçado com !important) */
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
    }
    .footer-col-1 ul {
        padding: 0 !important; /* Remove espaçamento interno (!important) */
        margin: 0 !important; /* Remove margem (!important) */
        list-style: none !important; /* Remove marcadores da lista (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    }
    .footer-col-1 ul li {
        text-align: center !important; /* Centraliza o texto (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    }
    .sobre-hero {
        padding: 180px 0 60px 0; /* Espaçamento interno: 180px 0 60px 0 */
    }
    .hero-title {
        font-size: 32px !important; /* Tamanho da fonte: 32px (forçado com !important) */
    }
    .contato-header-center h1 {
        font-size: 32px !important; /* Tamanho da fonte: 32px (forçado com !important) */
    }
    .hero-subtitle {
        font-size: 16px; /* Tamanho da fonte: 16px */
        margin-bottom: 32px; /* Margem inferior: 32px */
    }
    .hero-cta-group {
        flex-direction: column; /* Empilha os filhos na vertical */
        gap: 16px; /* Espaço de 16px entre os itens */
        padding: 0 20px; /* Espaçamento interno: 0 20px */
    }
    .btn-primary-glow, .btn-secondary-outline {
        width: 100%; /* Ocupa 100% da largura do pai */
        box-sizing: border-box; /* Padding e borda passam a contar dentro da largura/altura definida */
    }
    .col-title {
        font-size: 28px; /* Tamanho da fonte: 28px */
    }
    .imersao-box {
        padding: 48px 24px; /* Espaçamento interno: 48px 24px */
        border-radius: 24px; /* Arredonda os cantos: 24px */
    }
    .glow-orb {
        display: none; /* Esconde o elemento e tira do fluxo */
    }
    .page-produto {
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        max-width: 100vw !important; /* Não deixa ultrapassar a largura da tela (!important) */
        overflow-x: hidden !important; /* Esconde rolagem horizontal (evita scroll lateral) (!important) */
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
    }
    .hero-produto {
        padding: 60px 20px 40px 20px !important; /* Espaçamento interno: 60px 20px 40px 20px (forçado com !important) */
        text-align: center !important; /* Centraliza o texto (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    }
    .hero-produto h1 {
        font-size: 32px !important; /* Tamanho da fonte: 32px (forçado com !important) */
        line-height: 1.2 !important; /* Altura da linha do texto: 1.2 (forçado com !important) */
        margin-bottom: 16px !important; /* Margem inferior: 16px (forçado com !important) */
    }
    .hero-produto p {
        font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
        margin-bottom: 32px !important; /* Margem inferior: 32px (forçado com !important) */
        padding: 0 10px !important; /* Espaçamento interno: 0 10px (forçado com !important) */
    }
    .hero-buttons {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        gap: 16px !important; /* Espaço de 16px entre os itens (!important) */
        align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    }
    .hero-buttons a {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
        align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        max-width: 320px !important; /* Largura máxima: 320px (forçado com !important) */
        margin: 0 !important; /* Remove margem (!important) */
        padding: 16px 20px !important; /* Espaçamento interno: 16px 20px (forçado com !important) */
    }
    .dor-produto {
        padding: 40px 20px 0px 20px !important; /* Espaçamento interno: 40px 20px 0px 20px (forçado com !important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
    }
    .dor-grid {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        gap: 30px !important; /* Espaço de 30px entre os itens (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    }
    .dor-texto-esq {
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        text-align: center !important; /* Centraliza o texto (!important) */
        padding: 0 !important; /* Remove espaçamento interno (!important) */
    }
    .dor-texto-esq h2 {
        font-size: 24px !important; /* Tamanho da fonte: 24px (forçado com !important) */
        margin: 16px 0 !important; /* Margem: 16px 0 (forçado com !important) */
    }
    .dor-visual-dir {
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        max-width: 100% !important; /* Não deixa ultrapassar 100% do pai (!important) */
        margin: 0 auto !important; /* Zera margem vertical e centraliza na horizontal (!important) */
        position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
    }
    .dor-card-flutuante {
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        max-width: 100% !important; /* Não deixa ultrapassar 100% do pai (!important) */
        margin: 0 !important; /* Remove margem (!important) */
        position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
        transform: none !important; /* Transformação (rotação, escala ou deslocamento): none (forçado com !important) */
        top: auto !important; /* Distância a partir do(a) topo: auto (forçado com !important) */
        bottom: auto !important; /* Distância a partir do(a) base: auto (forçado com !important) */
        left: 0 !important; /* Distância a partir do(a) esquerda: 0 (forçado com !important) */
        right: 0 !important; /* Distância a partir do(a) direita: 0 (forçado com !important) */
    }
    .solucao-produto {
        padding: 40px 20px !important; /* Espaçamento interno: 40px 20px (forçado com !important) */
        margin: 0 !important; /* Remove margem (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
        height: auto !important; /* Altura automática, ajusta ao conteúdo (!important) */
        min-height: 0 !important; /* Altura mínima: 0 (forçado com !important) */
        max-height: none !important; /* Remove limite de altura (!important) */
        overflow: visible !important; /* Deixa o conteúdo ultrapassar os limites sem cortar (!important) */
    }
    .solucao-produto .container {
        height: auto !important; /* Altura automática, ajusta ao conteúdo (!important) */
        max-height: none !important; /* Remove limite de altura (!important) */
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
        overflow: visible !important; /* Deixa o conteúdo ultrapassar os limites sem cortar (!important) */
    }
    .solucao-cabecalho {
        text-align: center !important; /* Centraliza o texto (!important) */
        margin-bottom: 32px !important; /* Margem inferior: 32px (forçado com !important) */
        margin-top: 0 !important; /* Margem superior: 0 (forçado com !important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    }
    .solucao-cabecalho h2 {
        font-size: 24px !important; /* Tamanho da fonte: 24px (forçado com !important) */
        margin: 16px 0 !important; /* Margem: 16px 0 (forçado com !important) */
    }
    .solucao-grid {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        gap: 20px !important; /* Espaço de 20px entre os itens (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        height: auto !important; /* Altura automática, ajusta ao conteúdo (!important) */
        max-height: none !important; /* Remove limite de altura (!important) */
        overflow: visible !important; /* Deixa o conteúdo ultrapassar os limites sem cortar (!important) */
    }
    .solucao-card {
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        max-width: 100% !important; /* Não deixa ultrapassar 100% do pai (!important) */
        margin: 0 !important; /* Remove margem (!important) */
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        align-items: flex-start !important; /* Alinha os filhos no início do eixo cruzado (!important) */
    }
    .dif-grid {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        gap: 32px !important; /* Espaço de 32px entre os itens (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        max-width: 100vw !important; /* Não deixa ultrapassar a largura da tela (!important) */
        margin: 0 !important; /* Remove margem (!important) */
        padding: 0 !important; /* Remove espaçamento interno (!important) */
    }
    .dif-texto, .dif-checklist {
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        max-width: 100% !important; /* Não deixa ultrapassar 100% do pai (!important) */
        flex: 1 1 100% !important; /* Define grow/shrink/basis do item flex: 1 1 100% (forçado com !important) */
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
        float: none !important; /* Remove flutuação (!important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
    }
    .dif-texto {
        text-align: center !important; /* Centraliza o texto (!important) */
        margin-top: 0 !important; /* Margem superior: 0 (forçado com !important) */
        padding-top: 10px !important; /* Espaçamento interno superior: 10px (forçado com !important) */
    }
    .dif-texto h2 {
        font-size: 24px !important; /* Tamanho da fonte: 24px (forçado com !important) */
        margin: 0 0 16px 0 !important; /* Margem: 0 0 16px 0 (forçado com !important) */
        line-height: 1.4 !important; /* Altura da linha do texto: 1.4 (forçado com !important) */
        overflow: visible !important; /* Deixa o conteúdo ultrapassar os limites sem cortar (!important) */
    }
    .dif-checklist {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        gap: 20px !important; /* Espaço de 20px entre os itens (!important) */
    }
    .check-item {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: row !important; /* Alinha os filhos lado a lado na horizontal (!important) */
        align-items: flex-start !important; /* Alinha os filhos no início do eixo cruzado (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        max-width: 100% !important; /* Não deixa ultrapassar 100% do pai (!important) */
        margin: 0 !important; /* Remove margem (!important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
        overflow: hidden !important; /* Esconde o que ultrapassar os limites do elemento (!important) */
    }
    .check-conteudo {
        width: calc(100% - 40px) !important; /* Largura calculada: calc(100% - 40px) (forçado com !important) */
    }
    .cta-produto {
        padding: 40px 20px 60px 20px !important; /* Espaçamento interno: 40px 20px 60px 20px (forçado com !important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
    }
    .cta-conteudo {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
        padding: 40px 20px !important; /* Espaçamento interno: 40px 20px (forçado com !important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        border-radius: 16px !important; /* Arredonda os cantos: 16px (forçado com !important) */
        text-align: center !important; /* Centraliza o texto (!important) */
        position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
        overflow: hidden !important; /* Esconde o que ultrapassar os limites do elemento (!important) */
    }
    .cta-conteudo h2 {
        font-size: 24px !important; /* Tamanho da fonte: 24px (forçado com !important) */
        margin-bottom: 16px !important; /* Margem inferior: 16px (forçado com !important) */
    }
    .cta-botoes {
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
        margin-top: 24px !important; /* Margem superior: 24px (forçado com !important) */
    }
    .btn-cta-primario {
        display: inline-flex !important; /* Ativa flexbox mantendo o elemento inline (!important) */
        justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
        align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        max-width: 320px !important; /* Largura máxima: 320px (forçado com !important) */
    }
    .split-layout {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        gap: 30px !important; /* Espaço de 30px entre os itens (!important) */
    }
    .secao-header h2 {
        font-size: 32px !important; /* Tamanho da fonte: 32px (forçado com !important) */
    }
    .page-recursos .bento-grid, .page-recursos .split-cards, .page-recursos .grid-2-cols {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        gap: 20px !important; /* Espaço de 20px entre os itens (!important) */
    }
    .page-recursos .bento-card {
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        max-width: 100% !important; /* Não deixa ultrapassar 100% do pai (!important) */
        margin: 0 !important; /* Remove margem (!important) */
        padding: 24px !important; /* Espaçamento interno: 24px (forçado com !important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        align-items: flex-start !important; /* Alinha os filhos no início do eixo cruzado (!important) */
    }
    .page-recursos .bento-card h3, .page-recursos .bento-card p {
        word-break: normal !important; /* Controla quebra de palavras longas: normal (forçado com !important) */
        overflow-wrap: break-word !important; /* Controla quebra de palavras longas: break-word (forçado com !important) */
        white-space: normal !important; /* Permite quebra de linha normal (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
    }
    .hero-recursos {
        padding: 40px 20px !important; /* Espaçamento interno: 40px 20px (forçado com !important) */
    }
    .hero-recursos h1 {
        font-size: 32px !important; /* Tamanho da fonte: 32px (forçado com !important) */
        line-height: 1.2 !important; /* Altura da linha do texto: 1.2 (forçado com !important) */
    }
    .page-recursos .split-text {
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        padding: 0 !important; /* Remove espaçamento interno (!important) */
    }
    section#estoque.recursos-secao.dark-mode {
        display: block !important; /* Muda para block, ocupa a linha toda (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        height: auto !important; /* Altura automática, ajusta ao conteúdo (!important) */
        min-height: min-content !important; /* Altura mínima: min-content (forçado com !important) */
        max-height: none !important; /* Remove limite de altura (!important) */
        background: #060913 !important; /* Cor de fundo: #060913 (forçado com !important) */
        padding-top: 60px !important; /* Espaçamento interno superior: 60px (forçado com !important) */
        padding-bottom: 60px !important; /* Espaçamento interno inferior: 60px (forçado com !important) */
        margin: 0 !important; /* Remove margem (!important) */
        position: static !important; /* Volta ao posicionamento normal do fluxo (!important) */
        float: none !important; /* Remove flutuação (!important) */
        overflow: auto !important; /* Mostra barra de rolagem só quando necessário (!important) */
    }
    section#estoque .container.split-layout {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        height: auto !important; /* Altura automática, ajusta ao conteúdo (!important) */
        min-height: min-content !important; /* Altura mínima: min-content (forçado com !important) */
        max-height: none !important; /* Remove limite de altura (!important) */
        position: static !important; /* Volta ao posicionamento normal do fluxo (!important) */
        margin: 0 !important; /* Remove margem (!important) */
        padding: 0 20px !important; /* Espaçamento interno: 0 20px (forçado com !important) */
        gap: 30px !important; /* Espaço de 30px entre os itens (!important) */
    }
    section#estoque .split-cards {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        height: auto !important; /* Altura automática, ajusta ao conteúdo (!important) */
        min-height: min-content !important; /* Altura mínima: min-content (forçado com !important) */
        max-height: none !important; /* Remove limite de altura (!important) */
        position: static !important; /* Volta ao posicionamento normal do fluxo (!important) */
        gap: 20px !important; /* Espaço de 20px entre os itens (!important) */
        margin: 0 !important; /* Remove margem (!important) */
        padding: 0 !important; /* Remove espaçamento interno (!important) */
    }
    section#estoque .bento-card {
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        height: auto !important; /* Altura automática, ajusta ao conteúdo (!important) */
        min-height: auto !important; /* Altura mínima: auto (forçado com !important) */
        max-height: none !important; /* Remove limite de altura (!important) */
        position: relative !important; /* Mantém no fluxo normal e vira referência para filhos absolutos (!important) */
        transform: none !important; /* Transformação (rotação, escala ou deslocamento): none (forçado com !important) */
        top: auto !important; /* Distância a partir do(a) topo: auto (forçado com !important) */
        bottom: auto !important; /* Distância a partir do(a) base: auto (forçado com !important) */
        margin: 0 !important; /* Remove margem (!important) */
        flex: none !important; /* Define grow/shrink/basis do item flex: none (forçado com !important) */
    }
    .story-text {
        text-align: center !important; /* Centraliza o texto (!important) */
        display: flex !important; /* Ativa flexbox nos filhos diretos (!important) */
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        align-items: center !important; /* Centraliza os filhos no eixo cruzado (geralmente vertical) (!important) */
    }
    .story-text h2 {
        font-size: 30px !important; /* Tamanho da fonte: 30px (forçado com !important) */
    }
    .story-section.bg-gray {
        padding-top: 60px !important; /* Espaçamento interno superior: 60px (forçado com !important) */
        padding-bottom: 40px !important; /* Espaçamento interno inferior: 40px (forçado com !important) */
    }
    .story-section.bg-white {
        padding-top: 40px !important; /* Espaçamento interno superior: 40px (forçado com !important) */
    }
    .integration-section {
        padding: 50px 20px !important; /* Espaçamento interno: 50px 20px (forçado com !important) */
    }
    .final-cta-section {
        padding: 80px 20px !important; /* Espaçamento interno: 80px 20px (forçado com !important) */
    }
    .badge-dark-wrapper {
        justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
    }
    .tech-divider-content h3 {
        font-size: 26px !important; /* Tamanho da fonte: 26px (forçado com !important) */
        padding: 0 10px !important; /* Espaçamento interno: 0 10px (forçado com !important) */
        line-height: 1.4 !important; /* Altura da linha do texto: 1.4 (forçado com !important) */
    }
    .final-cta-content h2 {
        font-size: 34px !important; /* Tamanho da fonte: 34px (forçado com !important) */
    }
    .final-cta-content p {
        font-size: 16px !important; /* Tamanho da fonte: 16px (forçado com !important) */
    }
    .filter-nav-pills {
        flex-direction: row !important; /* Alinha os filhos lado a lado na horizontal (!important) */
        flex-wrap: wrap !important; /* Permite os itens quebrarem para a linha de baixo (!important) */
        justify-content: center !important; /* Centraliza os filhos no eixo principal (geralmente horizontal) (!important) */
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        margin: 20px auto 40px auto !important; /* Margem: 20px auto 40px auto (forçado com !important) */
    }
    .filter-nav-pills .pill {
        text-align: center !important; /* Centraliza o texto (!important) */
        width: auto !important; /* Largura automática, ajusta ao conteúdo (!important) */
        font-size: 14px !important; /* Tamanho da fonte: 14px (forçado com !important) */
        padding: 8px 16px !important; /* Espaçamento interno: 8px 16px (forçado com !important) */
    }
    .modern-logos-grid {
        grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)) !important; /* Cria colunas automáticas que se ajustam à largura disponível: repeat(auto-fit, minmax(140px, 1fr)) (forçado com !important) */
        gap: 16px !important; /* Espaço de 16px entre os itens (!important) */
    }
    .logo-box {
        height: 90px !important; /* Altura: 90px (forçado com !important) */
        padding: 12px !important; /* Espaçamento interno: 12px (forçado com !important) */
    }
    .logo-box img {
        max-height: 40px !important; /* Altura máxima: 40px (forçado com !important) */
    }
    .tech-divider-actions {
        flex-direction: column !important; /* Empilha os filhos na vertical (!important) */
        padding: 0 20px !important; /* Espaçamento interno: 0 20px (forçado com !important) */
    }
    .tech-divider-actions a {
        width: 100% !important; /* Ocupa 100% da largura do pai (!important) */
        box-sizing: border-box !important; /* Padding e borda passam a contar dentro da largura/altura definida (!important) */
    }

    /* 1. Resolve a Imagem 2: Cria o respiro correto entre o último card e a seção azul */
    .story-section.bg-gray {
        padding-top: 40px !important;
        padding-bottom: 60px !important;
    }

    /* 2. Força o grid a ocupar 100% da largura da tela no celular */
    .story-grid {
        grid-template-columns: 1fr !important;
        gap: 32px !important;
        width: 100% !important;
    }

    /* 3. Resolve a Imagem 1: Expande a caixa "A Galactix nasceu..." até as bordas */
    .highlight-card {
        width: 100% !important;
        max-width: 100% !important;
        padding: 24px 16px !important;
        box-sizing: border-box !important;
    }

    .highlight-card .quote {
        font-size: 17px !important;
        line-height: 1.5 !important;
    }

    /* 1. Compacta o padding do topo e base de todas as seções */
    .story-section, 
    .story-section.bg-white, 
    .story-section.bg-gray {
        padding-top: 24px !important;
        padding-bottom: 24px !important;
    }

    /* 2. Reduz o gap do Grid empilhado no celular */
    .story-grid {
        gap: 16px !important;
    }

    /* 3. Controla a margem inferior dos parágrafos de texto */
    .story-text p {
        margin-bottom: 12px !important;
    }

    /* 4. Esconde o container de features caso esteja vazio ou carregando */
    .story-features:empty {
        display: none !important;
    }


    /* 1. Reduz o espaço entre o botão do vídeo e o bloco "Foco em Alta Performance" */
    .container-showcase-float + .container + .container {
        padding-bottom: 10px !important;
    }

    .sub-video {
        margin-bottom: 10px !important;
    }

    .galactix-intro-transition {
        padding-top: 10px !important;
        margin-top: 0 !important;
    }

    .intro-asymmetric-grid {
        padding-top: 10px !important;
        gap: 10px !important;
    }

    .intro-badge {
        margin-bottom: 12px !important;
    }

    /* 2. Reduz o espaço entre o texto da introdução e a imagem do Galactix Commerce */
    .intro-right-block,
    .intro-subtitle {
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
    }

    .galactix-hero-section {
        margin-top: 0 !important;
        margin-bottom: 15px !important;
        background-position: top center !important; /* Elimina o espaço transparente no topo da imagem */
        min-height: 140px !important;
    }

    /* 1. Remove a lâmina que estava cortando o topo do elemento */
    .galactix-intro-transition {
        overflow: visible !important;
        padding-top: 28px !important; /* Dá espaço real para o badge não bater no teto */
        margin-top: 0 !important;
    }

    .intro-asymmetric-grid {
        padding-top: 0 !important;
        overflow: visible !important;
    }

    .intro-left-block {
        overflow: visible !important;
    }

    /* 2. Força o badge a ter altura inteira e respiro de caixa */
    .intro-badge {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        height: auto !important;
        min-height: 32px !important;
        padding: 6px 16px !important;
        margin-top: 0 !important;
        margin-bottom: 16px !important;
        background: #f3e8ff !important; /* Fundo lilás original */
        border: 1px solid #d8b4fe !important;
        border-radius: 100px !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    .intro-badge span,
    #json-intro-badge {
        color: #7e22ce !important; /* Texto roxo visível */
        -webkit-text-fill-color: #7e22ce !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        text-transform: uppercase !important;
        letter-spacing: 0.5px !important;
        white-space: nowrap !important;
        line-height: 1.2 !important;
    }

    .led-dot {
        width: 8px !important;
        height: 8px !important;
        background-color: #9333ea !important;
        border-radius: 50% !important;
        display: inline-block !important;
        box-shadow: 0 0 8px #9333ea !important;
        flex-shrink: 0 !important;
    }

    /* 1. Elimina respiros do bloco de texto e da transição */
    .galactix-intro-transition,
    .intro-asymmetric-grid,
    .intro-right-block,
    .intro-subtitle {
        padding-bottom: 0 !important;
        margin-bottom: 0 !important;
    }

    /* 2. Puxa a imagem para cima colando-a ao texto */
    .galactix-hero-section {
        margin-top: 20px !important; /* Puxa a imagem para perto do texto */
        padding-top: 0 !important;
        background-position: top center !important;
    }

    .solucoes-desafios {
        /* Devolve um pequeno respiro no topo apenas no celular */
        padding-top: 0px !important; 
    }
    
    .desafios-header {
        /* Desliga o "Raio Trator" (margem negativa) para o badge não vazar e ser cortado */
        margin-top: 0px !important; 
    }

    .story-section.bg-gray {
        padding-bottom: 0 !important; /* Zera o espaçamento interno inferior */
    }
    
    .story-text p:last-child {
        margin-bottom: 0 !important; /* Zera a margem inferior */
    }

    .integration-section {
        padding-top: 16px !important; /* Define espaçamento interno superior em 24px */
        margin-top: 0 !important; /* Zera a margem superior */
    }

    .integration-header {
        margin-top: 0 !important; /* Zera a margem superior */
        padding-top: 0 !important; /* Zera o espaçamento interno superior */
        margin-bottom: 32px !important; /* Define margem inferior em 32px */
    }
}

/* ==================== PÁGINA COOP (padrão visual do Produto) ==================== */

.page-coop {
    overflow-x: hidden;
}
.page-coop .container {
    margin: 0 auto;
    padding: 0 20px;
    clear: unset;
}

/* Botões */
.page-coop .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 52px;
    padding: 0 28px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 8px;
    text-decoration: none;
    transition: all 0.3s ease;
    background: #00a0e3;
    color: #ffffff;
    border: 1px solid #00a0e3;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
}
.page-coop .btn:hover {
    background: #008cc6;
    box-shadow: 0 6px 20px rgba(0, 160, 227, 0.5);
    transform: translateY(-2px);
}
.page-coop .btn-outline {
    background: transparent;
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.3);
    box-shadow: none;
}
.page-coop .btn-outline:hover {
    background: rgba(255, 255, 255, 0.05);
    border-color: #ffffff;
    transform: translateY(-2px);
}
.page-coop .btn-light {
    background: #ffffff;
    color: #0b0f19;
    border: 1px solid #ffffff;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
}
.page-coop .btn-light:hover {
    background: #e2e8f0;
    transform: translateY(-2px);
}
.page-coop .btn-large {
    height: 64px;
    padding: 0 44px;
    font-size: 18px;
    font-weight: 700;
    border-radius: 100px;
}
.page-coop .btn-large:hover {
    transform: translateY(-3px) scale(1.02);
}

/* Eyebrow / tags */
.page-coop .eyebrow {
    display: inline-block;
    background: #e0f2fe;
    color: #0284c7;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    padding: 6px 16px;
    border-radius: 100px;
    margin-bottom: 20px;
}
.page-coop .eyebrow-light {
    background: rgba(56, 189, 248, 0.1);
    color: #38bdf8;
    border: 1px solid rgba(56, 189, 248, 0.3);
}

/* Estrutura genérica de seção */
.page-coop .section {
    background: #ffffff;
    padding: 100px 20px;
}
.page-coop .section-light {
    background: #f8fafc;
}
.page-coop .section h2 {
    color: #0f172a;
    font-size: 42px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1px;
    margin: 0 0 20px 0;
}
.page-coop .section-center {
    max-width: 720px;
    margin: 0 auto;
    text-align: center;
}
.page-coop .section-heading {
    max-width: 720px;
    margin: 0 auto 24px auto;
    text-align: center;
}
.page-coop .section-center p,
.page-coop .section-heading p {
    color: #475569;
    font-size: 18px;
    line-height: 1.7;
    margin: 0 auto;
    max-width: 640px;
}

/* Seções escuras (gradiente estilo hero-produto / solucao-produto) */
.page-coop .hero,
.page-coop .section-dark,
.page-coop .ecosystem {
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.page-coop .section-dark h2,
.page-coop .ecosystem h2 {
    color: #ffffff;
}
.page-coop .section-dark .section-heading p,
.page-coop .section-dark .section-center p,
.page-coop .ecosystem .section-center p {
    color: #cbd5e1;
}
.page-coop .coop-integration,
.page-coop .newton,
.page-coop .cta-section {
    background: #0b0f19;
}

/* HERO */
.page-coop .hero {
    padding: 90px 20px 100px 20px;
    overflow: hidden;
}
.page-coop .hero-grid {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 60px;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
}
.page-coop .hero-content {
    text-align: left;
}
.page-coop .hero h1 {
    color: #ffffff;
    font-size: 50px;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -1.5px;
    margin: 0 0 20px 0;
}
.page-coop .hero h1 span {
    color: #00a0e3;
}
.page-coop .hero-description {
    color: #cbd5e1;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.7;
    max-width: 520px;
    margin: 0 0 36px 0;
}
.page-coop .hero-actions {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 48px;
}
.page-coop .hero-mini-info {
    display: flex;
    gap: 36px;
    flex-wrap: wrap;
}
.page-coop .hero-mini-info > div {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.page-coop .hero-mini-info strong {
    color: #ffffff;
    font-size: 15px;
    font-weight: 700;
}
.page-coop .hero-mini-info span {
    color: #94a3b8;
    font-size: 13px;
}

/* Mockup do dashboard (hero-visual) */
.page-coop .hero-visual {
    position: relative;
}
.page-coop .dashboard {
    background: #0d1220;
    border: 1px solid #1e293b;
    border-radius: 20px;
    padding: 28px;
    box-shadow: 0 30px 60px -15px rgba(0, 0, 0, 0.5);
}
.page-coop .dashboard-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 20px;
    border-bottom: 1px solid #1e293b;
    margin-bottom: 24px;
}
.page-coop .dashboard-logo {
    display: block;
    color: #ffffff;
    font-weight: 800;
    font-size: 14px;
    letter-spacing: 1px;
}
.page-coop .dashboard-header small {
    color: #64748b;
    font-size: 12px;
}
.page-coop .status {
    color: #10b981;
    font-size: 12px;
    font-weight: 700;
}
.page-coop .dashboard-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    margin-bottom: 20px;
}
.page-coop .stat {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 12px;
    padding: 14px;
}
.page-coop .stat span {
    display: block;
    color: #94a3b8;
    font-size: 11px;
    margin-bottom: 6px;
}
.page-coop .stat strong {
    display: block;
    color: #ffffff;
    font-size: 17px;
    font-weight: 800;
}
.page-coop .stat small {
    color: #10b981;
    font-size: 11px;
    font-weight: 700;
}
.page-coop .chart-card {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 12px;
    padding: 18px;
    margin-bottom: 14px;
}
.page-coop .chart-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 14px;
}
.page-coop .chart-title strong {
    display: block;
    color: #ffffff;
    font-size: 14px;
}
.page-coop .chart-title div span {
    color: #64748b;
    font-size: 12px;
    font-weight: 400;
}
.page-coop .chart-title > span {
    color: #10b981;
    font-weight: 700;
    font-size: 13px;
}
.page-coop .chart {
    height: 80px;
    border-radius: 8px;
    overflow: hidden;
    background: #0b0f19;
}
.page-coop .chart-line {
    width: 100%;
    height: 100%;
    background: linear-gradient(100deg, rgba(0, 160, 227, 0) 0%, rgba(0, 160, 227, 0.15) 35%, rgba(0, 160, 227, 0.55) 65%, rgba(0, 160, 227, 0.15) 100%);
    clip-path: polygon(0 80%, 15% 65%, 30% 72%, 45% 40%, 60% 52%, 75% 20%, 100% 35%, 100% 100%, 0 100%);
}
.page-coop .dashboard-bottom {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}
.page-coop .mini-card {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 12px;
    padding: 14px;
}
.page-coop .mini-card span {
    display: block;
    color: #94a3b8;
    font-size: 11px;
    margin-bottom: 6px;
}
.page-coop .mini-card strong {
    color: #ffffff;
    font-size: 15px;
    font-weight: 800;
}

/* Cards genéricos (Problemas / Diferenciais) */
.page-coop .cards-grid {
    display: grid;
    gap: 24px;
    margin-top: 56px;
}
.page-coop .cards-grid-4 {
    grid-template-columns: repeat(4, 1fr);
}
.page-coop .cards-grid-3 {
    grid-template-columns: repeat(3, 1fr);
}
.page-coop .card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 32px;
    transition: all 0.3s ease;
}
.page-coop .card:hover {
    transform: translateY(-5px);
    border-color: #00a0e3;
    box-shadow: 0 10px 30px rgba(0, 160, 227, 0.1);
}
.page-coop .card-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: #e0f2fe;
    color: #0284c7;
    font-size: 14px;
    font-weight: 800;
    margin-bottom: 20px;
}
.page-coop .card h3 {
    color: #0f172a;
    font-size: 20px;
    font-weight: 700;
    margin: 0 0 12px 0;
    line-height: 1.3;
}
.page-coop .card p {
    color: #64748b;
    font-size: 15px;
    line-height: 1.7;
    margin: 0;
}

/* Ecossistema */
.page-coop .ecosystem-map {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 36px;
    margin-top: 64px;
}
.page-coop .ecosystem-core {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #0284c7);
    color: #ffffff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 18px;
    letter-spacing: 0.5px;
    box-shadow: 0 25px 60px -10px rgba(0, 160, 227, 0.5);
    text-align: center;
}
.page-coop .ecosystem-core span {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    opacity: 0.85;
    margin-top: 6px;
}
.page-coop .ecosystem-items {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    width: 100%;
    max-width: 920px;
}
.page-coop .ecosystem-item {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 14px;
    padding: 22px 24px;
    text-align: center;
    transition: all 0.3s ease;
}
.page-coop .ecosystem-item:hover {
    border-color: #00a0e3;
    transform: translateY(-4px);
}
.page-coop .ecosystem-item strong {
    display: block;
    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 6px;
}
.page-coop .ecosystem-item span {
    color: #94a3b8;
    font-size: 13px;
}
.page-coop .ecosystem-highlight {
    border-color: #00a0e3;
    background: rgba(0, 160, 227, 0.08);
}
.page-coop .ecosystem-highlight strong {
    color: #38bdf8;
}

/* Soluções (grid escuro estilo solucao-produto) */
.page-coop .solutions-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    margin-top: 56px;
}
.page-coop .solution-card {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 16px;
    padding: 32px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    transition: all 0.4s ease;
}
.page-coop .solution-card:hover {
    background: #151e32;
    border-color: #00a0e3;
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0, 160, 227, 0.1);
}
.page-coop .solution-tag {
    display: inline-block;
    background: rgba(0, 160, 227, 0.12);
    color: #38bdf8;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding: 5px 12px;
    border-radius: 100px;
    margin-bottom: 20px;
    border: 1px solid rgba(0, 160, 227, 0.25);
}
.page-coop .solution-card h3 {
    color: #ffffff;
    font-size: 20px;
    font-weight: 700;
    margin: 0 0 12px 0;
}
.page-coop .solution-card p {
    color: #94a3b8;
    font-size: 15px;
    line-height: 1.65;
    margin: 0 0 16px 0;
}
.page-coop .solution-card a {
    color: #38bdf8;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    margin-top: auto;
}
.page-coop .solution-card a:hover {
    color: #00a0e3;
}
.page-coop .solution-card-featured {
    border-color: #00a0e3;
    background: linear-gradient(160deg, rgba(0, 160, 227, 0.12), #111827 60%);
}
.page-coop .solution-card-featured .solution-tag {
    background: #00a0e3;
    color: #ffffff;
    border-color: #00a0e3;
}

/* Integração */
.page-coop .integration-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
}
.page-coop .coop-integration h2 {
    color: #ffffff;
    font-size: 38px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1px;
    margin: 0 0 20px 0;
}
.page-coop .coop-integration h2 span {
    color: #00a0e3;
    display: block;
}
.page-coop .coop-integration-text p {
    color: #94a3b8;
    font-size: 17px;
    line-height: 1.7;
    margin: 0 0 32px 0;
    max-width: 480px;
}
.page-coop .integration-map {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 16px 32px;
}
.page-coop .integration-map > div:nth-child(1) { grid-column: 1; grid-row: 1; }
.page-coop .integration-map > div:nth-child(2) { grid-column: 1; grid-row: 2; }
.page-coop .integration-map > div:nth-child(3) { grid-column: 1; grid-row: 3; }
.page-coop .integration-map > div:nth-child(4) { grid-column: 1; grid-row: 4; }
.page-coop .integration-map > div:nth-child(5) { grid-column: 2; grid-row: 1 / span 4; }
.page-coop .integration-map > div:nth-child(6) { grid-column: 3; grid-row: 1; }
.page-coop .integration-map > div:nth-child(7) { grid-column: 3; grid-row: 2; }
.page-coop .integration-map > div:nth-child(8) { grid-column: 3; grid-row: 3; }
.page-coop .integration-map > div:nth-child(9) { grid-column: 3; grid-row: 4; }
.page-coop .integration-source,
.page-coop .integration-target {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 10px;
    padding: 14px 18px;
    color: #cbd5e1;
    font-size: 14px;
    font-weight: 600;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}
.page-coop .integration-core {
    background: linear-gradient(135deg, #00a0e3, #0284c7);
    color: #ffffff;
    font-weight: 800;
    font-size: 15px;
    letter-spacing: 1px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    text-align: center;
    box-shadow: 0 20px 45px -10px rgba(0, 160, 227, 0.5);
    min-height: 140px;
}

/* Jornada */
.page-coop .journey {
    display: flex;
    align-items: stretch;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 60px;
}
.page-coop .journey-item {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 24px 18px;
    text-align: center;
    flex: 0 1 160px;
    width: 160px;
    transition: all 0.3s ease;
}
.page-coop .journey-item:hover {
    border-color: #00a0e3;
    transform: translateY(-4px);
    box-shadow: 0 10px 30px rgba(0, 160, 227, 0.1);
}
.page-coop .journey-item span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #e0f2fe;
    color: #0284c7;
    font-size: 12px;
    font-weight: 800;
    margin-bottom: 14px;
}
.page-coop .journey-item strong {
    display: block;
    color: #0f172a;
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 6px;
}
.page-coop .journey-item p {
    color: #64748b;
    font-size: 13px;
    line-height: 1.5;
    margin: 0;
}
.page-coop .journey-arrow {
    display: flex;
    align-items: center;
    color: #cbd5e1;
    font-size: 20px;
    font-weight: 700;
}

/* Newton */
.page-coop .newton-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
}
.page-coop .newton h2 {
    color: #ffffff;
    font-size: 38px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1px;
    margin: 0 0 20px 0;
}
.page-coop .newton-text p {
    color: #94a3b8;
    font-size: 17px;
    line-height: 1.7;
    margin: 0 0 28px 0;
    max-width: 480px;
}
.page-coop .newton-tags {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.page-coop .newton-tags span {
    display: inline-block;
    background: rgba(0, 160, 227, 0.12);
    color: #38bdf8;
    border: 1px solid rgba(0, 160, 227, 0.25);
    font-size: 13px;
    font-weight: 700;
    padding: 8px 16px;
    border-radius: 100px;
}
.page-coop .newton-chat {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 16px;
    padding: 28px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.page-coop .chat-message {
    padding: 14px 18px;
    border-radius: 14px;
    font-size: 14px;
    line-height: 1.5;
    max-width: 85%;
}
.page-coop .user-message {
    align-self: flex-end;
    background: #00a0e3;
    color: #ffffff;
    border-bottom-right-radius: 4px;
}
.page-coop .ai-message {
    align-self: flex-start;
    background: #1e293b;
    color: #e2e8f0;
    border-bottom-left-radius: 4px;
}

/* Modular */
.page-coop .module-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-top: 56px;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}
.page-coop .module-grid > div {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 24px;
    text-align: center;
    font-weight: 700;
    color: #0f172a;
    font-size: 15px;
    transition: all 0.3s ease;
}
.page-coop .module-grid > div:hover {
    border-color: #00a0e3;
    color: #00a0e3;
    transform: translateY(-3px);
}
.page-coop .module-featured {
    background: linear-gradient(135deg, #00a0e3, #0284c7) !important;
    color: #ffffff !important;
    border: none !important;
}
.page-coop .module-featured:hover {
    color: #ffffff !important;
}

/* CTA final */
.page-coop .cta-section {
    padding: 120px 20px;
    display: flex;
    justify-content: center;
    position: relative;
    overflow: hidden;
}
.page-coop .cta-section::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 600px;
    height: 400px;
    background: radial-gradient(circle, rgba(0, 160, 227, 0.15) 0%, rgba(11, 15, 25, 0) 70%);
    border-radius: 50%;
    z-index: 1;
}
.page-coop .cta-content {
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    z-index: 2;
}
.page-coop .cta-content h2 {
    color: #ffffff;
    font-size: 46px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1.5px;
    margin: 0 0 20px 0;
}
.page-coop .cta-content p {
    color: #94a3b8;
    font-size: 20px;
    line-height: 1.6;
    margin: 0 0 40px 0;
    max-width: 680px;
}

@media (max-width: 992px) {
    .page-coop .hero-grid,
    .page-coop .integration-grid,
    .page-coop .newton-grid {
        grid-template-columns: 1fr;
    }
    .page-coop .hero-visual {
        margin-top: 40px;
    }
    .page-coop .solutions-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .page-coop .cards-grid-4,
    .page-coop .cards-grid-3 {
        grid-template-columns: repeat(2, 1fr);
    }
    .page-coop .module-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .page-coop .ecosystem-items {
        grid-template-columns: repeat(2, 1fr);
    }
    .page-coop .integration-map {
        grid-template-columns: 1fr;
        justify-items: center;
    }
    .page-coop .integration-map > div:nth-child(n) {
        grid-column: 1;
        grid-row: auto;
    }
}

@media (max-width: 768px) {
    .page-coop .section {
        padding: 60px 20px;
    }
    .page-coop .section h2 {
        font-size: 28px;
        letter-spacing: -0.5px;
    }
    .page-coop .hero {
        padding: 50px 20px 60px 20px;
    }
    .page-coop .hero h1 {
        font-size: 32px;
        letter-spacing: -1px;
    }
    .page-coop .hero-description {
        font-size: 16px;
        max-width: 100%;
    }
    .page-coop .hero-actions {
        flex-direction: column;
        align-items: stretch;
    }
    .page-coop .hero-mini-info {
        gap: 20px;
    }
    .page-coop .cards-grid-4,
    .page-coop .cards-grid-3,
    .page-coop .solutions-grid,
    .page-coop .module-grid,
    .page-coop .ecosystem-items {
        grid-template-columns: 1fr;
    }
    .page-coop .journey {
        flex-direction: column;
        align-items: stretch;
    }
    .page-coop .journey-item {
        width: auto;
    }
    .page-coop .journey-arrow {
        justify-content: center;
        transform: rotate(90deg);
    }
    .page-coop .coop-integration h2,
    .page-coop .newton h2 {
        font-size: 28px;
    }
    .page-coop .cta-content h2 {
        font-size: 28px;
    }
    .page-coop .cta-content p {
        font-size: 17px;
    }
}

/* ══════════════════════════════════════════════════════════════
   GALACTIX B2C — padrão visual do Produto.html
   (conteúdo original da página preservado; aqui só entra o estilo)
══════════════════════════════════════════════════════════════ */
.gx-b2c {
    display: block;
    overflow: hidden;
    background: #ffffff;
}
.gx-b2c * {
    box-sizing: border-box;
}
.gx-b2c .b2c-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}
.gx-b2c button {
    font-family: inherit;
    cursor: pointer;
}
.gx-b2c input {
    font-family: inherit;
}

/* ---------- Seções: fundo claro / escuro ---------- */
.gx-b2c .b2c-section {
    padding: 100px 0;
    background: #ffffff;
}
.gx-b2c .b2c-section.b2c-light {
    background: #f8fafc;
}
.gx-b2c .b2c-section.b2c-dark,
.gx-b2c .b2c-section.b2c-ai-section,
.gx-b2c .b2c-section.b2c-checkout-section,
.gx-b2c .b2c-section.b2c-newton,
.gx-b2c .b2c-section.b2c-agents-section,
.gx-b2c .b2c-hero {
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}

/* ---------- Tipografia comum ---------- */
.gx-b2c .b2c-eyebrow {
    display: inline-block;
    background: #e0f2fe;
    color: #0284c7;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    padding: 6px 16px;
    border-radius: 100px;
    margin-bottom: 22px;
    border: 1px solid rgba(56, 189, 248, 0.4);
}
.gx-b2c .b2c-eyebrow-light {
    background: rgba(56, 189, 248, 0.1);
    color: #38bdf8;
    border: 1px solid rgba(56, 189, 248, 0.3);
}

.gx-b2c .b2c-section-heading {
    max-width: 760px;
    margin: 0 0 60px 0;
}
.gx-b2c .b2c-section-heading.b2c-center {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}
.gx-b2c .b2c-section-heading h2,
.gx-b2c .b2c-content h2 {
    font-size: 38px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
    color: #0f172a;
    margin: 0 0 18px 0;
}
.gx-b2c .b2c-section-heading h2 span,
.gx-b2c .b2c-content h2 span {
    color: #00a0e3;
}
.gx-b2c .b2c-section-heading p,
.gx-b2c .b2c-content p {
    font-size: 18px;
    color: #475569;
    line-height: 1.7;
    margin: 0;
}
.gx-b2c .b2c-section.b2c-dark .b2c-section-heading h2,
.gx-b2c .b2c-section.b2c-ai-section .b2c-section-heading h2,
.gx-b2c .b2c-section.b2c-checkout-section .b2c-content h2,
.gx-b2c .b2c-section.b2c-newton .b2c-content h2,
.gx-b2c .b2c-section.b2c-agents-section .b2c-section-heading h2,
.gx-b2c .b2c-hero h1 {
    color: #ffffff;
}
.gx-b2c .b2c-section.b2c-dark .b2c-section-heading p,
.gx-b2c .b2c-section.b2c-ai-section .b2c-section-heading p,
.gx-b2c .b2c-section.b2c-checkout-section .b2c-content p,
.gx-b2c .b2c-section.b2c-newton .b2c-content p,
.gx-b2c .b2c-section.b2c-agents-section .b2c-section-heading p {
    color: #94a3b8;
}
.gx-b2c .b2c-ai-section .b2c-content h2,
.gx-b2c .b2c-checkout-section .b2c-section-heading h2 {
    color: #ffffff;
}
.gx-b2c .b2c-ai-section .b2c-content p {
    color: #94a3b8;
}

.gx-b2c .b2c-two-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}
.gx-b2c .b2c-content h3 {
    font-size: 22px;
    color: inherit;
}

/* ---------- Botões ---------- */
.gx-b2c .b2c-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    height: 52px;
    padding: 0 32px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 8px;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 1px solid transparent;
}
.gx-b2c .b2c-btn-primary {
    background: #00a0e3;
    color: #ffffff;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
}
.gx-b2c .b2c-btn-primary:hover {
    background: #008cc6;
    transform: translateY(-2px);
}
.gx-b2c .b2c-btn-outline {
    background: transparent;
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.3);
}
.gx-b2c .b2c-btn-outline:hover {
    background: rgba(255, 255, 255, 0.05);
    border-color: #ffffff;
}
.gx-b2c .b2c-btn-light {
    background: rgba(255, 255, 255, 0.1);
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.25);
}
.gx-b2c .b2c-btn-light:hover {
    background: rgba(255, 255, 255, 0.18);
}
.gx-b2c .b2c-hero-actions,
.gx-b2c .b2c-final-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: flex-start;
}
.gx-b2c .b2c-final-actions {
    justify-content: center;
    margin-top: 36px;
}

/* ---------- Lista de checagem ---------- */
.gx-b2c .b2c-check-list {
    list-style: none;
    margin: 28px 0 0 0;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 24px;
}
.gx-b2c .b2c-check-list li {
    position: relative;
    padding-left: 26px;
    font-size: 15px;
    color: #334155;
    font-weight: 500;
}
.gx-b2c .b2c-check-list li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    color: #10b981;
    font-weight: 800;
}
.gx-b2c .b2c-check-list.b2c-check-dark li {
    color: #e2e8f0;
}

/* ---------- Tags (badges de recursos) ---------- */
.gx-b2c .b2c-hero-features,
.gx-b2c .b2c-newton-features,
.gx-b2c .b2c-payment-tags,
.gx-b2c .b2c-delivery-features {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 28px;
}
.gx-b2c .b2c-hero-features span,
.gx-b2c .b2c-newton-features span,
.gx-b2c .b2c-payment-tags span,
.gx-b2c .b2c-delivery-features span {
    background: rgba(0, 160, 227, 0.12);
    color: #38bdf8;
    font-size: 12.5px;
    font-weight: 700;
    padding: 8px 16px;
    border-radius: 100px;
    border: 1px solid rgba(0, 160, 227, 0.3);
}
.gx-b2c .b2c-checkout-section .b2c-payment-tags span,
.gx-b2c .b2c-delivery-features span {
    background: #e0f2fe;
    color: #0284c7;
    border-color: rgba(2, 132, 199, 0.25);
}

/* ══════════════════════════════════════════════
   01. HERO
══════════════════════════════════════════════ */
.gx-b2c .b2c-hero {
    padding: 60px 0 100px 0;
}
.gx-b2c .b2c-hero-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}
.gx-b2c .b2c-hero-content h1 {
    font-size: 46px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1px;
    margin: 0 0 20px 0;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}
.gx-b2c .b2c-hero-content h1 span {
    color: #00a0e3;
}
.gx-b2c .b2c-hero-description {
    font-size: 18px;
    color: #cbd5e1;
    line-height: 1.7;
    margin: 0;
    max-width: 520px;
    margin-bottom: 25px;
}

.gx-b2c .b2c-store-mockup {
    position: relative;
}
.gx-b2c .b2c-browser {
    background: #ffffff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 30px 60px -15px rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.08);
}
.gx-b2c .b2c-browser-top {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 16px;
    background: #f1f5f9;
    border-bottom: 1px solid #e2e8f0;
}
.gx-b2c .b2c-browser-dots {
    display: flex;
    gap: 6px;
}
.gx-b2c .b2c-browser-dots i {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #cbd5e1;
    display: block;
}
.gx-b2c .b2c-browser-address {
    flex: 1;
    background: #ffffff;
    border-radius: 100px;
    padding: 4px 14px;
    font-size: 12px;
    color: #64748b;
}
.gx-b2c .b2c-store-header {
    position: static !important;
    top: auto !important;
    left: auto !important;
    z-index: auto !important;
    width: auto !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    gap: 16px;
    padding: 16px 20px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-b2c .b2c-store-header strong {
    font-size: 14px;
    color: #0f172a;
    letter-spacing: 1px;
}
.gx-b2c .b2c-store-search {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 8px;
    background: #f1f5f9;
    border-radius: 100px;
    padding: 8px 16px;
    font-size: 13px;
    color: #94a3b8;
}
.gx-b2c .b2c-store-search i {
    margin-left: auto;
    background: #00a0e3;
    color: #fff;
    font-style: normal;
    font-size: 10px;
    font-weight: 800;
    padding: 3px 8px;
    border-radius: 100px;
}
.gx-b2c .b2c-store-actions {
    display: flex;
    gap: 14px;
    font-size: 13px;
    color: #64748b;
    white-space: nowrap;
}
.gx-b2c .b2c-store-nav {
    display: flex;
    gap: 20px;
    padding: 12px 20px;
    font-size: 13px;
    font-weight: 600;
    color: #334155;
    border-bottom: 1px solid #f1f5f9;
}
.gx-b2c .b2c-store-banner {
    background: linear-gradient(135deg, #0b1e46 0%, #123f8f 100%);
    padding: 32px 20px;
    color: #fff;
}
.gx-b2c .b2c-store-banner small {
    color: #7dd3fc;
    font-weight: 700;
    letter-spacing: 1px;
    font-size: 11px;
}
.gx-b2c .b2c-store-banner h3 {
    font-size: 22px;
    margin: 10px 0 16px 0;
    font-weight: 800;
}
.gx-b2c .b2c-store-banner button {
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 10px 20px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 13px;
}
.gx-b2c .b2c-home-shelf {
    padding: 20px;
}
.gx-b2c .b2c-shelf-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}
.gx-b2c .b2c-shelf-header small {
    display: block;
    color: #94a3b8;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-b2c .b2c-shelf-header strong {
    color: #0f172a;
    font-size: 15px;
}
.gx-b2c .b2c-shelf-header > span {
    background: #e0f2fe;
    color: #0284c7;
    font-size: 11px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 100px;
}
.gx-b2c .b2c-product-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}
.gx-b2c .b2c-product-grid article {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.gx-b2c .b2c-product-image {
    width: 100%;
    aspect-ratio: 1;
    border-radius: 10px;
    background: linear-gradient(135deg, #e0f2fe, #f0f9ff);
    margin-bottom: 4px;
}
.gx-b2c .b2c-product-grid small {
    color: #94a3b8;
    font-size: 10.5px;
}
.gx-b2c .b2c-product-grid strong {
    font-size: 12.5px;
    color: #0f172a;
}
.gx-b2c .b2c-product-grid > article > span {
    color: #00a0e3;
    font-size: 12.5px;
    font-weight: 700;
}
.gx-b2c .b2c-floating-ai {
    position: absolute;
    bottom: -20px;
    left: -20px;
    display: flex;
    align-items: center;
    gap: 12px;
    background: #ffffff;
    border-radius: 14px;
    padding: 14px 20px;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.25);
}
.gx-b2c .b2c-floating-ai > span {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    flex-shrink: 0;
}
.gx-b2c .b2c-floating-ai small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-b2c .b2c-floating-ai strong {
    color: #0f172a;
    font-size: 13px;
}

/* ══════════════════════════════════════════════
   02. JORNADA / 12. PÓS-COMPRA (fluxos com setas)
══════════════════════════════════════════════ */
.gx-b2c .b2c-journey,
.gx-b2c .b2c-order-flow {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
}
.gx-b2c .b2c-journey article,
.gx-b2c .b2c-order-flow article {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 22px 18px;
    text-align: center;
    min-width: 140px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}
.gx-b2c .b2c-journey article span:first-child {
    display: block;
    font-size: 11px;
    font-weight: 800;
    color: #94a3b8;
    margin-bottom: 8px;
}
.gx-b2c .b2c-journey article div,
.gx-b2c .b2c-order-flow article > span {
    width: 40px;
    height: 40px;
    margin: 0 auto 10px auto;
    border-radius: 50%;
    background: #e0f2fe;
    color: #0284c7;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 17px;
}
.gx-b2c .b2c-journey article strong,
.gx-b2c .b2c-order-flow article strong {
    display: block;
    font-size: 14.5px;
    color: #0f172a;
    margin-bottom: 4px;
}
.gx-b2c .b2c-journey article small,
.gx-b2c .b2c-order-flow article small {
    color: #64748b;
    font-size: 12px;
}
.gx-b2c .b2c-journey > i,
.gx-b2c .b2c-order-flow > i {
    font-style: normal;
    color: #cbd5e1;
    font-size: 18px;
}

/* ══════════════════════════════════════════════
   03. CAPACIDADES
══════════════════════════════════════════════ */
.gx-b2c .b2c-capabilities {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}
.gx-b2c .b2c-capabilities article {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 32px;
    transition: all 0.3s ease;
}
.gx-b2c .b2c-capabilities article:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.06);
    border-color: #00a0e3;
}
.gx-b2c .b2c-capabilities article > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: rgba(0, 160, 227, 0.1);
    border: 1px solid rgba(0, 160, 227, 0.2);
    color: #00a0e3;
    font-size: 20px;
    margin-bottom: 20px;
}
.gx-b2c .b2c-capabilities h3 {
    font-size: 19px;
    color: #0f172a;
    margin: 0 0 10px 0;
}
.gx-b2c .b2c-capabilities p {
    font-size: 14.5px;
    color: #64748b;
    line-height: 1.6;
    margin: 0;
}

/* ══════════════════════════════════════════════
   04. VITRINES / IA (prateleira personalizada)
══════════════════════════════════════════════ */
.gx-b2c .b2c-ai-shelf {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 18px;
    padding: 26px;
}
.gx-b2c .b2c-ai-shelf-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}
.gx-b2c .b2c-ai-shelf-header small {
    display: block;
    color: #64748b;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-b2c .b2c-ai-shelf-header strong {
    color: #ffffff;
    font-size: 16px;
}
.gx-b2c .b2c-ai-shelf-header > span {
    background: rgba(0, 160, 227, 0.15);
    color: #38bdf8;
    font-size: 11px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 100px;
}
.gx-b2c .b2c-ai-shelf-products {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    margin-bottom: 20px;
}
.gx-b2c .b2c-ai-shelf-products article {
    position: relative;
    background: #0b0f19;
    border: 1px solid #1e293b;
    border-radius: 12px;
    padding: 10px;
}
.gx-b2c .b2c-ai-shelf-products article > div:first-of-type,
.gx-b2c .b2c-ai-shelf-products article > div {
    width: 100%;
    aspect-ratio: 1;
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(0, 160, 227, 0.25), rgba(128, 43, 226, 0.15));
    margin-bottom: 8px;
}
.gx-b2c .b2c-match {
    position: absolute;
    top: 8px;
    right: 8px;
    background: #10b981;
    color: #fff;
    font-size: 9.5px;
    font-weight: 800;
    padding: 2px 8px;
    border-radius: 100px;
    z-index: 2;
}
.gx-b2c .b2c-ai-shelf-products small {
    display: block;
    color: #64748b;
    font-size: 10.5px;
}
.gx-b2c .b2c-ai-shelf-products strong {
    display: block;
    color: #fff;
    font-size: 13px;
    margin: 2px 0;
}
.gx-b2c .b2c-ai-shelf-products > article > span:last-child {
    color: #00a0e3;
    font-size: 12.5px;
    font-weight: 700;
}
.gx-b2c .b2c-ai-shelf-reason {
    display: flex;
    align-items: center;
    gap: 10px;
    background: rgba(0, 160, 227, 0.08);
    border: 1px solid rgba(0, 160, 227, 0.2);
    border-radius: 10px;
    padding: 12px 16px;
}
.gx-b2c .b2c-ai-shelf-reason span {
    color: #00a0e3;
}
.gx-b2c .b2c-ai-shelf-reason p {
    margin: 0;
    color: #cbd5e1;
    font-size: 12.5px;
    line-height: 1.5;
}

/* ══════════════════════════════════════════════
   05. BUSCA COM IA
══════════════════════════════════════════════ */
.gx-b2c .b2c-ai-search {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 18px;
    padding: 26px;
}
.gx-b2c .b2c-ai-search-title {
    color: #64748b;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1px;
    margin-bottom: 16px;
}
.gx-b2c .b2c-ai-search-input {
    display: flex;
    align-items: center;
    gap: 10px;
    background: #0b0f19;
    border: 1px solid #1e293b;
    border-radius: 100px;
    padding: 12px 18px;
    margin-bottom: 18px;
}
.gx-b2c .b2c-ai-search-input p {
    flex: 1;
    margin: 0;
    color: #e2e8f0;
    font-size: 13.5px;
}
.gx-b2c .b2c-ai-search-input strong {
    color: #00a0e3;
}
.gx-b2c .b2c-ai-intent {
    background: rgba(0, 160, 227, 0.08);
    border: 1px solid rgba(0, 160, 227, 0.2);
    border-radius: 10px;
    padding: 14px 16px;
    margin-bottom: 18px;
}
.gx-b2c .b2c-ai-intent small {
    display: block;
    color: #38bdf8;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.5px;
    margin-bottom: 10px;
}
.gx-b2c .b2c-ai-intent > div {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.gx-b2c .b2c-ai-intent span {
    background: rgba(0, 160, 227, 0.15);
    color: #7dd3fc;
    font-size: 11.5px;
    font-weight: 600;
    padding: 5px 12px;
    border-radius: 100px;
}
.gx-b2c .b2c-ai-search-results-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}
.gx-b2c .b2c-ai-search-results-title strong {
    color: #fff;
    font-size: 14px;
}
.gx-b2c .b2c-ai-search-results-title span {
    color: #64748b;
    font-size: 12px;
}
.gx-b2c .b2c-ai-search-results {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-bottom: 20px;
}
.gx-b2c .b2c-ai-search-results article {
    background: #0b0f19;
    border: 1px solid #1e293b;
    border-radius: 10px;
    padding: 10px;
}
.gx-b2c .b2c-ai-search-results article div {
    width: 100%;
    aspect-ratio: 1;
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(0, 160, 227, 0.25), rgba(128, 43, 226, 0.15));
    margin-bottom: 8px;
}
.gx-b2c .b2c-ai-search-results small {
    display: block;
    color: #10b981;
    font-size: 10px;
    font-weight: 700;
}
.gx-b2c .b2c-ai-search-results strong {
    display: block;
    color: #fff;
    font-size: 12.5px;
    margin: 2px 0;
}
.gx-b2c .b2c-ai-search-results span {
    color: #00a0e3;
    font-size: 12px;
    font-weight: 700;
}
.gx-b2c .b2c-ai-learning {
    display: flex;
    align-items: center;
    gap: 12px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid #1e293b;
    border-radius: 10px;
    padding: 14px 16px;
}
.gx-b2c .b2c-ai-learning > span {
    color: #00a0e3;
    font-size: 18px;
    flex-shrink: 0;
}
.gx-b2c .b2c-ai-learning small {
    display: block;
    color: #64748b;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 4px;
}
.gx-b2c .b2c-ai-learning strong {
    color: #cbd5e1;
    font-size: 12.5px;
    font-weight: 500;
    line-height: 1.5;
}

/* ══════════════════════════════════════════════
   06. PÁGINA DE PRODUTO (PDP)
══════════════════════════════════════════════ */
.gx-b2c .b2c-pdp {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    display: grid;
    grid-template-columns: 100px 1fr;
    gap: 22px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-b2c .b2c-pdp-thumbs {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 10px;
}
.gx-b2c .b2c-pdp-thumbs span {
    display: block;
    width: 100%;
    aspect-ratio: 1;
    border-radius: 8px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
}
.gx-b2c .b2c-pdp-main-image {
    width: 100%;
    aspect-ratio: 1;
    border-radius: 12px;
    background: linear-gradient(135deg, #e0f2fe, #f0f9ff);
}
.gx-b2c .b2c-pdp-info small {
    color: #94a3b8;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-b2c .b2c-pdp-info h3 {
    font-size: 20px;
    color: #0f172a;
    margin: 6px 0 10px 0;
}
.gx-b2c .b2c-rating {
    color: #f59e0b;
    font-size: 13px;
    margin-bottom: 14px;
}
.gx-b2c .b2c-rating span {
    color: #64748b;
    margin-left: 6px;
}
.gx-b2c .b2c-pdp-price {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin-bottom: 16px;
}
.gx-b2c .b2c-pdp-price del {
    color: #94a3b8;
    font-size: 13px;
}
.gx-b2c .b2c-pdp-price strong {
    color: #00a0e3;
    font-size: 22px;
    font-weight: 800;
}
.gx-b2c .b2c-pdp-price small {
    color: #64748b;
    font-size: 12px;
}
.gx-b2c .b2c-pdp-info label {
    display: block;
    font-size: 12px;
    font-weight: 700;
    color: #334155;
    margin: 12px 0 8px 0;
}
.gx-b2c .b2c-color-options,
.gx-b2c .b2c-size-options {
    display: flex;
    gap: 8px;
    margin-bottom: 4px;
}
.gx-b2c .b2c-color-options button {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: 2px solid #e2e8f0;
    background: linear-gradient(135deg, #0f172a, #334155);
}
.gx-b2c .b2c-size-options button {
    min-width: 38px;
    height: 38px;
    padding: 0 10px;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
    background: #fff;
    font-size: 13px;
    font-weight: 600;
    color: #334155;
}
.gx-b2c .b2c-size-options button.active {
    background: #00a0e3;
    border-color: #00a0e3;
    color: #fff;
}
.gx-b2c .b2c-delivery-preview {
    display: flex;
    align-items: center;
    gap: 12px;
    background: #f0f9ff;
    border-radius: 10px;
    padding: 12px 14px;
    margin: 16px 0;
}
.gx-b2c .b2c-delivery-preview span {
    color: #00a0e3;
    font-size: 18px;
}
.gx-b2c .b2c-delivery-preview small {
    display: block;
    color: #64748b;
    font-size: 10.5px;
    font-weight: 700;
}
.gx-b2c .b2c-delivery-preview strong {
    color: #0f172a;
    font-size: 13.5px;
}
.gx-b2c .b2c-buy-button {
    display: block;
    width: 100%;
    background: #00a0e3;
    color: #fff;
    border: none;
    border-radius: 10px;
    padding: 15px;
    font-size: 15px;
    font-weight: 700;
    box-shadow: 0 8px 20px rgba(0, 160, 227, 0.3);
}
.gx-b2c .b2c-buy-button:hover {
    background: #008cc6;
}

/* ══════════════════════════════════════════════
   07. PROMESSA DE ENTREGA
══════════════════════════════════════════════ */
.gx-b2c .b2c-delivery-products {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-bottom: 40px;
}
.gx-b2c .b2c-delivery-products article {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 20px;
    text-align: left;
}
.gx-b2c .b2c-delivery-product-image {
    width: 100%;
    aspect-ratio: 1;
    border-radius: 10px;
    background: linear-gradient(135deg, #e0f2fe, #f0f9ff);
    margin-bottom: 14px;
}
.gx-b2c .b2c-delivery-products small {
    color: #94a3b8;
    font-size: 11.5px;
}
.gx-b2c .b2c-delivery-products strong {
    display: block;
    color: #0f172a;
    font-size: 15px;
    margin: 4px 0 8px 0;
}
.gx-b2c .b2c-delivery-price {
    display: block;
    color: #00a0e3;
    font-weight: 700;
    margin-bottom: 12px;
}
.gx-b2c .b2c-delivery-badge {
    display: inline-block;
    background: #dcfce7;
    color: #16a34a;
    font-size: 12px;
    font-weight: 700;
    padding: 6px 12px;
    border-radius: 100px;
}
.gx-b2c .b2c-delivery-features {
    justify-content: center;
    margin-top: 0;
}

/* ══════════════════════════════════════════════
   08. CARRINHO
══════════════════════════════════════════════ */
.gx-b2c .b2c-cart {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-b2c .b2c-cart-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
    padding-bottom: 14px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-b2c .b2c-cart-header strong {
    color: #0f172a;
    font-size: 16px;
}
.gx-b2c .b2c-cart-header span {
    color: #64748b;
    font-size: 12.5px;
}
.gx-b2c .b2c-cart-item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 0;
    border-bottom: 1px solid #f8fafc;
}
.gx-b2c .b2c-cart-image {
    width: 52px;
    height: 52px;
    border-radius: 10px;
    background: linear-gradient(135deg, #e0f2fe, #f0f9ff);
    flex-shrink: 0;
}
.gx-b2c .b2c-cart-item > div {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.gx-b2c .b2c-cart-item strong {
    color: #0f172a;
    font-size: 14px;
}
.gx-b2c .b2c-cart-item small {
    color: #94a3b8;
    font-size: 11.5px;
}
.gx-b2c .b2c-cart-item > strong {
    color: #0f172a;
    font-size: 14.5px;
}
.gx-b2c .b2c-coupon {
    display: flex;
    gap: 8px;
    margin: 16px 0;
}
.gx-b2c .b2c-coupon input {
    flex: 1;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 10px 14px;
    font-size: 13px;
    color: #334155;
    background: #f8fafc;
}
.gx-b2c .b2c-coupon button {
    border: 1px solid #00a0e3;
    background: #fff;
    color: #00a0e3;
    border-radius: 8px;
    padding: 0 18px;
    font-weight: 700;
    font-size: 13px;
}
.gx-b2c .b2c-cart-summary {
    border-top: 1px dashed #e2e8f0;
    padding-top: 14px;
    margin-bottom: 18px;
}
.gx-b2c .b2c-cart-summary > div {
    display: flex;
    justify-content: space-between;
    font-size: 13.5px;
    color: #64748b;
    margin-bottom: 8px;
}
.gx-b2c .b2c-cart-summary > div.total {
    font-size: 17px;
    font-weight: 800;
    color: #0f172a;
    margin-top: 10px;
}

/* ══════════════════════════════════════════════
   09. CHECKOUT
══════════════════════════════════════════════ */
.gx-b2c .b2c-checkout {
    background: #ffffff;
    border-radius: 18px;
    padding: 26px;
}
.gx-b2c .b2c-checkout-steps {
    display: flex;
    gap: 10px;
    margin-bottom: 22px;
    flex-wrap: wrap;
}
.gx-b2c .b2c-checkout-steps span {
    font-size: 12.5px;
    font-weight: 700;
    padding: 8px 14px;
    border-radius: 100px;
    background: #f1f5f9;
    color: #94a3b8;
}
.gx-b2c .b2c-checkout-steps span.complete {
    background: #dcfce7;
    color: #16a34a;
}
.gx-b2c .b2c-checkout-steps span.active {
    background: #00a0e3;
    color: #fff;
}
.gx-b2c .b2c-checkout-body small {
    color: #94a3b8;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-b2c .b2c-checkout-body h3 {
    font-size: 20px;
    color: #0f172a;
    margin: 6px 0 18px 0;
}
.gx-b2c .b2c-payment-options {
    display: flex;
    gap: 10px;
    margin-bottom: 18px;
}
.gx-b2c .b2c-payment-options button {
    flex: 1;
    padding: 12px;
    border-radius: 10px;
    border: 1px solid #e2e8f0;
    background: #fff;
    font-weight: 700;
    font-size: 13.5px;
    color: #334155;
}
.gx-b2c .b2c-payment-options button.active {
    border-color: #00a0e3;
    background: #f0f9ff;
    color: #00a0e3;
}
.gx-b2c .b2c-payment-selected {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #f8fafc;
    border-radius: 10px;
    padding: 14px 16px;
    margin-bottom: 20px;
}
.gx-b2c .b2c-payment-selected > span {
    background: #00a0e3;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    padding: 4px 10px;
    border-radius: 100px;
}
.gx-b2c .b2c-payment-selected strong {
    display: block;
    color: #0f172a;
    font-size: 15px;
}
.gx-b2c .b2c-payment-selected small {
    color: #64748b;
    font-size: 11.5px;
}

/* ══════════════════════════════════════════════
   10. PROMOÇÕES
══════════════════════════════════════════════ */
.gx-b2c .b2c-promotions {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}
.gx-b2c .b2c-promotions article {
    background: #ffffff;
    border: 1px dashed #cbd5e1;
    border-radius: 14px;
    padding: 22px 18px;
    text-align: center;
}
.gx-b2c .b2c-promotions small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
}
.gx-b2c .b2c-promotions strong {
    display: block;
    color: #0f172a;
    font-size: 17px;
    margin-bottom: 6px;
}
.gx-b2c .b2c-promotions span {
    color: #00a0e3;
    font-weight: 700;
    font-size: 13px;
}

/* ══════════════════════════════════════════════
   11. MINHA CONTA
══════════════════════════════════════════════ */
.gx-b2c .b2c-account {
    display: grid;
    grid-template-columns: 220px 1fr;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-b2c .b2c-account aside {
    background: #f8fafc;
    padding: 24px 18px;
    border-right: 1px solid #e2e8f0;
}
.gx-b2c .b2c-account-user {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
}
.gx-b2c .b2c-account-user > span {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #00a0e3;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
}
.gx-b2c .b2c-account-user small {
    display: block;
    color: #94a3b8;
    font-size: 11px;
}
.gx-b2c .b2c-account-user strong {
    color: #0f172a;
    font-size: 14px;
}
.gx-b2c .b2c-account aside nav {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.gx-b2c .b2c-account aside nav span {
    padding: 9px 10px;
    border-radius: 8px;
    font-size: 13.5px;
    color: #64748b;
    font-weight: 500;
}
.gx-b2c .b2c-account aside nav span.active {
    background: #e0f2fe;
    color: #0284c7;
    font-weight: 700;
}
.gx-b2c .b2c-order {
    padding: 26px;
}
.gx-b2c .b2c-order small {
    color: #94a3b8;
    font-size: 11px;
    font-weight: 700;
}
.gx-b2c .b2c-order h3 {
    color: #0f172a;
    font-size: 20px;
    margin: 6px 0 22px 0;
}
.gx-b2c .b2c-order-timeline {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-bottom: 22px;
}
.gx-b2c .b2c-order-timeline > div {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 13.5px;
    color: #94a3b8;
}
.gx-b2c .b2c-order-timeline > div.complete {
    color: #0f172a;
}
.gx-b2c .b2c-order-timeline > div.active {
    color: #00a0e3;
    font-weight: 700;
}
.gx-b2c .b2c-order-timeline i {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-style: normal;
    font-size: 12px;
    background: #f1f5f9;
    color: #94a3b8;
    flex-shrink: 0;
}
.gx-b2c .b2c-order-timeline > div.complete i {
    background: #dcfce7;
    color: #16a34a;
}
.gx-b2c .b2c-order-timeline > div.active i {
    background: #00a0e3;
    color: #fff;
}
.gx-b2c .b2c-order button {
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 12px 22px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 13.5px;
}

/* ══════════════════════════════════════════════
   13. NEWTON — chat
══════════════════════════════════════════════ */
.gx-b2c .b2c-newton-chat {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 18px;
    overflow: hidden;
}
.gx-b2c .b2c-chat-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 20px;
    border-bottom: 1px solid #1e293b;
}
.gx-b2c .b2c-chat-header > span {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    flex-shrink: 0;
}
.gx-b2c .b2c-chat-header strong {
    display: block;
    color: #fff;
    font-size: 14px;
}
.gx-b2c .b2c-chat-header small {
    color: #64748b;
    font-size: 11px;
}
.gx-b2c .b2c-chat-header i {
    margin-left: auto;
    font-style: normal;
    color: #10b981;
    font-size: 11.5px;
    font-weight: 700;
}
.gx-b2c .b2c-chat-body {
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.gx-b2c .b2c-chat-message {
    max-width: 85%;
    padding: 12px 16px;
    border-radius: 14px;
    font-size: 13.5px;
    line-height: 1.5;
}
.gx-b2c .b2c-chat-message.user {
    align-self: flex-end;
    background: #00a0e3;
    color: #fff;
    border-bottom-right-radius: 4px;
}
.gx-b2c .b2c-chat-message.newton {
    align-self: flex-start;
    display: flex;
    gap: 10px;
    background: #0b0f19;
    border: 1px solid #1e293b;
    color: #e2e8f0;
    border-bottom-left-radius: 4px;
}
.gx-b2c .b2c-chat-message.newton > span {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #00a0e3;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.gx-b2c .b2c-chat-products {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}
.gx-b2c .b2c-chat-products article {
    background: #0b0f19;
    border: 1px solid #1e293b;
    border-radius: 10px;
    padding: 8px;
}
.gx-b2c .b2c-chat-products article div {
    width: 100%;
    aspect-ratio: 1;
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(0, 160, 227, 0.25), rgba(128, 43, 226, 0.15));
    margin-bottom: 6px;
}
.gx-b2c .b2c-chat-products strong {
    display: block;
    color: #fff;
    font-size: 12px;
}
.gx-b2c .b2c-chat-products small {
    display: block;
    color: #f59e0b;
    font-size: 10px;
}
.gx-b2c .b2c-chat-products span {
    color: #00a0e3;
    font-size: 11.5px;
    font-weight: 700;
}
.gx-b2c .b2c-chat-input {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 20px;
    border-top: 1px solid #1e293b;
}
.gx-b2c .b2c-chat-input span {
    flex: 1;
    color: #64748b;
    font-size: 13px;
}
.gx-b2c .b2c-chat-input button {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #00a0e3;
    color: #fff;
    border: none;
    flex-shrink: 0;
}

/* ══════════════════════════════════════════════
   14. AGENTES DE IA
══════════════════════════════════════════════ */
.gx-b2c .b2c-agents-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}
.gx-b2c .b2c-agents-grid article {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 16px;
    padding: 26px;
    transition: all 0.3s ease;
}
.gx-b2c .b2c-agents-grid article:hover {
    border-color: #00a0e3;
    transform: translateY(-4px);
}
.gx-b2c .b2c-agents-grid article > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: rgba(0, 160, 227, 0.12);
    color: #00a0e3;
    margin-bottom: 16px;
}
.gx-b2c .b2c-agents-grid small {
    display: block;
    color: #64748b;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.8px;
    margin-bottom: 6px;
}
.gx-b2c .b2c-agents-grid h3 {
    color: #fff;
    font-size: 18px;
    margin: 0 0 10px 0;
}
.gx-b2c .b2c-agents-grid p {
    color: #94a3b8;
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
}
.gx-b2c .b2c-agent-newton {
    background: linear-gradient(160deg, #0b1e46 0%, #123f8f 100%);
    border-color: transparent;
}
.gx-b2c .b2c-agent-newton > span {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
}

/* ══════════════════════════════════════════════
   15. ECOSSISTEMA
══════════════════════════════════════════════ */
.gx-b2c .b2c-ecosystem {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 30px;
}
.gx-b2c .b2c-ecosystem-core {
    background: linear-gradient(135deg, #00a0e3, #802be2);
    border-radius: 16px;
    padding: 22px 40px;
    text-align: center;
    color: #fff;
}
.gx-b2c .b2c-ecosystem-core small {
    display: block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1px;
    opacity: 0.85;
}
.gx-b2c .b2c-ecosystem-core strong {
    display: block;
    font-size: 20px;
    margin: 4px 0;
}
.gx-b2c .b2c-ecosystem-core span {
    font-size: 12.5px;
    opacity: 0.85;
}
.gx-b2c .b2c-ecosystem-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    width: 100%;
}
.gx-b2c .b2c-ecosystem-grid article {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid #1e293b;
    border-radius: 14px;
    padding: 22px 18px;
    text-align: center;
}
.gx-b2c .b2c-ecosystem-grid small {
    display: block;
    color: #64748b;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
}
.gx-b2c .b2c-ecosystem-grid strong {
    display: block;
    color: #fff;
    font-size: 16px;
    margin-bottom: 4px;
}
.gx-b2c .b2c-ecosystem-grid span {
    color: #94a3b8;
    font-size: 12px;
}

/* ══════════════════════════════════════════════
   16. CTA FINAL
══════════════════════════════════════════════ */
.gx-b2c .b2c-final-cta {
    background: #0b0f19;
    padding: 120px 0;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.gx-b2c .b2c-final-cta::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 600px;
    height: 400px;
    background: radial-gradient(circle, rgba(0, 160, 227, 0.15) 0%, rgba(11, 15, 25, 0) 70%);
}
.gx-b2c .b2c-final-cta .b2c-container {
    position: relative;
    z-index: 1;
    max-width: 800px;
}
.gx-b2c .b2c-final-cta h2 {
    color: #ffffff;
    font-size: 42px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
    margin: 18px 0 20px 0;
}
.gx-b2c .b2c-final-cta h2 span {
    display: block;
    color: #94a3b8;
    font-size: 22px;
    font-weight: 500;
    margin-top: 12px;
}
.gx-b2c .b2c-final-cta p {
    color: #94a3b8;
    font-size: 17px;
    line-height: 1.7;
    max-width: 640px;
    margin: 0 auto;
}

/* ══════════════════════════════════════════════
   RESPONSIVO
══════════════════════════════════════════════ */
@media (max-width: 992px) {
    .gx-b2c .b2c-hero-grid,
    .gx-b2c .b2c-two-columns {
        grid-template-columns: 1fr;
    }
    .gx-b2c .b2c-capabilities,
    .gx-b2c .b2c-delivery-products,
    .gx-b2c .b2c-promotions,
    .gx-b2c .b2c-agents-grid,
    .gx-b2c .b2c-ecosystem-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .gx-b2c .b2c-account {
        grid-template-columns: 1fr;
    }
    .gx-b2c .b2c-account aside {
        border-right: none;
        border-bottom: 1px solid #e2e8f0;
    }
}

@media (max-width: 768px) {
    .gx-b2c .b2c-section {
        padding: 64px 0;
    }
    .gx-b2c .b2c-hero-content h1 {
        font-size: 32px;
    }
    .gx-b2c .b2c-section-heading h2,
    .gx-b2c .b2c-content h2 {
        font-size: 28px;
    }
    .gx-b2c .b2c-check-list {
        grid-template-columns: 1fr;
    }
    .gx-b2c .b2c-pdp {
        grid-template-columns: 1fr;
    }
    .gx-b2c .b2c-pdp-thumbs {
        flex-direction: row;
    }
    .gx-b2c .b2c-product-grid,
    .gx-b2c .b2c-ai-shelf-products,
    .gx-b2c .b2c-ai-search-results,
    .gx-b2c .b2c-chat-products,
    .gx-b2c .b2c-capabilities,
    .gx-b2c .b2c-delivery-products,
    .gx-b2c .b2c-promotions,
    .gx-b2c .b2c-agents-grid,
    .gx-b2c .b2c-ecosystem-grid {
        grid-template-columns: 1fr;
    }
    .gx-b2c .b2c-journey,
    .gx-b2c .b2c-order-flow {
        flex-direction: column;
    }
    .gx-b2c .b2c-journey > i,
    .gx-b2c .b2c-order-flow > i {
        transform: rotate(90deg);
    }
    .gx-b2c .b2c-final-cta h2 {
        font-size: 28px;
    }
}

/* ══════════════════════════════════════════════════════════════
   GALACTIX B2B — padrão visual do b2c.html / Produto.html
   (conteúdo original da página preservado; aqui só entra o estilo)
══════════════════════════════════════════════════════════════ */
.gx-b2b {
    display: block;
    overflow: hidden;
    background: #ffffff;
}
.gx-b2b * {
    box-sizing: border-box;
}
.gx-b2b .b2b-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}
.gx-b2b button {
    font-family: inherit;
    cursor: pointer;
}
.gx-b2b input {
    font-family: inherit;
}

/* ---------- Seções: fundo claro / escuro ---------- */
.gx-b2b .b2b-section {
    padding: 100px 0;
    background: #ffffff;
}
.gx-b2b .b2b-section.b2b-light {
    background: #f8fafc;
}
.gx-b2b .b2b-section.b2b-dark,
.gx-b2b .b2b-section.b2b-ai-section,
.gx-b2b .b2b-section.b2b-commission-section,
.gx-b2b .b2b-section.b2b-insights-section,
.gx-b2b .b2b-section.b2b-newton-section,
.gx-b2b .b2b-section.b2b-agents-section,
.gx-b2b .b2b-section.b2b-ecosystem-section,
.gx-b2b .b2b-hero {
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}

/* ---------- Tipografia comum ---------- */
.gx-b2b .b2b-eyebrow {
    display: inline-block;
    background: #e0f2fe;
    color: #0284c7;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    padding: 6px 16px;
    border-radius: 100px;
    margin-bottom: 22px;
    border: 1px solid rgba(56, 189, 248, 0.4);
}
.gx-b2b .b2b-eyebrow-light {
    background: rgba(56, 189, 248, 0.1);
    color: #38bdf8;
    border: 1px solid rgba(56, 189, 248, 0.3);
}

.gx-b2b .b2b-section-heading {
    max-width: 760px;
    margin: 0 0 60px 0;
}
.gx-b2b .b2b-section-heading.b2b-center {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}
.gx-b2b .b2b-section-heading h2,
.gx-b2b .b2b-content h2 {
    font-size: 38px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
    color: #0f172a;
    margin: 0 0 18px 0;
}
.gx-b2b .b2b-section-heading h2 span,
.gx-b2b .b2b-content h2 span {
    color: #00a0e3;
}
.gx-b2b .b2b-section-heading p,
.gx-b2b .b2b-content p {
    font-size: 18px;
    color: #475569;
    line-height: 1.7;
    margin: 0;
}
.gx-b2b .b2b-section.b2b-dark .b2b-section-heading h2,
.gx-b2b .b2b-section.b2b-ai-section .b2b-section-heading h2,
.gx-b2b .b2b-section.b2b-commission-section .b2b-section-heading h2,
.gx-b2b .b2b-section.b2b-insights-section .b2b-content h2,
.gx-b2b .b2b-section.b2b-newton-section .b2b-section-heading h2,
.gx-b2b .b2b-section.b2b-agents-section .b2b-section-heading h2,
.gx-b2b .b2b-section.b2b-ecosystem-section .b2b-section-heading h2,
.gx-b2b .b2b-hero h1 {
    color: #ffffff;
}
.gx-b2b .b2b-section.b2b-dark .b2b-section-heading p,
.gx-b2b .b2b-section.b2b-ai-section .b2b-section-heading p,
.gx-b2b .b2b-section.b2b-commission-section .b2b-section-heading p,
.gx-b2b .b2b-section.b2b-insights-section .b2b-content p,
.gx-b2b .b2b-section.b2b-newton-section .b2b-section-heading p,
.gx-b2b .b2b-section.b2b-agents-section .b2b-section-heading p,
.gx-b2b .b2b-section.b2b-ecosystem-section .b2b-section-heading p {
    color: #94a3b8;
}
.gx-b2b .b2b-dark .b2b-content h2,
.gx-b2b .b2b-ai-section .b2b-content h2,
.gx-b2b .b2b-commission-section .b2b-content h2 {
    color: #ffffff;
}
.gx-b2b .b2b-dark .b2b-content p,
.gx-b2b .b2b-ai-section .b2b-content p,
.gx-b2b .b2b-commission-section .b2b-content p {
    color: #94a3b8;
}

.gx-b2b .b2b-two-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}
.gx-b2b .b2b-content h3 {
    font-size: 22px;
    color: inherit;
}

/* ---------- Botões ---------- */
.gx-b2b .b2b-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    height: 52px;
    padding: 0 27px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 8px;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 1px solid transparent;
}
.gx-b2b .b2b-btn-primary {
    background: #00a0e3;
    color: #ffffff;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
}
.gx-b2b .b2b-btn-primary:hover {
    background: #008cc6;
    transform: translateY(-2px);
}
.gx-b2b .b2b-btn-outline {
    background: transparent;
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.3);
}
.gx-b2b .b2b-btn-outline:hover {
    background: rgba(255, 255, 255, 0.05);
    border-color: #ffffff;
}
.gx-b2b .b2b-btn-light {
    background: rgba(255, 255, 255, 0.1);
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.25);
}
.gx-b2b .b2b-btn-light:hover {
    background: rgba(255, 255, 255, 0.18);
}
.gx-b2b .b2b-hero-actions,
.gx-b2b .b2b-final-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: flex-start;
}
.gx-b2b .b2b-final-actions {
    justify-content: center;
    margin-top: 36px;
}

/* ---------- Lista de checagem ---------- */
.gx-b2b .b2b-check-list {
    list-style: none;
    margin: 28px 0 0 0;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 24px;
}
.gx-b2b .b2b-check-list li {
    position: relative;
    padding-left: 26px;
    font-size: 15px;
    color: #334155;
    font-weight: 500;
}
.gx-b2b .b2b-check-list li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    color: #10b981;
    font-weight: 800;
}

/* ---------- Tags (badges de recursos) ---------- */
.gx-b2b .b2b-hero-features,
.gx-b2b .b2b-feature-tags,
.gx-b2b .b2b-rule-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 28px;
}
.gx-b2b .b2b-hero-features span,
.gx-b2b .b2b-feature-tags span,
.gx-b2b .b2b-rule-tags span {
    background: rgba(0, 160, 227, 0.12);
    color: #38bdf8;
    font-size: 12.5px;
    font-weight: 700;
    padding: 8px 16px;
    border-radius: 100px;
    border: 1px solid rgba(0, 160, 227, 0.3);
}

/* ══════════════════════════════════════════════
   01. HERO
══════════════════════════════════════════════ */
.gx-b2b .b2b-hero {
    padding: 60px 0 100px 0;
}
.gx-b2b .b2b-hero-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}
.gx-b2b .b2b-hero-content h1 {
    font-size: 44px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1px;
    margin: 0 0 20px 0;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}
.gx-b2b .b2b-hero-content h1 span {
    display: block;
    color: #00a0e3;
    font-size: 26px;
    font-weight: 700;
    margin-top: 10px;
}
.gx-b2b .b2b-hero-description {
    font-size: 18px;
    color: #cbd5e1;
    line-height: 1.7;
    margin: 0;
    max-width: 520px;
    margin-bottom:25px;
}

.gx-b2b .b2b-portal-mockup {
    position: relative;
}
.gx-b2b .b2b-browser {
    background: #ffffff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 30px 60px -15px rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.08);
}
.gx-b2b .b2b-browser-top {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 16px;
    background: #f1f5f9;
    border-bottom: 1px solid #e2e8f0;
}
.gx-b2b .b2b-browser-dots {
    display: flex;
    gap: 6px;
}
.gx-b2b .b2b-browser-dots i {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #cbd5e1;
    display: block;
}
.gx-b2b .b2b-browser-address {
    flex: 1;
    background: #ffffff;
    border-radius: 100px;
    padding: 4px 14px;
    font-size: 12px;
    color: #64748b;
}
.gx-b2b .b2b-portal-header {
    position: static !important;
    top: auto !important;
    left: auto !important;
    z-index: auto !important;
    width: auto !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    gap: 16px;
    padding: 16px 20px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-b2b .b2b-portal-header strong {
    font-size: 14px;
    color: #0f172a;
    letter-spacing: 1px;
}
.gx-b2b .b2b-portal-search {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 8px;
    background: #f1f5f9;
    border-radius: 100px;
    padding: 8px 16px;
    font-size: 13px;
    color: #94a3b8;
}
.gx-b2b .b2b-portal-header > span {
    font-size: 12.5px;
    color: #64748b;
    font-weight: 600;
    white-space: nowrap;
}
.gx-b2b .b2b-dashboard {
    padding: 22px 20px;
}
.gx-b2b .b2b-dashboard-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
}
.gx-b2b .b2b-dashboard-title small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-b2b .b2b-dashboard-title h3 {
    color: #0f172a;
    font-size: 17px;
    margin: 2px 0 0 0;
}
.gx-b2b .b2b-status {
    background: #dcfce7;
    color: #16a34a;
    font-size: 11.5px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 100px;
}
.gx-b2b .b2b-dashboard-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.gx-b2b .b2b-dashboard-cards article {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 12px 14px;
}
.gx-b2b .b2b-dashboard-cards small {
    display: block;
    color: #94a3b8;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-b2b .b2b-dashboard-cards strong {
    display: block;
    color: #0f172a;
    font-size: 15px;
    margin: 4px 0 2px 0;
}
.gx-b2b .b2b-dashboard-cards span {
    color: #64748b;
    font-size: 11px;
}
.gx-b2b .b2b-quick-order-preview {
    background: #0b0f19;
    border-radius: 12px;
    padding: 16px;
}
.gx-b2b .b2b-quick-order-preview > div:first-child small {
    display: block;
    color: #64748b;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-b2b .b2b-quick-order-preview > div:first-child strong {
    display: block;
    color: #ffffff;
    font-size: 13px;
    margin: 3px 0 12px 0;
    font-weight: 600;
}
.gx-b2b .b2b-preview-row {
    display: grid;
    grid-template-columns: 50px 1fr 60px 70px;
    align-items: center;
    gap: 10px;
    padding: 7px 0;
    font-size: 12px;
    border-top: 1px solid #1e293b;
}
.gx-b2b .b2b-preview-row span:first-child {
    color: #64748b;
}
.gx-b2b .b2b-preview-row strong {
    color: #e2e8f0;
    font-weight: 500;
}
.gx-b2b .b2b-preview-row span:last-child {
    color: #00a0e3;
    font-weight: 700;
    text-align: right;
}
.gx-b2b .b2b-quick-order-preview button {
    width: 100%;
    margin-top: 14px;
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 11px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 13px;
}
.gx-b2b .b2b-floating-card {
    position: absolute;
    bottom: -20px;
    left: -20px;
    display: flex;
    align-items: center;
    gap: 12px;
    background: #ffffff;
    border-radius: 14px;
    padding: 14px 20px;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.25);
}
.gx-b2b .b2b-floating-card > span {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    flex-shrink: 0;
}
.gx-b2b .b2b-floating-card small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-b2b .b2b-floating-card strong {
    color: #0f172a;
    font-size: 13px;
}

/* ══════════════════════════════════════════════
   02. PILARES B2B / capacidades genéricas
══════════════════════════════════════════════ */
.gx-b2b .b2b-pillars {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}
.gx-b2b .b2b-pillars article {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 30px 26px;
    transition: all 0.3s ease;
}
.gx-b2b .b2b-pillars article:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.06);
    border-color: #00a0e3;
}
.gx-b2b .b2b-pillars > article > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: rgba(0, 160, 227, 0.1);
    border: 1px solid rgba(0, 160, 227, 0.2);
    color: #00a0e3;
    font-size: 20px;
    margin-bottom: 20px;
}
.gx-b2b .b2b-pillars h3 {
    font-size: 18px;
    color: #0f172a;
    margin: 0 0 10px 0;
}
.gx-b2b .b2b-pillars p {
    font-size: 14px;
    color: #64748b;
    line-height: 1.6;
    margin: 0;
}

/* ══════════════════════════════════════════════
   03. PAINEL DE CONTA (portal autoatendimento)
══════════════════════════════════════════════ */
.gx-b2b .b2b-account-panel {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-b2b .b2b-account-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-b2b .b2b-account-header small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-b2b .b2b-account-header strong {
    color: #0f172a;
    font-size: 16px;
}
.gx-b2b .b2b-account-header > span {
    background: #dcfce7;
    color: #16a34a;
    font-size: 11.5px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 100px;
}
.gx-b2b .b2b-account-menu {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
}
.gx-b2b .b2b-account-menu article {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 18px;
    text-align: center;
}
.gx-b2b .b2b-account-menu span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    margin: 0 auto 10px auto;
    border-radius: 10px;
    background: rgba(0, 160, 227, 0.1);
    color: #00a0e3;
    font-size: 17px;
}
.gx-b2b .b2b-account-menu strong {
    display: block;
    color: #0f172a;
    font-size: 13.5px;
}

/* ══════════════════════════════════════════════
   04. ORGANIZAÇÕES
══════════════════════════════════════════════ */
.gx-b2b .b2b-organization {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
}
.gx-b2b .b2b-org-root {
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    border-radius: 14px;
    padding: 18px 32px;
    text-align: center;
}
.gx-b2b .b2b-org-root small {
    display: block;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 1px;
    opacity: 0.85;
}
.gx-b2b .b2b-org-root strong {
    display: block;
    font-size: 18px;
    margin: 4px 0;
}
.gx-b2b .b2b-org-root span {
    font-size: 12px;
    opacity: 0.85;
}
.gx-b2b .b2b-org-line {
    width: 1px;
    height: 30px;
    background: #cbd5e1;
}
.gx-b2b .b2b-org-units {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    width: 100%;
}
.gx-b2b .b2b-org-units article {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 20px;
    text-align: center;
}
.gx-b2b .b2b-org-units small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 6px;
}
.gx-b2b .b2b-org-units strong {
    display: block;
    color: #0f172a;
    font-size: 16px;
    margin-bottom: 4px;
}
.gx-b2b .b2b-org-units span {
    color: #64748b;
    font-size: 12.5px;
}
.gx-b2b .b2b-org-users {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
}
.gx-b2b .b2b-org-users span {
    background: #f1f5f9;
    color: #334155;
    font-size: 12.5px;
    font-weight: 600;
    padding: 8px 16px;
    border-radius: 100px;
}

/* ══════════════════════════════════════════════
   05. CATÁLOGO / PREÇOS / REGRAS
══════════════════════════════════════════════ */
.gx-b2b .b2b-rules-flow {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 30px;
    margin-bottom: 36px;
}
.gx-b2b .b2b-rules-core {
    background: linear-gradient(135deg, #00a0e3, #802be2);
    border-radius: 14px;
    padding: 16px 32px;
    text-align: center;
    color: #fff;
}
.gx-b2b .b2b-rules-core small {
    display: block;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 1px;
    opacity: 0.85;
}
.gx-b2b .b2b-rules-core strong {
    font-size: 18px;
}
.gx-b2b .b2b-client-rules {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    width: 100%;
}
.gx-b2b .b2b-client-rules article {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 14px;
    padding: 22px;
}
.gx-b2b .b2b-client-rules small {
    display: block;
    color: #64748b;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-b2b .b2b-client-rules strong {
    display: block;
    color: #ffffff;
    font-size: 15px;
    margin: 4px 0 14px 0;
}
.gx-b2b .b2b-client-rules ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.gx-b2b .b2b-client-rules li {
    color: #94a3b8;
    font-size: 12.5px;
    padding-left: 16px;
    position: relative;
}
.gx-b2b .b2b-client-rules li::before {
    content: "•";
    position: absolute;
    left: 0;
    color: #00a0e3;
}

/* ══════════════════════════════════════════════
   06. CRÉDITO
══════════════════════════════════════════════ */
.gx-b2b .b2b-credit-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-b2b .b2b-credit-client {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}
.gx-b2b .b2b-credit-client small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
}
.gx-b2b .b2b-credit-client strong {
    color: #0f172a;
    font-size: 15px;
}
.gx-b2b .b2b-credit-client > span {
    color: #16a34a;
    font-size: 12px;
    font-weight: 700;
}
.gx-b2b .b2b-credit-value {
    margin-bottom: 12px;
}
.gx-b2b .b2b-credit-value small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-b2b .b2b-credit-value strong {
    display: block;
    color: #00a0e3;
    font-size: 26px;
    font-weight: 800;
    margin: 4px 0 2px 0;
}
.gx-b2b .b2b-credit-value span {
    color: #64748b;
    font-size: 12.5px;
}
.gx-b2b .b2b-credit-progress {
    width: 100%;
    height: 8px;
    background: #f1f5f9;
    border-radius: 100px;
    overflow: hidden;
    margin-bottom: 18px;
}
.gx-b2b .b2b-credit-progress span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #00a0e3, #802be2);
    border-radius: 100px;
}
.gx-b2b .b2b-credit-numbers {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 18px;
}
.gx-b2b .b2b-credit-numbers > div {
    background: #f8fafc;
    border-radius: 10px;
    padding: 12px 14px;
}
.gx-b2b .b2b-credit-numbers small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
}
.gx-b2b .b2b-credit-numbers strong {
    color: #0f172a;
    font-size: 14.5px;
}
.gx-b2b .b2b-credit-condition {
    border-top: 1px dashed #e2e8f0;
    padding-top: 16px;
}
.gx-b2b .b2b-credit-condition small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 10px;
}
.gx-b2b .b2b-credit-condition > div {
    display: flex;
    gap: 8px;
}
.gx-b2b .b2b-credit-condition span {
    background: #e0f2fe;
    color: #0284c7;
    font-size: 12px;
    font-weight: 700;
    padding: 6px 14px;
    border-radius: 100px;
}

/* ══════════════════════════════════════════════
   07. PEDIDO RÁPIDO
══════════════════════════════════════════════ */
.gx-b2b .b2b-quick-order {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-b2b .b2b-quick-order-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
}
.gx-b2b .b2b-quick-order-header small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
}
.gx-b2b .b2b-quick-order-header strong {
    color: #0f172a;
    font-size: 16px;
}
.gx-b2b .b2b-quick-order-header > span {
    color: #64748b;
    font-size: 12.5px;
    font-weight: 600;
}
.gx-b2b .b2b-quick-order-columns {
    display: grid;
    grid-template-columns: 90px 1fr 90px;
    gap: 10px;
    padding: 0 4px 8px 4px;
    font-size: 11px;
    font-weight: 700;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.gx-b2b .b2b-quick-order-row {
    display: grid;
    grid-template-columns: 90px 1fr 90px;
    gap: 10px;
    align-items: center;
    padding: 8px 4px;
    border-top: 1px solid #f1f5f9;
}
.gx-b2b .b2b-quick-order-row input {
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    padding: 6px 8px;
    font-size: 12.5px;
    color: #334155;
    background: #f8fafc;
    width: 100%;
}
.gx-b2b .b2b-quick-order-row strong {
    font-size: 13px;
    color: #0f172a;
    font-weight: 500;
}
.gx-b2b .b2b-quick-order .b2b-btn {
    margin-top: 18px;
    width: 100%;
    justify-content: center;
    height: 48px;
}

/* ══════════════════════════════════════════════
   08. PEDIDO POR ARQUIVO + IA
══════════════════════════════════════════════ */
.gx-b2b .b2b-ai-order-flow {
    display: grid;
    grid-template-columns: 1fr auto 1fr auto 1.2fr;
    gap: 16px;
    align-items: center;
}
.gx-b2b .b2b-upload-box {
    background: rgba(255, 255, 255, 0.03);
    border: 1px dashed rgba(0, 160, 227, 0.4);
    border-radius: 16px;
    padding: 28px 18px;
    text-align: center;
}
.gx-b2b .b2b-upload-box > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin: 0 auto 14px auto;
    border-radius: 50%;
    background: rgba(0, 160, 227, 0.12);
    color: #00a0e3;
    font-size: 18px;
}
.gx-b2b .b2b-upload-box strong {
    display: block;
    color: #ffffff;
    font-size: 14.5px;
    margin-bottom: 6px;
}
.gx-b2b .b2b-upload-box small {
    display: block;
    color: #64748b;
    font-size: 11px;
    margin-bottom: 16px;
}
.gx-b2b .b2b-upload-box button {
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 10px 18px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 12.5px;
}
.gx-b2b .b2b-flow-arrow {
    color: #38bdf8;
    font-size: 20px;
    text-align: center;
}
.gx-b2b .b2b-newton-processing {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 16px;
    padding: 22px 18px;
    text-align: center;
}
.gx-b2b .b2b-newton-processing > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    margin: 0 auto 10px auto;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    font-weight: 700;
}
.gx-b2b .b2b-newton-processing small {
    display: block;
    color: #64748b;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-b2b .b2b-newton-processing strong {
    display: block;
    color: #ffffff;
    font-size: 13.5px;
    margin: 4px 0 12px 0;
}
.gx-b2b .b2b-processing-bar {
    width: 100%;
    height: 6px;
    background: #1e293b;
    border-radius: 100px;
    overflow: hidden;
    margin-bottom: 12px;
}
.gx-b2b .b2b-processing-bar span {
    display: block;
    width: 65%;
    height: 100%;
    background: linear-gradient(90deg, #00a0e3, #802be2);
}
.gx-b2b .b2b-newton-processing p {
    color: #94a3b8;
    font-size: 12px;
    line-height: 1.5;
    margin: 0;
}
.gx-b2b .b2b-ai-order-result {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 16px;
    padding: 18px;
}
.gx-b2b .b2b-ai-order-result > div {
    display: grid;
    grid-template-columns: 50px 1fr 40px 40px;
    gap: 8px;
    padding: 8px 0;
    border-bottom: 1px solid #1e293b;
    font-size: 12px;
}
.gx-b2b .b2b-ai-order-result > div:first-child {
    color: #64748b;
    font-size: 10.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.gx-b2b .b2b-ai-order-result > div:last-child {
    border-bottom: none;
}
.gx-b2b .b2b-ai-order-result strong {
    color: #e2e8f0;
    font-weight: 500;
}
.gx-b2b .b2b-ai-order-result span {
    color: #94a3b8;
}
.gx-b2b .b2b-ai-order-result button {
    width: 100%;
    margin-top: 14px;
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 12px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 13px;
}

/* ══════════════════════════════════════════════
   09. WHATSAPP + NEWTON
══════════════════════════════════════════════ */
.gx-b2b .b2b-whatsapp {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 18px;
    padding: 22px;
}
.gx-b2b .b2b-whatsapp-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
    padding-bottom: 14px;
    border-bottom: 1px solid #1e293b;
}
.gx-b2b .b2b-whatsapp-header > span {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    flex-shrink: 0;
}
.gx-b2b .b2b-whatsapp-header strong {
    display: block;
    color: #fff;
    font-size: 14px;
}
.gx-b2b .b2b-whatsapp-header small {
    color: #64748b;
    font-size: 11px;
}
.gx-b2b .b2b-message {
    max-width: 88%;
    padding: 12px 16px;
    border-radius: 14px;
    font-size: 13.5px;
    line-height: 1.5;
    margin-bottom: 14px;
}
.gx-b2b .b2b-message.user {
    margin-left: auto;
    background: #00a0e3;
    color: #fff;
    border-bottom-right-radius: 4px;
}
.gx-b2b .b2b-message.newton {
    display: flex;
    gap: 10px;
    background: #0b0f19;
    border: 1px solid #1e293b;
    color: #e2e8f0;
    border-bottom-left-radius: 4px;
}
.gx-b2b .b2b-message.newton > span {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #00a0e3;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.gx-b2b .b2b-message-order {
    background: #0b0f19;
    border: 1px solid #1e293b;
    border-radius: 12px;
    padding: 16px;
}
.gx-b2b .b2b-message-order > div {
    display: flex;
    justify-content: space-between;
    font-size: 13px;
    color: #e2e8f0;
    padding: 5px 0;
}
.gx-b2b .b2b-message-order strong {
    font-weight: 500;
}
.gx-b2b .b2b-message-order span {
    color: #94a3b8;
}
.gx-b2b .b2b-message-order hr {
    border: none;
    border-top: 1px solid #1e293b;
    margin: 10px 0;
}
.gx-b2b .b2b-message-order div:has(strong):last-of-type,
.gx-b2b .b2b-message-order > div:nth-last-child(3) {
    font-weight: 700;
}
.gx-b2b .b2b-message-order small {
    display: block;
    color: #64748b;
    font-size: 11.5px;
    margin: 8px 0 12px 0;
}
.gx-b2b .b2b-message-order button {
    width: 100%;
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 12px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 13px;
}

/* ══════════════════════════════════════════════
   10. RECOMPRA
══════════════════════════════════════════════ */
.gx-b2b .b2b-reorder-panel {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 22px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-b2b .b2b-reorder-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-b2b .b2b-reorder-header strong {
    color: #0f172a;
    font-size: 15px;
}
.gx-b2b .b2b-reorder-header span {
    color: #64748b;
    font-size: 12px;
}
.gx-b2b .b2b-reorder-panel > article {
    display: grid;
    grid-template-columns: repeat(4, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding: 14px 0;
    border-top: 1px solid #f1f5f9;
}
.gx-b2b .b2b-reorder-panel > article > div small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
}
.gx-b2b .b2b-reorder-panel > article > div strong {
    color: #0f172a;
    font-size: 13.5px;
}
.gx-b2b .b2b-reorder-panel > article > div:last-child {
    display: flex;
    gap: 8px;
}
.gx-b2b .b2b-reorder-panel > article button {
    border: 1px solid #e2e8f0;
    background: #fff;
    color: #334155;
    padding: 8px 14px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}
.gx-b2b .b2b-reorder-panel > article button:last-child {
    background: #00a0e3;
    border-color: #00a0e3;
    color: #fff;
}

/* ══════════════════════════════════════════════
   11. COTAÇÕES
══════════════════════════════════════════════ */
.gx-b2b .b2b-quote {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-b2b .b2b-quote-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}
.gx-b2b .b2b-quote-header small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
}
.gx-b2b .b2b-quote-header strong {
    color: #0f172a;
    font-size: 16px;
}
.gx-b2b .b2b-quote-header > span {
    background: #fef3c7;
    color: #b45309;
    font-size: 11.5px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 100px;
}
.gx-b2b .b2b-quote-client {
    background: #f8fafc;
    border-radius: 10px;
    padding: 12px 14px;
    margin-bottom: 18px;
}
.gx-b2b .b2b-quote-client small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
}
.gx-b2b .b2b-quote-client strong {
    color: #0f172a;
    font-size: 14px;
}
.gx-b2b .b2b-quote-values {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-bottom: 18px;
}
.gx-b2b .b2b-quote-values > div span {
    display: block;
    color: #64748b;
    font-size: 11.5px;
    margin-bottom: 4px;
}
.gx-b2b .b2b-quote-values > div strong {
    color: #0f172a;
    font-size: 16px;
}
.gx-b2b .b2b-policy-ok {
    background: #dcfce7;
    color: #16a34a;
    font-size: 13px;
    font-weight: 700;
    padding: 10px 14px;
    border-radius: 10px;
    margin-bottom: 18px;
}
.gx-b2b .b2b-quote-actions {
    display: flex;
    gap: 10px;
}
.gx-b2b .b2b-quote-actions button {
    flex: 1;
    padding: 12px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 13.5px;
    border: 1px solid #e2e8f0;
    background: #fff;
    color: #334155;
}
.gx-b2b .b2b-quote-actions button:first-child {
    background: #00a0e3;
    border-color: #00a0e3;
    color: #fff;
}

/* ══════════════════════════════════════════════
   12. VENDA ASSISTIDA
══════════════════════════════════════════════ */
.gx-b2b .b2b-assisted-sale {
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: 32px;
    align-items: stretch;
}
.gx-b2b .b2b-customer-profile {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-b2b .b2b-customer-name {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
    padding-bottom: 18px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-b2b .b2b-customer-name > span {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #00a0e3;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    flex-shrink: 0;
}
.gx-b2b .b2b-customer-name small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
}
.gx-b2b .b2b-customer-name strong {
    display: block;
    color: #0f172a;
    font-size: 15px;
}
.gx-b2b .b2b-customer-name p {
    margin: 2px 0 0 0;
    color: #00a0e3;
    font-size: 11px;
    font-weight: 700;
}
.gx-b2b .b2b-customer-info {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 20px;
}
.gx-b2b .b2b-customer-info > div {
    display: flex;
    justify-content: space-between;
    font-size: 13px;
}
.gx-b2b .b2b-customer-info small {
    color: #94a3b8;
}
.gx-b2b .b2b-customer-info strong {
    color: #0f172a;
}
.gx-b2b .b2b-customer-profile > button {
    width: 100%;
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 13px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 13.5px;
}
.gx-b2b .b2b-assisted-benefits {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.gx-b2b .b2b-assisted-benefits article {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 16px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 18px 22px;
}
.gx-b2b .b2b-assisted-benefits > article > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: rgba(0, 160, 227, 0.1);
    color: #00a0e3;
    font-size: 17px;
    flex-shrink: 0;
}
.gx-b2b .b2b-assisted-benefits strong {
    display: block;
    color: #0f172a;
    font-size: 14.5px;
}
.gx-b2b .b2b-assisted-benefits small {
    color: #64748b;
    font-size: 12.5px;
}

/* ══════════════════════════════════════════════
   13. COMISSIONAMENTO
══════════════════════════════════════════════ */
.gx-b2b .b2b-commission-layout {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 30px;
    align-items: start;
}
.gx-b2b .b2b-rule-builder {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 18px;
    padding: 24px;
}
.gx-b2b .b2b-rule-builder-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
    padding-bottom: 14px;
    border-bottom: 1px solid #1e293b;
}
.gx-b2b .b2b-rule-builder-header small {
    display: block;
    color: #64748b;
    font-size: 10px;
    font-weight: 700;
}
.gx-b2b .b2b-rule-builder-header strong {
    color: #fff;
    font-size: 14px;
}
.gx-b2b .b2b-rule-builder-header > span {
    background: #dcfce7;
    color: #16a34a;
    font-size: 11px;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 100px;
}
.gx-b2b .b2b-rule-condition {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 0;
}
.gx-b2b .b2b-rule-condition small {
    width: 24px;
    color: #00a0e3;
    font-weight: 800;
    font-size: 12px;
    flex-shrink: 0;
}
.gx-b2b .b2b-rule-condition > div {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    font-size: 13px;
}
.gx-b2b .b2b-rule-condition span {
    color: #94a3b8;
}
.gx-b2b .b2b-rule-condition strong {
    color: #64748b;
    font-weight: 400;
    font-size: 12px;
}
.gx-b2b .b2b-rule-condition b {
    background: rgba(0, 160, 227, 0.12);
    color: #38bdf8;
    padding: 3px 10px;
    border-radius: 100px;
    font-weight: 700;
}
.gx-b2b .b2b-rule-result {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 12px;
    padding-top: 16px;
    border-top: 1px dashed #1e293b;
}
.gx-b2b .b2b-rule-result small {
    width: 24px;
    color: #10b981;
    font-weight: 800;
    font-size: 12px;
}
.gx-b2b .b2b-rule-result span {
    color: #94a3b8;
    font-size: 13px;
    margin-right: 8px;
}
.gx-b2b .b2b-rule-result strong {
    background: #10b981;
    color: #fff;
    padding: 4px 12px;
    border-radius: 100px;
    font-size: 13px;
}
.gx-b2b .b2b-commission-types {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 24px;
}
.gx-b2b .b2b-commission-types > small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 16px;
}
.gx-b2b .b2b-commission-type-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    margin-bottom: 18px;
}
.gx-b2b .b2b-commission-type-grid article {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 14px 8px;
    text-align: center;
}
.gx-b2b .b2b-commission-type-grid span {
    display: block;
    color: #00a0e3;
    font-size: 16px;
    margin-bottom: 6px;
}
.gx-b2b .b2b-commission-type-grid strong {
    color: #0f172a;
    font-size: 11.5px;
    font-weight: 600;
}
.gx-b2b .b2b-commission-types > p {
    color: #64748b;
    font-size: 13px;
    line-height: 1.6;
    margin: 0;
}

/* ---------- 13.1 Simulador ---------- */
.gx-b2b .b2b-commission-simulator {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 18px;
    padding: 24px;
}
.gx-b2b .b2b-simulator-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
    padding-bottom: 14px;
    border-bottom: 1px solid #1e293b;
}
.gx-b2b .b2b-simulator-header small {
    color: #64748b;
    font-size: 10px;
    font-weight: 700;
}
.gx-b2b .b2b-simulator-header strong {
    color: #fff;
    font-size: 14px;
}
.gx-b2b .b2b-simulator-row {
    display: flex;
    justify-content: space-between;
    font-size: 13.5px;
    color: #94a3b8;
    margin-bottom: 16px;
}
.gx-b2b .b2b-simulator-row strong {
    color: #fff;
}
.gx-b2b .b2b-discount-control {
    margin-bottom: 20px;
}
.gx-b2b .b2b-discount-control > div:first-child {
    display: flex;
    justify-content: space-between;
    font-size: 13px;
    color: #94a3b8;
    margin-bottom: 10px;
}
.gx-b2b .b2b-discount-control strong {
    color: #00a0e3;
}
.gx-b2b .b2b-range {
    position: relative;
    height: 6px;
    background: #1e293b;
    border-radius: 100px;
}
.gx-b2b .b2b-range span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #00a0e3, #802be2);
    border-radius: 100px;
}
.gx-b2b .b2b-range i {
    position: absolute;
    top: 50%;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
    transform: translate(-50%, -50%);
}
.gx-b2b .b2b-simulator-result {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-bottom: 18px;
}
.gx-b2b .b2b-simulator-result > div {
    background: #0b0f19;
    border-radius: 10px;
    padding: 12px 8px;
    text-align: center;
}
.gx-b2b .b2b-simulator-result small {
    display: block;
    color: #64748b;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.3px;
    margin-bottom: 4px;
}
.gx-b2b .b2b-simulator-result strong {
    color: #fff;
    font-size: 14px;
}
.gx-b2b .b2b-simulator-alert {
    display: flex;
    align-items: center;
    gap: 12px;
    background: rgba(16, 185, 129, 0.1);
    border: 1px solid rgba(16, 185, 129, 0.3);
    border-radius: 10px;
    padding: 14px 16px;
}
.gx-b2b .b2b-simulator-alert > span {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: #10b981;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    flex-shrink: 0;
}
.gx-b2b .b2b-simulator-alert strong {
    display: block;
    color: #fff;
    font-size: 13px;
}
.gx-b2b .b2b-simulator-alert small {
    color: #94a3b8;
    font-size: 11.5px;
}

/* ══════════════════════════════════════════════
   14. APROVAÇÕES
══════════════════════════════════════════════ */
.gx-b2b .b2b-approval-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-b2b .b2b-approval-card > div:first-child small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
}
.gx-b2b .b2b-approval-card > div:first-child strong {
    color: #0f172a;
    font-size: 15px;
}
.gx-b2b .b2b-approval-value {
    margin: 16px 0;
}
.gx-b2b .b2b-approval-value small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
}
.gx-b2b .b2b-approval-value strong {
    display: block;
    color: #0f172a;
    font-size: 26px;
    font-weight: 800;
}
.gx-b2b .b2b-approval-limit {
    display: flex;
    justify-content: space-between;
    background: #f8fafc;
    border-radius: 10px;
    padding: 12px 14px;
    font-size: 13px;
    color: #64748b;
    margin-bottom: 16px;
}
.gx-b2b .b2b-approval-limit strong {
    color: #0f172a;
}
.gx-b2b .b2b-approval-warning {
    display: flex;
    align-items: center;
    gap: 12px;
    background: #fef3c7;
    border-radius: 10px;
    padding: 14px 16px;
    margin-bottom: 18px;
}
.gx-b2b .b2b-approval-warning > span {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: #f59e0b;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    flex-shrink: 0;
}
.gx-b2b .b2b-approval-warning strong {
    display: block;
    color: #92400e;
    font-size: 13.5px;
}
.gx-b2b .b2b-approval-warning small {
    color: #b45309;
    font-size: 12px;
}
.gx-b2b .b2b-approval-actions {
    display: flex;
    gap: 10px;
}
.gx-b2b .b2b-approval-actions button {
    flex: 1;
    padding: 12px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 13.5px;
    border: 1px solid #e2e8f0;
    background: #fff;
    color: #334155;
}
.gx-b2b .b2b-approval-actions button:first-child {
    background: #10b981;
    border-color: #10b981;
    color: #fff;
}

/* ══════════════════════════════════════════════
   15. CONTRATOS
══════════════════════════════════════════════ */
.gx-b2b .b2b-contract {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-b2b .b2b-contract-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-b2b .b2b-contract-header small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
}
.gx-b2b .b2b-contract-header strong {
    color: #0f172a;
    font-size: 15px;
}
.gx-b2b .b2b-contract-header > span {
    background: #dcfce7;
    color: #16a34a;
    font-size: 11.5px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 100px;
}
.gx-b2b .b2b-contract-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}
.gx-b2b .b2b-contract-grid > div {
    background: #f8fafc;
    border-radius: 10px;
    padding: 14px;
}
.gx-b2b .b2b-contract-grid small {
    display: block;
    color: #94a3b8;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.3px;
}
.gx-b2b .b2b-contract-grid strong {
    display: block;
    color: #0f172a;
    font-size: 14.5px;
    margin: 4px 0 2px 0;
}
.gx-b2b .b2b-contract-grid span {
    color: #64748b;
    font-size: 11.5px;
}

/* ══════════════════════════════════════════════
   16. INTELIGÊNCIA COMERCIAL
══════════════════════════════════════════════ */
.gx-b2b .b2b-insight-chat {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.gx-b2b .b2b-insight-question {
    align-self: flex-end;
    max-width: 85%;
    background: #00a0e3;
    color: #fff;
    border-radius: 14px;
    border-bottom-right-radius: 4px;
    padding: 14px 18px;
}
.gx-b2b .b2b-insight-question span {
    display: block;
    font-size: 10.5px;
    font-weight: 700;
    opacity: 0.85;
    margin-bottom: 4px;
}
.gx-b2b .b2b-insight-question p {
    margin: 0;
    font-size: 14px;
    line-height: 1.5;
}
.gx-b2b .b2b-insight-answer {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 16px;
    padding: 20px;
}
.gx-b2b .b2b-newton-mini {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
}
.gx-b2b .b2b-newton-mini span {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
}
.gx-b2b .b2b-newton-mini strong {
    color: #fff;
    font-size: 13.5px;
}
.gx-b2b .b2b-insight-answer > p {
    color: #cbd5e1;
    font-size: 14px;
    line-height: 1.6;
    margin: 0 0 16px 0;
}
.gx-b2b .b2b-insight-impact {
    background: rgba(0, 160, 227, 0.08);
    border: 1px solid rgba(0, 160, 227, 0.2);
    border-radius: 10px;
    padding: 14px 16px;
    margin-bottom: 16px;
}
.gx-b2b .b2b-insight-impact small {
    display: block;
    color: #38bdf8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 4px;
}
.gx-b2b .b2b-insight-impact strong {
    color: #fff;
    font-size: 20px;
    font-weight: 800;
}
.gx-b2b .b2b-insight-accounts {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 18px;
}
.gx-b2b .b2b-insight-accounts > div {
    display: flex;
    justify-content: space-between;
    background: #0b0f19;
    border-radius: 8px;
    padding: 10px 14px;
    font-size: 13px;
}
.gx-b2b .b2b-insight-accounts strong {
    color: #e2e8f0;
    font-weight: 500;
}
.gx-b2b .b2b-insight-accounts span {
    color: #f87171;
    font-weight: 700;
}
.gx-b2b .b2b-insight-answer button {
    width: 100%;
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 13px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 13.5px;
}

/* ══════════════════════════════════════════════
   17. NEWTON B2B
══════════════════════════════════════════════ */
.gx-b2b .b2b-newton-examples {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 28px;
}
.gx-b2b .b2b-newton-examples article {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 18px;
    padding: 26px;
}
.gx-b2b .b2b-newton-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    font-weight: 700;
    margin-bottom: 14px;
}
.gx-b2b .b2b-newton-examples > article > small {
    display: block;
    color: #64748b;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
}
.gx-b2b .b2b-newton-examples > article > p {
    color: #e2e8f0;
    font-size: 15px;
    font-style: italic;
    line-height: 1.5;
    margin: 0 0 18px 0;
}
.gx-b2b .b2b-newton-response {
    background: #0b0f19;
    border: 1px solid #1e293b;
    border-radius: 12px;
    padding: 16px;
}
.gx-b2b .b2b-newton-response > small {
    display: block;
    color: #38bdf8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 6px;
}
.gx-b2b .b2b-newton-response > strong {
    display: block;
    color: #fff;
    font-size: 22px;
    font-weight: 800;
    margin-bottom: 12px;
}
.gx-b2b .b2b-newton-response > div {
    display: flex;
    justify-content: space-between;
    font-size: 12.5px;
    padding: 6px 0;
    border-top: 1px solid #1e293b;
}
.gx-b2b .b2b-newton-response span {
    color: #94a3b8;
}
.gx-b2b .b2b-newton-response div strong {
    color: #e2e8f0;
    font-weight: 600;
}

/* ══════════════════════════════════════════════
   18. AGENTES DE IA
══════════════════════════════════════════════ */
.gx-b2b .b2b-agents-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}
.gx-b2b .b2b-agents-grid article {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 16px;
    padding: 26px;
    transition: all 0.3s ease;
}
.gx-b2b .b2b-agents-grid article:hover {
    border-color: #00a0e3;
    transform: translateY(-4px);
}
.gx-b2b .b2b-agents-grid article > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: rgba(0, 160, 227, 0.12);
    color: #00a0e3;
    margin-bottom: 16px;
}
.gx-b2b .b2b-agents-grid small {
    display: block;
    color: #64748b;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.8px;
    margin-bottom: 6px;
}
.gx-b2b .b2b-agents-grid h3 {
    color: #fff;
    font-size: 18px;
    margin: 0 0 10px 0;
}
.gx-b2b .b2b-agents-grid p {
    color: #94a3b8;
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
}
.gx-b2b .b2b-agent-newton {
    background: linear-gradient(160deg, #0b1e46 0%, #123f8f 100%);
    border-color: transparent;
}
.gx-b2b .b2b-agent-newton > span {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
}

/* ══════════════════════════════════════════════
   19. ECOSSISTEMA
══════════════════════════════════════════════ */
.gx-b2b .b2b-ecosystem {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
}
.gx-b2b .b2b-ecosystem-newton {
    display: flex;
    align-items: center;
    gap: 12px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid #1e293b;
    border-radius: 100px;
    padding: 8px 22px 8px 8px;
}
.gx-b2b .b2b-ecosystem-newton > span {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 13px;
}
.gx-b2b .b2b-ecosystem-newton small {
    display: block;
    color: #64748b;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-b2b .b2b-ecosystem-newton strong {
    color: #fff;
    font-size: 13px;
}
.gx-b2b .b2b-ecosystem-line {
    width: 1px;
    height: 26px;
    background: #1e293b;
}
.gx-b2b .b2b-ecosystem-core {
    background: linear-gradient(135deg, #00a0e3, #802be2);
    border-radius: 16px;
    padding: 22px 40px;
    text-align: center;
    color: #fff;
}
.gx-b2b .b2b-ecosystem-core small {
    display: block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1px;
    opacity: 0.85;
}
.gx-b2b .b2b-ecosystem-core strong {
    display: block;
    font-size: 20px;
    margin-top: 4px;
}
.gx-b2b .b2b-ecosystem-modules {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 16px;
    width: 100%;
}
.gx-b2b .b2b-ecosystem-modules article {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid #1e293b;
    border-radius: 14px;
    padding: 20px 14px;
    text-align: center;
}
.gx-b2b .b2b-ecosystem-modules small {
    display: block;
    color: #64748b;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.3px;
    margin-bottom: 8px;
}
.gx-b2b .b2b-ecosystem-modules strong {
    display: block;
    color: #fff;
    font-size: 14.5px;
    margin-bottom: 4px;
}
.gx-b2b .b2b-ecosystem-modules span {
    color: #94a3b8;
    font-size: 11px;
}

/* ══════════════════════════════════════════════
   20. CTA FINAL
══════════════════════════════════════════════ */
.gx-b2b .b2b-final-cta {
    background: #0b0f19;
    padding: 120px 0;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.gx-b2b .b2b-final-cta::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 600px;
    height: 400px;
    background: radial-gradient(circle, rgba(0, 160, 227, 0.15) 0%, rgba(11, 15, 25, 0) 70%);
}
.gx-b2b .b2b-final-cta .b2b-container {
    position: relative;
    z-index: 1;
    max-width: 800px;
}
.gx-b2b .b2b-final-cta h2 {
    color: #ffffff;
    font-size: 42px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
    margin: 18px 0 20px 0;
}
.gx-b2b .b2b-final-cta h2 span {
    display: block;
    color: #94a3b8;
    font-size: 22px;
    font-weight: 500;
    margin-top: 12px;
}
.gx-b2b .b2b-final-cta p {
    color: #94a3b8;
    font-size: 17px;
    line-height: 1.7;
    max-width: 640px;
    margin: 0 auto;
}

/* ══════════════════════════════════════════════
   RESPONSIVO
══════════════════════════════════════════════ */
@media (max-width: 992px) {
    .gx-b2b .b2b-hero-grid,
    .gx-b2b .b2b-two-columns,
    .gx-b2b .b2b-commission-layout,
    .gx-b2b .b2b-assisted-sale {
        grid-template-columns: 1fr;
    }
    .gx-b2b .b2b-pillars,
    .gx-b2b .b2b-org-units,
    .gx-b2b .b2b-client-rules,
    .gx-b2b .b2b-newton-examples,
    .gx-b2b .b2b-agents-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .gx-b2b .b2b-dashboard-cards,
    .gx-b2b .b2b-commission-type-grid,
    .gx-b2b .b2b-ecosystem-modules {
        grid-template-columns: repeat(2, 1fr);
    }
    .gx-b2b .b2b-ai-order-flow {
        grid-template-columns: 1fr;
    }
    .gx-b2b .b2b-ai-order-flow .b2b-flow-arrow {
        transform: rotate(90deg);
    }
}

@media (max-width: 768px) {
    .gx-b2b .b2b-section {
        padding: 64px 0;
    }
    .gx-b2b .b2b-hero-content h1 {
        font-size: 30px;
    }
    .gx-b2b .b2b-section-heading h2,
    .gx-b2b .b2b-content h2 {
        font-size: 26px;
    }
    .gx-b2b .b2b-check-list {
        grid-template-columns: 1fr;
    }
    .gx-b2b .b2b-pillars,
    .gx-b2b .b2b-org-units,
    .gx-b2b .b2b-client-rules,
    .gx-b2b .b2b-dashboard-cards,
    .gx-b2b .b2b-commission-type-grid,
    .gx-b2b .b2b-ecosystem-modules,
    .gx-b2b .b2b-newton-examples,
    .gx-b2b .b2b-agents-grid,
    .gx-b2b .b2b-account-menu,
    .gx-b2b .b2b-quote-values,
    .gx-b2b .b2b-credit-numbers,
    .gx-b2b .b2b-simulator-result,
    .gx-b2b .b2b-contract-grid {
        grid-template-columns: 1fr;
    }
    .gx-b2b .b2b-reorder-panel > article {
        grid-template-columns: 1fr;
        gap: 8px;
    }
    .gx-b2b .b2b-final-cta h2 {
        font-size: 26px;
    }
}

/* ══════════════════════════════════════════════════════════════
   GALACTIX SFA — padrão visual do b2c.html / b2b.html / Produto.html
   (conteúdo original da página preservado; aqui só entra o estilo)
══════════════════════════════════════════════════════════════ */
.gx-sfa {
    display: block;
    overflow: hidden;
    background: #ffffff;
}
.gx-sfa * {
    box-sizing: border-box;
}
.gx-sfa .sfa-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}
.gx-sfa button {
    font-family: inherit;
    cursor: pointer;
}
.gx-sfa input {
    font-family: inherit;
}

/* ---------- Seções: fundo claro / escuro ---------- */
.gx-sfa .sfa-section {
    padding: 100px 0;
    background: #ffffff;
}
.gx-sfa .sfa-section.sfa-light {
    background: #f8fafc;
}
.gx-sfa .sfa-section.sfa-dark,
.gx-sfa .sfa-section.sfa-mobile-section,
.gx-sfa .sfa-section.sfa-offline-section,
.gx-sfa .sfa-section.sfa-mobile-tools-section,
.gx-sfa .sfa-section.sfa-commission-section,
.gx-sfa .sfa-section.sfa-voice-section,
.gx-sfa .sfa-section.sfa-newton-section,
.gx-sfa .sfa-section.sfa-agents-section,
.gx-sfa .sfa-section.sfa-ecosystem-section,
.gx-sfa .sfa-hero {
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}

/* ---------- Tipografia comum ---------- */
.gx-sfa .sfa-eyebrow {
    display: inline-block;
    background: #e0f2fe;
    color: #0284c7;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    padding: 6px 16px;
    border-radius: 100px;
    margin-bottom: 22px;
    border: 1px solid rgba(56, 189, 248, 0.4);
}
.gx-sfa .sfa-eyebrow-light {
    background: rgba(56, 189, 248, 0.1);
    color: #38bdf8;
    border: 1px solid rgba(56, 189, 248, 0.3);
}

.gx-sfa .sfa-section-heading {
    max-width: 760px;
    margin: 0 0 60px 0;
}
.gx-sfa .sfa-section-heading.sfa-center {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}
.gx-sfa .sfa-section-heading h2,
.gx-sfa .sfa-content h2 {
    font-size: 38px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
    color: #0f172a;
    margin: 0 0 18px 0;
}
.gx-sfa .sfa-section-heading h2 span,
.gx-sfa .sfa-content h2 span {
    color: #00a0e3;
}
.gx-sfa .sfa-section-heading p,
.gx-sfa .sfa-content p {
    font-size: 18px;
    color: #475569;
    line-height: 1.7;
    margin: 0;
}
.gx-sfa .sfa-section.sfa-dark .sfa-section-heading h2,
.gx-sfa .sfa-section.sfa-mobile-section .sfa-section-heading h2,
.gx-sfa .sfa-section.sfa-offline-section .sfa-content h2,
.gx-sfa .sfa-section.sfa-mobile-tools-section .sfa-section-heading h2,
.gx-sfa .sfa-section.sfa-commission-section .sfa-content h2,
.gx-sfa .sfa-section.sfa-voice-section .sfa-section-heading h2,
.gx-sfa .sfa-section.sfa-newton-section .sfa-section-heading h2,
.gx-sfa .sfa-section.sfa-agents-section .sfa-section-heading h2,
.gx-sfa .sfa-section.sfa-ecosystem-section .sfa-section-heading h2,
.gx-sfa .sfa-hero h1 {
    color: #ffffff;
}
.gx-sfa .sfa-section.sfa-dark .sfa-section-heading p,
.gx-sfa .sfa-section.sfa-mobile-section .sfa-section-heading p,
.gx-sfa .sfa-section.sfa-offline-section .sfa-content p,
.gx-sfa .sfa-section.sfa-mobile-tools-section .sfa-section-heading p,
.gx-sfa .sfa-section.sfa-commission-section .sfa-content p,
.gx-sfa .sfa-section.sfa-voice-section .sfa-section-heading p,
.gx-sfa .sfa-section.sfa-newton-section .sfa-section-heading p,
.gx-sfa .sfa-section.sfa-agents-section .sfa-section-heading p,
.gx-sfa .sfa-section.sfa-ecosystem-section .sfa-section-heading p {
    color: #94a3b8;
}
.gx-sfa .sfa-dark .sfa-content h2,
.gx-sfa .sfa-offline-section .sfa-content h2,
.gx-sfa .sfa-commission-section .sfa-content h2 {
    color: #ffffff;
}
.gx-sfa .sfa-dark .sfa-content p,
.gx-sfa .sfa-offline-section .sfa-content p,
.gx-sfa .sfa-commission-section .sfa-content p {
    color: #94a3b8;
}

.gx-sfa .sfa-two-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}
.gx-sfa .sfa-content h3 {
    font-size: 22px;
    color: inherit;
}

/* ---------- Botões ---------- */
.gx-sfa .sfa-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    height: 52px;
    padding: 0 25px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 8px;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 1px solid transparent;
}
.gx-sfa .sfa-btn-primary {
    background: #00a0e3;
    color: #ffffff;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
}
.gx-sfa .sfa-btn-primary:hover {
    background: #008cc6;
    transform: translateY(-2px);
}
.gx-sfa .sfa-btn-outline {
    background: transparent;
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.3);
}
.gx-sfa .sfa-btn-outline:hover {
    background: rgba(255, 255, 255, 0.05);
    border-color: #ffffff;
}
.gx-sfa .sfa-btn-light {
    background: rgba(255, 255, 255, 0.1);
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.25);
}
.gx-sfa .sfa-btn-light:hover {
    background: rgba(255, 255, 255, 0.18);
}
.gx-sfa .sfa-hero-actions,
.gx-sfa .sfa-final-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: flex-start;
}
.gx-sfa .sfa-final-actions {
    justify-content: center;
    margin-top: 30px;
}

/* ---------- Lista de checagem ---------- */
.gx-sfa .sfa-check-list {
    list-style: none;
    margin: 28px 0 0 0;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 24px;
}
.gx-sfa .sfa-check-list li {
    position: relative;
    padding-left: 26px;
    font-size: 15px;
    color: #334155;
    font-weight: 500;
}
.gx-sfa .sfa-check-list li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    color: #10b981;
    font-weight: 800;
}

/* ---------- Tags (badges de recursos) ---------- */
.gx-sfa .sfa-hero-features,
.gx-sfa .sfa-offline-features,
.gx-sfa .sfa-platform-tags,
.gx-sfa .sfa-commission-tags,
.gx-sfa .sfa-final-platforms {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 28px;
}
.gx-sfa .sfa-hero-features span,
.gx-sfa .sfa-offline-features span,
.gx-sfa .sfa-platform-tags span,
.gx-sfa .sfa-commission-tags span,
.gx-sfa .sfa-final-platforms span {
    background: rgba(0, 160, 227, 0.12);
    color: #38bdf8;
    font-size: 12.5px;
    font-weight: 700;
    padding: 8px 16px;
    border-radius: 100px;
    border: 1px solid rgba(0, 160, 227, 0.3);
}
.gx-sfa .sfa-final-platforms {
    justify-content: center;
    margin: 24px 0 0 0;
}

/* ---------- Componentes reaproveitados entre seções ---------- */
.gx-sfa .sfa-policy-ok {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #dcfce7;
    color: #16a34a;
    font-size: 13px;
    font-weight: 700;
    padding: 12px 16px;
    border-radius: 10px;
}
.gx-sfa .sfa-range {
    position: relative;
    height: 6px;
    background: #1e293b;
    border-radius: 100px;
}
.gx-sfa .sfa-range span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #00a0e3, #802be2);
    border-radius: 100px;
}
.gx-sfa .sfa-range i {
    position: absolute;
    top: 50%;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
    transform: translate(-50%, -50%);
}

/* ══════════════════════════════════════════════
   01. HERO
══════════════════════════════════════════════ */
.gx-sfa .sfa-hero {
    padding: 60px 0 100px 0;
}
.gx-sfa .sfa-hero-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}
.gx-sfa .sfa-hero-content h1 {
    font-size: 44px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1px;
    margin: 0 0 20px 0;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}
.gx-sfa .sfa-hero-content h1 span {
    display: block;
    color: #00a0e3;
    font-size: 26px;
    font-weight: 700;
    margin-top: 10px;
}
.gx-sfa .sfa-hero-description {
    font-size: 18px;
    color: #cbd5e1;
    line-height: 1.7;
    margin: 0;
    max-width: 520px;
    margin-bottom:25px;
}

.gx-sfa .sfa-dashboard-mockup {
    position: relative;
}
.gx-sfa .sfa-browser {
    background: #ffffff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 30px 60px -15px rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.08);
}
.gx-sfa .sfa-browser-top {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 16px;
    background: #f1f5f9;
    border-bottom: 1px solid #e2e8f0;
}
.gx-sfa .sfa-browser-dots {
    display: flex;
    gap: 6px;
}
.gx-sfa .sfa-browser-dots i {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #cbd5e1;
    display: block;
}
.gx-sfa .sfa-browser-address {
    flex: 1;
    background: #ffffff;
    border-radius: 100px;
    padding: 4px 14px;
    font-size: 12px;
    color: #64748b;
}
.gx-sfa .sfa-dashboard-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 20px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-sfa .sfa-dashboard-header small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-sfa .sfa-dashboard-header h3 {
    color: #0f172a;
    font-size: 17px;
    margin: 2px 0 0 0;
}
.gx-sfa .sfa-online {
    background: #dcfce7;
    color: #16a34a;
    font-size: 11.5px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 100px;
}
.gx-sfa .sfa-kpis {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    padding: 18px 20px;
}
.gx-sfa .sfa-kpis article {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 12px 14px;
}
.gx-sfa .sfa-kpis small {
    display: block;
    color: #94a3b8;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-sfa .sfa-kpis strong {
    display: block;
    color: #0f172a;
    font-size: 15px;
    margin: 4px 0 2px 0;
}
.gx-sfa .sfa-kpis span {
    color: #64748b;
    font-size: 11px;
}
.gx-sfa .sfa-newton-card {
    margin: 0 20px 20px 20px;
    background: #0b0f19;
    border-radius: 14px;
    padding: 18px;
}
.gx-sfa .sfa-newton-card-title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}
.gx-sfa .sfa-newton-card-title > span {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 13px;
    flex-shrink: 0;
}
.gx-sfa .sfa-newton-card-title small {
    display: block;
    color: #64748b;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-sfa .sfa-newton-card-title strong {
    color: #fff;
    font-size: 13.5px;
}
.gx-sfa .sfa-newton-card > p {
    color: #cbd5e1;
    font-size: 13px;
    margin: 0 0 12px 0;
}
.gx-sfa .sfa-newton-card ul {
    list-style: none;
    margin: 0 0 14px 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.gx-sfa .sfa-newton-card li {
    color: #94a3b8;
    font-size: 12px;
    line-height: 1.5;
    padding-left: 14px;
    position: relative;
}
.gx-sfa .sfa-newton-card li::before {
    content: "•";
    position: absolute;
    left: 0;
    color: #00a0e3;
}
.gx-sfa .sfa-newton-card li strong {
    color: #e2e8f0;
}
.gx-sfa .sfa-newton-card > button {
    width: 100%;
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 11px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 12.5px;
}
.gx-sfa .sfa-floating-mobile {
    position: absolute;
    bottom: -20px;
    left: -20px;
    display: flex;
    align-items: center;
    gap: 12px;
    background: #ffffff;
    border-radius: 14px;
    padding: 14px 20px;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.25);
}
.gx-sfa .sfa-floating-mobile > span {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    flex-shrink: 0;
}
.gx-sfa .sfa-floating-mobile small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-sfa .sfa-floating-mobile strong {
    color: #0f172a;
    font-size: 13px;
}

/* ══════════════════════════════════════════════
   02. JORNADA COMERCIAL
══════════════════════════════════════════════ */
.gx-sfa .sfa-journey {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
}
.gx-sfa .sfa-journey article {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 22px 18px;
    text-align: center;
    min-width: 140px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}
.gx-sfa .sfa-journey article > span:first-child {
    display: block;
    font-size: 11px;
    font-weight: 800;
    color: #94a3b8;
    margin-bottom: 8px;
}
.gx-sfa .sfa-journey article > div {
    width: 40px;
    height: 40px;
    margin: 0 auto 10px auto;
    border-radius: 50%;
    background: #e0f2fe;
    color: #0284c7;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 17px;
}
.gx-sfa .sfa-journey article strong {
    display: block;
    font-size: 14.5px;
    color: #0f172a;
    margin-bottom: 4px;
}
.gx-sfa .sfa-journey article small {
    color: #64748b;
    font-size: 12px;
}
.gx-sfa .sfa-journey > i {
    font-style: normal;
    color: #cbd5e1;
    font-size: 18px;
}

/* ══════════════════════════════════════════════
   03. MINHA CARTEIRA
══════════════════════════════════════════════ */
.gx-sfa .sfa-portfolio {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 24px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-sfa .sfa-portfolio-header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-sfa .sfa-portfolio-header small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
}
.gx-sfa .sfa-portfolio-header strong {
    color: #0f172a;
    font-size: 16px;
}
.gx-sfa .sfa-customer-card {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 20px;
}
.gx-sfa .sfa-customer-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}
.gx-sfa .sfa-customer-card-top small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
}
.gx-sfa .sfa-customer-card-top strong {
    color: #0f172a;
    font-size: 15px;
}
.gx-sfa .sfa-customer-card-top > span {
    background: rgba(0, 160, 227, 0.12);
    color: #0284c7;
    font-size: 11px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 100px;
}
.gx-sfa .sfa-customer-stats {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    margin-bottom: 16px;
}
.gx-sfa .sfa-customer-stats > div {
    background: #ffffff;
    border-radius: 10px;
    padding: 10px 12px;
}
.gx-sfa .sfa-customer-stats small {
    display: block;
    color: #94a3b8;
    font-size: 9.5px;
    font-weight: 700;
}
.gx-sfa .sfa-customer-stats strong {
    color: #0f172a;
    font-size: 14px;
}
.gx-sfa .sfa-customer-actions {
    display: flex;
    gap: 10px;
}
.gx-sfa .sfa-customer-actions button {
    flex: 1;
    border: 1px solid #e2e8f0;
    background: #fff;
    color: #334155;
    padding: 11px;
    border-radius: 8px;
    font-size: 12.5px;
    font-weight: 700;
}
.gx-sfa .sfa-customer-actions button:last-child {
    background: #00a0e3;
    border-color: #00a0e3;
    color: #fff;
}

/* ══════════════════════════════════════════════
   04. CLIENTE 360
══════════════════════════════════════════════ */
.gx-sfa .sfa-customer-360 {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-sfa .sfa-360-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
    padding-bottom: 16px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-sfa .sfa-360-header small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
}
.gx-sfa .sfa-360-header h3 {
    color: #0f172a;
    font-size: 17px;
    margin: 2px 0;
}
.gx-sfa .sfa-360-header span {
    color: #64748b;
    font-size: 11.5px;
}
.gx-sfa .sfa-360-header strong {
    background: #fef3c7;
    color: #b45309;
    font-size: 10.5px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 100px;
}
.gx-sfa .sfa-360-kpis {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.gx-sfa .sfa-360-kpis > div {
    background: #f8fafc;
    border-radius: 10px;
    padding: 12px 14px;
}
.gx-sfa .sfa-360-kpis small {
    display: block;
    color: #94a3b8;
    font-size: 9.5px;
    font-weight: 700;
}
.gx-sfa .sfa-360-kpis strong {
    color: #0f172a;
    font-size: 14.5px;
}
.gx-sfa .sfa-behavior {
    border-top: 1px dashed #e2e8f0;
    padding-top: 16px;
    margin-bottom: 18px;
}
.gx-sfa .sfa-behavior > small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 10px;
}
.gx-sfa .sfa-behavior > div {
    display: flex;
    justify-content: space-between;
    font-size: 13px;
    padding: 6px 0;
}
.gx-sfa .sfa-behavior span {
    color: #64748b;
}
.gx-sfa .sfa-behavior strong {
    color: #0f172a;
    font-weight: 700;
}
.gx-sfa .sfa-newton-insight {
    display: flex;
    gap: 12px;
    background: #111827;
    border-radius: 14px;
    padding: 18px;
}
.gx-sfa .sfa-newton-insight > span {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    flex-shrink: 0;
}
.gx-sfa .sfa-newton-insight small {
    display: block;
    color: #64748b;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-sfa .sfa-newton-insight strong {
    display: block;
    color: #fff;
    font-size: 14px;
    margin: 4px 0 8px 0;
}
.gx-sfa .sfa-newton-insight p {
    color: #94a3b8;
    font-size: 12.5px;
    line-height: 1.5;
    margin: 0 0 14px 0;
}
.gx-sfa .sfa-newton-insight button {
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 10px 18px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 12.5px;
}

/* ══════════════════════════════════════════════
   05. PRIORIDADES
══════════════════════════════════════════════ */
.gx-sfa .sfa-priorities {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 18px;
    padding: 22px;
}
.gx-sfa .sfa-priorities-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
    padding-bottom: 14px;
    border-bottom: 1px solid #1e293b;
}
.gx-sfa .sfa-priorities-header > div {
    display: flex;
    align-items: center;
    gap: 10px;
}
.gx-sfa .sfa-priorities-header > div > span {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 12px;
}
.gx-sfa .sfa-priorities-header small {
    display: block;
    color: #64748b;
    font-size: 9.5px;
    font-weight: 700;
}
.gx-sfa .sfa-priorities-header strong {
    color: #fff;
    font-size: 13.5px;
}
.gx-sfa .sfa-priorities-header > span {
    color: #38bdf8;
    font-size: 12px;
    font-weight: 700;
}
.gx-sfa .sfa-priorities article {
    display: grid;
    grid-template-columns: 30px 1fr auto auto;
    align-items: center;
    gap: 14px;
    padding: 14px 0;
    border-top: 1px solid #1e293b;
}
.gx-sfa .sfa-priorities article b {
    color: #38bdf8;
    font-size: 15px;
}
.gx-sfa .sfa-priorities article strong {
    display: block;
    color: #fff;
    font-size: 13.5px;
}
.gx-sfa .sfa-priorities article span {
    color: #94a3b8;
    font-size: 12px;
}
.gx-sfa .sfa-priorities article > div:nth-child(3) small {
    display: block;
    color: #64748b;
    font-size: 9px;
    font-weight: 700;
}
.gx-sfa .sfa-priorities article > div:nth-child(3) strong {
    color: #00a0e3;
    font-size: 13px;
}
.gx-sfa .sfa-priorities article button {
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 8px 16px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 12px;
    white-space: nowrap;
}

/* ══════════════════════════════════════════════
   06. APLICATIVO ANDROID + IPHONE
══════════════════════════════════════════════ */
.gx-sfa .sfa-mobile-layout {
    display: grid;
    grid-template-columns: 260px 1fr 260px;
    gap: 40px;
    align-items: center;
}
.gx-sfa .sfa-phone {
    background: #0b0f19;
    border: 6px solid #111827;
    border-radius: 32px;
    padding: 16px 14px;
    box-shadow: 0 30px 60px -15px rgba(0, 0, 0, 0.6);
}
.gx-sfa .sfa-phone-top {
    display: flex;
    justify-content: space-between;
    color: #64748b;
    font-size: 10px;
    margin-bottom: 10px;
}
.gx-sfa .sfa-phone-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}
.gx-sfa .sfa-phone-header small {
    display: block;
    color: #64748b;
    font-size: 8.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-sfa .sfa-phone-header strong {
    color: #fff;
    font-size: 13px;
}
.gx-sfa .sfa-phone-header > span {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: #00a0e3;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 700;
}
.gx-sfa .sfa-phone-summary {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-bottom: 12px;
}
.gx-sfa .sfa-phone-summary article {
    background: #111827;
    border-radius: 8px;
    padding: 8px 10px;
}
.gx-sfa .sfa-phone-summary small {
    display: block;
    color: #64748b;
    font-size: 8px;
    font-weight: 700;
}
.gx-sfa .sfa-phone-summary strong {
    color: #fff;
    font-size: 14px;
}
.gx-sfa .sfa-phone-newton {
    display: flex;
    align-items: center;
    gap: 8px;
    background: rgba(0, 160, 227, 0.12);
    border: 1px solid rgba(0, 160, 227, 0.25);
    border-radius: 10px;
    padding: 10px;
    margin-bottom: 12px;
}
.gx-sfa .sfa-phone-newton > span {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 700;
    flex-shrink: 0;
}
.gx-sfa .sfa-phone-newton small {
    display: block;
    color: #38bdf8;
    font-size: 8px;
    font-weight: 700;
}
.gx-sfa .sfa-phone-newton strong {
    color: #e2e8f0;
    font-size: 10.5px;
    font-weight: 500;
    line-height: 1.4;
}
.gx-sfa .sfa-phone-visits > small,
.gx-sfa .sfa-phone-page-title small {
    display: block;
    color: #64748b;
    font-size: 8.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
}
.gx-sfa .sfa-phone-page-title {
    margin-bottom: 14px;
}
.gx-sfa .sfa-phone-page-title strong {
    display: block;
    color: #fff;
    font-size: 15px;
    margin-top: 2px;
}
.gx-sfa .sfa-phone-visits article {
    display: flex;
    align-items: center;
    gap: 10px;
    background: #111827;
    border-radius: 8px;
    padding: 8px 10px;
    margin-bottom: 6px;
}
.gx-sfa .sfa-phone-visits article > span {
    color: #38bdf8;
    font-size: 10.5px;
    font-weight: 700;
}
.gx-sfa .sfa-phone-visits strong {
    display: block;
    color: #fff;
    font-size: 11px;
}
.gx-sfa .sfa-phone-visits small {
    color: #64748b;
    font-size: 9.5px;
}
.gx-sfa .sfa-mobile-route article {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    border-bottom: 1px solid #1e293b;
}
.gx-sfa .sfa-mobile-route article > span {
    color: #38bdf8;
    font-size: 10.5px;
    font-weight: 700;
    width: 38px;
    flex-shrink: 0;
}
.gx-sfa .sfa-mobile-route article > i {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #00a0e3;
    flex-shrink: 0;
}
.gx-sfa .sfa-mobile-route strong {
    display: block;
    color: #fff;
    font-size: 11px;
}
.gx-sfa .sfa-mobile-route small {
    color: #64748b;
    font-size: 9.5px;
}
.gx-sfa .sfa-phone-button {
    width: 100%;
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 10px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 12px;
    margin: 12px 0;
}
.gx-sfa .sfa-phone-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 12px;
    border-top: 1px solid #1e293b;
    color: #64748b;
    font-size: 14px;
}
.gx-sfa .sfa-phone-nav strong {
    color: #00a0e3;
    font-size: 20px;
    font-weight: 400;
}
.gx-sfa .sfa-mobile-features {
    text-align: center;
}
.gx-sfa .sfa-platforms {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-bottom: 18px;
}
.gx-sfa .sfa-platforms span {
    background: rgba(0, 160, 227, 0.12);
    color: #38bdf8;
    font-size: 11.5px;
    font-weight: 700;
    padding: 6px 14px;
    border-radius: 100px;
    border: 1px solid rgba(0, 160, 227, 0.3);
}
.gx-sfa .sfa-mobile-features h3 {
    color: #fff;
    font-size: 22px;
    font-weight: 700;
    line-height: 1.4;
    margin: 0 0 24px 0;
}
.gx-sfa .sfa-mobile-feature-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
}
.gx-sfa .sfa-mobile-feature-grid article {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid #1e293b;
    border-radius: 12px;
    padding: 16px 10px;
}
.gx-sfa .sfa-mobile-feature-grid span {
    display: block;
    color: #00a0e3;
    font-size: 17px;
    margin-bottom: 8px;
}
.gx-sfa .sfa-mobile-feature-grid strong {
    display: block;
    color: #fff;
    font-size: 12.5px;
}
.gx-sfa .sfa-mobile-feature-grid small {
    color: #64748b;
    font-size: 10.5px;
}

/* ══════════════════════════════════════════════
   07. OFFLINE FIRST
══════════════════════════════════════════════ */
.gx-sfa .sfa-offline-card {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 18px;
    padding: 24px;
}
.gx-sfa .sfa-offline-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}
.gx-sfa .sfa-offline-header > div {
    display: flex;
    align-items: center;
    gap: 10px;
}
.gx-sfa .sfa-offline-header > div > span {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: rgba(0, 160, 227, 0.12);
    color: #00a0e3;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
}
.gx-sfa .sfa-offline-header small {
    display: block;
    color: #64748b;
    font-size: 9.5px;
    font-weight: 700;
}
.gx-sfa .sfa-offline-header strong {
    color: #fff;
    font-size: 14px;
}
.gx-sfa .sfa-offline-status {
    background: #fef3c7;
    color: #b45309;
    font-size: 11px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 100px;
}
.gx-sfa .sfa-offline-card > p {
    color: #94a3b8;
    font-size: 13px;
    line-height: 1.6;
    margin: 0 0 18px 0;
}
.gx-sfa .sfa-offline-data {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    margin-bottom: 18px;
}
.gx-sfa .sfa-offline-data > div {
    background: #0b0f19;
    border-radius: 10px;
    padding: 12px;
}
.gx-sfa .sfa-offline-data span {
    color: #10b981;
    font-size: 12px;
}
.gx-sfa .sfa-offline-data strong {
    display: block;
    color: #fff;
    font-size: 12.5px;
    margin: 4px 0 2px 0;
}
.gx-sfa .sfa-offline-data small {
    color: #64748b;
    font-size: 10.5px;
}
.gx-sfa .sfa-sync-pending {
    background: rgba(245, 158, 11, 0.1);
    border: 1px solid rgba(245, 158, 11, 0.3);
    border-radius: 10px;
    padding: 14px;
    margin-bottom: 14px;
}
.gx-sfa .sfa-sync-pending > small {
    display: block;
    color: #fbbf24;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
}
.gx-sfa .sfa-sync-pending > div {
    display: flex;
    justify-content: space-between;
    font-size: 12.5px;
    color: #e2e8f0;
    padding: 4px 0;
}
.gx-sfa .sfa-sync-pending strong {
    color: #fbbf24;
}
.gx-sfa .sfa-last-sync {
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    color: #64748b;
}
.gx-sfa .sfa-last-sync strong {
    color: #e2e8f0;
}

/* ══════════════════════════════════════════════
   08. AGENDA E ROTEIRO
══════════════════════════════════════════════ */
.gx-sfa .sfa-route-panel {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
}
.gx-sfa .sfa-route-map {
    position: relative;
    background: #e2e8f0;
    border-radius: 18px;
    min-height: 320px;
    overflow: hidden;
}
.gx-sfa .sfa-map-road {
    position: absolute;
    background: #cbd5e1;
}
.gx-sfa .sfa-map-road.road-1 {
    top: 20%;
    left: 0;
    width: 100%;
    height: 6px;
}
.gx-sfa .sfa-map-road.road-2 {
    top: 20%;
    left: 30%;
    width: 6px;
    height: 50%;
}
.gx-sfa .sfa-map-road.road-3 {
    top: 55%;
    left: 30%;
    width: 55%;
    height: 6px;
}
.gx-sfa .sfa-map-pin {
    position: absolute;
    width: 30px;
    height: 30px;
    border-radius: 50% 50% 50% 0;
    background: #00a0e3;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    transform: rotate(-45deg);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25);
}
.gx-sfa .sfa-map-pin span,
.gx-sfa .sfa-map-pin {
    text-align: center;
}
.gx-sfa .sfa-map-pin.pin-1 {
    top: 12%;
    left: 27%;
}
.gx-sfa .sfa-map-pin.pin-2 {
    top: 45%;
    left: 27%;
}
.gx-sfa .sfa-map-pin.pin-3 {
    top: 47%;
    left: 82%;
}
.gx-sfa .sfa-route-list {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 22px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-sfa .sfa-route-list-header {
    margin-bottom: 16px;
    padding-bottom: 14px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-sfa .sfa-route-list-header small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
}
.gx-sfa .sfa-route-list-header strong {
    color: #0f172a;
    font-size: 16px;
}
.gx-sfa .sfa-route-list article {
    display: grid;
    grid-template-columns: 50px 1fr 30px;
    align-items: center;
    gap: 12px;
    padding: 12px 0;
    border-top: 1px solid #f1f5f9;
}
.gx-sfa .sfa-route-list article > span {
    color: #00a0e3;
    font-weight: 700;
    font-size: 13px;
}
.gx-sfa .sfa-route-list article strong {
    display: block;
    color: #0f172a;
    font-size: 13.5px;
}
.gx-sfa .sfa-route-list article small {
    color: #64748b;
    font-size: 11.5px;
}
.gx-sfa .sfa-route-list article b {
    background: #f1f5f9;
    color: #334155;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 700;
}

/* ══════════════════════════════════════════════
   09. PREPARAÇÃO DA VISITA
══════════════════════════════════════════════ */
.gx-sfa .sfa-visit-brief {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-sfa .sfa-visit-brief-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
    padding-bottom: 16px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-sfa .sfa-visit-brief-header small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
}
.gx-sfa .sfa-visit-brief-header strong {
    color: #0f172a;
    font-size: 16px;
}
.gx-sfa .sfa-visit-brief-header > span {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
}
.gx-sfa .sfa-visit-summary {
    margin-bottom: 18px;
}
.gx-sfa .sfa-visit-summary > small {
    display: block;
    color: #0284c7;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 12px;
}
.gx-sfa .sfa-visit-summary article {
    display: flex;
    justify-content: space-between;
    font-size: 13px;
    padding: 9px 0;
    border-top: 1px solid #f1f5f9;
}
.gx-sfa .sfa-visit-summary span {
    color: #64748b;
}
.gx-sfa .sfa-visit-summary strong {
    color: #0f172a;
    font-weight: 600;
    text-align: right;
}
.gx-sfa .sfa-visit-suggestion {
    background: #f0f9ff;
    border-radius: 10px;
    padding: 14px 16px;
    margin-bottom: 18px;
}
.gx-sfa .sfa-visit-suggestion small {
    display: block;
    color: #0284c7;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 6px;
}
.gx-sfa .sfa-visit-suggestion p {
    margin: 0;
    color: #334155;
    font-size: 13.5px;
    line-height: 1.5;
}
.gx-sfa .sfa-visit-brief > button {
    width: 100%;
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 14px;
    border-radius: 10px;
    font-weight: 700;
    font-size: 14px;
}

/* ══════════════════════════════════════════════
   10. CHECK-IN / VISITA
══════════════════════════════════════════════ */
.gx-sfa .sfa-visit-active {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-sfa .sfa-visit-active-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
}
.gx-sfa .sfa-visit-active-header small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
}
.gx-sfa .sfa-visit-active-header strong {
    color: #0f172a;
    font-size: 16px;
}
.gx-sfa .sfa-visit-active-header > span {
    color: #ef4444;
    font-size: 12px;
    font-weight: 700;
}
.gx-sfa .sfa-checkin {
    display: flex;
    align-items: center;
    gap: 12px;
    background: #dcfce7;
    border-radius: 10px;
    padding: 12px 16px;
    margin-bottom: 20px;
}
.gx-sfa .sfa-checkin > span {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #16a34a;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    flex-shrink: 0;
}
.gx-sfa .sfa-checkin small {
    display: block;
    color: #15803d;
    font-size: 10px;
    font-weight: 700;
}
.gx-sfa .sfa-checkin strong {
    color: #14532d;
    font-size: 13.5px;
}
.gx-sfa .sfa-visit-actions {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-bottom: 20px;
}
.gx-sfa .sfa-visit-actions button {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 14px 8px;
    font-size: 11.5px;
    font-weight: 600;
    color: #334155;
}
.gx-sfa .sfa-visit-actions button span {
    color: #00a0e3;
    font-size: 17px;
}
.gx-sfa .sfa-finish-visit {
    width: 100%;
    background: #ef4444;
    color: #fff;
    border: none;
    padding: 14px;
    border-radius: 10px;
    font-weight: 700;
    font-size: 14px;
}

/* ══════════════════════════════════════════════
   11. RECURSOS MOBILE
══════════════════════════════════════════════ */
.gx-sfa .sfa-mobile-tools {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
}
.gx-sfa .sfa-mobile-tools article {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid #1e293b;
    border-radius: 16px;
    padding: 24px 18px;
    text-align: center;
    transition: all 0.3s ease;
}
.gx-sfa .sfa-mobile-tools article:hover {
    border-color: #00a0e3;
    transform: translateY(-4px);
}
.gx-sfa .sfa-mobile-tools span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin: 0 auto 16px auto;
    border-radius: 12px;
    background: rgba(0, 160, 227, 0.12);
    color: #00a0e3;
    font-size: 18px;
}
.gx-sfa .sfa-mobile-tools h3 {
    color: #fff;
    font-size: 15.5px;
    margin: 0 0 8px 0;
}
.gx-sfa .sfa-mobile-tools p {
    color: #94a3b8;
    font-size: 12.5px;
    line-height: 1.5;
    margin: 0;
}

/* ══════════════════════════════════════════════
   12. PEDIDO PELO VENDEDOR
══════════════════════════════════════════════ */
.gx-sfa .sfa-order {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 24px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-sfa .sfa-order-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}
.gx-sfa .sfa-order-header small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
}
.gx-sfa .sfa-order-header strong {
    color: #0f172a;
    font-size: 15px;
}
.gx-sfa .sfa-order-header > span {
    background: rgba(0, 160, 227, 0.12);
    color: #0284c7;
    font-size: 11px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 100px;
}
.gx-sfa .sfa-order-context {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-bottom: 16px;
}
.gx-sfa .sfa-order-context > div {
    background: #f8fafc;
    border-radius: 8px;
    padding: 10px;
}
.gx-sfa .sfa-order-context small {
    display: block;
    color: #94a3b8;
    font-size: 9px;
    font-weight: 700;
}
.gx-sfa .sfa-order-context strong {
    color: #0f172a;
    font-size: 12.5px;
}
.gx-sfa .sfa-order-products {
    margin-bottom: 14px;
}
.gx-sfa .sfa-order-products > div {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 9px 0;
    border-top: 1px solid #f1f5f9;
    font-size: 13px;
}
.gx-sfa .sfa-order-products span {
    color: #334155;
    flex: 1;
}
.gx-sfa .sfa-order-products strong {
    color: #64748b;
    font-weight: 500;
    margin: 0 12px;
}
.gx-sfa .sfa-order-products b {
    color: #0f172a;
    font-weight: 700;
}
.gx-sfa .sfa-order-summary {
    border-top: 1px dashed #e2e8f0;
    padding-top: 12px;
    margin-bottom: 14px;
}
.gx-sfa .sfa-order-summary > div {
    display: flex;
    justify-content: space-between;
    font-size: 13px;
    color: #64748b;
    padding: 4px 0;
}
.gx-sfa .sfa-order-summary > div:last-child strong {
    color: #0f172a;
    font-size: 16px;
}
.gx-sfa .sfa-order-commercial {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 14px;
}
.gx-sfa .sfa-order-commercial > div {
    background: #f0f9ff;
    border-radius: 8px;
    padding: 10px;
}
.gx-sfa .sfa-order-commercial small {
    display: block;
    color: #0284c7;
    font-size: 9px;
    font-weight: 700;
}
.gx-sfa .sfa-order-commercial strong {
    color: #0f172a;
    font-size: 13px;
}
.gx-sfa .sfa-order-commercial span {
    display: block;
    color: #64748b;
    font-size: 10.5px;
}
.gx-sfa .sfa-order .sfa-policy-ok {
    margin-bottom: 14px;
}
.gx-sfa .sfa-order > button {
    width: 100%;
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 14px;
    border-radius: 10px;
    font-weight: 700;
    font-size: 14px;
}

/* ══════════════════════════════════════════════
   13. PEDIDO OFFLINE
══════════════════════════════════════════════ */
.gx-sfa .sfa-offline-order {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 24px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-sfa .sfa-offline-order-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}
.gx-sfa .sfa-offline-order-header small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
}
.gx-sfa .sfa-offline-order-header strong {
    color: #0f172a;
    font-size: 15px;
}
.gx-sfa .sfa-offline-order-header > span {
    background: #fef3c7;
    color: #b45309;
    font-size: 11px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 100px;
}
.gx-sfa .sfa-offline-info {
    display: flex;
    justify-content: space-between;
    background: #f8fafc;
    border-radius: 8px;
    padding: 10px 14px;
    margin-bottom: 14px;
    font-size: 12.5px;
    color: #64748b;
}
.gx-sfa .sfa-offline-info strong {
    color: #0f172a;
}
.gx-sfa .sfa-offline-order-products > div {
    display: grid;
    grid-template-columns: 50px 1fr 40px 70px;
    align-items: center;
    gap: 10px;
    padding: 9px 0;
    border-top: 1px solid #f1f5f9;
    font-size: 12.5px;
}
.gx-sfa .sfa-offline-order-products span {
    color: #64748b;
}
.gx-sfa .sfa-offline-order-products strong {
    color: #0f172a;
    font-weight: 500;
}
.gx-sfa .sfa-offline-order-products b {
    color: #0f172a;
    font-weight: 700;
    text-align: right;
}
.gx-sfa .sfa-offline-order-total {
    display: flex;
    justify-content: space-between;
    border-top: 1px dashed #e2e8f0;
    padding-top: 12px;
    margin: 8px 0 16px 0;
    font-size: 13px;
    color: #64748b;
    font-weight: 700;
}
.gx-sfa .sfa-offline-order-total strong {
    color: #0f172a;
    font-size: 17px;
}
.gx-sfa .sfa-offline-warning {
    display: flex;
    gap: 12px;
    background: rgba(245, 158, 11, 0.1);
    border: 1px solid rgba(245, 158, 11, 0.3);
    border-radius: 10px;
    padding: 14px 16px;
    margin-bottom: 16px;
}
.gx-sfa .sfa-offline-warning > span {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #f59e0b;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    flex-shrink: 0;
    font-size: 13px;
}
.gx-sfa .sfa-offline-warning strong {
    display: block;
    color: #92400e;
    font-size: 13px;
}
.gx-sfa .sfa-offline-warning p {
    margin: 4px 0 0 0;
    color: #b45309;
    font-size: 12px;
    line-height: 1.4;
}
.gx-sfa .sfa-offline-order > button {
    width: 100%;
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 14px;
    border-radius: 10px;
    font-weight: 700;
    font-size: 14px;
}
.gx-sfa .sfa-validation-flow {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 24px;
}
.gx-sfa .sfa-validation-flow span {
    background: #e0f2fe;
    color: #0284c7;
    font-size: 12px;
    font-weight: 700;
    padding: 7px 14px;
    border-radius: 100px;
}
.gx-sfa .sfa-validation-flow i {
    font-style: normal;
    color: #94a3b8;
}

/* ══════════════════════════════════════════════
   14. NEGOCIAÇÃO
══════════════════════════════════════════════ */
.gx-sfa .sfa-negotiation {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-sfa .sfa-negotiation-header {
    margin-bottom: 18px;
    padding-bottom: 16px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-sfa .sfa-negotiation-header small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
}
.gx-sfa .sfa-negotiation-header strong {
    color: #0f172a;
    font-size: 15px;
}
.gx-sfa .sfa-negotiation-price {
    display: flex;
    justify-content: space-between;
    font-size: 13.5px;
    color: #64748b;
    margin-bottom: 20px;
}
.gx-sfa .sfa-negotiation-price strong {
    color: #0f172a;
}
.gx-sfa .sfa-discount {
    margin-bottom: 20px;
}
.gx-sfa .sfa-discount > div:first-child {
    display: flex;
    justify-content: space-between;
    font-size: 13px;
    color: #64748b;
    margin-bottom: 10px;
}
.gx-sfa .sfa-discount strong {
    color: #00a0e3;
}
.gx-sfa .sfa-discount .sfa-range {
    background: #f1f5f9;
    margin-bottom: 6px;
}
.gx-sfa .sfa-discount .sfa-range i {
    background: #00a0e3;
    box-shadow: 0 2px 8px rgba(0, 160, 227, 0.4);
}
.gx-sfa .sfa-discount > div:last-child {
    display: flex;
    justify-content: space-between;
    font-size: 11px;
    color: #94a3b8;
}
.gx-sfa .sfa-negotiation-results {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-bottom: 18px;
}
.gx-sfa .sfa-negotiation-results article {
    background: #f8fafc;
    border-radius: 10px;
    padding: 12px 8px;
    text-align: center;
}
.gx-sfa .sfa-negotiation-results small {
    display: block;
    color: #94a3b8;
    font-size: 9.5px;
    font-weight: 700;
}
.gx-sfa .sfa-negotiation-results strong {
    color: #0f172a;
    font-size: 14px;
}

/* ══════════════════════════════════════════════
   15. POLÍTICA + APROVAÇÃO
══════════════════════════════════════════════ */
.gx-sfa .sfa-approval-flow {
    display: grid;
    grid-template-columns: 1fr auto 1fr auto 1fr;
    gap: 16px;
    align-items: center;
}
.gx-sfa .sfa-approval-simulation {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 16px;
    padding: 22px;
}
.gx-sfa .sfa-approval-simulation > small {
    display: block;
    color: #64748b;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
}
.gx-sfa .sfa-approval-simulation > strong {
    display: block;
    color: #fff;
    font-size: 18px;
    font-weight: 800;
    margin-bottom: 16px;
}
.gx-sfa .sfa-approval-simulation > div {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
.gx-sfa .sfa-approval-simulation article {
    background: #0b0f19;
    border-radius: 8px;
    padding: 10px;
    text-align: center;
}
.gx-sfa .sfa-approval-simulation article small {
    display: block;
    color: #64748b;
    font-size: 9px;
    font-weight: 700;
}
.gx-sfa .sfa-approval-simulation article strong {
    color: #fff;
    font-size: 13px;
}
.gx-sfa .sfa-approval-arrow {
    color: #38bdf8;
    font-size: 20px;
    text-align: center;
}
.gx-sfa .sfa-approval-warning {
    display: flex;
    gap: 12px;
    background: rgba(245, 158, 11, 0.12);
    border: 1px solid rgba(245, 158, 11, 0.3);
    border-radius: 16px;
    padding: 22px;
}
.gx-sfa .sfa-approval-warning > span {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: #f59e0b;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    flex-shrink: 0;
}
.gx-sfa .sfa-approval-warning small {
    display: block;
    color: #fbbf24;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-sfa .sfa-approval-warning strong {
    display: block;
    color: #fff;
    font-size: 13.5px;
    margin: 4px 0 6px 0;
}
.gx-sfa .sfa-approval-warning p {
    margin: 0;
    color: #94a3b8;
    font-size: 12px;
    line-height: 1.4;
}
.gx-sfa .sfa-manager-approval {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 16px;
    padding: 22px;
}
.gx-sfa .sfa-manager-approval > small {
    display: block;
    color: #64748b;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
}
.gx-sfa .sfa-manager-approval > strong {
    display: block;
    color: #fff;
    font-size: 14px;
    margin-bottom: 16px;
}
.gx-sfa .sfa-manager-approval > div {
    display: flex;
    gap: 10px;
}
.gx-sfa .sfa-manager-approval button {
    flex: 1;
    padding: 10px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 12.5px;
    border: none;
}
.gx-sfa .sfa-manager-approval button:first-child {
    background: #10b981;
    color: #fff;
}
.gx-sfa .sfa-manager-approval button:last-child {
    background: #1e293b;
    color: #94a3b8;
}

/* ══════════════════════════════════════════════
   16. COMISSÕES
══════════════════════════════════════════════ */
.gx-sfa .sfa-commission-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 24px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-sfa .sfa-commission-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}
.gx-sfa .sfa-commission-header small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
}
.gx-sfa .sfa-commission-header strong {
    color: #0f172a;
    font-size: 15px;
}
.gx-sfa .sfa-commission-header > span {
    background: #f1f5f9;
    color: #64748b;
    font-size: 11px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 100px;
}
.gx-sfa .sfa-commission-total {
    background: #f0f9ff;
    border-radius: 10px;
    padding: 16px;
    margin-bottom: 16px;
}
.gx-sfa .sfa-commission-total small {
    display: block;
    color: #0284c7;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-sfa .sfa-commission-total strong {
    display: block;
    color: #0f172a;
    font-size: 24px;
    font-weight: 800;
    margin: 4px 0;
}
.gx-sfa .sfa-commission-total span {
    color: #64748b;
    font-size: 12px;
}
.gx-sfa .sfa-commission-breakdown {
    margin-bottom: 18px;
}
.gx-sfa .sfa-commission-breakdown > div {
    display: flex;
    justify-content: space-between;
    font-size: 13px;
    padding: 8px 0;
    border-top: 1px solid #f1f5f9;
}
.gx-sfa .sfa-commission-breakdown span {
    color: #64748b;
}
.gx-sfa .sfa-commission-breakdown strong {
    color: #0f172a;
}
.gx-sfa .sfa-next-tier {
    border-top: 1px dashed #e2e8f0;
    padding-top: 16px;
}
.gx-sfa .sfa-next-tier > div {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 10px;
}
.gx-sfa .sfa-next-tier small {
    display: block;
    color: #94a3b8;
    font-size: 9.5px;
    font-weight: 700;
}
.gx-sfa .sfa-next-tier > div strong {
    color: #0f172a;
    font-size: 13px;
}
.gx-sfa .sfa-next-tier > span {
    color: #00a0e3;
    font-weight: 700;
    font-size: 13px;
}
.gx-sfa .sfa-tier-progress {
    width: 100%;
    height: 8px;
    background: #f1f5f9;
    border-radius: 100px;
    overflow: hidden;
    margin-bottom: 12px;
}
.gx-sfa .sfa-tier-progress span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #00a0e3, #802be2);
    border-radius: 100px;
}
.gx-sfa .sfa-next-tier p {
    margin: 0;
    color: #64748b;
    font-size: 12.5px;
}
.gx-sfa .sfa-next-tier p strong {
    color: #0f172a;
}

/* ══════════════════════════════════════════════
   17. METAS
══════════════════════════════════════════════ */
.gx-sfa .sfa-goal-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 24px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-sfa .sfa-goal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 4px;
}
.gx-sfa .sfa-goal-header small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
}
.gx-sfa .sfa-goal-header strong {
    color: #0f172a;
    font-size: 22px;
    font-weight: 800;
}
.gx-sfa .sfa-goal-header > span {
    color: #00a0e3;
    font-weight: 800;
    font-size: 18px;
}
.gx-sfa .sfa-goal-card > p {
    margin: 0 0 14px 0;
    color: #64748b;
    font-size: 12.5px;
}
.gx-sfa .sfa-goal-progress {
    width: 100%;
    height: 10px;
    background: #f1f5f9;
    border-radius: 100px;
    overflow: hidden;
    margin-bottom: 14px;
}
.gx-sfa .sfa-goal-progress span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #00a0e3, #802be2);
    border-radius: 100px;
}
.gx-sfa .sfa-goal-remaining {
    display: flex;
    justify-content: space-between;
    background: #f8fafc;
    border-radius: 8px;
    padding: 10px 14px;
    margin-bottom: 16px;
    font-size: 12.5px;
    color: #64748b;
}
.gx-sfa .sfa-goal-remaining strong {
    color: #0f172a;
    font-size: 14px;
}
.gx-sfa .sfa-goal-items {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}
.gx-sfa .sfa-goal-items > div {
    display: flex;
    justify-content: space-between;
    background: #f8fafc;
    border-radius: 8px;
    padding: 10px 12px;
    font-size: 12.5px;
}
.gx-sfa .sfa-goal-items span {
    color: #64748b;
}
.gx-sfa .sfa-goal-items strong {
    color: #0f172a;
    font-weight: 700;
}
.gx-sfa .sfa-newton-goal {
    display: flex;
    gap: 12px;
    background: #111827;
    border-radius: 14px;
    padding: 18px;
    margin-top: 24px;
}
.gx-sfa .sfa-newton-goal > span {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    flex-shrink: 0;
}
.gx-sfa .sfa-newton-goal p {
    margin: 0;
    color: #cbd5e1;
    font-size: 13.5px;
    line-height: 1.6;
}
.gx-sfa .sfa-newton-goal p strong {
    color: #fff;
}

/* ══════════════════════════════════════════════
   18. CAMPANHAS
══════════════════════════════════════════════ */
.gx-sfa .sfa-campaigns {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}
.gx-sfa .sfa-campaigns article {
    position: relative;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 26px 22px;
    transition: all 0.3s ease;
}
.gx-sfa .sfa-campaigns article:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.08);
    border-color: #00a0e3;
}
.gx-sfa .sfa-campaign-badge {
    position: absolute;
    top: 20px;
    right: 20px;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    padding: 5px 12px;
    border-radius: 100px;
}
.gx-sfa .sfa-campaigns > article > small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
}
.gx-sfa .sfa-campaigns h3 {
    color: #0f172a;
    font-size: 18px;
    margin: 0 0 10px 0;
}
.gx-sfa .sfa-campaigns > article > p {
    color: #64748b;
    font-size: 13.5px;
    line-height: 1.6;
    margin: 0 0 18px 0;
}
.gx-sfa .sfa-campaign-progress {
    width: 100%;
    height: 8px;
    background: #f1f5f9;
    border-radius: 100px;
    overflow: hidden;
    margin-bottom: 10px;
}
.gx-sfa .sfa-campaign-progress span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #00a0e3, #802be2);
    border-radius: 100px;
}
.gx-sfa .sfa-campaigns > article > strong {
    display: block;
    color: #0f172a;
    font-size: 14px;
    margin-bottom: 4px;
}
.gx-sfa .sfa-campaigns > article > small:last-child {
    color: #94a3b8;
    font-size: 12px;
    font-weight: 400;
}

/* ══════════════════════════════════════════════
   19. OPORTUNIDADES
══════════════════════════════════════════════ */
.gx-sfa .sfa-pipeline {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
}
.gx-sfa .sfa-pipeline-column {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid #1e293b;
    border-radius: 14px;
    padding: 16px;
}
.gx-sfa .sfa-pipeline-column > div:first-child {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 14px;
    padding-bottom: 12px;
    border-bottom: 1px solid #1e293b;
}
.gx-sfa .sfa-pipeline-column > div:first-child small {
    color: #64748b;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-sfa .sfa-pipeline-column > div:first-child strong {
    color: #38bdf8;
    font-size: 12.5px;
}
.gx-sfa .sfa-pipeline-column article {
    background: #111827;
    border-radius: 10px;
    padding: 12px;
    margin-bottom: 10px;
}
.gx-sfa .sfa-pipeline-column article strong {
    display: block;
    color: #fff;
    font-size: 13px;
    margin-bottom: 4px;
}
.gx-sfa .sfa-pipeline-column article span {
    color: #00a0e3;
    font-size: 12.5px;
    font-weight: 700;
}

/* ══════════════════════════════════════════════
   20. PROSPECÇÃO
══════════════════════════════════════════════ */
.gx-sfa .sfa-prospect {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 24px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-sfa .sfa-prospect-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}
.gx-sfa .sfa-prospect-header > span {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    flex-shrink: 0;
}
.gx-sfa .sfa-prospect-header small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
}
.gx-sfa .sfa-prospect-header strong {
    color: #0f172a;
    font-size: 14.5px;
}
.gx-sfa .sfa-prospect > p {
    color: #64748b;
    font-size: 13.5px;
    margin: 0 0 18px 0;
}
.gx-sfa .sfa-prospect-company {
    background: #f8fafc;
    border-radius: 12px;
    padding: 18px;
    margin-bottom: 18px;
}
.gx-sfa .sfa-prospect-company > small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
}
.gx-sfa .sfa-prospect-company h3 {
    color: #0f172a;
    font-size: 18px;
    margin: 4px 0 16px 0;
}
.gx-sfa .sfa-prospect-company > div {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
}
.gx-sfa .sfa-prospect-company article {
    background: #ffffff;
    border-radius: 8px;
    padding: 10px 12px;
}
.gx-sfa .sfa-prospect-company article small {
    display: block;
    color: #94a3b8;
    font-size: 9px;
    font-weight: 700;
}
.gx-sfa .sfa-prospect-company article strong {
    color: #0f172a;
    font-size: 13px;
}
.gx-sfa .sfa-prospect > button {
    width: 100%;
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 13px;
    border-radius: 10px;
    font-weight: 700;
    font-size: 13.5px;
}

/* ══════════════════════════════════════════════
   21. VOZ + NEWTON
══════════════════════════════════════════════ */
.gx-sfa .sfa-voice-flow {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 20px;
    align-items: center;
}
.gx-sfa .sfa-voice-input {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid #1e293b;
    border-radius: 18px;
    padding: 26px;
    text-align: center;
}
.gx-sfa .sfa-microphone {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    margin: 0 auto 14px auto;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    font-size: 22px;
}
.gx-sfa .sfa-voice-input > small {
    display: block;
    color: #64748b;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 12px;
}
.gx-sfa .sfa-voice-input > p {
    color: #e2e8f0;
    font-size: 14px;
    font-style: italic;
    line-height: 1.6;
    margin: 0 0 18px 0;
}
.gx-sfa .sfa-wave {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    height: 24px;
}
.gx-sfa .sfa-wave i {
    width: 3px;
    background: #00a0e3;
    border-radius: 2px;
    animation: sfa-wave-pulse 1s ease-in-out infinite;
}
.gx-sfa .sfa-wave i:nth-child(1) { height: 40%; animation-delay: 0s; }
.gx-sfa .sfa-wave i:nth-child(2) { height: 70%; animation-delay: 0.1s; }
.gx-sfa .sfa-wave i:nth-child(3) { height: 100%; animation-delay: 0.2s; }
.gx-sfa .sfa-wave i:nth-child(4) { height: 55%; animation-delay: 0.3s; }
.gx-sfa .sfa-wave i:nth-child(5) { height: 85%; animation-delay: 0.4s; }
.gx-sfa .sfa-wave i:nth-child(6) { height: 50%; animation-delay: 0.5s; }
.gx-sfa .sfa-wave i:nth-child(7) { height: 75%; animation-delay: 0.6s; }
.gx-sfa .sfa-wave i:nth-child(8) { height: 35%; animation-delay: 0.7s; }
@keyframes sfa-wave-pulse {
    0%, 100% { transform: scaleY(0.6); opacity: 0.6; }
    50% { transform: scaleY(1); opacity: 1; }
}
.gx-sfa .sfa-voice-arrow {
    color: #38bdf8;
    font-size: 22px;
    text-align: center;
}
.gx-sfa .sfa-voice-result {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 18px;
    padding: 24px;
}
.gx-sfa .sfa-voice-result-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
    padding-bottom: 14px;
    border-bottom: 1px solid #1e293b;
}
.gx-sfa .sfa-voice-result-header > span {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #00a0e3;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 12px;
}
.gx-sfa .sfa-voice-result-header small {
    display: block;
    color: #64748b;
    font-size: 9.5px;
    font-weight: 700;
}
.gx-sfa .sfa-voice-result-header strong {
    color: #fff;
    font-size: 13.5px;
}
.gx-sfa .sfa-voice-action {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid #1e293b;
}
.gx-sfa .sfa-voice-action > span {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #10b981;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    flex-shrink: 0;
}
.gx-sfa .sfa-voice-action strong {
    display: block;
    color: #fff;
    font-size: 13px;
}
.gx-sfa .sfa-voice-action small {
    color: #64748b;
    font-size: 11.5px;
}
.gx-sfa .sfa-voice-result > button {
    width: 100%;
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 13px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 13.5px;
    margin-top: 16px;
}

/* ══════════════════════════════════════════════
   22. NEWTON COPILOTO COMERCIAL
══════════════════════════════════════════════ */
.gx-sfa .sfa-newton-prompts {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 50px;
}
.gx-sfa .sfa-newton-prompts article {
    display: flex;
    align-items: center;
    gap: 12px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid #1e293b;
    border-radius: 100px;
    padding: 12px 20px;
}
.gx-sfa .sfa-newton-prompts span {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 11px;
    flex-shrink: 0;
}
.gx-sfa .sfa-newton-prompts p {
    margin: 0;
    color: #e2e8f0;
    font-size: 13px;
    line-height: 1.4;
}
.gx-sfa .sfa-newton-architecture {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 30px;
}
.gx-sfa .sfa-newton-core {
    display: flex;
    align-items: center;
    gap: 12px;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    border-radius: 100px;
    padding: 14px 32px;
    color: #fff;
}
.gx-sfa .sfa-newton-core > span {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
}
.gx-sfa .sfa-newton-core strong {
    font-size: 15px;
    letter-spacing: 1px;
}
.gx-sfa .sfa-newton-connections {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 14px;
    width: 100%;
}
.gx-sfa .sfa-newton-connections article {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid #1e293b;
    border-radius: 12px;
    padding: 16px 10px;
    text-align: center;
}
.gx-sfa .sfa-newton-connections strong {
    display: block;
    color: #fff;
    font-size: 13px;
    margin-bottom: 4px;
}
.gx-sfa .sfa-newton-connections small {
    color: #64748b;
    font-size: 11px;
}

/* ══════════════════════════════════════════════
   23. GESTÃO DA EQUIPE
══════════════════════════════════════════════ */
.gx-sfa .sfa-team-dashboard {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 24px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-sfa .sfa-team-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}
.gx-sfa .sfa-team-header small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
}
.gx-sfa .sfa-team-header strong {
    color: #0f172a;
    font-size: 15px;
}
.gx-sfa .sfa-team-header > span {
    color: #64748b;
    font-size: 12px;
    font-weight: 600;
}
.gx-sfa .sfa-team-kpis {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-bottom: 18px;
}
.gx-sfa .sfa-team-kpis article {
    background: #f8fafc;
    border-radius: 10px;
    padding: 12px 10px;
    text-align: center;
}
.gx-sfa .sfa-team-kpis small {
    display: block;
    color: #94a3b8;
    font-size: 9.5px;
    font-weight: 700;
}
.gx-sfa .sfa-team-kpis strong {
    color: #0f172a;
    font-size: 15px;
}
.gx-sfa .sfa-team-table {
    border-top: 1px solid #f1f5f9;
}
.gx-sfa .sfa-team-table > div {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr 1fr;
    gap: 8px;
    padding: 11px 0;
    border-bottom: 1px solid #f1f5f9;
    font-size: 13px;
    align-items: center;
}
.gx-sfa .sfa-team-table > div.header {
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.gx-sfa .sfa-team-table > div:not(.header) strong {
    color: #0f172a;
}
.gx-sfa .sfa-team-table > div:not(.header) span {
    color: #64748b;
}

/* ══════════════════════════════════════════════
   24. AGENTES SFA
══════════════════════════════════════════════ */
.gx-sfa .sfa-agents-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}
.gx-sfa .sfa-agents-grid article {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 16px;
    padding: 26px;
    transition: all 0.3s ease;
}
.gx-sfa .sfa-agents-grid article:hover {
    border-color: #00a0e3;
    transform: translateY(-4px);
}
.gx-sfa .sfa-agents-grid > article > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: rgba(0, 160, 227, 0.12);
    color: #00a0e3;
    margin-bottom: 16px;
}
.gx-sfa .sfa-agents-grid small {
    display: block;
    color: #64748b;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.8px;
    margin-bottom: 6px;
}
.gx-sfa .sfa-agents-grid h3 {
    color: #fff;
    font-size: 18px;
    margin: 0 0 10px 0;
}
.gx-sfa .sfa-agents-grid p {
    color: #94a3b8;
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
}
.gx-sfa .sfa-agent-newton {
    background: linear-gradient(160deg, #0b1e46 0%, #123f8f 100%);
    border-color: transparent;
}
.gx-sfa .sfa-agent-newton > span {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
}

/* ══════════════════════════════════════════════
   25. ECOSSISTEMA
══════════════════════════════════════════════ */
.gx-sfa .sfa-ecosystem {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
}
.gx-sfa .sfa-ecosystem-newton {
    display: flex;
    align-items: center;
    gap: 12px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid #1e293b;
    border-radius: 100px;
    padding: 8px 22px 8px 8px;
}
.gx-sfa .sfa-ecosystem-newton > span {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 13px;
}
.gx-sfa .sfa-ecosystem-newton small {
    display: block;
    color: #64748b;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-sfa .sfa-ecosystem-newton strong {
    color: #fff;
    font-size: 13px;
}
.gx-sfa .sfa-ecosystem-line {
    width: 1px;
    height: 26px;
    background: #1e293b;
}
.gx-sfa .sfa-ecosystem-core {
    background: linear-gradient(135deg, #00a0e3, #802be2);
    border-radius: 16px;
    padding: 22px 40px;
    text-align: center;
    color: #fff;
}
.gx-sfa .sfa-ecosystem-core small {
    display: block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1px;
    opacity: 0.85;
}
.gx-sfa .sfa-ecosystem-core strong {
    display: block;
    font-size: 20px;
    margin: 4px 0 14px 0;
}
.gx-sfa .sfa-ecosystem-core > div {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
}
.gx-sfa .sfa-ecosystem-core > div span {
    background: rgba(255, 255, 255, 0.18);
    font-size: 11px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 100px;
}
.gx-sfa .sfa-ecosystem-modules {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 16px;
    width: 100%;
}
.gx-sfa .sfa-ecosystem-modules article {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid #1e293b;
    border-radius: 14px;
    padding: 20px 14px;
    text-align: center;
}
.gx-sfa .sfa-ecosystem-modules small {
    display: block;
    color: #64748b;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.3px;
    margin-bottom: 8px;
}
.gx-sfa .sfa-ecosystem-modules strong {
    display: block;
    color: #fff;
    font-size: 14.5px;
    margin-bottom: 4px;
}
.gx-sfa .sfa-ecosystem-modules span {
    color: #94a3b8;
    font-size: 11px;
}

/* ══════════════════════════════════════════════
   26. CTA FINAL
══════════════════════════════════════════════ */
.gx-sfa .sfa-final-cta {
    background: #0b0f19;
    padding: 120px 0;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.gx-sfa .sfa-final-cta::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 600px;
    height: 400px;
    background: radial-gradient(circle, rgba(0, 160, 227, 0.15) 0%, rgba(11, 15, 25, 0) 70%);
}
.gx-sfa .sfa-final-cta .sfa-container {
    position: relative;
    z-index: 1;
    max-width: 800px;
}
.gx-sfa .sfa-final-cta h2 {
    color: #ffffff;
    font-size: 42px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
    margin: 18px 0 20px 0;
}
.gx-sfa .sfa-final-cta h2 span {
    display: block;
    color: #94a3b8;
    font-size: 22px;
    font-weight: 500;
    margin-top: 12px;
}
.gx-sfa .sfa-final-cta p {
    color: #94a3b8;
    font-size: 17px;
    line-height: 1.7;
    max-width: 640px;
    margin: 0 auto;
}

/* ══════════════════════════════════════════════
   RESPONSIVO
══════════════════════════════════════════════ */
@media (max-width: 992px) {
    .gx-sfa .sfa-hero-grid,
    .gx-sfa .sfa-two-columns,
    .gx-sfa .sfa-route-panel,
    .gx-sfa .sfa-approval-flow,
    .gx-sfa .sfa-voice-flow {
        grid-template-columns: 1fr;
    }
    .gx-sfa .sfa-mobile-layout {
        grid-template-columns: 1fr;
        justify-items: center;
    }
    .gx-sfa .sfa-mobile-tools,
    .gx-sfa .sfa-campaigns,
    .gx-sfa .sfa-pipeline,
    .gx-sfa .sfa-newton-prompts,
    .gx-sfa .sfa-newton-connections,
    .gx-sfa .sfa-ecosystem-modules,
    .gx-sfa .sfa-agents-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .gx-sfa .sfa-kpis,
    .gx-sfa .sfa-order-context,
    .gx-sfa .sfa-negotiation-results,
    .gx-sfa .sfa-team-kpis {
        grid-template-columns: repeat(2, 1fr);
    }
    .gx-sfa .sfa-approval-arrow,
    .gx-sfa .sfa-voice-arrow {
        transform: rotate(90deg);
    }
}

@media (max-width: 768px) {
    .gx-sfa .sfa-section {
        padding: 64px 0;
    }
    .gx-sfa .sfa-hero-content h1 {
        font-size: 30px;
    }
    .gx-sfa .sfa-section-heading h2,
    .gx-sfa .sfa-content h2 {
        font-size: 26px;
    }
    .gx-sfa .sfa-check-list {
        grid-template-columns: 1fr;
    }
    .gx-sfa .sfa-mobile-tools,
    .gx-sfa .sfa-campaigns,
    .gx-sfa .sfa-pipeline,
    .gx-sfa .sfa-newton-prompts,
    .gx-sfa .sfa-newton-connections,
    .gx-sfa .sfa-ecosystem-modules,
    .gx-sfa .sfa-agents-grid,
    .gx-sfa .sfa-kpis,
    .gx-sfa .sfa-order-context,
    .gx-sfa .sfa-negotiation-results,
    .gx-sfa .sfa-team-kpis,
    .gx-sfa .sfa-customer-stats,
    .gx-sfa .sfa-360-kpis,
    .gx-sfa .sfa-offline-data,
    .gx-sfa .sfa-goal-items,
    .gx-sfa .sfa-order-commercial,
    .gx-sfa .sfa-prospect-company > div,
    .gx-sfa .sfa-approval-simulation > div {
        grid-template-columns: 1fr;
    }
    .gx-sfa .sfa-visit-actions {
        grid-template-columns: repeat(2, 1fr);
    }
    .gx-sfa .sfa-team-table > div {
        grid-template-columns: 1fr 1fr;
        row-gap: 4px;
    }
    .gx-sfa .sfa-journey {
        flex-direction: column;
    }
    .gx-sfa .sfa-journey > i {
        transform: rotate(90deg);
    }
    .gx-sfa .sfa-offline-order-products > div {
        grid-template-columns: 40px 1fr 30px 60px;
        font-size: 11px;
    }
    .gx-sfa .sfa-final-cta h2 {
        font-size: 26px;
    }
}

/* ══════════════════════════════════════════════════════════════
   SELLER CENTER — UNIVERSIDADE — padrão visual do b2c.html / Produto.html
   (conteúdo original da página preservado; aqui só entra o estilo)
══════════════════════════════════════════════════════════════ */
* + .seller-university,
.seller-university {
    display: block;
    overflow: hidden;
    background: #ffffff;
}
.seller-university *,
.seller-section *,
.university-context-section *,
.university-newton-section *,
.university-certificate-section *,
.university-management-section *,
.university-whitelabel * {
    box-sizing: border-box;
}
.seller-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}
.seller-university button,
.seller-section button,
.university-management-section button {
    font-family: inherit;
    cursor: pointer;
}

/* ---------- Seções: fundo claro / escuro ---------- */
.seller-university {
    padding: 60px 0 100px 0;
}
.seller-section {
    padding: 100px 0;
    background: #ffffff;
}
.seller-section.seller-light {
    background: #f8fafc;
}
.seller-section.university-newton-section {
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}

/* ---------- Tipografia comum ---------- */
.seller-eyebrow {
    display: inline-block;
    background: #e0f2fe;
    color: #0284c7;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    padding: 6px 16px;
    border-radius: 100px;
    margin-bottom: 22px;
    border: 1px solid rgba(56, 189, 248, 0.4);
}
.seller-eyebrow-light {
    background: rgba(56, 189, 248, 0.1);
    color: #38bdf8;
    border: 1px solid rgba(56, 189, 248, 0.3);
}

.seller-section-heading {
    /* overrides the global `header { position:fixed !important }` rule,
       since this block uses a semantic <header> tag */
    position: static !important;
    top: auto !important;
    left: auto !important;
    z-index: auto !important;
    width: auto !important;
    display: flex !important;
    flex-direction: column !important;
    max-width: 760px;
    margin: 0 0 60px 0;
    border-bottom: none !important;
}
.seller-section-heading.seller-center {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    align-items: center;
}
.seller-section-heading h2,
.seller-content h2 {
    font-size: 38px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
    color: #0f172a;
    margin: 0 0 18px 0;
}
.seller-section-heading h2 span,
.seller-content h2 span {
    color: #00a0e3;
}
.seller-section-heading p,
.seller-content p {
    font-size: 18px;
    color: #475569;
    line-height: 1.7;
    margin: 0;
}
.university-newton-section .seller-section-heading h2 {
    color: #ffffff;
}
.university-newton-section .seller-section-heading p {
    color: #94a3b8;
}

.seller-two-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}
.seller-content h3 {
    font-size: 22px;
}

/* ---------- Lista de checagem ---------- */
.seller-check-list {
    list-style: none;
    margin: 28px 0 0 0;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 24px;
}
.seller-check-list li {
    position: relative;
    padding-left: 26px;
    font-size: 15px;
    color: #334155;
    font-weight: 500;
}
.seller-check-list li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    color: #10b981;
    font-weight: 800;
}

/* ══════════════════════════════════════════════
   01. UNIVERSIDADE — DASHBOARD (hero)
══════════════════════════════════════════════ */
.university-dashboard {
    display: grid;
    grid-template-columns: 220px 1fr;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 20px 50px -15px rgba(0, 0, 0, 0.12);
}
.university-sidebar {
    background: #0b0f19;
    padding: 24px 18px;
    display: flex;
    flex-direction: column;
    gap: 26px;
}
.university-logo {
    display: flex;
    align-items: center;
    gap: 10px;
}
.university-logo-icon {
    width: 34px;
    height: 34px;
    border-radius: 9px;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    flex-shrink: 0;
}
.university-logo small {
    display: block;
    color: #64748b;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.university-logo strong {
    color: #fff;
    font-size: 13.5px;
}
.university-menu {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.university-menu a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 8px;
    color: #94a3b8;
    text-decoration: none;
    font-size: 13.5px;
    font-weight: 500;
}
.university-menu a span {
    width: 18px;
    text-align: center;
    color: #64748b;
}
.university-menu a.active {
    background: rgba(0, 160, 227, 0.12);
    color: #ffffff;
}
.university-menu a.active span {
    color: #00a0e3;
}
.university-sidebar-help {
    margin-top: auto;
    display: flex;
    align-items: center;
    gap: 10px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid #1e293b;
    border-radius: 12px;
    padding: 12px 14px;
}
.university-sidebar-help > span {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    flex-shrink: 0;
}
.university-sidebar-help small {
    display: block;
    color: #64748b;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.3px;
}
.university-sidebar-help strong {
    color: #e2e8f0;
    font-size: 12px;
    font-weight: 600;
}

.university-content {
    padding: 28px;
    background: #f8fafc;
}
.university-content-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
}
.university-content-header small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.university-content-header h3 {
    color: #0f172a;
    font-size: 22px;
    margin: 4px 0 4px 0;
}
.university-content-header p {
    color: #64748b;
    font-size: 13.5px;
    margin: 0;
}
.university-user {
    display: flex;
    align-items: center;
    gap: 10px;
}
.university-user > span {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #00a0e3;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 13px;
    flex-shrink: 0;
}
.university-user strong {
    display: block;
    color: #0f172a;
    font-size: 13.5px;
}
.university-user small {
    color: #94a3b8;
    font-size: 11px;
}

.university-continue {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 24px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 26px;
    margin-bottom: 28px;
}
.university-label {
    display: inline-block;
    color: #0284c7;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.5px;
    margin-bottom: 10px;
}
.university-continue-info h4 {
    color: #0f172a;
    font-size: 19px;
    margin: 0 0 10px 0;
}
.university-continue-info p {
    color: #64748b;
    font-size: 13.5px;
    line-height: 1.6;
    margin: 0 0 18px 0;
}
.university-progress-info {
    display: flex;
    justify-content: space-between;
    font-size: 12.5px;
    color: #64748b;
    margin-bottom: 8px;
}
.university-progress-info strong {
    color: #00a0e3;
    font-weight: 700;
}
.university-progress {
    width: 100%;
    height: 8px;
    background: #f1f5f9;
    border-radius: 100px;
    overflow: hidden;
    margin-bottom: 20px;
}
.university-progress span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #00a0e3, #802be2);
    border-radius: 100px;
}
.university-continue-info button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 12px 22px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 13.5px;
}
.university-video-cover {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    background: linear-gradient(135deg, #0b1e46 0%, #123f8f 100%);
    min-height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.university-video-overlay {
    display: flex;
    align-items: center;
    justify-content: center;
}
.university-play {
    width: 54px;
    height: 54px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: #fff;
    font-size: 18px;
    backdrop-filter: blur(4px);
}
.university-video-meta {
    position: absolute;
    left: 14px;
    bottom: 14px;
    color: #fff;
}
.university-video-meta span {
    display: block;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    opacity: 0.8;
}
.university-video-meta strong {
    font-size: 13px;
}

.university-block-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
}
.university-block-title small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.university-block-title h4 {
    color: #0f172a;
    font-size: 18px;
    margin: 4px 0 0 0;
}
.university-block-title a {
    color: #00a0e3;
    font-weight: 700;
    font-size: 13px;
    text-decoration: none;
}
.university-courses {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}
.university-course-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    overflow: hidden;
    transition: all 0.3s ease;
}
.university-course-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.08);
    border-color: #00a0e3;
}
.university-course-image {
    position: relative;
    height: 100px;
    background: linear-gradient(135deg, #e0f2fe, #f0f9ff);
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding: 10px;
}
.university-course-category {
    position: absolute;
    top: 10px;
    left: 10px;
    background: rgba(255, 255, 255, 0.9);
    color: #0284c7;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 0.3px;
    padding: 4px 10px;
    border-radius: 100px;
}
.university-course-image button {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #ffffff;
    border: none;
    color: #00a0e3;
    font-size: 14px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
}
.university-course-content {
    padding: 16px;
}
.university-course-content small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.3px;
}
.university-course-content h5 {
    color: #0f172a;
    font-size: 15px;
    line-height: 1.4;
    margin: 6px 0 8px 0;
}
.university-course-content p {
    color: #64748b;
    font-size: 12.5px;
    line-height: 1.5;
    margin: 0 0 14px 0;
}
.university-course-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 12px;
    border-top: 1px solid #f1f5f9;
}
.university-course-footer span {
    color: #94a3b8;
    font-size: 11.5px;
}
.university-course-footer a {
    color: #00a0e3;
    font-weight: 700;
    font-size: 12.5px;
    text-decoration: none;
}

/* ══════════════════════════════════════════════
   02. TRILHAS DE APRENDIZAGEM
══════════════════════════════════════════════ */
.university-paths-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.university-paths-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
    padding-bottom: 16px;
    border-bottom: 1px solid #f1f5f9;
}
.university-paths-header small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
}
.university-paths-header strong {
    color: #0f172a;
    font-size: 15px;
}
.university-paths-header > span {
    background: #e0f2fe;
    color: #0284c7;
    font-size: 11.5px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 100px;
}
.university-path {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 0;
    border-top: 1px solid #f1f5f9;
}
.university-path-icon {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: #f1f5f9;
    color: #94a3b8;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    flex-shrink: 0;
}
.university-path.complete .university-path-icon {
    background: #10b981;
    color: #fff;
}
.university-path.locked {
    opacity: 0.5;
}
.university-path-content {
    flex: 1;
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 4px 12px;
}
.university-path-content > div small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
}
.university-path-content > div strong {
    color: #0f172a;
    font-size: 13.5px;
}
.university-path-content > span {
    color: #64748b;
    font-size: 12px;
    font-weight: 700;
}
.university-path-progress {
    grid-column: 1 / -1;
    width: 100%;
    height: 5px;
    background: #f1f5f9;
    border-radius: 100px;
    overflow: hidden;
    margin-top: 4px;
}
.university-path-progress i {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #00a0e3, #802be2);
    border-radius: 100px;
    font-style: normal;
}
.university-path.complete .university-path-progress i {
    background: #10b981;
}

/* ══════════════════════════════════════════════
   03. ÁREAS DE CONHECIMENTO
══════════════════════════════════════════════ */
.university-knowledge-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
}
.university-knowledge-grid article {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 26px;
    transition: all 0.3s ease;
}
.university-knowledge-grid article:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.08);
    border-color: #00a0e3;
}
.university-knowledge-number {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: rgba(0, 160, 227, 0.1);
    border: 1px solid rgba(0, 160, 227, 0.2);
    color: #00a0e3;
    font-weight: 800;
    font-size: 14px;
    margin-bottom: 18px;
}
.university-knowledge-grid h3 {
    color: #0f172a;
    font-size: 17px;
    margin: 0 0 10px 0;
}
.university-knowledge-grid p {
    color: #64748b;
    font-size: 13.5px;
    line-height: 1.6;
    margin: 0 0 14px 0;
}
.university-knowledge-grid a {
    color: #00a0e3;
    font-weight: 700;
    font-size: 12.5px;
    text-decoration: none;
}
.university-knowledge-newton {
    background: linear-gradient(160deg, #0b1e46 0%, #123f8f 100%) !important;
    border-color: transparent !important;
}
.university-knowledge-newton .university-knowledge-number {
    background: rgba(255, 255, 255, 0.15);
    border-color: transparent;
    color: #fff;
}
.university-knowledge-newton h3,
.university-knowledge-newton p {
    color: #ffffff !important;
}
.university-knowledge-newton p {
    opacity: 0.85;
}
.university-knowledge-newton a {
    color: #7dd3fc !important;
}

/* ══════════════════════════════════════════════
   04. CONTEÚDO CONTEXTUAL
══════════════════════════════════════════════ */
.university-context-example {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.university-context-kpi {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}
.university-context-kpi small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.3px;
}
.university-context-kpi strong {
    color: #0f172a;
    font-size: 24px;
    font-weight: 800;
}
.university-context-kpi > span {
    color: #ef4444;
    font-size: 13px;
    font-weight: 700;
}
.university-context-progress {
    width: 100%;
    height: 8px;
    background: #f1f5f9;
    border-radius: 100px;
    overflow: hidden;
    margin-bottom: 18px;
}
.university-context-progress span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #f59e0b, #ef4444);
    border-radius: 100px;
}
.university-context-alert {
    display: flex;
    align-items: center;
    gap: 12px;
    background: #fef3c7;
    border-radius: 10px;
    padding: 14px 16px;
    margin-bottom: 18px;
}
.university-context-alert > span {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: #f59e0b;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    flex-shrink: 0;
}
.university-context-alert strong {
    display: block;
    color: #92400e;
    font-size: 13.5px;
}
.university-context-alert p {
    color: #b45309;
    font-size: 12px;
    margin: 2px 0 0 0;
}
.university-context-newton {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    background: #0b0f19;
    border-radius: 12px;
    padding: 18px;
}
.university-newton-avatar {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 13px;
    flex-shrink: 0;
}
.university-context-newton > div {
    flex: 1;
}
.university-context-newton small {
    display: block;
    color: #38bdf8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 6px;
}
.university-context-newton p {
    color: #cbd5e1;
    font-size: 13px;
    line-height: 1.5;
    margin: 0 0 14px 0;
}
.university-recommended-course {
    display: flex;
    align-items: center;
    gap: 12px;
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 10px;
    padding: 12px;
}
.university-recommended-play {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    background: rgba(0, 160, 227, 0.15);
    color: #00a0e3;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.university-recommended-course > div {
    flex: 1;
}
.university-recommended-course small {
    display: block;
    color: #64748b;
    font-size: 9.5px;
    font-weight: 700;
}
.university-recommended-course strong {
    display: block;
    color: #e2e8f0;
    font-size: 12.5px;
    font-weight: 600;
}
.university-recommended-course button {
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 8px 14px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 11.5px;
    white-space: nowrap;
}

/* ══════════════════════════════════════════════
   05. NEWTON + UNIVERSIDADE
══════════════════════════════════════════════ */
.university-newton-demo {
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-width: 760px;
    margin: 0 auto;
}
.university-newton-question {
    align-self: flex-end;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    max-width: 85%;
}
.university-chat-user {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    flex-shrink: 0;
    order: 2;
}
.university-newton-question > div {
    background: #00a0e3;
    color: #fff;
    border-radius: 14px;
    border-bottom-right-radius: 4px;
    padding: 14px 18px;
}
.university-newton-question small {
    display: block;
    font-size: 10.5px;
    font-weight: 700;
    opacity: 0.85;
    margin-bottom: 4px;
}
.university-newton-question p {
    margin: 0;
    font-size: 14px;
    line-height: 1.5;
}
.university-newton-answer {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    max-width: 90%;
}
.university-newton-answer > div {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 14px;
    border-bottom-left-radius: 4px;
    padding: 18px;
}
.university-newton-answer small {
    display: block;
    color: #38bdf8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
}
.university-newton-answer p {
    color: #e2e8f0;
    font-size: 14px;
    line-height: 1.6;
    margin: 0 0 12px 0;
}
.university-newton-answer p strong {
    color: #7dd3fc;
    font-weight: 700;
}
.university-chat-course {
    display: flex;
    align-items: center;
    gap: 12px;
    background: #0b0f19;
    border: 1px solid #1e293b;
    border-radius: 10px;
    padding: 12px;
    margin-top: 6px;
}
.university-chat-video {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: rgba(0, 160, 227, 0.15);
    color: #00a0e3;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.university-chat-course > div {
    flex: 1;
}
.university-chat-course small {
    display: block;
    color: #64748b;
    font-size: 9.5px;
    font-weight: 700;
}
.university-chat-course strong {
    display: block;
    color: #e2e8f0;
    font-size: 12.5px;
    font-weight: 600;
    margin: 2px 0;
}
.university-chat-course span {
    color: #94a3b8;
    font-size: 11px;
}
.university-chat-course button {
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 8px 14px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 11.5px;
    white-space: nowrap;
}

/* ══════════════════════════════════════════════
   06. ONBOARDING + CAPACITAÇÃO
══════════════════════════════════════════════ */
.university-onboarding {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.university-onboarding-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}
.university-onboarding-header small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
}
.university-onboarding-header strong {
    color: #0f172a;
    font-size: 15px;
}
.university-onboarding-header > span {
    color: #00a0e3;
    font-size: 15px;
    font-weight: 800;
}
.university-onboarding-progress {
    width: 100%;
    height: 8px;
    background: #f1f5f9;
    border-radius: 100px;
    overflow: hidden;
    margin-bottom: 20px;
}
.university-onboarding-progress span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #00a0e3, #802be2);
    border-radius: 100px;
}
.university-onboarding-items {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    margin-bottom: 22px;
}
.university-onboarding-items > div {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    text-align: center;
    padding: 10px 4px;
    border-radius: 10px;
    background: #f8fafc;
}
.university-onboarding-items span {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #e2e8f0;
    color: #94a3b8;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
}
.university-onboarding-items strong {
    color: #475569;
    font-size: 10.5px;
    font-weight: 600;
}
.university-onboarding-items > div.complete {
    background: #dcfce7;
}
.university-onboarding-items > div.complete span {
    background: #10b981;
    color: #fff;
}
.university-onboarding-items > div.complete strong {
    color: #16a34a;
}
.university-onboarding-items > div.current {
    background: #e0f2fe;
}
.university-onboarding-items > div.current span {
    background: #00a0e3;
    color: #fff;
}
.university-onboarding-items > div.current strong {
    color: #0284c7;
}
.university-onboarding-training {
    background: #f8fafc;
    border-radius: 12px;
    padding: 18px;
}
.university-onboarding-training > small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 12px;
}
.university-onboarding-training > div {
    display: flex;
    justify-content: space-between;
    font-size: 13px;
    color: #334155;
    padding: 7px 0;
    border-bottom: 1px solid #e2e8f0;
}
.university-onboarding-training > div strong {
    color: #00a0e3;
}
.university-onboarding-training > p {
    color: #64748b;
    font-size: 12px;
    margin: 12px 0 14px 0;
}
.university-onboarding-training button {
    width: 100%;
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 12px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 13px;
}

/* ══════════════════════════════════════════════
   07. CERTIFICAÇÃO
══════════════════════════════════════════════ */
.university-certificate {
    background: #ffffff;
    border: 2px solid #e0f2fe;
    border-radius: 18px;
    padding: 40px 32px;
    text-align: center;
    box-shadow: 0 15px 40px -10px rgba(0, 0, 0, 0.1);
    position: relative;
}
.university-certificate::before {
    content: "";
    position: absolute;
    inset: 10px;
    border: 1px dashed #cbd5e1;
    border-radius: 12px;
    pointer-events: none;
}
.university-certificate-logo {
    color: #00a0e3;
    font-weight: 800;
    letter-spacing: 1px;
    font-size: 14px;
    margin-bottom: 18px;
}
.university-certificate > small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 1.5px;
    margin-bottom: 18px;
}
.university-certificate > p {
    color: #64748b;
    font-size: 13px;
    margin: 0 0 6px 0;
}
.university-certificate h3 {
    color: #0f172a;
    font-size: 24px;
    font-weight: 800;
    margin: 0 0 12px 0;
    letter-spacing: 0.5px;
}
.university-certificate strong {
    display: block;
    color: #00a0e3;
    font-size: 16px;
    font-weight: 800;
    letter-spacing: 0.5px;
    margin: 12px 0 22px 0;
}
.university-certificate-info {
    display: flex;
    justify-content: center;
    gap: 24px;
    margin-bottom: 24px;
}
.university-certificate-info span {
    color: #64748b;
    font-size: 12px;
}
.university-certificate-signature {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}
.university-certificate-signature span {
    width: 140px;
    border-top: 1px solid #cbd5e1;
}
.university-certificate-signature small {
    color: #94a3b8;
    font-size: 11px;
}

/* ══════════════════════════════════════════════
   08. GESTÃO DA UNIVERSIDADE
══════════════════════════════════════════════ */
.university-management-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-bottom: 30px;
}
.university-management-kpis article {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 20px;
    text-align: center;
}
.university-management-kpis small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.3px;
    margin-bottom: 8px;
}
.university-management-kpis strong {
    color: #0f172a;
    font-size: 26px;
    font-weight: 800;
}
.university-management-table {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    overflow: hidden;
}
.university-management-row {
    display: grid;
    grid-template-columns: 1.4fr 0.8fr 1.4fr 1fr;
    align-items: center;
    gap: 14px;
    padding: 16px 22px;
    border-bottom: 1px solid #f1f5f9;
}
.university-management-row:last-child {
    border-bottom: none;
}
.university-management-row.header {
    background: #f8fafc;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.5px;
    padding: 12px 22px;
}
.university-management-row strong {
    color: #0f172a;
    font-size: 14px;
}
.university-management-row > span {
    color: #64748b;
    font-size: 13.5px;
}
.university-seller-progress {
    display: flex;
    align-items: center;
    gap: 10px;
}
.university-seller-progress > div {
    flex: 1;
    height: 6px;
    background: #f1f5f9;
    border-radius: 100px;
    overflow: hidden;
}
.university-seller-progress span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #00a0e3, #802be2);
    border-radius: 100px;
}
.university-seller-progress strong {
    font-size: 12px;
    color: #334155;
    font-weight: 700;
    flex-shrink: 0;
}
.university-status {
    display: inline-block;
    background: #f1f5f9;
    color: #64748b;
    font-size: 11.5px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 100px;
    width: fit-content;
}
.university-status.complete {
    background: #dcfce7;
    color: #16a34a;
}
.university-status.warning {
    background: #fef3c7;
    color: #b45309;
}

/* ══════════════════════════════════════════════
   09. WHITE LABEL / MARKETCOOP
══════════════════════════════════════════════ */
.university-brand-example {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 40px 24px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.university-brand-before,
.university-brand-after {
    flex: 1;
    text-align: center;
    padding: 20px;
    border-radius: 14px;
}
.university-brand-before {
    background: #f8fafc;
    border: 1px dashed #cbd5e1;
}
.university-brand-after {
    background: linear-gradient(135deg, #0b1e46 0%, #123f8f 100%);
    color: #fff;
}
.university-brand-before small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 1px;
    margin-bottom: 8px;
}
.university-brand-before strong {
    color: #0f172a;
    font-size: 17px;
}
.university-brand-after small {
    display: block;
    color: #7dd3fc;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 1px;
    margin-bottom: 8px;
}
.university-brand-after strong {
    color: #fff;
    font-size: 17px;
}
.university-brand-arrow {
    color: #00a0e3;
    font-size: 22px;
    flex-shrink: 0;
}

/* ══════════════════════════════════════════════
   RESPONSIVO
══════════════════════════════════════════════ */
@media (max-width: 992px) {
    .seller-two-columns,
    .university-dashboard,
    .university-continue {
        grid-template-columns: 1fr;
    }
    .university-courses,
    .university-knowledge-grid,
    .university-onboarding-items,
    .university-management-kpis {
        grid-template-columns: repeat(2, 1fr);
    }
    .university-sidebar {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 14px;
    }
    .university-menu {
        flex-direction: row;
        flex-wrap: wrap;
    }
    .university-sidebar-help {
        margin-top: 0;
        width: 100%;
    }
    .university-management-row {
        grid-template-columns: 1fr 1fr;
        row-gap: 8px;
    }
    .university-management-row.header {
        display: none;
    }
    .university-brand-example {
        flex-direction: column;
    }
    .university-brand-arrow {
        transform: rotate(90deg);
    }
}

@media (max-width: 768px) {
    .seller-university {
        padding: 40px 0 60px 0;
    }
    .seller-section {
        padding: 64px 0;
    }
    .seller-section-heading h2,
    .seller-content h2 {
        font-size: 26px;
    }
    .seller-check-list {
        grid-template-columns: 1fr;
    }
    .university-courses,
    .university-knowledge-grid,
    .university-onboarding-items,
    .university-management-kpis {
        grid-template-columns: 1fr;
    }
    .university-management-row {
        grid-template-columns: 1fr;
        row-gap: 6px;
    }
    .university-newton-question,
    .university-newton-answer {
        max-width: 100%;
    }
}

/* ══════════════════════════════════════════════════════════════
   GALACTIX CATÁLOGO DIGITAL — padrão visual do b2c.html / Produto.html
   (conteúdo original da página preservado; aqui só entra o estilo)
══════════════════════════════════════════════════════════════ */
.gx-catalog {
    display: block;
    overflow: hidden;
    background: #ffffff;
}
.gx-catalog * {
    box-sizing: border-box;
}
.gx-catalog .catalog-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}
.gx-catalog button {
    font-family: inherit;
    cursor: pointer;
}
.gx-catalog input {
    font-family: inherit;
}

/* ---------- Seções: fundo claro / escuro ---------- */
.gx-catalog .catalog-section {
    padding: 100px 0;
    background: #ffffff;
}
.gx-catalog .catalog-section.catalog-light {
    background: #f8fafc;
}
.gx-catalog .catalog-section.catalog-dark,
.gx-catalog .catalog-section.catalog-analytics-section,
.gx-catalog .catalog-section.catalog-newton-section,
.gx-catalog .catalog-section.catalog-event-section,
.gx-catalog .catalog-section.catalog-ecosystem,
.gx-catalog .catalog-hero {
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}

/* ---------- Tipografia comum ---------- */
.gx-catalog .catalog-eyebrow {
    display: inline-block;
    background: #e0f2fe;
    color: #0284c7;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    padding: 6px 16px;
    border-radius: 100px;
    margin-bottom: 22px;
    border: 1px solid rgba(56, 189, 248, 0.4);
}
.gx-catalog .catalog-eyebrow-light {
    background: rgba(56, 189, 248, 0.1);
    color: #38bdf8;
    border: 1px solid rgba(56, 189, 248, 0.3);
}

/* .catalog-heading is a <header> tag — override the global fixed-header rule */
.gx-catalog .catalog-heading {
    position: static !important;
    top: auto !important;
    left: auto !important;
    z-index: auto !important;
    width: auto !important;
    display: flex !important;
    flex-direction: column !important;
    max-width: 760px;
    margin: 0 0 60px 0;
    border-bottom: none !important;
}
.gx-catalog .catalog-heading.catalog-center {
    margin-left: auto;
    margin-right: auto;
    align-items: center;
    text-align: center;
}
.gx-catalog .catalog-heading h2,
.gx-catalog .catalog-content h2 {
    font-size: 38px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
    color: #0f172a;
    margin: 0 0 18px 0;
}
.gx-catalog .catalog-heading h2 span,
.gx-catalog .catalog-content h2 span {
    color: #00a0e3;
}
.gx-catalog .catalog-heading p,
.gx-catalog .catalog-content p {
    font-size: 18px;
    color: #475569;
    line-height: 1.7;
    margin: 0 0 14px 0;
}
.gx-catalog .catalog-heading p:last-child,
.gx-catalog .catalog-content p:last-child {
    margin-bottom: 0;
}
.gx-catalog .catalog-section.catalog-dark .catalog-heading h2,
.gx-catalog .catalog-section.catalog-analytics-section .catalog-heading h2,
.gx-catalog .catalog-section.catalog-newton-section .catalog-content h2,
.gx-catalog .catalog-section.catalog-event-section .catalog-content h2,
.gx-catalog .catalog-section.catalog-ecosystem .catalog-heading h2,
.gx-catalog .catalog-hero h1 {
    color: #ffffff;
}
.gx-catalog .catalog-section.catalog-dark .catalog-heading p,
.gx-catalog .catalog-section.catalog-dark .catalog-content p,
.gx-catalog .catalog-section.catalog-analytics-section .catalog-heading p,
.gx-catalog .catalog-section.catalog-newton-section .catalog-content p,
.gx-catalog .catalog-section.catalog-event-section .catalog-content p,
.gx-catalog .catalog-section.catalog-ecosystem .catalog-heading p {
    color: #94a3b8;
}
.gx-catalog .catalog-two-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}
.gx-catalog .catalog-content h3 {
    font-size: 22px;
    color: inherit;
}

/* ---------- Botões ---------- */
.gx-catalog .catalog-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    height: 52px;
    padding: 0 20px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 8px;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 1px solid transparent;
}
.gx-catalog .catalog-btn-primary {
    background: #00a0e3;
    color: #ffffff;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
}
.gx-catalog .catalog-btn-primary:hover {
    background: #008cc6;
    transform: translateY(-2px);
}
.gx-catalog .catalog-btn-outline {
    background: transparent;
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.3);
}
.gx-catalog .catalog-btn-outline:hover {
    background: rgba(255, 255, 255, 0.05);
    border-color: #ffffff;
}
.gx-catalog .catalog-btn-light {
    background: rgba(255, 255, 255, 0.1);
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.25);
}
.gx-catalog .catalog-btn-light:hover {
    background: rgba(255, 255, 255, 0.18);
}
.gx-catalog .catalog-hero-actions,
.gx-catalog .catalog-final-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}
.gx-catalog .catalog-final-actions {
    justify-content: center;
    margin-top: 32px;
}

/* ---------- Lista de checagem ---------- */
.gx-catalog .catalog-check-list {
    list-style: none;
    margin: 28px 0 0 0;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 24px;
}
.gx-catalog .catalog-check-list li {
    position: relative;
    padding-left: 26px;
    font-size: 15px;
    color: #334155;
    font-weight: 500;
}
.gx-catalog .catalog-check-list li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    color: #10b981;
    font-weight: 800;
}
.gx-catalog .catalog-check-list.catalog-check-light li {
    color: #e2e8f0;
}

/* ---------- Tags (badges) ---------- */
.gx-catalog .catalog-hero-tags,
.gx-catalog .catalog-final-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 28px;
}
.gx-catalog .catalog-final-tags {
    justify-content: center;
    margin: 24px 0;
}
.gx-catalog .catalog-hero-tags span,
.gx-catalog .catalog-final-tags span {
    background: rgba(0, 160, 227, 0.12);
    color: #38bdf8;
    font-size: 12.5px;
    font-weight: 700;
    padding: 8px 16px;
    border-radius: 100px;
    border: 1px solid rgba(0, 160, 227, 0.3);
}

/* ══════════════════════════════════════════════
   01. HERO
══════════════════════════════════════════════ */
.gx-catalog .catalog-hero {
    padding: 60px 0 100px 0;
}
.gx-catalog .catalog-hero-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}
.gx-catalog .catalog-hero-content h1 {
    font-size: 44px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1px;
    margin: 0 0 20px 0;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}
.gx-catalog .catalog-hero-content h1 span {
    display: block;
    color: #00a0e3;
    font-size: 26px;
    font-weight: 700;
    margin-top: 10px;
}
.gx-catalog .catalog-hero-content > p {
    font-size: 18px;
    color: #cbd5e1;
    line-height: 1.7;
    margin: 0;
    max-width: 520px;
    margin-bottom:25px;
}

.gx-catalog .catalog-browser {
    background: #ffffff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 30px 60px -15px rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.08);
}
.gx-catalog .catalog-browser-top {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 16px;
    background: #f1f5f9;
    border-bottom: 1px solid #e2e8f0;
    font-size: 12px;
    color: #64748b;
}
.gx-catalog .catalog-browser-dots {
    display: flex;
    gap: 6px;
}
.gx-catalog .catalog-browser-dots i {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #cbd5e1;
    display: block;
}
.gx-catalog .catalog-browser-top > span {
    flex: 1;
}
.gx-catalog .catalog-browser-actions {
    color: #334155;
    font-size: 13px;
    white-space: nowrap;
}
.gx-catalog .catalog-browser-actions b {
    background: #00a0e3;
    color: #fff;
    font-size: 10px;
    padding: 1px 6px;
    border-radius: 100px;
}
.gx-catalog .catalog-magazine {
    display: grid;
    grid-template-columns: 32px 1fr 1fr 32px;
    align-items: center;
    gap: 10px;
    padding: 20px;
    background: #f8fafc;
}
.gx-catalog .catalog-arrow {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    font-size: 16px;
    color: #334155;
    display: flex;
    align-items: center;
    justify-content: center;
}
.gx-catalog .catalog-page {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 22px;
    min-height: 260px;
    position: relative;
}
.gx-catalog .catalog-page-editorial {
    background: linear-gradient(160deg, #0b1e46 0%, #123f8f 100%);
    color: #fff;
    border: none;
    overflow: hidden;
    padding-bottom: 100px;
}
.gx-catalog .catalog-page-label {
    display: inline-block;
    background: rgba(255, 255, 255, 0.15);
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    padding: 4px 12px;
    border-radius: 100px;
    margin-bottom: 14px;
}
.gx-catalog .catalog-page-editorial h3 {
    font-size: 22px;
    font-weight: 800;
    margin: 0 0 10px 0;
}
.gx-catalog .catalog-page-editorial h3 span {
    display: block;
    color: #7dd3fc;
}
.gx-catalog .catalog-page-editorial > p {
    font-size: 13px;
    color: #cbd5e1;
    margin: 0 0 16px 0;
}
.gx-catalog .catalog-page-editorial > button {
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 9px 16px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 12.5px;
}
.gx-catalog .catalog-editorial-art {
    position: absolute;
    bottom: 14px;
    right: 14px;
    width: 70px;
    height: 70px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.5px;
    color: #7dd3fc;
}
.gx-catalog .catalog-product-badge {
    display: inline-block;
    background: #dcfce7;
    color: #16a34a;
    font-size: 10px;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 100px;
    margin-bottom: 14px;
}
.gx-catalog .catalog-product-image {
    width: 100%;
    height: 100px;
    border-radius: 10px;
    background: linear-gradient(135deg, #e0f2fe, #f0f9ff);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #94a3b8;
    font-size: 11px;
    font-weight: 700;
    margin-bottom: 14px;
}
.gx-catalog .catalog-page-product small {
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
}
.gx-catalog .catalog-page-product h4 {
    color: #0f172a;
    font-size: 15px;
    margin: 4px 0 8px 0;
}
.gx-catalog .catalog-product-code {
    color: #64748b;
    font-size: 11px;
    margin-bottom: 8px;
}
.gx-catalog .catalog-product-price {
    color: #00a0e3;
    font-weight: 800;
    font-size: 16px;
    margin-bottom: 14px;
}
.gx-catalog .catalog-page-product > button {
    width: 100%;
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 9px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 12.5px;
}
.gx-catalog .catalog-browser-footer {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 14px 20px;
    border-top: 1px solid #e2e8f0;
    font-size: 12px;
    color: #64748b;
}
.gx-catalog .catalog-browser-footer > div {
    flex: 1;
    height: 4px;
    background: #f1f5f9;
    border-radius: 100px;
    overflow: hidden;
}
.gx-catalog .catalog-browser-footer > div i {
    display: block;
    height: 100%;
    background: #00a0e3;
    border-radius: 100px;
}
.gx-catalog .catalog-browser-footer button {
    background: #f1f5f9;
    border: none;
    color: #334155;
    padding: 8px 16px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 12px;
    white-space: nowrap;
}

/* ══════════════════════════════════════════════
   02. CONCEITO — jornada com setas
══════════════════════════════════════════════ */
.gx-catalog .catalog-journey {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
}
.gx-catalog .catalog-journey article {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 22px 18px;
    text-align: center;
    min-width: 130px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}
.gx-catalog .catalog-journey article > span:first-child {
    display: block;
    font-size: 11px;
    font-weight: 800;
    color: #94a3b8;
    margin-bottom: 8px;
}
.gx-catalog .catalog-journey article div {
    width: 40px;
    height: 40px;
    margin: 0 auto 10px auto;
    border-radius: 50%;
    background: #e0f2fe;
    color: #0284c7;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 17px;
}
.gx-catalog .catalog-journey article strong {
    display: block;
    font-size: 14.5px;
    color: #0f172a;
    margin-bottom: 4px;
}
.gx-catalog .catalog-journey article small {
    color: #64748b;
    font-size: 12px;
}
.gx-catalog .catalog-journey > i {
    font-style: normal;
    color: #cbd5e1;
    font-size: 18px;
}

/* ══════════════════════════════════════════════
   03. REVISTA INTERATIVA
══════════════════════════════════════════════ */
.gx-catalog .catalog-spread {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}
.gx-catalog .catalog-spread-page {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 20px;
    min-height: 240px;
}
.gx-catalog .catalog-spread-page > small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 12px;
}
.gx-catalog .catalog-spread-cover {
    background: linear-gradient(160deg, #0b1e46 0%, #123f8f 100%);
    color: #fff;
    border: none;
}
.gx-catalog .catalog-spread-cover > small {
    color: #7dd3fc;
}
.gx-catalog .catalog-spread-cover h3 {
    font-size: 20px;
    font-weight: 800;
    margin: 0 0 20px 0;
}
.gx-catalog .catalog-spread-cover h3 span {
    display: block;
    color: #7dd3fc;
}
.gx-catalog .catalog-cover-image {
    width: 100%;
    height: 100px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    font-weight: 800;
    color: rgba(255, 255, 255, 0.7);
}
.gx-catalog .catalog-mini-products {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    margin-bottom: 14px;
}
.gx-catalog .catalog-mini-products article {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 8px;
    position: relative;
}
.gx-catalog .catalog-mini-products article div {
    width: 100%;
    aspect-ratio: 1;
    border-radius: 8px;
    background: linear-gradient(135deg, #e0f2fe, #f0f9ff);
    margin-bottom: 6px;
}
.gx-catalog .catalog-mini-products strong {
    display: block;
    color: #0f172a;
    font-size: 12px;
}
.gx-catalog .catalog-mini-products span {
    color: #00a0e3;
    font-size: 11.5px;
    font-weight: 700;
}
.gx-catalog .catalog-mini-products button {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #00a0e3;
    color: #fff;
    border: none;
    font-weight: 700;
    line-height: 1;
}
.gx-catalog .catalog-page-number {
    display: block;
    text-align: right;
    color: #94a3b8;
    font-size: 11px;
}

/* ══════════════════════════════════════════════
   04. VITRINE COMERCIAL
══════════════════════════════════════════════ */
.gx-catalog .catalog-product-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
}
.gx-catalog .catalog-product-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 20px;
    text-align: left;
    position: relative;
    transition: all 0.3s ease;
}
.gx-catalog .catalog-product-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.08);
    border-color: #00a0e3;
}
.gx-catalog .catalog-ready {
    display: inline-block;
    background: #dcfce7;
    color: #16a34a;
    font-size: 10px;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 100px;
    margin-bottom: 12px;
}
.gx-catalog .catalog-product-card-image {
    width: 100%;
    height: 110px;
    border-radius: 10px;
    background: linear-gradient(135deg, #e0f2fe, #f0f9ff);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #94a3b8;
    font-size: 11px;
    font-weight: 700;
    margin-bottom: 14px;
}
.gx-catalog .catalog-product-card > small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
}
.gx-catalog .catalog-product-card h3 {
    color: #0f172a;
    font-size: 15px;
    margin: 4px 0 8px 0;
}
.gx-catalog .catalog-product-card > strong {
    display: block;
    color: #00a0e3;
    font-size: 17px;
    font-weight: 800;
    margin-bottom: 14px;
}
.gx-catalog .catalog-quantity {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}
.gx-catalog .catalog-quantity button {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    color: #334155;
    font-weight: 700;
}
.gx-catalog .catalog-quantity span {
    font-weight: 700;
    color: #0f172a;
}
.gx-catalog .catalog-add {
    width: 100%;
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 11px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 13px;
}

/* ══════════════════════════════════════════════
   05. B2B PERSONALIZADO
══════════════════════════════════════════════ */
.gx-catalog .catalog-b2b-card {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 18px;
    padding: 24px;
}
.gx-catalog .catalog-b2b-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid #1e293b;
}
.gx-catalog .catalog-b2b-header small {
    display: block;
    color: #64748b;
    font-size: 10.5px;
    font-weight: 700;
}
.gx-catalog .catalog-b2b-header strong {
    color: #fff;
    font-size: 15px;
}
.gx-catalog .catalog-b2b-header > span {
    background: rgba(245, 158, 11, 0.15);
    color: #fbbf24;
    font-size: 11px;
    font-weight: 800;
    padding: 5px 12px;
    border-radius: 100px;
}
.gx-catalog .catalog-b2b-product {
    display: flex;
    gap: 16px;
    margin-bottom: 20px;
}
.gx-catalog .catalog-b2b-image {
    width: 80px;
    height: 80px;
    flex-shrink: 0;
    border-radius: 10px;
    background: linear-gradient(135deg, rgba(0, 160, 227, 0.25), rgba(128, 43, 226, 0.15));
    display: flex;
    align-items: center;
    justify-content: center;
    color: #64748b;
    font-size: 10px;
    font-weight: 700;
}
.gx-catalog .catalog-b2b-product small {
    color: #64748b;
    font-size: 10.5px;
}
.gx-catalog .catalog-b2b-product h3 {
    color: #fff;
    font-size: 15px;
    margin: 4px 0 6px 0;
}
.gx-catalog .catalog-standard-price {
    color: #64748b;
    font-size: 12px;
}
.gx-catalog .catalog-b2b-product > div > span {
    display: block;
    color: #38bdf8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-top: 6px;
}
.gx-catalog .catalog-customer-price {
    color: #00a0e3;
    font-size: 19px;
    font-weight: 800;
}
.gx-catalog .catalog-b2b-info {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-bottom: 20px;
}
.gx-catalog .catalog-b2b-info article {
    background: #0b0f19;
    border-radius: 10px;
    padding: 12px 10px;
    text-align: center;
}
.gx-catalog .catalog-b2b-info small {
    display: block;
    color: #64748b;
    font-size: 9.5px;
    font-weight: 700;
    margin-bottom: 4px;
}
.gx-catalog .catalog-b2b-info strong {
    color: #e2e8f0;
    font-size: 12.5px;
}
.gx-catalog .catalog-b2b-card > button {
    width: 100%;
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 13px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 13.5px;
}

/* ══════════════════════════════════════════════
   06. COMPARTILHAMENTO / SFA
══════════════════════════════════════════════ */
.gx-catalog .catalog-share-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 24px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-catalog .catalog-share-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
}
.gx-catalog .catalog-share-header small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
}
.gx-catalog .catalog-share-header strong {
    color: #0f172a;
    font-size: 15px;
}
.gx-catalog .catalog-share-header > span {
    color: #00a0e3;
    font-size: 16px;
}
.gx-catalog .catalog-share-card label {
    display: block;
    font-size: 12px;
    font-weight: 700;
    color: #334155;
    margin-bottom: 14px;
}
.gx-catalog .catalog-share-card > label > div {
    margin-top: 6px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 10px 12px;
    font-weight: 400;
    font-size: 13.5px;
    color: #0f172a;
}
.gx-catalog .catalog-share-options {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 14px;
}
.gx-catalog .catalog-share-options label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 500;
    color: #334155;
    margin-bottom: 0;
}
.gx-catalog .catalog-generate-link {
    width: 100%;
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 13px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 13.5px;
    margin: 6px 0 16px 0;
}
.gx-catalog .catalog-generated-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #f0f9ff;
    border-radius: 8px;
    padding: 10px 14px;
    margin-bottom: 16px;
}
.gx-catalog .catalog-generated-link span {
    color: #0284c7;
    font-size: 12.5px;
    font-weight: 600;
}
.gx-catalog .catalog-generated-link button {
    background: none;
    border: 1px solid #00a0e3;
    color: #00a0e3;
    border-radius: 6px;
    padding: 5px 12px;
    font-size: 11.5px;
    font-weight: 700;
}
.gx-catalog .catalog-share-channels {
    display: flex;
    gap: 8px;
}
.gx-catalog .catalog-share-channels button {
    flex: 1;
    border: 1px solid #e2e8f0;
    background: #fff;
    color: #334155;
    padding: 10px;
    border-radius: 8px;
    font-size: 12.5px;
    font-weight: 600;
}

/* ══════════════════════════════════════════════
   07. JORNADA / CRM — timeline
══════════════════════════════════════════════ */
.gx-catalog .catalog-tracking-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-catalog .catalog-tracking-header {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 26px;
    padding-bottom: 20px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-catalog .catalog-tracking-header small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
}
.gx-catalog .catalog-tracking-header strong {
    color: #0f172a;
    font-size: 14.5px;
}
.gx-catalog .catalog-timeline {
    display: flex;
    align-items: center;
    gap: 6px;
}
.gx-catalog .catalog-timeline article {
    flex: 1;
    text-align: center;
}
.gx-catalog .catalog-timeline article span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    margin: 0 auto 10px auto;
    border-radius: 50%;
    background: #f1f5f9;
    color: #94a3b8;
    font-size: 14px;
}
.gx-catalog .catalog-timeline article.complete span {
    background: #dcfce7;
    color: #16a34a;
}
.gx-catalog .catalog-timeline article small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
}
.gx-catalog .catalog-timeline article strong {
    display: block;
    color: #0f172a;
    font-size: 12.5px;
    margin-top: 2px;
}
.gx-catalog .catalog-timeline > i {
    flex: 0 0 24px;
    height: 1px;
    background: #e2e8f0;
    margin-bottom: 42px;
}

/* ══════════════════════════════════════════════
   08. CARRINHO
══════════════════════════════════════════════ */
.gx-catalog .catalog-cart {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-catalog .catalog-cart-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
    padding-bottom: 14px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-catalog .catalog-cart-header strong {
    color: #0f172a;
    font-size: 16px;
}
.gx-catalog .catalog-cart-header span {
    color: #64748b;
    font-size: 12.5px;
}
.gx-catalog .catalog-cart > article {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 0;
    border-bottom: 1px solid #f8fafc;
}
.gx-catalog .catalog-cart-image {
    width: 52px;
    height: 52px;
    border-radius: 10px;
    background: linear-gradient(135deg, #e0f2fe, #f0f9ff);
    flex-shrink: 0;
}
.gx-catalog .catalog-cart > article > div {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.gx-catalog .catalog-cart > article strong {
    color: #0f172a;
    font-size: 14px;
}
.gx-catalog .catalog-cart > article small {
    color: #94a3b8;
    font-size: 11.5px;
}
.gx-catalog .catalog-cart > article > span {
    color: #0f172a;
    font-size: 14.5px;
    font-weight: 600;
}
.gx-catalog .catalog-cart-total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 0;
    font-size: 15px;
    color: #64748b;
}
.gx-catalog .catalog-cart-total strong {
    color: #0f172a;
    font-size: 20px;
    font-weight: 800;
}
.gx-catalog .catalog-cart > button {
    width: 100%;
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 14px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 14px;
    margin-bottom: 12px;
}
.gx-catalog .catalog-cart > a {
    display: block;
    text-align: center;
    color: #00a0e3;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}

/* ══════════════════════════════════════════════
   09. ANALYTICS
══════════════════════════════════════════════ */
.gx-catalog .catalog-analytics-dashboard {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 18px;
    padding: 26px;
}
.gx-catalog .catalog-analytics-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 22px;
}
.gx-catalog .catalog-analytics-header small {
    display: block;
    color: #64748b;
    font-size: 10.5px;
    font-weight: 700;
}
.gx-catalog .catalog-analytics-header strong {
    color: #fff;
    font-size: 15px;
}
.gx-catalog .catalog-analytics-header > span {
    color: #94a3b8;
    font-size: 12.5px;
}
.gx-catalog .catalog-analytics-kpis {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 24px;
}
.gx-catalog .catalog-analytics-kpis article {
    background: #0b0f19;
    border-radius: 12px;
    padding: 14px;
}
.gx-catalog .catalog-analytics-kpis small {
    display: block;
    color: #64748b;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.3px;
    margin-bottom: 6px;
}
.gx-catalog .catalog-analytics-kpis strong {
    display: block;
    color: #fff;
    font-size: 17px;
    font-weight: 800;
}
.gx-catalog .catalog-analytics-kpis span {
    color: #10b981;
    font-size: 11px;
    font-weight: 700;
}
.gx-catalog .catalog-analytics-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 20px;
}
.gx-catalog .catalog-chart,
.gx-catalog .catalog-top-products {
    background: #0b0f19;
    border-radius: 14px;
    padding: 18px;
}
.gx-catalog .catalog-chart > small,
.gx-catalog .catalog-top-products > small {
    display: block;
    color: #64748b;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 16px;
}
.gx-catalog .catalog-chart-bars {
    display: flex;
    align-items: flex-end;
    gap: 8px;
    height: 140px;
}
.gx-catalog .catalog-chart-bars i {
    flex: 1;
    display: block;
    background: linear-gradient(180deg, #00a0e3, #802be2);
    border-radius: 4px 4px 0 0;
}
.gx-catalog .catalog-top-products > div {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    border-top: 1px solid #1e293b;
}
.gx-catalog .catalog-top-products > div:first-of-type {
    border-top: none;
}
.gx-catalog .catalog-top-products b {
    color: #64748b;
    font-size: 11px;
    width: 18px;
}
.gx-catalog .catalog-top-products span {
    flex: 1;
    color: #e2e8f0;
    font-size: 13px;
}
.gx-catalog .catalog-top-products strong {
    color: #00a0e3;
    font-size: 12.5px;
    font-weight: 700;
}

/* ══════════════════════════════════════════════
   10. FUNIL
══════════════════════════════════════════════ */
.gx-catalog .catalog-funnel {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.gx-catalog .catalog-funnel article {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: linear-gradient(90deg, rgba(0, 160, 227, 0.25), rgba(128, 43, 226, 0.12));
    border: 1px solid rgba(0, 160, 227, 0.3);
    border-radius: 10px;
    padding: 14px 20px;
    color: #fff;
}
.gx-catalog .catalog-funnel span {
    font-size: 13.5px;
    color: #cbd5e1;
}
.gx-catalog .catalog-funnel strong {
    font-size: 16px;
    font-weight: 800;
}

/* ══════════════════════════════════════════════
   11. NEWTON PARA O COMPRADOR — chat
══════════════════════════════════════════════ */
.gx-catalog .catalog-newton-chat {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 18px;
    overflow: hidden;
}
.gx-catalog .catalog-newton-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 20px;
    border-bottom: 1px solid #1e293b;
}
.gx-catalog .catalog-newton-header > span {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    flex-shrink: 0;
}
.gx-catalog .catalog-newton-header strong {
    display: block;
    color: #fff;
    font-size: 14px;
}
.gx-catalog .catalog-newton-header small {
    color: #64748b;
    font-size: 11px;
}
.gx-catalog .catalog-newton-header i {
    margin-left: auto;
    font-style: normal;
    color: #10b981;
    font-size: 11.5px;
    font-weight: 700;
}
.gx-catalog .catalog-chat-message {
    max-width: 85%;
    padding: 12px 16px;
    margin: 16px 20px;
    border-radius: 14px;
    font-size: 13.5px;
    line-height: 1.5;
}
.gx-catalog .catalog-chat-message.user {
    margin-left: auto;
    background: #00a0e3;
    color: #fff;
    border-bottom-right-radius: 4px;
}
.gx-catalog .catalog-chat-message.newton {
    display: flex;
    gap: 10px;
    background: #0b0f19;
    border: 1px solid #1e293b;
    color: #e2e8f0;
    border-bottom-left-radius: 4px;
}
.gx-catalog .catalog-chat-message.newton > span {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #00a0e3;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.gx-catalog .catalog-chat-products {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin: 0 20px 16px 20px;
}
.gx-catalog .catalog-chat-products article {
    background: #0b0f19;
    border: 1px solid #1e293b;
    border-radius: 10px;
    padding: 8px;
}
.gx-catalog .catalog-chat-products article div {
    width: 100%;
    aspect-ratio: 1;
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(0, 160, 227, 0.25), rgba(128, 43, 226, 0.15));
    margin-bottom: 6px;
}
.gx-catalog .catalog-chat-products strong {
    display: block;
    color: #fff;
    font-size: 12px;
}
.gx-catalog .catalog-chat-products span {
    color: #00a0e3;
    font-size: 11.5px;
    font-weight: 700;
}
.gx-catalog .catalog-chat-input {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 20px;
    border-top: 1px solid #1e293b;
}
.gx-catalog .catalog-chat-input span {
    flex: 1;
    color: #64748b;
    font-size: 13px;
}
.gx-catalog .catalog-chat-input button {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #00a0e3;
    color: #fff;
    border: none;
    flex-shrink: 0;
}
.gx-catalog .catalog-prompts {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 24px;
}
.gx-catalog .catalog-prompts span {
    background: rgba(0, 160, 227, 0.08);
    border: 1px solid rgba(0, 160, 227, 0.2);
    border-radius: 10px;
    padding: 12px 16px;
    color: #cbd5e1;
    font-size: 13.5px;
    font-style: italic;
}

/* ══════════════════════════════════════════════
   12. NEWTON PARA GESTÃO — perguntas
══════════════════════════════════════════════ */
.gx-catalog .catalog-insights {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}
.gx-catalog .catalog-insights article {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 20px;
}
.gx-catalog .catalog-insights article > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    flex-shrink: 0;
}
.gx-catalog .catalog-insights p {
    margin: 0;
    color: #334155;
    font-size: 14.5px;
    line-height: 1.5;
}

/* ══════════════════════════════════════════════
   13. CRIAÇÃO COM IA
══════════════════════════════════════════════ */
.gx-catalog .catalog-create-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-catalog .catalog-create-header {
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-catalog .catalog-create-header small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
}
.gx-catalog .catalog-create-header strong {
    color: #0f172a;
    font-size: 16px;
}
.gx-catalog .catalog-create-card label {
    display: block;
    font-size: 12px;
    font-weight: 700;
    color: #334155;
    margin-bottom: 14px;
}
.gx-catalog .catalog-create-card > label > div {
    margin-top: 6px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 10px 12px;
    font-weight: 400;
    font-size: 13.5px;
    color: #0f172a;
}
.gx-catalog .catalog-create-options {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-bottom: 14px;
}
.gx-catalog .catalog-create-options label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 500;
    color: #334155;
    margin-bottom: 0;
}
.gx-catalog .catalog-create-card > button {
    width: 100%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    border: none;
    padding: 14px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 14px;
    margin-top: 6px;
}

/* ══════════════════════════════════════════════
   14. QR CODE / FEIRAS
══════════════════════════════════════════════ */
.gx-catalog .catalog-qr-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 30px;
    text-align: center;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-catalog .catalog-qr-card > small {
    display: block;
    color: #94a3b8;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 18px;
}
.gx-catalog .catalog-qr {
    width: 140px;
    height: 140px;
    margin: 0 auto 20px auto;
    background: #0f172a;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.gx-catalog .catalog-qr div {
    color: #fff;
    font-size: 22px;
    line-height: 1.3;
    letter-spacing: 4px;
}
.gx-catalog .catalog-qr-card h3 {
    color: #0f172a;
    font-size: 17px;
    margin: 0 0 10px 0;
}
.gx-catalog .catalog-qr-card > span {
    color: #00a0e3;
    font-size: 13px;
    font-weight: 600;
}

/* ══════════════════════════════════════════════
   15. GESTÃO DE CATÁLOGOS
══════════════════════════════════════════════ */
.gx-catalog .catalog-admin {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-catalog .catalog-admin-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}
.gx-catalog .catalog-admin-header small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
}
.gx-catalog .catalog-admin-header strong {
    color: #0f172a;
    font-size: 16px;
}
.gx-catalog .catalog-admin-header button {
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 10px 18px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 13px;
}
.gx-catalog .catalog-admin-tabs {
    display: flex;
    gap: 8px;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-catalog .catalog-admin-tabs span {
    color: #64748b;
    font-size: 13px;
    font-weight: 600;
    padding: 6px 14px;
    border-radius: 100px;
}
.gx-catalog .catalog-admin-tabs span.active {
    background: #e0f2fe;
    color: #0284c7;
}
.gx-catalog .catalog-admin-item {
    display: grid;
    grid-template-columns: 60px 1.6fr 1fr 1fr 1fr 1.4fr;
    align-items: center;
    gap: 16px;
}
.gx-catalog .catalog-admin-cover {
    width: 60px;
    height: 60px;
    border-radius: 10px;
    background: linear-gradient(160deg, #0b1e46 0%, #123f8f 100%);
    color: #7dd3fc;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 13px;
}
.gx-catalog .catalog-published {
    display: block;
    color: #16a34a;
    font-size: 11px;
    font-weight: 700;
    margin-bottom: 4px;
}
.gx-catalog .catalog-admin-item > div > strong {
    display: block;
    color: #0f172a;
    font-size: 14.5px;
}
.gx-catalog .catalog-admin-item > div > small {
    color: #94a3b8;
    font-size: 11.5px;
}
.gx-catalog .catalog-admin-item > div small:not(.catalog-published) {
    display: block;
    color: #94a3b8;
    font-size: 9.5px;
    font-weight: 700;
    margin-bottom: 4px;
}
.gx-catalog .catalog-admin-item > div strong {
    color: #0f172a;
    font-size: 14.5px;
}
.gx-catalog .catalog-admin-actions {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.gx-catalog .catalog-admin-actions button {
    border: 1px solid #e2e8f0;
    background: #fff;
    color: #334155;
    padding: 7px 10px;
    border-radius: 8px;
    font-size: 11.5px;
    font-weight: 600;
}

/* ══════════════════════════════════════════════
   16. INTEGRAÇÃO / ECOSSISTEMA
══════════════════════════════════════════════ */
.gx-catalog .catalog-ecosystem-map {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
}
.gx-catalog .catalog-ecosystem-newton {
    display: flex;
    align-items: center;
    gap: 12px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid #1e293b;
    border-radius: 100px;
    padding: 8px 22px 8px 8px;
}
.gx-catalog .catalog-ecosystem-newton > span {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 13px;
}
.gx-catalog .catalog-ecosystem-newton small {
    display: block;
    color: #64748b;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-catalog .catalog-ecosystem-newton strong {
    color: #fff;
    font-size: 13px;
}
.gx-catalog .catalog-ecosystem-line {
    width: 1px;
    height: 26px;
    background: #1e293b;
}
.gx-catalog .catalog-ecosystem-core {
    background: linear-gradient(135deg, #00a0e3, #802be2);
    border-radius: 16px;
    padding: 22px 40px;
    text-align: center;
    color: #fff;
}
.gx-catalog .catalog-ecosystem-core small {
    display: block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1px;
    opacity: 0.85;
}
.gx-catalog .catalog-ecosystem-core strong {
    display: block;
    font-size: 20px;
    margin-top: 4px;
}
.gx-catalog .catalog-ecosystem-modules {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 14px;
    width: 100%;
}
.gx-catalog .catalog-ecosystem-modules article {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid #1e293b;
    border-radius: 14px;
    padding: 18px 12px;
    text-align: center;
}
.gx-catalog .catalog-ecosystem-modules small {
    display: block;
    color: #64748b;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.3px;
    margin-bottom: 8px;
}
.gx-catalog .catalog-ecosystem-modules strong {
    display: block;
    color: #fff;
    font-size: 13.5px;
    margin-bottom: 4px;
}
.gx-catalog .catalog-ecosystem-modules span {
    color: #94a3b8;
    font-size: 10.5px;
}

/* ══════════════════════════════════════════════
   17. CTA FINAL
══════════════════════════════════════════════ */
.gx-catalog .catalog-final-cta {
    background: #0b0f19;
    padding: 120px 0;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.gx-catalog .catalog-final-cta::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 600px;
    height: 400px;
    background: radial-gradient(circle, rgba(0, 160, 227, 0.15) 0%, rgba(11, 15, 25, 0) 70%);
}
.gx-catalog .catalog-final-cta .catalog-container {
    position: relative;
    z-index: 1;
    max-width: 800px;
}
.gx-catalog .catalog-final-cta h2 {
    color: #ffffff;
    font-size: 42px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
    margin: 18px 0 20px 0;
}
.gx-catalog .catalog-final-cta h2 span {
    display: block;
    color: #94a3b8;
    font-size: 22px;
    font-weight: 500;
    margin-top: 12px;
}
.gx-catalog .catalog-final-cta p {
    color: #94a3b8;
    font-size: 17px;
    line-height: 1.7;
    max-width: 640px;
    margin: 0 auto;
}

/* ══════════════════════════════════════════════
   RESPONSIVO
══════════════════════════════════════════════ */
@media (max-width: 992px) {
    .gx-catalog .catalog-hero-grid,
    .gx-catalog .catalog-two-columns {
        grid-template-columns: 1fr;
    }
    .gx-catalog .catalog-product-grid,
    .gx-catalog .catalog-b2b-info,
    .gx-catalog .catalog-insights,
    .gx-catalog .catalog-analytics-kpis,
    .gx-catalog .catalog-ecosystem-modules {
        grid-template-columns: repeat(2, 1fr);
    }
    .gx-catalog .catalog-analytics-grid {
        grid-template-columns: 1fr;
    }
    .gx-catalog .catalog-admin-item {
        grid-template-columns: 1fr 1fr;
        row-gap: 12px;
    }
}

@media (max-width: 768px) {
    .gx-catalog .catalog-section {
        padding: 64px 0;
    }
    .gx-catalog .catalog-hero-content h1 {
        font-size: 30px;
    }
    .gx-catalog .catalog-heading h2,
    .gx-catalog .catalog-content h2 {
        font-size: 26px;
    }
    .gx-catalog .catalog-check-list {
        grid-template-columns: 1fr;
    }
    .gx-catalog .catalog-magazine {
        grid-template-columns: 24px 1fr 24px;
    }
    .gx-catalog .catalog-magazine .catalog-page-product {
        display: none;
    }
    .gx-catalog .catalog-spread,
    .gx-catalog .catalog-product-grid,
    .gx-catalog .catalog-b2b-info,
    .gx-catalog .catalog-mini-products,
    .gx-catalog .catalog-insights,
    .gx-catalog .catalog-analytics-kpis,
    .gx-catalog .catalog-chat-products,
    .gx-catalog .catalog-ecosystem-modules {
        grid-template-columns: 1fr;
    }
    .gx-catalog .catalog-tracking-header {
        grid-template-columns: 1fr;
        gap: 8px;
    }
    .gx-catalog .catalog-timeline {
        flex-direction: column;
        align-items: flex-start;
    }
    .gx-catalog .catalog-timeline > i {
        display: none;
    }
    .gx-catalog .catalog-admin-item {
        grid-template-columns: 1fr;
    }
    .gx-catalog .catalog-final-cta h2 {
        font-size: 26px;
    }
}

/* ══════════════════════════════════════════════════════════════
   SELLER CENTER — OPERAÇÃO — padrão visual do b2c.html / Produto.html
   (conteúdo original da página preservado; aqui só entra o estilo)
   Reaproveita as classes compartilhadas já definidas no bloco
   "SELLER CENTER — UNIVERSIDADE" acima: .seller-container,
   .seller-section(.seller-light), .seller-eyebrow(-light),
   .seller-section-heading(.seller-center), .seller-two-columns,
   .seller-content, .seller-check-list.
══════════════════════════════════════════════════════════════ */
.gx-seller-center {
    display: block;
    overflow: hidden;
    background: #ffffff;
}
.gx-seller-center * {
    box-sizing: border-box;
}
.gx-seller-center button {
    font-family: inherit;
    cursor: pointer;
}

/* ---------- fundo escuro genérico + variante clara do checklist ---------- */
.seller-section.seller-dark,
.seller-final-cta {
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.seller-section.seller-dark .seller-section-heading h2,
.seller-section.seller-dark .seller-content h2,
.seller-final-cta h2 {
    color: #ffffff;
}
.seller-section.seller-dark .seller-section-heading p,
.seller-section.seller-dark .seller-content p,
.seller-final-cta p {
    color: #94a3b8;
}
.seller-check-list.seller-check-light li {
    color: #e2e8f0;
}

/* ---------- header semântico usado como sub-cabeçalho (bug do <header> global) ---------- */
.seller-kanban header {
    position: static !important;
    top: auto !important;
    left: auto !important;
    z-index: auto !important;
    width: auto !important;
    display: flex !important;
    flex-direction: row !important;
    border-bottom: none !important;
}

/* ---------- Botões ---------- */
.seller-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    height: 52px;
    padding: 0 26px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 8px;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 1px solid transparent;
}
.seller-btn-primary {
    background: #00a0e3;
    color: #ffffff;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
}
.seller-btn-primary:hover {
    background: #008cc6;
    transform: translateY(-2px);
}
.seller-btn-outline {
    background: transparent;
    color: #FFF;
    border-color: #e2e8f0;
}
.seller-btn-outline:hover {
    background: #f8fafc;
    border-color: #cbd5e1;
    color:#000;
}
.seller-final-cta .seller-btn-outline,
.seller-btn-light {
    background: rgba(255, 255, 255, 0.1);
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.25);
}
.seller-final-cta .seller-btn-outline:hover,
.seller-btn-light:hover {
    background: rgba(255, 255, 255, 0.18);
}
.seller-hero-actions,
.seller-final-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 8px;
}
.seller-final-actions {
    justify-content: center;
    margin-top: 36px;
}
.seller-text-link {
    display: inline-block;
    margin-top: 8px;
    color: #00a0e3;
    font-weight: 700;
    font-size: 14.5px;
    text-decoration: none;
}
.seller-text-link:hover {
    text-decoration: underline;
}

/* ---------- Chips / tags ---------- */
.seller-hero-tags,
.seller-final-modules,
.seller-newton-prompts {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 24px;
}
.seller-hero-tags span,
.seller-final-modules span {
    background: rgba(0, 160, 227, 0.12);
    color: #38bdf8;
    font-size: 12.5px;
    font-weight: 700;
    padding: 8px 16px;
    border-radius: 100px;
    border: 1px solid rgba(0, 160, 227, 0.3);
}
.seller-final-modules {
    justify-content: center;
    margin-bottom: 8px;
}
.seller-newton-prompts span {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    color: #334155;
    font-size: 13px;
    font-style: italic;
    padding: 10px 16px;
    border-radius: 10px;
}

/* ---------- Status / badges reutilizáveis ---------- */
.seller-status {
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}
.seller-status.active {
    color: #16a34a;
}
.seller-status.warning {
    color: #d97706;
}

/* ---------- Tabelas reutilizáveis (catálogo / conciliação) ---------- */
.seller-table {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    overflow: hidden;
}
.seller-table-row {
    display: grid;
    grid-template-columns: 2fr 0.8fr 0.8fr 1fr;
    align-items: center;
    gap: 10px;
    padding: 14px 16px;
    border-top: 1px solid #f1f5f9;
    font-size: 13px;
}
.seller-table-row:first-child {
    border-top: none;
}
.seller-table-row.header {
    background: #f8fafc;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}
.seller-table-row > div:first-child {
    display: flex;
    align-items: center;
    gap: 10px;
}
.seller-table-row strong {
    color: #0f172a;
    font-weight: 600;
}
.seller-table-row small {
    display: block;
    color: #94a3b8;
    font-size: 11px;
}
.seller-table-row button {
    justify-self: end;
    background: none;
    border: none;
    color: #00a0e3;
    font-weight: 700;
    font-size: 12.5px;
    padding: 0;
}
.seller-product-thumb {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background: linear-gradient(135deg, #e0f2fe, #f0f9ff);
    flex-shrink: 0;
}
.seller-reconciliation {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    overflow: hidden;
}
.seller-reconciliation .seller-table-row {
    grid-template-columns: 0.8fr 1fr 1fr 1fr 1fr 0.8fr;
}

/* ---------- Painel genérico (cabeçalho + busca, usado em vários cards) ---------- */
.seller-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}
.seller-panel-header small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.seller-panel-header strong {
    color: #0f172a;
    font-size: 16px;
}
.seller-panel-header button {
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 9px 16px;
    border-radius: 8px;
    font-size: 12.5px;
    font-weight: 700;
    white-space: nowrap;
}
.seller-search {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 10px 14px;
    font-size: 13px;
    color: #94a3b8;
    margin-bottom: 14px;
}

/* ══════════════════════════════════════════════
   01. HERO
══════════════════════════════════════════════ */
.seller-hero {
    padding: 60px 0 100px 0;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.seller-hero-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}
.seller-hero-content h1 {
    font-size: 44px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1px;
    color: #ffffff;
    margin: 0 0 20px 0;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}
.seller-hero-content h1 span {
    display: block;
    color: #00a0e3;
    font-size: 26px;
    font-weight: 700;
    margin-top: 10px;
}
.seller-hero-content > p {
    font-size: 18px;
    color: #cbd5e1;
    line-height: 1.7;
    margin: 0;
    max-width: 520px;
}
.seller-hero-highlight {
    display: block;
    margin-top: 18px;
    color: #7dd3fc;
    font-size: 14.5px;
    font-weight: 600;
}

.seller-dashboard {
    background: #ffffff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 30px 60px -15px rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.08);
}
.seller-dashboard-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 20px;
    background: #0b0f19;
}
.seller-dashboard-brand {
    display: flex;
    align-items: center;
    gap: 10px;
}
.seller-dashboard-brand > span {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 13px;
    flex-shrink: 0;
}
.seller-dashboard-brand small {
    display: block;
    color: #64748b;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.seller-dashboard-brand strong {
    color: #fff;
    font-size: 13px;
}
.seller-dashboard-user {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #cbd5e1;
    font-size: 12.5px;
    font-weight: 600;
}
.seller-dashboard-body {
    padding: 22px 20px;
}
.seller-dashboard-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
}
.seller-dashboard-heading small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.seller-dashboard-heading h3 {
    color: #0f172a;
    font-size: 18px;
    margin: 2px 0 2px 0;
}
.seller-dashboard-heading p {
    color: #64748b;
    font-size: 12.5px;
    margin: 0;
}
.seller-dashboard-heading > span {
    color: #64748b;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}
.seller-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    margin-bottom: 16px;
}
.seller-kpis article {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 12px 10px;
}
.seller-kpis small {
    display: block;
    color: #94a3b8;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.3px;
}
.seller-kpis strong {
    display: block;
    color: #0f172a;
    font-size: 15px;
    margin: 4px 0 2px 0;
}
.seller-kpis span {
    color: #16a34a;
    font-size: 10.5px;
    font-weight: 700;
}
.seller-dashboard-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 14px;
}
.seller-chart-card {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 16px;
}
.seller-card-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}
.seller-card-title strong {
    color: #0f172a;
    font-size: 13.5px;
}
.seller-card-title span {
    color: #16a34a;
    font-size: 12px;
    font-weight: 700;
}
.seller-chart {
    display: flex;
    align-items: flex-end;
    gap: 5px;
    height: 90px;
}
.seller-chart i {
    display: block;
    flex: 1;
    background: linear-gradient(180deg, #00a0e3, rgba(0, 160, 227, 0.3));
    border-radius: 4px 4px 0 0;
    min-height: 4px;
}
.seller-operation-card {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 16px;
}
.seller-operation-card > strong {
    display: block;
    color: #0f172a;
    font-size: 13px;
    margin-bottom: 10px;
}
.seller-operation-card > div {
    display: flex;
    justify-content: space-between;
    font-size: 12.5px;
    color: #475569;
    padding: 6px 0;
    border-top: 1px solid #e2e8f0;
}
.seller-operation-card > div b {
    color: #0f172a;
}
.seller-operation-card > div.warning {
    color: #d97706;
}
.seller-operation-card > div.warning b {
    color: #d97706;
}

/* ══════════════════════════════════════════════
   02. JORNADA OPERACIONAL / 10. AUTOMAÇÃO DO PEDIDO
══════════════════════════════════════════════ */
.seller-journey,
.seller-automation-flow {
    display: flex;
    align-items: stretch;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
}
.seller-journey article,
.seller-automation-flow article {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 18px 14px;
    text-align: center;
    min-width: 120px;
    flex: 1;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}
.seller-automation-flow article {
    background: rgba(255, 255, 255, 0.04);
    border-color: #1e293b;
}
.seller-journey article > span:first-child,
.seller-automation-flow article > span:first-child {
    display: block;
    font-size: 11px;
    font-weight: 800;
    color: #94a3b8;
    margin-bottom: 8px;
}
.seller-journey article strong,
.seller-automation-flow article strong {
    display: block;
    font-size: 14px;
    color: #0f172a;
    margin: 2px 0 4px 0;
}
.seller-automation-flow article strong {
    color: #ffffff;
}
.seller-journey article small {
    color: #64748b;
    font-size: 11.5px;
}
.seller-automation-flow article small {
    display: block;
    color: #38bdf8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.3px;
    margin-bottom: 2px;
}
.seller-automation-flow article p {
    color: #94a3b8;
    font-size: 11.5px;
    margin: 0;
}
.seller-journey > i,
.seller-automation-flow > i {
    align-self: center;
    font-style: normal;
    color: #cbd5e1;
    font-size: 18px;
}
.seller-automation-flow > i {
    color: #38bdf8;
}

/* ══════════════════════════════════════════════
   03. CATÁLOGO
══════════════════════════════════════════════ */
.seller-products-panel {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 24px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}

/* ══════════════════════════════════════════════
   04. PREÇO + ESTOQUE
══════════════════════════════════════════════ */
.seller-stock-panel {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 24px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.seller-stock-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-top: 8px;
}
.seller-stock-grid > div > small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 10px;
}
.seller-stock-grid article {
    display: flex;
    justify-content: space-between;
    font-size: 13px;
    padding: 7px 0;
    border-top: 1px solid #f1f5f9;
}
.seller-stock-grid article span {
    color: #64748b;
}
.seller-stock-grid article strong {
    color: #0f172a;
}
.seller-margin {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #f0fdf4;
    border-radius: 10px;
    padding: 12px 16px;
    margin-top: 18px;
    font-size: 13px;
    color: #166534;
}
.seller-margin strong {
    font-size: 17px;
    font-weight: 800;
}

/* ══════════════════════════════════════════════
   05. GESTÃO DE PEDIDOS (kanban)
══════════════════════════════════════════════ */
.seller-orders-panel {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 24px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.seller-orders-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 20px;
}
.seller-orders-tabs span {
    background: #f1f5f9;
    color: #64748b;
    font-size: 12.5px;
    font-weight: 600;
    padding: 8px 16px;
    border-radius: 100px;
}
.seller-orders-tabs span.active {
    background: #00a0e3;
    color: #fff;
}
.seller-kanban {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}
.seller-kanban > div {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 14px;
}
.seller-kanban header {
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid #e2e8f0;
}
.seller-kanban header span {
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.seller-kanban header b {
    background: #e0f2fe;
    color: #0284c7;
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 100px;
}
.seller-kanban article {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 12px;
    margin-bottom: 10px;
    font-size: 12.5px;
}
.seller-kanban article:last-child {
    margin-bottom: 0;
}
.seller-kanban article strong {
    display: block;
    color: #0f172a;
    margin-bottom: 4px;
}
.seller-kanban article span {
    display: block;
    color: #64748b;
    margin-bottom: 4px;
}
.seller-kanban article b {
    color: #00a0e3;
    font-weight: 700;
}

/* ══════════════════════════════════════════════
   06. ERP + AUTOMAÇÃO
══════════════════════════════════════════════ */
.seller-integration-flow {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}
.seller-integration-flow > span {
    color: #38bdf8;
    font-size: 18px;
}
.seller-flow-system,
.seller-flow-main,
.seller-flow-integrator {
    width: 100%;
    max-width: 340px;
    text-align: center;
    border-radius: 14px;
    padding: 16px;
}
.seller-flow-system {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid #1e293b;
}
.seller-flow-main {
    background: linear-gradient(135deg, #00a0e3, #802be2);
    border: none;
}
.seller-flow-integrator {
    background: rgba(0, 160, 227, 0.08);
    border: 1px dashed rgba(0, 160, 227, 0.4);
}
.seller-flow-system small,
.seller-flow-integrator small {
    display: block;
    color: #64748b;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.seller-flow-main small {
    display: block;
    color: rgba(255, 255, 255, 0.8);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.seller-flow-system strong,
.seller-flow-integrator strong {
    display: block;
    color: #ffffff;
    font-size: 15px;
    margin: 4px 0;
}
.seller-flow-main strong {
    display: block;
    color: #ffffff;
    font-size: 16px;
    margin: 4px 0;
}
.seller-flow-system span,
.seller-flow-main span {
    color: #94a3b8;
    font-size: 11.5px;
}
.seller-flow-main span {
    color: rgba(255, 255, 255, 0.85);
}

/* ══════════════════════════════════════════════
   07. SINCRONIZAÇÃO ERP
══════════════════════════════════════════════ */
.seller-sync {
    display: grid;
    grid-template-columns: 180px 1fr 180px;
    gap: 20px;
    align-items: center;
}
.seller-sync-side {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 20px 16px;
    text-align: center;
}
.seller-sync-side.galactix {
    background: linear-gradient(135deg, #00a0e3, #802be2);
    border: none;
}
.seller-sync-side.galactix small {
    color: rgba(255, 255, 255, 0.8);
}
.seller-sync-side.galactix strong {
    color: #ffffff;
}
.seller-sync-side small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 4px;
}
.seller-sync-side strong {
    color: #0f172a;
    font-size: 14.5px;
}
.seller-sync-data {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.seller-sync-data article {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 10px 16px;
    font-size: 13px;
    color: #334155;
}
.seller-sync-data article i {
    font-style: normal;
    color: #00a0e3;
    font-size: 15px;
}
.seller-sync-data article.reverse {
    flex-direction: row-reverse;
}

/* ══════════════════════════════════════════════
   08. FATURAMENTO
══════════════════════════════════════════════ */
.seller-invoice-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 24px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.seller-invoice-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
}
.seller-invoice-header small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
}
.seller-invoice-header strong {
    color: #0f172a;
    font-size: 16px;
}
.seller-invoice-header > span {
    background: #dcfce7;
    color: #16a34a;
    font-size: 11.5px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 100px;
}
.seller-invoice-customer {
    background: #f8fafc;
    border-radius: 10px;
    padding: 12px 14px;
    margin-bottom: 12px;
}
.seller-invoice-customer small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
}
.seller-invoice-customer strong {
    display: block;
    color: #0f172a;
    font-size: 14px;
    margin: 2px 0;
}
.seller-invoice-customer span {
    color: #64748b;
    font-size: 12px;
}
.seller-invoice-value {
    margin-bottom: 18px;
}
.seller-invoice-value small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
}
.seller-invoice-value strong {
    display: block;
    color: #0f172a;
    font-size: 24px;
    font-weight: 800;
}
.seller-invoice-nfe {
    border-top: 1px dashed #e2e8f0;
    padding-top: 16px;
}
.seller-invoice-nfe > small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    margin-bottom: 8px;
}
.seller-invoice-nfe > div {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 6px;
}
.seller-invoice-nfe strong {
    color: #0f172a;
    font-size: 13.5px;
}
.seller-invoice-nfe > div span {
    color: #16a34a;
    font-size: 12px;
    font-weight: 700;
}
.seller-invoice-nfe p {
    color: #94a3b8;
    font-size: 11.5px;
    margin: 0 0 14px 0;
}
.seller-invoice-actions {
    display: flex;
    gap: 10px;
}
.seller-invoice-actions button {
    flex: 1;
    border: 1px solid #e2e8f0;
    background: #fff;
    color: #334155;
    padding: 10px;
    border-radius: 8px;
    font-size: 12.5px;
    font-weight: 700;
}

/* ══════════════════════════════════════════════
   09. LOGÍSTICA + TRANSPORTADORAS
══════════════════════════════════════════════ */
.seller-logistics-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 24px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.seller-tracking {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin: 20px 0;
}
.seller-tracking article {
    display: flex;
    align-items: center;
    gap: 12px;
}
.seller-tracking article > span {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #f1f5f9;
    color: #94a3b8;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    flex-shrink: 0;
}
.seller-tracking article.complete > span {
    background: #dcfce7;
    color: #16a34a;
}
.seller-tracking article.current > span {
    background: #00a0e3;
    color: #fff;
}
.seller-tracking article strong {
    display: block;
    color: #0f172a;
    font-size: 13.5px;
}
.seller-tracking article small {
    color: #94a3b8;
    font-size: 11.5px;
}
.seller-carrier-info {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    border-top: 1px solid #f1f5f9;
    padding-top: 16px;
}
.seller-carrier-info small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
}
.seller-carrier-info strong {
    color: #0f172a;
    font-size: 13.5px;
}
.seller-carrier-info button {
    margin-left: auto;
    background: none;
    border: none;
    color: #00a0e3;
    font-weight: 700;
    font-size: 13px;
}

/* ══════════════════════════════════════════════
   11. FINANCEIRO
══════════════════════════════════════════════ */
.seller-finance-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 24px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.seller-finance-card > small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.seller-finance-balance {
    display: block;
    color: #00a0e3;
    font-size: 28px;
    font-weight: 800;
    margin: 4px 0 16px 0;
}
.seller-next-payment {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #f0f9ff;
    border-radius: 10px;
    padding: 12px 16px;
    margin-bottom: 18px;
}
.seller-next-payment small {
    display: block;
    color: #64748b;
    font-size: 10px;
    font-weight: 700;
}
.seller-next-payment strong {
    color: #0f172a;
    font-size: 14px;
}
.seller-next-payment b {
    color: #00a0e3;
    font-size: 15px;
}
.seller-finance-summary > div {
    display: flex;
    justify-content: space-between;
    font-size: 13px;
    color: #64748b;
    padding: 7px 0;
    border-top: 1px solid #f1f5f9;
}
.seller-finance-summary > div strong {
    color: #0f172a;
}
.seller-finance-summary > div.total {
    font-size: 16px;
    font-weight: 800;
    color: #0f172a;
    border-top: 1px dashed #cbd5e1;
    margin-top: 4px;
    padding-top: 12px;
}
.seller-finance-summary > div.total strong {
    color: #16a34a;
}

/* ══════════════════════════════════════════════
   13. CRM
══════════════════════════════════════════════ */
.seller-crm-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 24px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.seller-crm-info {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    margin-bottom: 20px;
}
.seller-crm-info article {
    background: #f8fafc;
    border-radius: 10px;
    padding: 12px 14px;
}
.seller-crm-info small {
    display: block;
    color: #94a3b8;
    font-size: 9.5px;
    font-weight: 700;
}
.seller-crm-info strong {
    color: #0f172a;
    font-size: 15px;
}
.seller-crm-timeline > small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    margin-bottom: 10px;
}
.seller-crm-timeline article {
    display: flex;
    gap: 12px;
    padding: 8px 0;
    border-top: 1px solid #f1f5f9;
}
.seller-crm-timeline article > span {
    color: #94a3b8;
    font-size: 11px;
    font-weight: 700;
    flex-shrink: 0;
    width: 46px;
}
.seller-crm-timeline article strong {
    display: block;
    color: #0f172a;
    font-size: 13px;
}
.seller-crm-timeline article p {
    margin: 2px 0 0 0;
    color: #64748b;
    font-size: 12px;
}
.seller-full-button {
    display: block;
    width: 100%;
    margin-top: 18px;
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 13px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 13.5px;
}

/* ══════════════════════════════════════════════
   14. ATENDIMENTO
══════════════════════════════════════════════ */
.seller-support-card {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 18px;
    padding: 20px;
}
.seller-support-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
    padding-bottom: 14px;
    border-bottom: 1px solid #1e293b;
}
.seller-support-avatar {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: #00a0e3;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 12.5px;
    flex-shrink: 0;
}
.seller-support-header strong {
    display: block;
    color: #fff;
    font-size: 13.5px;
}
.seller-support-header small {
    color: #10b981;
    font-size: 11px;
}
.seller-support-message {
    max-width: 85%;
    padding: 10px 14px;
    border-radius: 12px;
    font-size: 13px;
    line-height: 1.5;
    margin-bottom: 12px;
}
.seller-support-message.customer {
    background: #1e293b;
    color: #e2e8f0;
    border-bottom-left-radius: 4px;
}
.seller-support-message.agent {
    margin-left: auto;
    background: #00a0e3;
    color: #fff;
    border-bottom-right-radius: 4px;
}
.seller-support-order {
    background: #0b0f19;
    border: 1px solid #1e293b;
    border-radius: 10px;
    padding: 14px;
    margin-bottom: 12px;
}
.seller-support-order > small {
    display: block;
    color: #64748b;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
}
.seller-support-order > div {
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
}
.seller-support-order strong {
    color: #fff;
    font-size: 14px;
}
.seller-support-order b {
    color: #00a0e3;
}
.seller-support-order > span {
    display: inline-block;
    color: #38bdf8;
    font-size: 11.5px;
    font-weight: 700;
    margin-bottom: 8px;
}
.seller-support-order p {
    color: #94a3b8;
    font-size: 11.5px;
    line-height: 1.6;
    margin: 0 0 12px 0;
}
.seller-support-order button {
    width: 100%;
    background: rgba(0, 160, 227, 0.15);
    color: #38bdf8;
    border: 1px solid rgba(0, 160, 227, 0.3);
    padding: 9px;
    border-radius: 8px;
    font-size: 12.5px;
    font-weight: 700;
}
.seller-support-input {
    display: flex;
    align-items: center;
    gap: 10px;
    background: #0b0f19;
    border: 1px solid #1e293b;
    border-radius: 100px;
    padding: 10px 8px 10px 16px;
}
.seller-support-input span {
    flex: 1;
    color: #64748b;
    font-size: 13px;
}
.seller-support-input button {
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 8px 16px;
    border-radius: 100px;
    font-size: 12px;
    font-weight: 700;
}

/* ══════════════════════════════════════════════
   15. SLA / GESTÃO POR EXCEÇÃO
══════════════════════════════════════════════ */
.seller-sla-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 24px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.seller-sla-card > small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.seller-sla-number {
    display: block;
    color: #16a34a;
    font-size: 34px;
    font-weight: 800;
    margin: 4px 0 2px 0;
}
.seller-sla-card > span {
    display: block;
    color: #64748b;
    font-size: 12.5px;
    margin-bottom: 14px;
}
.seller-sla-progress {
    width: 100%;
    height: 8px;
    background: #f1f5f9;
    border-radius: 100px;
    overflow: hidden;
    margin-bottom: 18px;
}
.seller-sla-progress i {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #10b981, #34d399);
    border-radius: 100px;
}
.seller-sla-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-bottom: 16px;
}
.seller-sla-grid article {
    background: #f8fafc;
    border-radius: 10px;
    padding: 12px 8px;
    text-align: center;
}
.seller-sla-grid article strong {
    display: block;
    color: #0f172a;
    font-size: 18px;
}
.seller-sla-grid article small {
    color: #64748b;
    font-size: 10.5px;
}
.seller-sla-grid article.warning strong {
    color: #d97706;
}
.seller-alert {
    background: #fef3c7;
    color: #92400e;
    font-size: 13px;
    font-weight: 600;
    padding: 12px 14px;
    border-radius: 10px;
}

/* ══════════════════════════════════════════════
   16. PERFORMANCE
══════════════════════════════════════════════ */
.seller-performance-kpis {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 14px;
    margin-bottom: 30px;
}
.seller-performance-kpis article {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid #1e293b;
    border-radius: 12px;
    padding: 16px 12px;
}
.seller-performance-kpis small {
    display: block;
    color: #64748b;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.3px;
}
.seller-performance-kpis strong {
    display: block;
    color: #fff;
    font-size: 18px;
    margin: 6px 0 4px 0;
}
.seller-performance-kpis span {
    color: #38bdf8;
    font-size: 11px;
    font-weight: 700;
}
.seller-performance-grid {
    display: grid;
    grid-template-columns: 1.6fr 1fr;
    gap: 20px;
}
.seller-performance-chart {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 16px;
    padding: 20px;
}
.seller-performance-chart > div small {
    display: block;
    color: #64748b;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.3px;
}
.seller-performance-chart > div strong {
    color: #fff;
    font-size: 15px;
}
.seller-big-chart {
    display: flex;
    align-items: flex-end;
    gap: 8px;
    height: 140px;
    margin-top: 18px;
}
.seller-big-chart i {
    display: block;
    flex: 1;
    background: linear-gradient(180deg, #00a0e3, #802be2);
    border-radius: 5px 5px 0 0;
    min-height: 4px;
}
.seller-top-products {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 16px;
    padding: 20px;
}
.seller-top-products > small {
    display: block;
    color: #64748b;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 14px;
}
.seller-top-products article {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 0;
    border-top: 1px solid #1e293b;
}
.seller-top-products article:first-of-type {
    border-top: none;
}
.seller-top-products b {
    color: #38bdf8;
    font-size: 12px;
    font-weight: 800;
    width: 20px;
}
.seller-top-products span {
    flex: 1;
    color: #e2e8f0;
    font-size: 12.5px;
}
.seller-top-products strong {
    color: #fff;
    font-size: 12.5px;
}

/* ══════════════════════════════════════════════
   17. OPERAÇÃO CONECTADA (ecossistema)
══════════════════════════════════════════════ */
.seller-ecosystem {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
}
.seller-ecosystem-client,
.seller-ecosystem-core {
    text-align: center;
    border-radius: 14px;
    padding: 16px 32px;
}
.seller-ecosystem-client {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
}
.seller-ecosystem-core {
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
}
.seller-ecosystem-client small,
.seller-ecosystem-core small {
    display: block;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 1px;
}
.seller-ecosystem-client small {
    color: #94a3b8;
}
.seller-ecosystem-core small {
    opacity: 0.85;
}
.seller-ecosystem-client strong {
    color: #0f172a;
    font-size: 16px;
}
.seller-ecosystem-core strong {
    display: block;
    font-size: 18px;
    margin-top: 4px;
}
.seller-ecosystem-arrow {
    color: #cbd5e1;
    font-size: 18px;
}
.seller-ecosystem-modules,
.seller-ecosystem-systems {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    width: 100%;
}
.seller-ecosystem-modules article,
.seller-ecosystem-systems article {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 18px 14px;
    text-align: center;
}
.seller-ecosystem-modules article.main {
    background: rgba(0, 160, 227, 0.08);
    border-color: #00a0e3;
}
.seller-ecosystem-modules small,
.seller-ecosystem-systems small {
    display: block;
    color: #94a3b8;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.3px;
    margin-bottom: 6px;
}
.seller-ecosystem-modules strong,
.seller-ecosystem-systems strong {
    color: #0f172a;
    font-size: 13.5px;
}

/* ══════════════════════════════════════════════
   18. AUTOMAÇÕES POR EVENTO
══════════════════════════════════════════════ */
.seller-rules {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.seller-rules article {
    display: flex;
    align-items: center;
    gap: 20px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 18px 24px;
}
.seller-rules article > div {
    flex: 1;
}
.seller-rules article small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 4px;
}
.seller-rules article strong {
    color: #0f172a;
    font-size: 14.5px;
    font-weight: 600;
}
.seller-rules article > span {
    color: #00a0e3;
    font-size: 18px;
    flex-shrink: 0;
}

/* ══════════════════════════════════════════════
   19. NEWTON
══════════════════════════════════════════════ */
.seller-newton-card {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 18px;
    padding: 22px;
}
.seller-newton-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
    padding-bottom: 14px;
    border-bottom: 1px solid #1e293b;
}
.seller-newton-header > span {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    flex-shrink: 0;
}
.seller-newton-header small {
    display: block;
    color: #64748b;
    font-size: 10px;
    font-weight: 700;
}
.seller-newton-header strong {
    color: #fff;
    font-size: 13.5px;
}
.seller-newton-header i {
    margin-left: auto;
    font-style: normal;
    color: #10b981;
    font-size: 11.5px;
    font-weight: 700;
}
.seller-newton-message {
    max-width: 85%;
    margin-left: auto;
    background: #00a0e3;
    color: #fff;
    padding: 12px 16px;
    border-radius: 14px;
    border-bottom-right-radius: 4px;
    font-size: 13.5px;
    margin-bottom: 14px;
}
.seller-newton-answer {
    display: flex;
    gap: 10px;
}
.seller-newton-answer > span {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #00a0e3;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.seller-newton-answer p {
    color: #cbd5e1;
    font-size: 13.5px;
    line-height: 1.6;
    margin: 0 0 10px 0;
}
.seller-newton-answer p strong {
    color: #fff;
}
.seller-newton-insight {
    background: rgba(0, 160, 227, 0.08);
    border: 1px solid rgba(0, 160, 227, 0.2);
    border-radius: 10px;
    padding: 12px 14px;
    margin: 12px 0;
}
.seller-newton-insight small {
    display: block;
    color: #38bdf8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 4px;
}
.seller-newton-insight strong {
    color: #fff;
    font-size: 18px;
    font-weight: 800;
}
.seller-newton-answer button {
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 11px 18px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 12.5px;
}

/* ══════════════════════════════════════════════
   20. UNIVERSIDADE — MÓDULO COMPLEMENTAR
══════════════════════════════════════════════ */
.seller-university-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 24px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.seller-university-card > div:first-child small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.seller-university-card > div:first-child strong {
    color: #0f172a;
    font-size: 15px;
}
.seller-university-progress {
    width: 100%;
    height: 8px;
    background: #f1f5f9;
    border-radius: 100px;
    overflow: hidden;
    margin: 14px 0 8px 0;
}
.seller-university-progress span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #00a0e3, #802be2);
    border-radius: 100px;
}
.seller-university-meta {
    display: flex;
    justify-content: space-between;
    font-size: 12.5px;
    color: #64748b;
    margin-bottom: 18px;
}
.seller-university-meta strong {
    color: #00a0e3;
}
.seller-university-next {
    background: #f8fafc;
    border-radius: 10px;
    padding: 12px 14px;
    margin-bottom: 16px;
}
.seller-university-next small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
}
.seller-university-next strong {
    display: block;
    color: #0f172a;
    font-size: 13.5px;
    margin: 3px 0;
}
.seller-university-next span {
    color: #64748b;
    font-size: 11.5px;
}
.seller-university-card > button {
    width: 100%;
    background: #00a0e3;
    color: #fff;
    border: none;
    padding: 13px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 13.5px;
}

/* ══════════════════════════════════════════════
   21. CTA FINAL
══════════════════════════════════════════════ */
.seller-final-cta {
    padding: 120px 0;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.seller-final-cta::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 600px;
    height: 400px;
    background: radial-gradient(circle, rgba(0, 160, 227, 0.15) 0%, rgba(11, 15, 25, 0) 70%);
}
.seller-final-cta .seller-container {
    position: relative;
    z-index: 1;
    max-width: 800px;
}
.seller-final-cta h2 {
    font-size: 42px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
    margin: 18px 0 20px 0;
}
.seller-final-cta h2 span {
    display: block;
    color: #94a3b8;
    font-size: 22px;
    font-weight: 500;
    margin-top: 12px;
}
.seller-final-cta p {
    font-size: 17px;
    line-height: 1.7;
    max-width: 640px;
    margin: 0 auto;
}

/* ══════════════════════════════════════════════
   RESPONSIVO
══════════════════════════════════════════════ */
@media (max-width: 992px) {
    .seller-hero-grid,
    .seller-dashboard-grid,
    .seller-sync,
    .seller-performance-grid {
        grid-template-columns: 1fr;
    }
    .seller-kpis,
    .seller-kanban,
    .seller-crm-info,
    .seller-sla-grid,
    .seller-ecosystem-modules,
    .seller-ecosystem-systems {
        grid-template-columns: repeat(2, 1fr);
    }
    .seller-performance-kpis {
        grid-template-columns: repeat(3, 1fr);
    }
    .seller-stock-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .seller-hero {
        padding: 40px 0 60px 0;
    }
    .seller-hero-content h1 {
        font-size: 30px;
    }
    .seller-kpis,
    .seller-kanban,
    .seller-crm-info,
    .seller-sla-grid,
    .seller-ecosystem-modules,
    .seller-ecosystem-systems,
    .seller-performance-kpis {
        grid-template-columns: 1fr;
    }
    .seller-table-row,
    .seller-reconciliation .seller-table-row {
        grid-template-columns: 1fr;
        gap: 4px;
    }
    .seller-table-row.header {
        display: none;
    }
    .seller-journey,
    .seller-automation-flow {
        flex-direction: column;
    }
    .seller-journey > i,
    .seller-automation-flow > i {
        transform: rotate(90deg);
    }
    .seller-final-cta h2 {
        font-size: 26px;
    }
}

/* ══════════════════════════════════════════════════════════════
   GALACTIX CRM — padrão visual do b2c.html / Produto.html
   (conteúdo original da página preservado; aqui só entra o estilo)
══════════════════════════════════════════════════════════════ */
.gx-crm {
    display: block;
    overflow: hidden;
    background: #ffffff;
}
.gx-crm * {
    box-sizing: border-box;
}
.gx-crm .crm-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}
.gx-crm button {
    font-family: inherit;
    cursor: pointer;
}
.gx-crm input {
    font-family: inherit;
}

/* ---------- Seções: fundo claro / escuro ---------- */
.gx-crm .crm-section {
    padding: 100px 0;
    background: #ffffff;
}
.gx-crm .crm-section.crm-light {
    background: #f8fafc;
}
.gx-crm .crm-section.crm-dark,
.gx-crm .crm-section.crm-newton-section,
.gx-crm .crm-hero {
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}

/* ---------- Tipografia comum ---------- */
.gx-crm .crm-eyebrow {
    display: inline-block;
    background: #e0f2fe;
    color: #0284c7;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    padding: 6px 16px;
    border-radius: 100px;
    margin-bottom: 22px;
    border: 1px solid rgba(56, 189, 248, 0.4);
}
.gx-crm .crm-eyebrow-light {
    background: rgba(56, 189, 248, 0.1);
    color: #38bdf8;
    border: 1px solid rgba(56, 189, 248, 0.3);
}

.gx-crm .crm-heading {
    position: static !important;
    top: auto !important;
    left: auto !important;
    z-index: auto !important;
    width: auto !important;
    display: block !important;
    flex-direction: row !important;
    border-bottom: none !important;
    max-width: 760px;
    margin: 0 0 60px 0;
}
.gx-crm .crm-heading.crm-center {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}
.gx-crm .crm-heading h2,
.gx-crm .crm-content h2 {
    font-size: 38px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
    color: #0f172a;
    margin: 0 0 18px 0;
}
.gx-crm .crm-heading h2 span,
.gx-crm .crm-content h2 span {
    color: #00a0e3;
}
.gx-crm .crm-heading p,
.gx-crm .crm-content p {
    font-size: 18px;
    color: #475569;
    line-height: 1.7;
    margin: 0 0 12px 0;
}
.gx-crm .crm-content p:last-child {
    margin-bottom: 0;
}
.gx-crm .crm-section.crm-dark .crm-heading h2,
.gx-crm .crm-section.crm-newton-section .crm-heading h2,
.gx-crm .crm-dark .crm-content h2,
.gx-crm .crm-newton-section .crm-content h2,
.gx-crm .crm-hero h1 {
    color: #ffffff;
}
.gx-crm .crm-section.crm-dark .crm-heading p,
.gx-crm .crm-section.crm-newton-section .crm-heading p,
.gx-crm .crm-dark .crm-content p,
.gx-crm .crm-newton-section .crm-content p {
    color: #94a3b8;
}

.gx-crm .crm-two-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}
.gx-crm .crm-content h3 {
    font-size: 22px;
    color: inherit;
}

/* ---------- Botões ---------- */
.gx-crm .crm-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    height: 52px;
    padding: 0 32px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 8px;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 1px solid transparent;
}
.gx-crm .crm-btn-primary {
    background: #00a0e3;
    color: #ffffff;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
}
.gx-crm .crm-btn-primary:hover {
    background: #008cc6;
    transform: translateY(-2px);
}
.gx-crm .crm-btn-outline {
    background: transparent;
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.3);
}
.gx-crm .crm-btn-outline:hover {
    background: rgba(255, 255, 255, 0.05);
    border-color: #ffffff;
}
.gx-crm .crm-btn-light {
    background: rgba(255, 255, 255, 0.1);
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.25);
}
.gx-crm .crm-btn-light:hover {
    background: rgba(255, 255, 255, 0.18);
}
.gx-crm .crm-hero-actions,
.gx-crm .crm-final-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: flex-start;
}
.gx-crm .crm-final-actions {
    justify-content: center;
    margin-top: 36px;
}

/* ---------- Lista de checagem ---------- */
.gx-crm .crm-check-list {
    list-style: none;
    margin: 28px 0 0 0;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 24px;
}
.gx-crm .crm-check-list li {
    position: relative;
    padding-left: 26px;
    font-size: 15px;
    color: #334155;
    font-weight: 500;
}
.gx-crm .crm-check-list li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    color: #10b981;
    font-weight: 800;
}
.gx-crm .crm-check-list.crm-check-light li {
    color: #e2e8f0;
}

/* ---------- Tags (badges de recursos) ---------- */
.gx-crm .crm-hero-tags,
.gx-crm .crm-newton-features,
.gx-crm .crm-final-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 28px;
}
.gx-crm .crm-hero-tags span,
.gx-crm .crm-final-tags span {
    background: rgba(0, 160, 227, 0.12);
    color: #38bdf8;
    font-size: 12.5px;
    font-weight: 700;
    padding: 8px 16px;
    border-radius: 100px;
    border: 1px solid rgba(0, 160, 227, 0.3);
}
.gx-crm .crm-hero-highlight {
    display: block;
    color: #7dd3fc;
    font-size: 15px;
    font-weight: 700;
    margin: 18px 0 20px 0;
}

/* ---------- Avatar de cliente (reutilizado em vários blocos) ---------- */
.gx-crm .crm-customer-avatar {
    /* width: 44px;
    height: 44px; */
    flex-shrink: 0;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 800;
    padding:30px;
}
.gx-crm .crm-customer-avatar.large {
    
    font-size: 17px;
}

/* ---------- Cabeçalho de painel (reutilizado em vários cards) ---------- */
.gx-crm .crm-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}
.gx-crm .crm-panel-header small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-crm .crm-panel-header strong {
    color: #0f172a;
    font-size: 16px;
}
.gx-crm .crm-panel-header > span {
    background: #e0f2fe;
    color: #0284c7;
    font-size: 11.5px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 100px;
}
.gx-crm .crm-panel-header button {
    background: #f1f5f9;
    color: #334155;
    border: none;
    font-size: 12.5px;
    font-weight: 600;
    padding: 8px 14px;
    border-radius: 8px;
}
.gx-crm .crm-section.crm-dark .crm-panel-header strong,
.gx-crm .crm-section.crm-newton-section .crm-panel-header strong {
    color: #ffffff;
}
.gx-crm .crm-section.crm-dark .crm-panel-header small,
.gx-crm .crm-section.crm-newton-section .crm-panel-header small {
    color: #64748b;
}

/* ══════════════════════════════════════════════
   01. HERO
══════════════════════════════════════════════ */
.gx-crm .crm-hero {
    padding: 60px 0 100px 0;
}
.gx-crm .crm-hero-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}
.gx-crm .crm-hero-content h1 {
    font-size: 46px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1px;
    margin: 0 0 20px 0;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}
.gx-crm .crm-hero-content h1 span {
    display: block;
    color: #00a0e3;
}
.gx-crm .crm-hero-content > p {
    font-size: 18px;
    color: #cbd5e1;
    line-height: 1.7;
    margin: 0;
    max-width: 520px;
}

.gx-crm .crm-customer-card {
    background: #ffffff;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 30px 60px -15px rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.08);
}
.gx-crm .crm-customer-header {
    display: flex;
    align-items: center;
    gap: 14px;
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-crm .crm-customer-header > div {
    /* flex: 1; */
    min-width: 0;
}
.gx-crm .crm-customer-header small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-crm .crm-customer-header strong {
    display: block;
    color: #0f172a;
    font-size: 15px;
    margin: 2px 0;
}
.gx-crm .crm-customer-header > div > span {
    color: #64748b;
    font-size: 12px;
}
.gx-crm .crm-status-active {
    background: #dcfce7;
    color: #16a34a;
    font-size: 11.5px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 100px;
    white-space: nowrap;
}

.gx-crm .crm-customer-kpis {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-bottom: 22px;
}
.gx-crm .crm-customer-kpis article {
    background: #f8fafc;
    border-radius: 10px;
    padding: 12px 10px;
    text-align: center;
}
.gx-crm .crm-customer-kpis small {
    display: block;
    color: #94a3b8;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.3px;
    margin-bottom: 4px;
}
.gx-crm .crm-customer-kpis strong {
    color: #0f172a;
    font-size: 14px;
}

.gx-crm .crm-card-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}
.gx-crm .crm-card-title strong {
    color: #0f172a;
    font-size: 13.5px;
}
.gx-crm .crm-card-title a {
    color: #00a0e3;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
}
.gx-crm .crm-customer-timeline article {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 0;
    border-top: 1px solid #f1f5f9;
}
.gx-crm .crm-event-dot {
    width: 8px;
    height: 8px;
    flex-shrink: 0;
    border-radius: 50%;
    background: #00a0e3;
}
.gx-crm .crm-customer-timeline article.sale .crm-event-dot {
    background: #10b981;
}
.gx-crm .crm-customer-timeline article > div {
    flex: 1;
    min-width: 0;
}
.gx-crm .crm-customer-timeline article strong {
    display: block;
    color: #0f172a;
    font-size: 13px;
}
.gx-crm .crm-customer-timeline article small {
    color: #94a3b8;
    font-size: 11.5px;
}
.gx-crm .crm-customer-timeline article time {
    color: #94a3b8;
    font-size: 11.5px;
    font-style: normal;
    white-space: nowrap;
}
.gx-crm .crm-customer-timeline article.sale b {
    color: #10b981;
    font-size: 13px;
    font-weight: 800;
    white-space: nowrap;
}

/* ══════════════════════════════════════════════
   02. JORNADA
══════════════════════════════════════════════ */
.gx-crm .crm-journey {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
}
.gx-crm .crm-journey article {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 22px 18px;
    text-align: center;
    min-width: 140px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}
.gx-crm .crm-journey article span {
    display: block;
    width: 34px;
    height: 34px;
    margin: 0 auto 10px auto;
    border-radius: 50%;
    background: #e0f2fe;
    color: #0284c7;
    font-size: 12px;
    font-weight: 800;
    line-height: 34px;
}
.gx-crm .crm-journey article strong {
    display: block;
    font-size: 14.5px;
    color: #0f172a;
    margin-bottom: 4px;
}
.gx-crm .crm-journey article small {
    color: #64748b;
    font-size: 12px;
}
.gx-crm .crm-journey > i {
    font-style: normal;
    color: #cbd5e1;
    font-size: 18px;
}

/* ══════════════════════════════════════════════
   03. CLIENTE 360º
══════════════════════════════════════════════ */
.gx-crm .crm-profile-panel {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-crm .crm-profile-header {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 20px;
}
.gx-crm .crm-profile-header > div {
    /* flex: 1; */
    min-width: 0;
}
.gx-crm .crm-profile-header small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-crm .crm-profile-header strong {
    display: block;
    color: #0f172a;
    font-size: 16px;
    margin: 2px 0;
}
.gx-crm .crm-profile-header > div > span {
    color: #64748b;
    font-size: 12.5px;
}
.gx-crm .crm-profile-header button {
    background: #f1f5f9;
    border: none;
    color: #64748b;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    font-size: 14px;
    flex-shrink: 0;
}
.gx-crm .crm-profile-tabs {
    display: flex;
    gap: 4px;
    background: #f1f5f9;
    border-radius: 10px;
    padding: 4px;
    margin-bottom: 22px;
    flex-wrap: wrap;
}
.gx-crm .crm-profile-tabs span {
    flex: 1;
    text-align: center;
    padding: 8px 10px;
    font-size: 12.5px;
    font-weight: 600;
    color: #64748b;
    border-radius: 7px;
    white-space: nowrap;
}
.gx-crm .crm-profile-tabs span.active {
    background: #ffffff;
    color: #0f172a;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}
.gx-crm .crm-profile-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}
.gx-crm .crm-profile-grid article {
    background: #f8fafc;
    border-radius: 10px;
    padding: 14px 12px;
}
.gx-crm .crm-profile-grid small {
    display: block;
    color: #94a3b8;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.3px;
    margin-bottom: 6px;
}
.gx-crm .crm-profile-grid strong {
    color: #0f172a;
    font-size: 14.5px;
}

/* ══════════════════════════════════════════════
   04. TIMELINE
══════════════════════════════════════════════ */
.gx-crm .crm-timeline-panel {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-crm .crm-timeline-day,
.gx-crm .crm-activity-day {
    display: block;
    color: #94a3b8;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1px;
    margin: 18px 0 10px 0;
}
.gx-crm .crm-timeline-day:first-child,
.gx-crm .crm-activity-day:first-child {
    margin-top: 0;
}
.gx-crm .crm-full-timeline article {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 12px 0;
    border-top: 1px solid #f1f5f9;
}
.gx-crm .crm-full-timeline article time {
    width: 44px;
    flex-shrink: 0;
    color: #94a3b8;
    font-size: 12px;
    font-style: normal;
    padding-top: 2px;
}
.gx-crm .crm-timeline-icon {
    width: 30px;
    height: 30px;
    flex-shrink: 0;
    border-radius: 50%;
    background: #e0f2fe;
    color: #0284c7;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
}
.gx-crm .crm-full-timeline article.success .crm-timeline-icon {
    background: #dcfce7;
    color: #16a34a;
}
.gx-crm .crm-full-timeline article > div {
    flex: 1;
    min-width: 0;
    padding-top: 3px;
}
.gx-crm .crm-full-timeline article strong {
    display: block;
    color: #0f172a;
    font-size: 14px;
    margin-bottom: 2px;
}
.gx-crm .crm-full-timeline article p {
    margin: 0;
    color: #64748b;
    font-size: 12.5px;
}
.gx-crm .crm-full-timeline article b {
    color: #16a34a;
    font-size: 14px;
    font-weight: 800;
    white-space: nowrap;
    padding-top: 3px;
}

/* ══════════════════════════════════════════════
   05. PIPELINE (kanban)
══════════════════════════════════════════════ */
.gx-crm .crm-pipeline {
    display: grid;
    grid-template-columns: repeat(5, minmax(220px, 1fr));
    gap: 16px;
    overflow-x: auto;
    padding-bottom: 8px;
}
.gx-crm .crm-pipeline-column {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 14px;
    min-width: 220px;
}
.gx-crm .crm-pipeline-column.won {
    background: #f0fdf4;
    border-color: #bbf7d0;
}
.gx-crm .crm-pipeline-column header {
    position: static !important;
    top: auto !important;
    left: auto !important;
    z-index: auto !important;
    width: auto !important;
    display: block !important;
    flex-direction: row !important;
    margin-bottom: 14px;
    padding-bottom: 12px;
    border-bottom: 1px solid #e2e8f0 !important;
}
.gx-crm .crm-pipeline-column header > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 4px;
}
.gx-crm .crm-pipeline-column header strong {
    color: #0f172a;
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: 0.5px;
}
.gx-crm .crm-pipeline-column header > div > span {
    background: #e2e8f0;
    color: #475569;
    font-size: 11px;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 100px;
}
.gx-crm .crm-pipeline-column header small {
    color: #64748b;
    font-size: 12px;
    font-weight: 600;
}
.gx-crm .crm-pipeline-column article {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 14px;
    margin-bottom: 10px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}
.gx-crm .crm-pipeline-column article strong {
    display: block;
    color: #0f172a;
    font-size: 13.5px;
    margin-bottom: 3px;
}
.gx-crm .crm-pipeline-column article > span {
    display: block;
    color: #64748b;
    font-size: 12px;
    margin-bottom: 8px;
}
.gx-crm .crm-pipeline-column article b {
    display: block;
    color: #00a0e3;
    font-size: 14px;
    font-weight: 800;
}
.gx-crm .crm-pipeline-column.won article b {
    color: #16a34a;
}
.gx-crm .crm-pipeline-column article footer {
    background: transparent;
    width: auto;
    float: none;
    padding: 10px 0 0 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 10px;
    border-top: 1px dashed #e2e8f0;
}
.gx-crm .crm-pipeline-column article footer span {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #e0f2fe;
    color: #0284c7;
    font-size: 9.5px;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
}
.gx-crm .crm-pipeline-column article footer small {
    color: #94a3b8;
    font-size: 11px;
}

/* ══════════════════════════════════════════════
   06. LEADS + OPORTUNIDADES
══════════════════════════════════════════════ */
.gx-crm .crm-stage-flow {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 28px;
}
.gx-crm .crm-stage-flow span {
    background: rgba(0, 160, 227, 0.12);
    color: #38bdf8;
    font-size: 12.5px;
    font-weight: 700;
    padding: 8px 16px;
    border-radius: 100px;
    border: 1px solid rgba(0, 160, 227, 0.3);
}
.gx-crm .crm-stage-flow i {
    font-style: normal;
    color: #475569;
    font-size: 14px;
}

.gx-crm .crm-lead-card {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 18px;
    padding: 26px;
}
.gx-crm .crm-lead-header {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 20px;
}
.gx-crm .crm-lead-header > div {
    /* flex: 1; */
    min-width: 0;
}
.gx-crm .crm-lead-header small {
    display: block;
    color: #64748b;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-crm .crm-lead-header strong {
    display: block;
    color: #ffffff;
    font-size: 15px;
    margin: 2px 0;
}
.gx-crm .crm-lead-header > div > span {
    color: #94a3b8;
    font-size: 12px;
}
.gx-crm .crm-lead-score {
    display: flex;
    align-items: baseline;
    gap: 2px;
    flex-shrink: 0;
}
.gx-crm .crm-lead-score strong {
    color: #00a0e3;
    font-size: 26px;
    font-weight: 800;
}
.gx-crm .crm-lead-score small {
    color: #64748b;
    font-size: 13px;
}
.gx-crm .crm-lead-data {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-bottom: 20px;
}
.gx-crm .crm-lead-data article {
    background: #0b0f19;
    border: 1px solid #1e293b;
    border-radius: 10px;
    padding: 12px 10px;
}
.gx-crm .crm-lead-data small {
    display: block;
    color: #64748b;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.3px;
    margin-bottom: 4px;
}
.gx-crm .crm-lead-data strong {
    color: #ffffff;
    font-size: 13px;
}
.gx-crm .crm-intent {
    display: flex;
    align-items: center;
    gap: 8px;
    background: rgba(0, 160, 227, 0.08);
    border: 1px solid rgba(0, 160, 227, 0.2);
    border-radius: 10px;
    padding: 12px 16px;
    color: #38bdf8;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 20px;
}
.gx-crm .crm-full-button {
    display: block;
    width: 100%;
    background: #00a0e3;
    color: #ffffff;
    border: none;
    height: 48px;
    border-radius: 8px;
    font-size: 14.5px;
    font-weight: 700;
    transition: background 0.3s ease;
}
.gx-crm .crm-full-button:hover {
    background: #008cc6;
}

/* ══════════════════════════════════════════════
   07. FORMULÁRIOS
══════════════════════════════════════════════ */
.gx-crm .crm-form-preview {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-crm .crm-form-header {
    margin-bottom: 20px;
}
.gx-crm .crm-form-header small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 4px;
}
.gx-crm .crm-form-header strong {
    color: #0f172a;
    font-size: 16px;
}
.gx-crm .crm-form-preview label {
    display: block;
    color: #94a3b8;
    font-size: 11.5px;
    font-weight: 700;
    margin-bottom: 14px;
}
.gx-crm .crm-form-preview label div {
    margin-top: 6px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 11px 14px;
    color: #334155;
    font-size: 13.5px;
    font-weight: 500;
}
.gx-crm .crm-form-preview > button {
    display: block;
    width: 100%;
    background: #00a0e3;
    color: #ffffff;
    border: none;
    height: 48px;
    border-radius: 8px;
    font-size: 14.5px;
    font-weight: 700;
    margin: 6px 0 22px 0;
}
.gx-crm .crm-form-actions {
    border-top: 1px dashed #e2e8f0;
    padding-top: 18px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.gx-crm .crm-form-actions small {
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 4px;
}
.gx-crm .crm-form-actions span {
    color: #16a34a;
    font-size: 13px;
    font-weight: 600;
}

/* ══════════════════════════════════════════════
   08. COMPORTAMENTO DIGITAL (tracking)
══════════════════════════════════════════════ */
.gx-crm .crm-tracking-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-crm .crm-tracking-card .crm-panel-header > span {
    background: #dcfce7;
    color: #16a34a;
}
.gx-crm .crm-tracking-events {
    display: flex;
    flex-direction: column;
}
.gx-crm .crm-tracking-events article {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 11px 0;
    border-top: 1px solid #f1f5f9;
}
.gx-crm .crm-tracking-events time {
    width: 46px;
    flex-shrink: 0;
    color: #94a3b8;
    font-size: 12px;
    font-style: normal;
}
.gx-crm .crm-tracking-events small {
    display: block;
    color: #94a3b8;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 2px;
}
.gx-crm .crm-tracking-events strong {
    color: #0f172a;
    font-size: 13.5px;
    font-weight: 600;
}
.gx-crm .crm-tracking-summary {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px dashed #e2e8f0;
}
.gx-crm .crm-tracking-summary article {
    background: #f8fafc;
    border-radius: 10px;
    padding: 12px 10px;
    text-align: center;
}
.gx-crm .crm-tracking-summary small {
    display: block;
    color: #94a3b8;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.3px;
    margin-bottom: 4px;
}
.gx-crm .crm-tracking-summary strong {
    color: #0f172a;
    font-size: 13.5px;
}

/* ══════════════════════════════════════════════
   09. SEGMENTAÇÃO
══════════════════════════════════════════════ */
.gx-crm .crm-segment-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-crm .crm-segment-rule {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13.5px;
}
.gx-crm .crm-segment-rule span {
    color: #64748b;
    font-weight: 600;
}
.gx-crm .crm-segment-rule b {
    background: rgba(0, 160, 227, 0.1);
    color: #0284c7;
    padding: 3px 10px;
    border-radius: 100px;
    font-weight: 700;
    font-size: 12px;
}
.gx-crm .crm-segment-rule strong {
    color: #0f172a;
    font-weight: 700;
}
.gx-crm .crm-segment-operator {
    color: #94a3b8;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.5px;
    padding: 8px 0 8px 4px;
}
.gx-crm .crm-segment-result {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #f8fafc;
    border-radius: 10px;
    padding: 14px 18px;
    margin: 16px 0 20px 0;
}
.gx-crm .crm-segment-result small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-crm .crm-segment-result strong {
    color: #00a0e3;
    font-size: 22px;
    font-weight: 800;
}
.gx-crm .crm-segment-card > button {
    display: block;
    width: 100%;
    background: #00a0e3;
    color: #ffffff;
    border: none;
    height: 48px;
    border-radius: 8px;
    font-size: 14.5px;
    font-weight: 700;
}

/* ══════════════════════════════════════════════
   10. MARKETING / CAMPANHA
══════════════════════════════════════════════ */
.gx-crm .crm-campaign-card {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 18px;
    padding: 26px;
}
.gx-crm .crm-campaign-card .crm-panel-header > span {
    background: rgba(0, 160, 227, 0.15);
    color: #38bdf8;
}
.gx-crm .crm-campaign-kpis {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    margin-bottom: 16px;
}
.gx-crm .crm-campaign-kpis article {
    background: #0b0f19;
    border: 1px solid #1e293b;
    border-radius: 10px;
    padding: 14px;
}
.gx-crm .crm-campaign-kpis small {
    display: block;
    color: #64748b;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.3px;
    margin-bottom: 6px;
}
.gx-crm .crm-campaign-kpis strong {
    display: block;
    color: #ffffff;
    font-size: 17px;
    font-weight: 800;
}
.gx-crm .crm-campaign-kpis span {
    color: #10b981;
    font-size: 12px;
    font-weight: 700;
}
.gx-crm .crm-campaign-conversion {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    padding-top: 16px;
    border-top: 1px dashed #1e293b;
}
.gx-crm .crm-campaign-conversion article {
    text-align: center;
}
.gx-crm .crm-campaign-conversion small {
    display: block;
    color: #64748b;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.3px;
    margin-bottom: 6px;
}
.gx-crm .crm-campaign-conversion strong {
    color: #00a0e3;
    font-size: 18px;
    font-weight: 800;
}

/* ══════════════════════════════════════════════
   11. AUTOMAÇÃO DE MARKETING (fluxo vertical)
══════════════════════════════════════════════ */
.gx-crm .crm-automation {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    max-width: 420px;
    margin: 0 auto;
}
.gx-crm .crm-automation article {
    width: 100%;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 18px 22px;
    text-align: center;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}
.gx-crm .crm-automation article small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 1px;
    margin-bottom: 6px;
}
.gx-crm .crm-automation article strong {
    display: block;
    color: #0f172a;
    font-size: 15px;
    margin-bottom: 4px;
}
.gx-crm .crm-automation article span {
    color: #64748b;
    font-size: 12.5px;
}
.gx-crm .crm-automation article.crm-automation-trigger {
    background: #e0f2fe;
    border-color: rgba(2, 132, 199, 0.25);
}
.gx-crm .crm-automation article.crm-automation-trigger small {
    color: #0284c7;
}
.gx-crm .crm-automation article.crm-automation-condition div {
    display: flex;
    gap: 8px;
    justify-content: center;
    margin-top: 10px;
}
.gx-crm .crm-automation article.crm-automation-condition div span {
    background: #f1f5f9;
    color: #334155;
    font-size: 11.5px;
    font-weight: 700;
    padding: 5px 14px;
    border-radius: 100px;
}
.gx-crm .crm-automation article.crm-automation-success {
    background: #f0fdf4;
    border-color: #bbf7d0;
}
.gx-crm .crm-automation article.crm-automation-success small {
    color: #16a34a;
}
.gx-crm .crm-automation > i {
    font-style: normal;
    color: #cbd5e1;
    font-size: 18px;
}

/* ══════════════════════════════════════════════
   12. LEAD SCORING
══════════════════════════════════════════════ */
.gx-crm .crm-score-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-crm .crm-score-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
}
.gx-crm .crm-score-header small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-crm .crm-score-header strong {
    color: #0f172a;
    font-size: 15px;
}
.gx-crm .crm-score-number {
    display: flex;
    align-items: baseline;
    gap: 2px;
}
.gx-crm .crm-score-number strong {
    color: #00a0e3;
    font-size: 26px;
    font-weight: 800;
}
.gx-crm .crm-score-number span {
    color: #94a3b8;
    font-size: 13px;
}
.gx-crm .crm-score-level {
    margin-bottom: 20px;
}
.gx-crm .crm-score-level > span {
    display: block;
    color: #00a0e3;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
}
.gx-crm .crm-score-level > div {
    width: 100%;
    height: 8px;
    background: #f1f5f9;
    border-radius: 100px;
    overflow: hidden;
}
.gx-crm .crm-score-level > div i {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #00a0e3, #802be2);
    border-radius: 100px;
}
.gx-crm .crm-score-events {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 20px;
}
.gx-crm .crm-score-events article {
    display: flex;
    align-items: center;
    gap: 12px;
}
.gx-crm .crm-score-events span {
    width: 40px;
    flex-shrink: 0;
    text-align: center;
    background: #dcfce7;
    color: #16a34a;
    font-size: 11.5px;
    font-weight: 800;
    padding: 3px 0;
    border-radius: 100px;
}
.gx-crm .crm-score-events article.negative span {
    background: rgba(239, 68, 68, 0.1);
    color: #ef4444;
}
.gx-crm .crm-score-events strong {
    color: #334155;
    font-size: 13.5px;
    font-weight: 500;
}
.gx-crm .crm-score-insight {
    display: flex;
    align-items: center;
    gap: 8px;
    background: rgba(0, 160, 227, 0.08);
    border: 1px solid rgba(0, 160, 227, 0.2);
    border-radius: 10px;
    padding: 12px 16px;
    color: #0284c7;
    font-size: 13px;
    font-weight: 600;
}

/* ══════════════════════════════════════════════
   13. ATIVIDADES
══════════════════════════════════════════════ */
.gx-crm .crm-activities-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-crm .crm-activities-card .crm-panel-header button {
    background: #00a0e3;
    color: #ffffff;
}
.gx-crm .crm-activity-summary {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-bottom: 12px;
}
.gx-crm .crm-activity-summary article {
    background: #f8fafc;
    border-radius: 10px;
    padding: 14px 10px;
    text-align: center;
}
.gx-crm .crm-activity-summary strong {
    display: block;
    color: #0f172a;
    font-size: 20px;
    font-weight: 800;
}
.gx-crm .crm-activity-summary small {
    color: #94a3b8;
    font-size: 11px;
    font-weight: 600;
}
.gx-crm .crm-activity {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 11px 0;
    border-top: 1px solid #f1f5f9;
}
.gx-crm .crm-activity time {
    width: 46px;
    flex-shrink: 0;
    color: #94a3b8;
    font-size: 12px;
    font-style: normal;
}
.gx-crm .crm-activity > span {
    width: 30px;
    height: 30px;
    flex-shrink: 0;
    border-radius: 50%;
    background: #e0f2fe;
    color: #0284c7;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
}
.gx-crm .crm-activity strong {
    display: block;
    color: #0f172a;
    font-size: 13.5px;
}
.gx-crm .crm-activity small {
    color: #94a3b8;
    font-size: 12px;
}

/* ══════════════════════════════════════════════
   14. CARTEIRA DO VENDEDOR
══════════════════════════════════════════════ */
.gx-crm .crm-portfolio-card {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 18px;
    padding: 26px;
}
.gx-crm .crm-portfolio-card .crm-panel-header > span {
    color: #64748b;
    font-size: 12.5px;
    font-weight: 600;
    background: none;
    padding: 0;
}
.gx-crm .crm-portfolio-value {
    margin-bottom: 18px;
}
.gx-crm .crm-portfolio-value small {
    display: block;
    color: #64748b;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 4px;
}
.gx-crm .crm-portfolio-value strong {
    color: #00a0e3;
    font-size: 26px;
    font-weight: 800;
}
.gx-crm .crm-portfolio-insights {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    margin-bottom: 22px;
}
.gx-crm .crm-portfolio-insights article {
    background: #0b0f19;
    border: 1px solid #1e293b;
    border-radius: 10px;
    padding: 14px;
}
.gx-crm .crm-portfolio-insights strong {
    display: block;
    color: #ffffff;
    font-size: 20px;
    font-weight: 800;
    margin-bottom: 4px;
}
.gx-crm .crm-portfolio-insights span {
    color: #94a3b8;
    font-size: 12px;
    line-height: 1.4;
}
.gx-crm .crm-portfolio-insights article.warning strong {
    color: #fbbf24;
}
.gx-crm .crm-portfolio-insights article.positive strong {
    color: #10b981;
}
.gx-crm .crm-portfolio-insights article.negative strong {
    color: #f87171;
}
.gx-crm .crm-portfolio-insights article.newton strong {
    color: #a855f7;
}

/* ══════════════════════════════════════════════
   15. ATENDIMENTO
══════════════════════════════════════════════ */
.gx-crm .crm-support-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 22px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-crm .crm-support-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}
.gx-crm .crm-support-header strong {
    display: block;
    color: #0f172a;
    font-size: 14px;
}
.gx-crm .crm-support-header small {
    color: #10b981;
    font-size: 12px;
    font-weight: 600;
}
.gx-crm .crm-support-message {
    background: #f1f5f9;
    color: #1e293b;
    font-size: 13.5px;
    line-height: 1.5;
    border-radius: 14px 14px 14px 4px;
    padding: 14px 16px;
    max-width: 88%;
    margin-bottom: 18px;
}
.gx-crm .crm-support-context {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 18px;
}
.gx-crm .crm-support-context > small {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 12px;
}
.gx-crm .crm-support-kpis {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-bottom: 14px;
}
.gx-crm .crm-support-kpis article {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 10px 8px;
    text-align: center;
}
.gx-crm .crm-support-kpis small {
    display: block;
    color: #94a3b8;
    font-size: 9px;
    font-weight: 700;
    margin-bottom: 3px;
}
.gx-crm .crm-support-kpis strong {
    color: #0f172a;
    font-size: 12.5px;
}
.gx-crm .crm-support-related {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 6px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 12px 14px;
    margin-bottom: 14px;
}
.gx-crm .crm-support-related small {
    display: block;
    width: 100%;
    color: #94a3b8;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.3px;
}
.gx-crm .crm-support-related strong {
    color: #0f172a;
    font-size: 13px;
}
.gx-crm .crm-support-related span {
    color: #00a0e3;
    font-size: 12px;
    font-weight: 600;
}
.gx-crm .crm-support-context button {
    display: block;
    width: 100%;
    background: #00a0e3;
    color: #ffffff;
    border: none;
    height: 42px;
    border-radius: 8px;
    font-size: 13.5px;
    font-weight: 700;
}

/* ══════════════════════════════════════════════
   16. COMMERCE + CRM (fluxo)
══════════════════════════════════════════════ */
.gx-crm .crm-commerce-flow {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
}
.gx-crm .crm-commerce-flow article {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 18px 16px;
    text-align: center;
    min-width: 140px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}
.gx-crm .crm-commerce-flow article small {
    display: block;
    font-size: 11px;
    font-weight: 800;
    color: #94a3b8;
    margin-bottom: 8px;
}
.gx-crm .crm-commerce-flow article strong {
    display: block;
    font-size: 13.5px;
    color: #0f172a;
    margin-bottom: 4px;
}
.gx-crm .crm-commerce-flow article span {
    color: #64748b;
    font-size: 11.5px;
}
.gx-crm .crm-commerce-flow article.warning {
    background: #fffbeb;
    border-color: #fde68a;
}
.gx-crm .crm-commerce-flow article.warning small {
    color: #f59e0b;
}
.gx-crm .crm-commerce-flow article.newton {
    background: linear-gradient(135deg, rgba(0, 160, 227, 0.08), rgba(128, 43, 226, 0.08));
    border-color: rgba(128, 43, 226, 0.25);
}
.gx-crm .crm-commerce-flow article.newton small {
    color: #a855f7;
}
.gx-crm .crm-commerce-flow > i {
    font-style: normal;
    color: #cbd5e1;
    font-size: 18px;
}

/* ══════════════════════════════════════════════
   17. METAS
══════════════════════════════════════════════ */
.gx-crm .crm-goal-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-crm .crm-goal-card .crm-panel-header > span {
    background: #dcfce7;
    color: #16a34a;
    font-size: 13px;
}
.gx-crm .crm-goal-values {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    margin-bottom: 16px;
}
.gx-crm .crm-goal-values article {
    background: #f8fafc;
    border-radius: 10px;
    padding: 14px;
}
.gx-crm .crm-goal-values small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.3px;
    margin-bottom: 4px;
}
.gx-crm .crm-goal-values strong {
    color: #0f172a;
    font-size: 16px;
    font-weight: 800;
}
.gx-crm .crm-goal-progress {
    width: 100%;
    height: 10px;
    background: #f1f5f9;
    border-radius: 100px;
    overflow: hidden;
    margin-bottom: 20px;
}
.gx-crm .crm-goal-progress i {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #00a0e3, #10b981);
    border-radius: 100px;
}
.gx-crm .crm-goal-footer {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 14px;
    padding-top: 16px;
    border-top: 1px dashed #e2e8f0;
}
.gx-crm .crm-goal-footer small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.3px;
    margin-bottom: 4px;
}
.gx-crm .crm-goal-footer strong {
    display: block;
    color: #0f172a;
    font-size: 15px;
    font-weight: 800;
}
.gx-crm .crm-goal-footer span {
    display: block;
    color: #16a34a;
    font-size: 11.5px;
    font-weight: 700;
    margin-top: 3px;
}

/* ══════════════════════════════════════════════
   18. ANALYTICS
══════════════════════════════════════════════ */
.gx-crm .crm-analytics-kpis {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 16px;
    margin-bottom: 40px;
}
.gx-crm .crm-analytics-kpis article {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 14px;
    padding: 18px;
}
.gx-crm .crm-analytics-kpis small {
    display: block;
    color: #64748b;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
}
.gx-crm .crm-analytics-kpis strong {
    display: block;
    color: #ffffff;
    font-size: 19px;
    font-weight: 800;
    margin-bottom: 4px;
}
.gx-crm .crm-analytics-kpis span {
    color: #10b981;
    font-size: 12px;
    font-weight: 700;
}
.gx-crm .crm-analytics-grid {
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    gap: 20px;
}
.gx-crm .crm-chart-card,
.gx-crm .crm-funnel-card {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 18px;
    padding: 24px;
}
.gx-crm .crm-chart-card > small,
.gx-crm .crm-funnel-card > small {
    display: block;
    color: #64748b;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 22px;
}
.gx-crm .crm-bars {
    display: flex;
    align-items: flex-end;
    gap: 8px;
    height: 160px;
}
.gx-crm .crm-bars i {
    flex: 1;
    display: block;
    font-style: normal;
    background: linear-gradient(180deg, #00a0e3, #802be2);
    border-radius: 4px 4px 0 0;
    min-height: 4px;
}
.gx-crm .crm-funnel-card article {
    display: block;
    margin: 0 0 14px 0;
    background: rgba(0, 160, 227, 0.15);
    border: 1px solid rgba(0, 160, 227, 0.3);
    border-radius: 8px;
    padding: 10px 16px;
}
.gx-crm .crm-funnel-card article:last-child {
    margin-bottom: 0;
    background: rgba(16, 185, 129, 0.15);
    border-color: rgba(16, 185, 129, 0.3);
}
.gx-crm .crm-funnel-card article span {
    display: block;
    color: #94a3b8;
    font-size: 11px;
    margin-bottom: 3px;
}
.gx-crm .crm-funnel-card article strong {
    color: #ffffff;
    font-size: 15px;
    font-weight: 800;
}

/* ══════════════════════════════════════════════
   19. NEWTON
══════════════════════════════════════════════ */
.gx-crm .crm-newton-prompts {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 28px;
}
.gx-crm .crm-newton-prompts span {
    display: block;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 10px;
    padding: 12px 16px;
    color: #cbd5e1;
    font-size: 13.5px;
    font-style: italic;
}

.gx-crm .crm-newton-card {
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 18px;
    padding: 22px;
}
.gx-crm .crm-newton-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
    padding-bottom: 18px;
    border-bottom: 1px solid #1e293b;
}
.gx-crm .crm-newton-header > span {
    width: 38px;
    height: 38px;
    flex-shrink: 0;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    font-weight: 800;
}
.gx-crm .crm-newton-header > div {
    flex: 1;
}
.gx-crm .crm-newton-header small {
    display: block;
    color: #64748b;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-crm .crm-newton-header strong {
    color: #ffffff;
    font-size: 14px;
}
.gx-crm .crm-newton-header i {
    font-style: normal;
    color: #10b981;
    font-size: 12px;
    font-weight: 600;
}
.gx-crm .crm-newton-user {
    background: #00a0e3;
    color: #ffffff;
    font-size: 13.5px;
    line-height: 1.5;
    border-radius: 14px 14px 4px 14px;
    padding: 14px 16px;
    margin: 0 0 16px auto;
    max-width: 82%;
}
.gx-crm .crm-newton-answer {
    display: flex;
    gap: 12px;
}
.gx-crm .crm-newton-answer > span {
    width: 30px;
    height: 30px;
    flex-shrink: 0;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 800;
}
.gx-crm .crm-newton-answer > div {
    flex: 1;
    min-width: 0;
    background: #0b0f19;
    border: 1px solid #1e293b;
    border-radius: 4px 14px 14px 14px;
    padding: 16px;
}
.gx-crm .crm-newton-answer p {
    margin: 0 0 12px 0;
    color: #cbd5e1;
    font-size: 13.5px;
    line-height: 1.6;
}
.gx-crm .crm-newton-answer strong {
    color: #ffffff;
}
.gx-crm .crm-newton-metric {
    background: rgba(0, 160, 227, 0.08);
    border: 1px solid rgba(0, 160, 227, 0.2);
    border-radius: 8px;
    padding: 10px 14px;
    margin-bottom: 12px;
}
.gx-crm .crm-newton-metric small {
    display: block;
    color: #64748b;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.gx-crm .crm-newton-metric strong {
    color: #00a0e3;
    font-size: 16px;
    font-weight: 800;
}
.gx-crm .crm-newton-insight {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #a855f7;
    font-size: 12.5px;
    font-weight: 600;
    margin-bottom: 14px;
}
.gx-crm .crm-newton-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.gx-crm .crm-newton-actions button {
    border: none;
    border-radius: 8px;
    padding: 10px 16px;
    font-size: 12.5px;
    font-weight: 700;
}
.gx-crm .crm-newton-actions button:first-child {
    background: #00a0e3;
    color: #ffffff;
}
.gx-crm .crm-newton-actions button:last-child {
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.15);
}

/* ══════════════════════════════════════════════
   20. ECOSSISTEMA
══════════════════════════════════════════════ */
.gx-crm .crm-ecosystem {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
}
.gx-crm .crm-ecosystem-top,
.gx-crm .crm-ecosystem-bottom {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    width: 100%;
}
.gx-crm .crm-ecosystem-top article,
.gx-crm .crm-ecosystem-bottom article {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 18px 14px;
    text-align: center;
}
.gx-crm .crm-ecosystem-bottom article.newton {
    background: linear-gradient(135deg, rgba(0, 160, 227, 0.06), rgba(128, 43, 226, 0.06));
    border-color: rgba(128, 43, 226, 0.25);
}
.gx-crm .crm-ecosystem-top small,
.gx-crm .crm-ecosystem-bottom small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.3px;
    margin-bottom: 6px;
}
.gx-crm .crm-ecosystem-top strong,
.gx-crm .crm-ecosystem-bottom strong {
    color: #0f172a;
    font-size: 14.5px;
}
.gx-crm .crm-ecosystem-bottom article.newton strong {
    color: #802be2;
}
.gx-crm .crm-ecosystem-lines {
    display: flex;
    justify-content: center;
}
.gx-crm .crm-ecosystem-lines span {
    width: 1px;
    height: 34px;
    background: #cbd5e1;
    display: block;
}
.gx-crm .crm-ecosystem-core {
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #fff;
    border-radius: 16px;
    padding: 22px 36px;
    text-align: center;
}
.gx-crm .crm-ecosystem-core small {
    display: block;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 1px;
    opacity: 0.85;
}
.gx-crm .crm-ecosystem-core strong {
    display: block;
    font-size: 20px;
    font-weight: 800;
    margin: 6px 0 10px 0;
}
.gx-crm .crm-ecosystem-core > div {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
}
.gx-crm .crm-ecosystem-core > div span {
    background: rgba(255, 255, 255, 0.15);
    font-size: 11.5px;
    font-weight: 600;
    padding: 5px 14px;
    border-radius: 100px;
}

/* ══════════════════════════════════════════════
   21. CTA FINAL
══════════════════════════════════════════════ */
.gx-crm .crm-final-cta {
    background: #0b0f19;
    padding: 120px 0;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.gx-crm .crm-final-cta::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 600px;
    height: 400px;
    background: radial-gradient(circle, rgba(0, 160, 227, 0.15) 0%, rgba(11, 15, 25, 0) 70%);
}
.gx-crm .crm-final-cta .crm-container {
    position: relative;
    z-index: 1;
    max-width: 800px;
}
.gx-crm .crm-final-cta h2 {
    color: #ffffff;
    font-size: 42px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
    margin: 18px 0 20px 0;
}
.gx-crm .crm-final-cta h2 span {
    display: block;
    color: #94a3b8;
    font-size: 22px;
    font-weight: 500;
    margin-top: 12px;
}
.gx-crm .crm-final-cta p {
    color: #94a3b8;
    font-size: 17px;
    line-height: 1.7;
    max-width: 640px;
    margin: 0 auto;
}
.gx-crm .crm-final-tags {
    justify-content: center;
}

/* ══════════════════════════════════════════════
   RESPONSIVO
══════════════════════════════════════════════ */
@media (max-width: 992px) {
    .gx-crm .crm-hero-grid,
    .gx-crm .crm-two-columns {
        grid-template-columns: 1fr;
    }
    .gx-crm .crm-analytics-kpis {
        grid-template-columns: repeat(3, 1fr);
    }
    .gx-crm .crm-analytics-grid {
        grid-template-columns: 1fr;
    }
    .gx-crm .crm-ecosystem-top,
    .gx-crm .crm-ecosystem-bottom {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .gx-crm .crm-section {
        padding: 64px 0;
    }
    .gx-crm .crm-hero-content h1 {
        font-size: 32px;
    }
    .gx-crm .crm-heading h2,
    .gx-crm .crm-content h2 {
        font-size: 28px;
    }
    .gx-crm .crm-check-list {
        grid-template-columns: 1fr;
    }
    .gx-crm .crm-customer-kpis,
    .gx-crm .crm-profile-grid,
    .gx-crm .crm-lead-data,
    .gx-crm .crm-tracking-summary,
    .gx-crm .crm-activity-summary,
    .gx-crm .crm-campaign-kpis,
    .gx-crm .crm-campaign-conversion,
    .gx-crm .crm-goal-values,
    .gx-crm .crm-portfolio-insights,
    .gx-crm .crm-support-kpis {
        grid-template-columns: 1fr 1fr;
    }
    .gx-crm .crm-analytics-kpis {
        grid-template-columns: repeat(2, 1fr);
    }
    .gx-crm .crm-ecosystem-top,
    .gx-crm .crm-ecosystem-bottom {
        grid-template-columns: 1fr;
    }
    .gx-crm .crm-journey,
    .gx-crm .crm-commerce-flow {
        flex-direction: column;
    }
    .gx-crm .crm-journey > i,
    .gx-crm .crm-commerce-flow > i {
        transform: rotate(90deg);
    }
    .gx-crm .crm-stage-flow {
        flex-direction: column;
        align-items: flex-start;
    }
    .gx-crm .crm-pipeline {
        grid-template-columns: 1fr;
    }
    .gx-crm .crm-final-cta h2 {
        font-size: 28px;
    }
}

/* ══════════════════════════════════════════════════════════════
   GALACTIX NETWORK (MARKETING MULTINÍVEL) — padrão visual do b2c.html
   (conteúdo original da página preservado; aqui só entra o estilo)
══════════════════════════════════════════════════════════════ */
.network-gamification {
    display: block;
    overflow: hidden;
    background: #ffffff;
}
.network-gamification * {
    box-sizing: border-box;
}
.network-gamification button {
    font-family: inherit;
    cursor: pointer;
}
.network-gamification .network-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* ---------- Cabeçalho de header interno (conflita com o header fixo do site) ---------- */
.network-gamification .network-heading {
    position: static !important;
    top: auto !important;
    left: auto !important;
    z-index: auto !important;
    width: auto !important;
    display: block !important;
    flex-direction: row !important;
    border-bottom: none !important;
}

/* ---------- Seções ---------- */
.network-gamification .network-section {
    padding: 100px 0;
    background: #ffffff;
}
.network-gamification .network-section.notifications-section {
    background: #f8fafc;
}
.network-gamification .network-section.newton-section {
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}

/* ---------- Tipografia comum ---------- */
.network-gamification .network-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #e0f2fe;
    color: #0284c7;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    padding: 6px 16px;
    border-radius: 100px;
    margin-bottom: 20px;
    border: 1px solid rgba(56, 189, 248, 0.4);
}
.network-gamification .newton-section .network-eyebrow {
    background: rgba(56, 189, 248, 0.1);
    color: #38bdf8;
    border: 1px solid rgba(56, 189, 248, 0.3);
}

.network-gamification .network-heading {
    max-width: 760px;
    margin: 0 0 60px 0;
}
.network-gamification .network-heading.center {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}
.network-gamification .network-heading h2,
.network-gamification .notification-copy h2 {
    margin: 0 0 18px 0;
    font-size: 38px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
    color: #0f172a;
}
.network-gamification .network-heading h2 span,
.network-gamification .notification-copy h2 span {
    display: block;
    color: #00a0e3;
}
.network-gamification .network-heading p,
.network-gamification .notification-copy p {
    margin: 0;
    color: #475569;
    font-size: 18px;
    line-height: 1.7;
}
.network-gamification .newton-section .network-heading h2 {
    color: #ffffff;
}
.network-gamification .newton-section .network-heading p {
    color: #94a3b8;
}

/* ══════════════════════════════════════════════
   HERO GAMIFICAÇÃO
══════════════════════════════════════════════ */
.network-gamification .gamification-hero {
    padding: 60px 0 100px 0;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.network-gamification .gamification-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}
.network-gamification .gamification-copy h1 {
    margin: 0 0 20px 0;
    max-width: 600px;
    color: #ffffff;
    font-size: 46px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1px;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}
.network-gamification .gamification-copy h1 span {
    display: block;
    color: #00a0e3;
}
.network-gamification .gamification-copy > p {
    max-width: 520px;
    margin: 0 0 28px 0;
    color: #cbd5e1;
    font-size: 18px;
    line-height: 1.7;
}
.network-gamification .gamification-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.network-gamification .gamification-tags span {
    padding: 8px 16px;
    border: 1px solid rgba(0, 160, 227, 0.3);
    border-radius: 100px;
    background: rgba(0, 160, 227, 0.12);
    color: #38bdf8;
    font-size: 12.5px;
    font-weight: 700;
}

/* ══════════════════════════════════════════════
   CARD GRADUAÇÃO (mockup)
══════════════════════════════════════════════ */
.network-gamification .graduation-card {
    position: relative;
    padding: 26px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 30px 60px -15px rgba(0, 0, 0, 0.5);
}
.network-gamification .graduation-card::before {
    content: "";
    position: absolute;
    width: 180px;
    height: 180px;
    right: -70px;
    top: -70px;
    border-radius: 50%;
    background: rgba(0, 160, 227, 0.08);
    filter: blur(2px);
}
.network-gamification .graduation-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 22px;
}
.network-gamification .graduation-person {
    display: flex;
    align-items: center;
    gap: 14px;
}
.network-gamification .graduation-avatar {
    /* width: 48px;
    height: 48px; */
    flex-shrink: 0;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #ffffff;
    font-weight: 800;
    padding:20px 19px;
}
.network-gamification .graduation-person small,
.network-gamification .graduation-person span {
    display: block;
}
.network-gamification .graduation-person small {
    margin-bottom: 4px;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1px;
}
.network-gamification .graduation-person strong {
    display: block;
    color: #0f172a;
    font-size: 16px;
}
.network-gamification .graduation-person span {
    margin-top: 4px;
    color: #FFF;
    font-size: 12px;
}
.network-gamification .graduation-badge {
    padding: 8px 12px;
    border-radius: 100px;
    background: #dcfce7;
    color: #16a34a;
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}
.network-gamification .graduation-levels {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}
.network-gamification .graduation-levels strong {
    color: #0f172a;
    font-size: 13px;
}
.network-gamification .graduation-levels span {
    color: #00a0e3;
    font-size: 13px;
    font-weight: 800;
}
.network-gamification .graduation-progress {
    height: 8px;
    margin-bottom: 10px;
    overflow: hidden;
    border-radius: 100px;
    background: #f1f5f9;
}
.network-gamification .graduation-progress i {
    display: block;
    width: 87%;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #00a0e3, #802be2);
}
.network-gamification .graduation-percent {
    display: flex;
    justify-content: space-between;
    margin-bottom: 22px;
    color: #64748b;
    font-size: 12px;
}
.network-gamification .graduation-percent strong {
    color: #00a0e3;
}
.network-gamification .graduation-message {
    padding: 16px;
    margin-bottom: 20px;
    border-radius: 10px;
    background: rgba(0, 160, 227, 0.08);
    border: 1px solid rgba(0, 160, 227, 0.2);
}
.network-gamification .graduation-message strong {
    display: block;
    margin-bottom: 6px;
    color: #0284c7;
    font-size: 15px;
}
.network-gamification .graduation-message p {
    margin: 0;
    color: #334155;
    font-size: 13px;
    line-height: 1.55;
}
.network-gamification .graduation-requirements {
    display: grid;
    gap: 2px;
}
.network-gamification .requirement {
    display: grid;
    grid-template-columns: 24px 1fr auto;
    gap: 8px;
    align-items: center;
    padding: 12px 0;
    border-top: 1px solid #f1f5f9;
    font-size: 13px;
    color: #334155;
}
.network-gamification .requirement:first-child {
    border-top: none;
}
.network-gamification .requirement .check {
    color: #10b981;
    font-weight: 900;
}
.network-gamification .requirement .pending {
    color: #f59e0b;
    font-weight: 900;
}
.network-gamification .requirement small {
    color: #94a3b8;
}

/* ══════════════════════════════════════════════
   NOTIFICAÇÕES
══════════════════════════════════════════════ */
.network-gamification .notification-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}
.network-gamification .notification-features {
    display: grid;
    gap: 14px;
    margin-top: 28px;
}
.network-gamification .notification-feature {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}
.network-gamification .notification-feature i {
    width: 25px;
    height: 25px;
    flex: 0 0 25px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #e0f2fe;
    color: #0284c7;
    font-style: normal;
    font-size: 11px;
    font-weight: 900;
}
.network-gamification .notification-feature strong {
    display: block;
    margin-bottom: 4px;
    color: #0f172a;
    font-size: 14.5px;
}
.network-gamification .notification-feature span {
    color: #64748b;
    font-size: 13px;
    line-height: 1.5;
}

.network-gamification .phone-wrapper {
    display: flex;
    justify-content: center;
    position: relative;
}
.network-gamification .phone {
    width: 350px;
    padding: 13px;
    border-radius: 42px;
    background: #17191f;
    box-shadow: 0 30px 60px -15px rgba(0, 0, 0, 0.35);
}
.network-gamification .phone-screen {
    min-height: 650px;
    padding: 25px 18px;
    overflow: hidden;
    border-radius: 32px;
    background: linear-gradient(180deg, #f0f9ff 0%, #ffffff 36%);
}
.network-gamification .phone-island {
    width: 92px;
    height: 22px;
    margin: -14px auto 25px;
    border-radius: 20px;
    background: #17191f;
}
.network-gamification .phone-header {
    margin-bottom: 22px;
}
.network-gamification .phone-header small {
    display: block;
    margin-bottom: 4px;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1px;
}
.network-gamification .phone-header strong {
    color: #0f172a;
    font-size: 20px;
}
.network-gamification .push-card {
    padding: 16px;
    margin-bottom: 14px;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}
.network-gamification .push-top {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 10px;
}
.network-gamification .push-logo {
    width: 30px;
    height: 30px;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #ffffff;
    font-size: 12px;
    font-weight: 900;
}
.network-gamification .push-top strong {
    flex: 1;
    color: #0f172a;
    font-size: 11px;
}
.network-gamification .push-top time {
    color: #94a3b8;
    font-size: 10px;
    font-style: normal;
}
.network-gamification .push-card h4 {
    margin: 0 0 6px 0;
    color: #0f172a;
    font-size: 14px;
}
.network-gamification .push-card p {
    margin: 0;
    color: #64748b;
    font-size: 12px;
    line-height: 1.5;
}
.network-gamification .push-card.highlight {
    border-color: rgba(0, 160, 227, 0.25);
    background: linear-gradient(135deg, #ffffff, #f0f9ff);
}

/* ══════════════════════════════════════════════
   MOTOR DE GATILHOS
══════════════════════════════════════════════ */
.network-gamification .trigger-builder {
    max-width: 880px;
    margin: 0 auto;
    padding: 26px;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.network-gamification .trigger-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid #f1f5f9;
}
.network-gamification .trigger-title small {
    display: block;
    margin-bottom: 4px;
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.network-gamification .trigger-title strong {
    color: #0f172a;
    font-size: 16px;
}
.network-gamification .trigger-status {
    padding: 5px 12px;
    border-radius: 100px;
    background: #dcfce7;
    color: #16a34a;
    font-size: 11.5px;
    font-weight: 700;
    white-space: nowrap;
}
.network-gamification .trigger-row {
    display: grid;
    grid-template-columns: 130px 1fr;
    gap: 18px;
    padding: 16px 0;
    border-top: 1px solid #f1f5f9;
}
.network-gamification .trigger-row:first-of-type {
    border-top: none;
}
.network-gamification .trigger-row > small {
    color: #94a3b8;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.5px;
}
.network-gamification .trigger-value {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.network-gamification .trigger-value span {
    padding: 6px 12px;
    border-radius: 8px;
    background: #f1f5f9;
    color: #334155;
    font-size: 12px;
    font-weight: 600;
}
.network-gamification .trigger-value span.primary {
    background: rgba(0, 160, 227, 0.1);
    color: #0284c7;
    font-weight: 700;
}

/* ══════════════════════════════════════════════
   CONSULTORA + LÍDER
══════════════════════════════════════════════ */
.network-gamification .journey-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 28px;
}
.network-gamification .journey-card {
    padding: 32px;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #ffffff;
    transition: all 0.3s ease;
}
.network-gamification .journey-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.06);
    border-color: #00a0e3;
}
.network-gamification .journey-card .icon {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    margin-bottom: 20px;
    border-radius: 12px;
    background: rgba(0, 160, 227, 0.1);
    border: 1px solid rgba(0, 160, 227, 0.2);
    font-size: 20px;
}
.network-gamification .journey-card > small {
    color: #00a0e3;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.5px;
}
.network-gamification .journey-card h3 {
    margin: 8px 0 10px 0;
    color: #0f172a;
    font-size: 22px;
    letter-spacing: -0.5px;
}
.network-gamification .journey-card > p {
    margin: 0 0 22px 0;
    color: #64748b;
    font-size: 14.5px;
    line-height: 1.6;
}
.network-gamification .journey-alert {
    padding: 16px;
    border-radius: 10px;
    background: #f8fafc;
}
.network-gamification .journey-alert strong {
    display: block;
    margin-bottom: 6px;
    color: #0f172a;
    font-size: 13px;
}
.network-gamification .journey-alert p {
    margin: 0;
    color: #64748b;
    font-size: 12.5px;
    line-height: 1.55;
}

/* ══════════════════════════════════════════════
   NEWTON
══════════════════════════════════════════════ */
.network-gamification .newton-box {
    max-width: 820px;
    margin: 0 auto;
    overflow: hidden;
    border: 1px solid #1e293b;
    border-radius: 18px;
    background: #111827;
}
.network-gamification .newton-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 18px 22px;
    border-bottom: 1px solid #1e293b;
}
.network-gamification .newton-icon {
    width: 38px;
    height: 38px;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #ffffff;
    font-weight: 900;
}
.network-gamification .newton-header strong {
    display: block;
    color: #ffffff;
    font-size: 13.5px;
}
.network-gamification .newton-header small {
    color: #64748b;
    font-size: 11px;
}
.network-gamification .newton-content {
    padding: 26px;
}
.network-gamification .newton-content > p {
    margin: 0 0 20px 0;
    color: #cbd5e1;
    font-size: 15px;
    line-height: 1.7;
}
.network-gamification .newton-content > p strong {
    color: #ffffff;
}
.network-gamification .newton-analysis {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-bottom: 20px;
}
.network-gamification .newton-analysis article {
    padding: 14px;
    border-radius: 10px;
    background: #0b0f19;
    border: 1px solid #1e293b;
}
.network-gamification .newton-analysis small {
    display: block;
    margin-bottom: 6px;
    color: #64748b;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.3px;
}
.network-gamification .newton-analysis strong {
    color: #ffffff;
    font-size: 15px;
}
.network-gamification .newton-recommendation {
    padding: 16px;
    border: 1px solid rgba(0, 160, 227, 0.2);
    border-radius: 10px;
    background: rgba(0, 160, 227, 0.08);
    color: #cbd5e1;
    font-size: 13px;
    line-height: 1.6;
}
.network-gamification .newton-recommendation strong {
    color: #38bdf8;
}
.network-gamification .newton-button {
    display: inline-flex;
    align-items: center;
    margin-top: 18px;
    padding: 12px 20px;
    border: 0;
    border-radius: 8px;
    background: #00a0e3;
    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
    transition: all 0.3s ease;
}
.network-gamification .newton-button:hover {
    background: #008cc6;
    transform: translateY(-2px);
}

/* ══════════════════════════════════════════════
   CONQUISTA
══════════════════════════════════════════════ */
.network-gamification .achievement-card {
    max-width: 650px;
    margin: 0 auto;
    padding: 50px;
    text-align: center;
    border: 1px solid #e2e8f0;
    border-radius: 24px;
    background:
        radial-gradient(circle at 50% 0%, rgba(0, 160, 227, 0.1), transparent 45%),
        #ffffff;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.network-gamification .achievement-diamond {
    display: block;
    margin-bottom: 14px;
    font-size: 56px;
}
.network-gamification .achievement-card > small {
    color: #00a0e3;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.5px;
}
.network-gamification .achievement-card h3 {
    margin: 12px 0 8px 0;
    color: #0f172a;
    font-size: 38px;
    font-weight: 800;
    letter-spacing: -1px;
}
.network-gamification .achievement-card > p {
    max-width: 430px;
    margin: 0 auto 28px auto;
    color: #64748b;
    font-size: 16px;
    line-height: 1.6;
}
.network-gamification .achievement-benefits {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
}
.network-gamification .achievement-benefits span {
    padding: 8px 16px;
    border-radius: 100px;
    background: rgba(0, 160, 227, 0.1);
    color: #0284c7;
    font-size: 12px;
    font-weight: 700;
}

/* ══════════════════════════════════════════════
   RESPONSIVO
══════════════════════════════════════════════ */
@media (max-width: 992px) {
    .network-gamification .gamification-grid,
    .network-gamification .notification-layout {
        grid-template-columns: 1fr;
        gap: 50px;
    }
    .network-gamification .journey-grid {
        grid-template-columns: 1fr;
    }
    .network-gamification .newton-analysis {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 768px) {
    .network-gamification .network-section,
    .network-gamification .gamification-hero {
        padding: 64px 0;
    }
    .network-gamification .gamification-copy h1 {
        font-size: 32px;
    }
    .network-gamification .network-heading h2,
    .network-gamification .notification-copy h2 {
        font-size: 28px;
    }
    .network-gamification .phone {
        width: min(350px, 100%);
    }
    .network-gamification .trigger-row {
        grid-template-columns: 1fr;
        gap: 8px;
    }
    .network-gamification .achievement-card {
        padding: 32px 20px;
    }
    .network-gamification .achievement-card h3 {
        font-size: 28px;
    }
}

/* ══════════════════════════════════════════════════════════════
   GALACTIX ATENDIMENTO OMNICHANNEL — padrão visual do b2c.html
   (conteúdo original da página preservado; aqui só entra o estilo)
   Variáveis mantidas porque o conteúdo usa var(--gx-...) em estilos
   inline (cores de status e do card de resumo reaproveitado).
══════════════════════════════════════════════════════════════ */
.gx-service {
    --gx-green: #16a34a;
    --gx-orange: #f59e0b;
    --gx-text: #334155;
    --gx-border: #e2e8f0;
    --gx-bg: #f8fafc;
    display: block;
    overflow: hidden;
    background: #ffffff;
    color: #334155;
    font-family: Inter, Arial, sans-serif;
}
.gx-service * {
    box-sizing: border-box;
}
.gx-service button {
    font-family: inherit;
    cursor: pointer;
}
.gx-service .gx-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* ---------- Cabeçalho interno (conflita com o header fixo do site) ---------- */
.gx-service .gx-heading {
    position: static !important;
    top: auto !important;
    left: auto !important;
    z-index: auto !important;
    width: auto !important;
    display: block !important;
    flex-direction: row !important;
    border-bottom: none !important;
}

/* ---------- Seções ---------- */
.gx-service .gx-section {
    padding: 100px 0;
    background: #ffffff;
}
.gx-service .gx-light {
    background: #f8fafc;
}
.gx-service .gx-dark {
    color: #ffffff;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}

/* ---------- Tipografia comum ---------- */
.gx-service .gx-eyebrow {
    display: inline-block;
    background: #e0f2fe;
    color: #0284c7;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    padding: 6px 16px;
    border-radius: 100px;
    margin-bottom: 20px;
    border: 1px solid rgba(56, 189, 248, 0.4);
}
.gx-service .gx-dark .gx-eyebrow {
    background: rgba(56, 189, 248, 0.1);
    color: #38bdf8;
    border: 1px solid rgba(56, 189, 248, 0.3);
}

.gx-service .gx-copy h1,
.gx-service .gx-copy h2,
.gx-service .gx-heading h2 {
    margin: 0 0 18px;
    color: #0f172a;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1px;
}
.gx-service .gx-copy h1 {
    font-size: 46px;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}
.gx-service .gx-copy h2,
.gx-service .gx-heading h2 {
    font-size: 38px;
    line-height: 1.25;
}
.gx-service .gx-copy h1 span,
.gx-service .gx-copy h2 span,
.gx-service .gx-heading h2 span {
    display: block;
    color: #00a0e3;
}
.gx-service .gx-dark .gx-copy h2,
.gx-service .gx-dark .gx-heading h2 {
    color: #ffffff;
}
.gx-service .gx-hero .gx-copy h1 {
    color: #ffffff;
}

.gx-service .gx-copy p,
.gx-service .gx-heading p {
    max-width: 650px;
    margin: 0 0 25px;
    color: #475569;
    font-size: 18px;
    line-height: 1.7;
}
.gx-service .gx-hero .gx-copy > p {
    color: #cbd5e1;
    max-width: 520px;
}
.gx-service .gx-dark .gx-copy p,
.gx-service .gx-dark .gx-heading p {
    color: #94a3b8;
}

.gx-service .gx-heading {
    max-width: 780px;
    margin: 0 auto 60px;
    text-align: center;
}

.gx-service .gx-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 28px;
}
.gx-service .gx-tags span {
    padding: 8px 16px;
    border: 1px solid #e2e8f0;
    border-radius: 100px;
    background: #ffffff;
    color: #334155;
    font-size: 12.5px;
    font-weight: 700;
}
.gx-service .gx-hero .gx-tags span {
    border: 1px solid rgba(0, 160, 227, 0.3);
    background: rgba(0, 160, 227, 0.12);
    color: #38bdf8;
}
.gx-service .gx-cta .gx-tags span {
    border: 1px solid rgba(0, 160, 227, 0.3);
    background: rgba(0, 160, 227, 0.12);
    color: #38bdf8;
}

.gx-service .gx-btns {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 28px;
}
.gx-service .gx-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 52px;
    padding: 0 28px;
    border-radius: 8px;
    text-decoration: none;
    font-size: 15px;
    font-weight: 700;
    transition: all 0.3s ease;
    border: 1px solid transparent;
}
.gx-service .gx-btn-primary {
    background: #00a0e3;
    color: #ffffff;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
}
.gx-service .gx-btn-primary:hover {
    background: #008cc6;
    transform: translateY(-2px);
}
.gx-service .gx-btn-outline {
    border: 1px solid #e2e8f0;
    color: #0f172a;
    background: #ffffff;
}
.gx-service .gx-hero .gx-btn-outline,
.gx-service .gx-cta .gx-btn-outline {
    border-color: rgba(255, 255, 255, 0.3);
    color: #ffffff;
    background: transparent;
}
.gx-service .gx-btn-outline:hover {
    background: rgba(255, 255, 255, 0.05);
    border-color: #ffffff;
}

.gx-service .gx-checks {
    display: grid;
    gap: 14px;
    margin-top: 28px;
}
.gx-service .gx-check {
    display: flex;
    gap: 12px;
    align-items: flex-start;
}
.gx-service .gx-check i {
    width: 25px;
    height: 25px;
    flex: 0 0 25px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #e0f2fe;
    color: #0284c7;
    font-size: 11px;
    font-style: normal;
    font-weight: 900;
}
.gx-service .gx-dark .gx-check i {
    background: rgba(0, 160, 227, 0.15);
    color: #38bdf8;
}
.gx-service .gx-check strong {
    display: block;
    margin-bottom: 4px;
    color: #0f172a;
    font-size: 14.5px;
}
.gx-service .gx-dark .gx-check strong {
    color: #ffffff;
}
.gx-service .gx-check span {
    color: #64748b;
    font-size: 13px;
    line-height: 1.5;
}
.gx-service .gx-dark .gx-check span {
    color: #94a3b8;
}

/* ══════════════════════════════════════════════
   01. HERO
══════════════════════════════════════════════ */
.gx-service .gx-hero {
    padding: 60px 0 100px 0;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.gx-service .gx-hero .gx-grid-2 {
    grid-template-columns: 1fr 1fr;
}
.gx-service .gx-hero-highlight {
    display: block;
    margin-top: 22px;
    color: #7dd3fc;
    font-size: 15px;
    font-weight: 700;
}

.gx-service .gx-grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}

/* ---- APP MOCKUP (hero) ---- */
.gx-service .gx-app {
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 30px 60px -15px rgba(0, 0, 0, 0.5);
}
.gx-service .gx-app-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 20px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-service .gx-app-title small {
    display: block;
    margin-bottom: 3px;
    color: #94a3b8;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 1px;
}
.gx-service .gx-app-title strong {
    color: #0f172a;
    font-size: 14px;
}
.gx-service .gx-online {
    color: #16a34a;
    font-size: 11px;
    font-weight: 700;
}
.gx-service .gx-inbox {
    display: grid;
    grid-template-columns: 190px 1fr 190px;
    min-height: 500px;
}
.gx-service .gx-sidebar {
    padding: 18px 12px;
    border-right: 1px solid #f1f5f9;
    background: #f8fafc;
}
.gx-service .gx-sidebar small {
    display: block;
    padding: 0 8px 10px;
    color: #94a3b8;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 1px;
}
.gx-service .gx-menu-item {
    display: flex;
    justify-content: space-between;
    padding: 9px 8px;
    margin-bottom: 3px;
    border-radius: 8px;
    color: #334155;
    font-size: 11px;
}
.gx-service .gx-menu-item.active {
    color: #0284c7;
    background: #e0f2fe;
    font-weight: 800;
}
.gx-service .gx-menu-item b {
    font-size: 10px;
}
.gx-service .gx-conversation-list {
    border-right: 1px solid #f1f5f9;
}
.gx-service .gx-conversation {
    padding: 15px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-service .gx-conversation.active {
    background: #f0f9ff;
}
.gx-service .gx-conversation-top {
    display: flex;
    justify-content: space-between;
    margin-bottom: 6px;
}
.gx-service .gx-conversation strong {
    color: #0f172a;
    font-size: 11px;
}
.gx-service .gx-conversation time {
    color: #94a3b8;
    font-size: 9px;
    font-style: normal;
}
.gx-service .gx-conversation p {
    margin: 0;
    color: #64748b;
    font-size: 10px;
    line-height: 1.45;
}
.gx-service .gx-channel {
    display: inline-flex;
    margin-top: 7px;
    padding: 4px 6px;
    border-radius: 5px;
    background: #dcfce7;
    color: #16a34a;
    font-size: 8px;
    font-weight: 800;
}
.gx-service .gx-chat {
    padding: 18px;
}
.gx-service .gx-chat-head {
    padding-bottom: 14px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-service .gx-chat-head strong {
    display: block;
    color: #0f172a;
    font-size: 12px;
}
.gx-service .gx-chat-head span {
    color: #94a3b8;
    font-size: 9px;
}
.gx-service .gx-bubble {
    max-width: 85%;
    padding: 11px 13px;
    margin-top: 18px;
    border-radius: 12px 12px 12px 3px;
    background: #f1f5f9;
    color: #1e293b;
    font-size: 10px;
    line-height: 1.5;
}
.gx-service .gx-bubble.agent {
    margin-left: auto;
    border-radius: 12px 12px 3px 12px;
    background: #00a0e3;
    color: #ffffff;
}
.gx-service .gx-context {
    padding: 16px 12px;
    background: #f8fafc;
}
.gx-service .gx-context > small {
    display: block;
    margin-bottom: 14px;
    color: #94a3b8;
    font-size: 8.5px;
    font-weight: 800;
}
.gx-service .gx-customer {
    display: flex;
    gap: 9px;
    align-items: center;
    margin-bottom: 18px;
}
.gx-service .gx-avatar {
    width: 34px;
    height: 34px;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #ffffff;
    font-size: 10px;
    font-weight: 900;
}
.gx-service .gx-customer strong {
    display: block;
    color: #0f172a;
    font-size: 10px;
}
.gx-service .gx-customer span {
    color: #94a3b8;
    font-size: 8px;
}
.gx-service .gx-context-kpi {
    padding: 9px 0;
    border-bottom: 1px solid #f1f5f9;
}
.gx-service .gx-context-kpi small {
    display: block;
    color: #94a3b8;
    font-size: 7.5px;
}
.gx-service .gx-context-kpi strong {
    color: #0f172a;
    font-size: 10px;
}

/* ══════════════════════════════════════════════
   02. CANAIS
══════════════════════════════════════════════ */
.gx-service .gx-channels {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 14px;
    margin-top: 45px;
}
.gx-service .gx-channel-card {
    padding: 22px 12px;
    text-align: center;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #ffffff;
    transition: all 0.3s ease;
}
.gx-service .gx-channel-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.06);
    border-color: #00a0e3;
}
.gx-service .gx-channel-card span {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    margin: 0 auto 12px;
    border-radius: 12px;
    background: rgba(0, 160, 227, 0.1);
    border: 1px solid rgba(0, 160, 227, 0.2);
    color: #00a0e3;
    font-weight: 800;
}
.gx-service .gx-channel-card strong {
    display: block;
    color: #0f172a;
    font-size: 12.5px;
}

/* ══════════════════════════════════════════════
   03. CLIENTE 360
══════════════════════════════════════════════ */
.gx-service .gx-customer360 {
    padding: 26px;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-service .gx-profile {
    display: flex;
    align-items: center;
    gap: 13px;
    padding-bottom: 20px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-service .gx-profile .gx-avatar {
    width: 48px;
    height: 48px;
}
.gx-service .gx-profile strong {
    display: block;
    color: #0f172a;
    font-size: 15px;
}
.gx-service .gx-profile span {
    color: #FFF;
    font-size: 11px;
}
.gx-service .gx-profile-status {
    margin-left: auto;
    color: #16a34a !important;
    font-weight: 800;
}
.gx-service .gx-kpis {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-top: 20px;
}
.gx-service .gx-kpi {
    padding: 14px;
    border-radius: 10px;
    background: #f8fafc;
}
.gx-service .gx-kpi small {
    display: block;
    margin-bottom: 5px;
    color: #94a3b8;
    font-size: 9.5px;
    font-weight: 700;
}
.gx-service .gx-kpi strong {
    color: #0f172a;
    font-size: 14px;
}
.gx-service .gx-order {
    padding: 14px;
    margin-top: 14px;
    border: 1px solid #f1f5f9;
    border-radius: 10px;
}
.gx-service .gx-order small {
    display: block;
    margin-bottom: 8px;
    color: #94a3b8;
    font-size: 9px;
    font-weight: 800;
}
.gx-service .gx-order-row {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}
.gx-service .gx-order-row strong {
    color: #0f172a;
    font-size: 12.5px;
}
.gx-service .gx-order-row span {
    color: #00a0e3;
    font-size: 11px;
    font-weight: 700;
}

/* ══════════════════════════════════════════════
   04/08. FLUXOS (roteamento / automação)
══════════════════════════════════════════════ */
.gx-service .gx-flow {
    max-width: 850px;
    margin: 0 auto;
    text-align: center;
}
.gx-service .gx-flow-node {
    display: inline-block;
    min-width: 280px;
    padding: 16px 22px;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
    color: #0f172a;
    font-size: 13px;
    font-weight: 700;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}
.gx-service .gx-flow-node.primary {
    border-color: rgba(0, 160, 227, 0.3);
    background: #e0f2fe;
    color: #0284c7;
}
.gx-service .gx-flow-node.success {
    border-color: #bbf7d0;
    background: #dcfce7;
    color: #16a34a;
}
.gx-service .gx-flow-arrow {
    display: block;
    padding: 8px;
    color: #cbd5e1;
}
.gx-service .gx-flow-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-top: 8px;
}

/* ══════════════════════════════════════════════
   05. OPERAÇÃO EM TEMPO REAL
══════════════════════════════════════════════ */
.gx-service .gx-operation {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}
.gx-service .gx-op-card {
    padding: 22px;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #ffffff;
}
.gx-service .gx-op-card small {
    display: block;
    margin-bottom: 8px;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 800;
}
.gx-service .gx-op-card strong {
    display: block;
    margin-bottom: 4px;
    color: #0f172a;
    font-size: 25px;
    font-weight: 800;
}
.gx-service .gx-op-card span {
    color: #64748b;
    font-size: 11px;
}
.gx-service .gx-op-card.danger strong {
    color: #ef4444;
}

/* ══════════════════════════════════════════════
   06. SLA
══════════════════════════════════════════════ */
.gx-service .gx-sla-panel {
    padding: 26px;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-service .gx-sla-head {
    display: flex;
    justify-content: space-between;
    padding-bottom: 16px;
    margin-bottom: 6px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-service .gx-sla-head strong {
    color: #0f172a;
    font-size: 14px;
}
.gx-service .gx-sla-head span {
    color: #64748b;
    font-size: 11px;
}
.gx-service .gx-sla-item {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 15px;
    padding: 16px 0;
    border-bottom: 1px solid #f1f5f9;
}
.gx-service .gx-sla-item:last-child {
    border-bottom: 0;
}
.gx-service .gx-sla-item strong {
    display: block;
    margin-bottom: 4px;
    color: #0f172a;
    font-size: 12.5px;
}
.gx-service .gx-sla-item small {
    color: #94a3b8;
    font-size: 10px;
}
.gx-service .gx-sla-time {
    text-align: right;
}
.gx-service .gx-sla-time b {
    display: block;
    color: #ef4444;
    font-size: 13.5px;
}
.gx-service .gx-sla-time span {
    color: #94a3b8;
    font-size: 9px;
}

/* ══════════════════════════════════════════════
   07. TICKETS
══════════════════════════════════════════════ */
.gx-service .gx-ticket {
    padding: 26px;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-service .gx-ticket-top {
    display: flex;
    justify-content: space-between;
    margin-bottom: 22px;
}
.gx-service .gx-ticket-top small {
    display: block;
    color: #00a0e3;
    font-size: 10px;
    font-weight: 800;
}
.gx-service .gx-ticket-top strong {
    color: #0f172a;
    font-size: 17px;
}
.gx-service .gx-priority {
    height: max-content;
    padding: 6px 12px;
    border-radius: 100px;
    background: rgba(239, 68, 68, 0.1);
    color: #ef4444;
    font-size: 10px;
    font-weight: 800;
}
.gx-service .gx-ticket-data {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}
.gx-service .gx-ticket-data article {
    padding: 14px;
    border-radius: 10px;
    background: #f8fafc;
}
.gx-service .gx-ticket-data small {
    display: block;
    margin-bottom: 5px;
    color: #94a3b8;
    font-size: 9px;
}
.gx-service .gx-ticket-data strong {
    color: #0f172a;
    font-size: 12px;
}

/* ══════════════════════════════════════════════
   09. INTEGRAÇÃO (pedido/ERP/TMS)
══════════════════════════════════════════════ */
.gx-service .gx-integration-card {
    padding: 28px;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-service .gx-integration-card > small {
    display: block;
    margin-bottom: 8px;
    color: #00a0e3;
    font-size: 10px;
    font-weight: 800;
}
.gx-service .gx-integration-card h3 {
    margin: 0 0 20px;
    color: #0f172a;
    font-size: 21px;
}
.gx-service .gx-tracking {
    position: relative;
    display: grid;
    gap: 18px;
}
.gx-service .gx-track-item {
    position: relative;
    display: grid;
    grid-template-columns: 24px 1fr;
    gap: 10px;
}
.gx-service .gx-track-icon {
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #dcfce7;
    color: #16a34a;
    font-size: 9px;
    font-weight: 800;
}
.gx-service .gx-track-item strong {
    display: block;
    color: #0f172a;
    font-size: 11.5px;
}
.gx-service .gx-track-item small {
    color: #94a3b8;
    font-size: 9px;
}

/* ══════════════════════════════════════════════
   10. NEWTON COPILOT
══════════════════════════════════════════════ */
.gx-service .gx-newton-card {
    overflow: hidden;
    border: 1px solid #1e293b;
    border-radius: 18px;
    background: #111827;
}
.gx-service .gx-newton-head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 18px 20px;
    border-bottom: 1px solid #1e293b;
}
.gx-service .gx-newton-logo {
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #ffffff;
    font-weight: 900;
}
.gx-service .gx-newton-head strong {
    display: block;
    color: #ffffff;
    font-size: 12.5px;
}
.gx-service .gx-newton-head small {
    color: #64748b;
    font-size: 9px;
}
.gx-service .gx-newton-body {
    padding: 24px;
}
.gx-service .gx-newton-context {
    padding: 16px;
    margin-bottom: 16px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.05);
}
.gx-service .gx-newton-context small {
    display: block;
    margin-bottom: 8px;
    color: #64748b;
    font-size: 9px;
    font-weight: 800;
}
.gx-service .gx-newton-context p {
    margin: 0;
    color: #cbd5e1;
    font-size: 12.5px;
    line-height: 1.6;
}
.gx-service .gx-suggestion {
    padding: 16px;
    border: 1px solid rgba(0, 160, 227, 0.25);
    border-radius: 12px;
    background: rgba(0, 160, 227, 0.1);
}
.gx-service .gx-suggestion small {
    display: block;
    margin-bottom: 8px;
    color: #38bdf8;
    font-size: 9px;
    font-weight: 800;
}
.gx-service .gx-suggestion p {
    margin: 0;
    color: #e0f2fe;
    font-size: 12.5px;
    line-height: 1.65;
}
.gx-service .gx-use {
    margin-top: 14px;
    padding: 10px 14px;
    border: 0;
    border-radius: 8px;
    background: #00a0e3;
    color: #ffffff;
    font-size: 11px;
    font-weight: 700;
    transition: background 0.3s ease;
}
.gx-service .gx-use:hover {
    background: #008cc6;
}

/* ---- Variante clara do card Newton (resumo automático) ---- */
.gx-service .gx-newton-card[style*="background:#fff"] .gx-newton-head strong {
    color: #0f172a;
}
.gx-service .gx-newton-card[style*="background:#fff"] .gx-newton-context small {
    color: #94a3b8;
}

/* ══════════════════════════════════════════════
   12. AGENTES DE IA
══════════════════════════════════════════════ */
.gx-service .gx-agent-flow {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 45px;
}
.gx-service .gx-agent-node {
    min-width: 145px;
    padding: 20px 14px;
    text-align: center;
    border: 1px solid #1e293b;
    border-radius: 14px;
    background: #111827;
}
.gx-service .gx-agent-node small {
    display: block;
    margin-bottom: 6px;
    color: #64748b;
    font-size: 9px;
}
.gx-service .gx-agent-node strong {
    color: #ffffff;
    font-size: 11.5px;
}
.gx-service .gx-agent-node.ai {
    border-color: rgba(0, 160, 227, 0.4);
    background: rgba(0, 160, 227, 0.12);
}
.gx-service .gx-agent-arrow {
    color: #64748b;
    font-size: 13px;
}

/* ══════════════════════════════════════════════
   13. ANALYTICS
══════════════════════════════════════════════ */
.gx-service .gx-analytics {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 14px;
}
.gx-service .gx-analytic {
    padding: 20px;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #ffffff;
}
.gx-service .gx-analytic small {
    display: block;
    margin-bottom: 8px;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 800;
}
.gx-service .gx-analytic strong {
    display: block;
    margin-bottom: 4px;
    color: #0f172a;
    font-size: 21px;
    font-weight: 800;
}
.gx-service .gx-analytic span {
    color: #16a34a;
    font-size: 11px;
    font-weight: 700;
}

/* ══════════════════════════════════════════════
   14. VOZ DO CLIENTE
══════════════════════════════════════════════ */
.gx-service .gx-voice {
    padding: 28px;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-service .gx-voice-top {
    display: flex;
    justify-content: space-between;
    padding-bottom: 18px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-service .gx-voice-top small {
    display: block;
    color: #00a0e3;
    font-size: 9px;
    font-weight: 800;
}
.gx-service .gx-voice-top strong {
    color: #0f172a;
    font-size: 16px;
}
.gx-service .gx-voice-list {
    margin-top: 20px;
}
.gx-service .gx-voice-row {
    display: grid;
    grid-template-columns: 100px 1fr 40px;
    gap: 12px;
    align-items: center;
    margin-bottom: 13px;
}
.gx-service .gx-voice-row span {
    color: #334155;
    font-size: 11px;
    font-weight: 600;
}
.gx-service .gx-bar {
    height: 8px;
    overflow: hidden;
    border-radius: 100px;
    background: #f1f5f9;
}
.gx-service .gx-bar i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #00a0e3, #802be2);
}
.gx-service .gx-voice-row b {
    text-align: right;
    color: #0f172a;
    font-size: 11px;
}
.gx-service .gx-alert {
    padding: 16px;
    margin-top: 22px;
    border-radius: 12px;
    background: rgba(239, 68, 68, 0.08);
}
.gx-service .gx-alert strong {
    display: block;
    margin-bottom: 5px;
    color: #ef4444;
    font-size: 12px;
}
.gx-service .gx-alert p {
    margin: 0;
    color: #7f1d1d;
    font-size: 11px;
    line-height: 1.5;
}

/* ══════════════════════════════════════════════
   15. ECOSSISTEMA
══════════════════════════════════════════════ */
.gx-service .gx-ecosystem {
    max-width: 950px;
    margin: 0 auto;
}
.gx-service .gx-eco-row {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 14px;
}
.gx-service .gx-eco-node {
    min-width: 150px;
    padding: 18px 14px;
    text-align: center;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #ffffff;
}
.gx-service .gx-eco-node small {
    display: block;
    margin-bottom: 6px;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.3px;
}
.gx-service .gx-eco-node strong {
    color: #0f172a;
    font-size: 14.5px;
}
.gx-service .gx-eco-core {
    max-width: 400px;
    margin: 24px auto;
    padding: 22px;
    text-align: center;
    border-radius: 16px;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #ffffff;
}
.gx-service .gx-eco-core small {
    display: block;
    margin-bottom: 8px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 1px;
    opacity: 0.85;
}
.gx-service .gx-eco-core strong {
    font-size: 19px;
    font-weight: 800;
}
.gx-service .gx-eco-line {
    width: 1px;
    height: 30px;
    margin: auto;
    background: #cbd5e1;
}

/* ══════════════════════════════════════════════
   16. CTA
══════════════════════════════════════════════ */
.gx-service .gx-cta {
    padding: 120px 0;
    text-align: center;
    color: #ffffff;
    position: relative;
    overflow: hidden;
    background: #0b0f19;
}
.gx-service .gx-cta::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 600px;
    height: 400px;
    background: radial-gradient(circle, rgba(0, 160, 227, 0.15) 0%, rgba(11, 15, 25, 0) 70%);
}
.gx-service .gx-cta .gx-container {
    position: relative;
    z-index: 1;
    max-width: 800px;
}
.gx-service .gx-cta h2 {
    max-width: 850px;
    margin: 18px auto 20px;
    color: #ffffff;
    font-size: 42px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
}
.gx-service .gx-cta h2 span {
    display: block;
    color: #94a3b8;
    font-size: 22px;
    font-weight: 500;
    margin-top: 12px;
}
.gx-service .gx-cta p {
    max-width: 640px;
    margin: 0 auto;
    color: #94a3b8;
    font-size: 17px;
    line-height: 1.7;
}
.gx-service .gx-cta .gx-btns {
    justify-content: center;
}

/* ══════════════════════════════════════════════
   RESPONSIVO
══════════════════════════════════════════════ */
@media (max-width: 1000px) {
    .gx-service .gx-grid-2,
    .gx-service .gx-hero .gx-grid-2 {
        grid-template-columns: 1fr;
    }
    .gx-service .gx-inbox {
        grid-template-columns: 160px 1fr;
    }
    .gx-service .gx-context {
        display: none;
    }
    .gx-service .gx-channels {
        grid-template-columns: repeat(3, 1fr);
    }
    .gx-service .gx-operation,
    .gx-service .gx-analytics {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 768px) {
    .gx-service .gx-section,
    .gx-service .gx-hero,
    .gx-service .gx-cta {
        padding: 64px 0;
    }
    .gx-service .gx-copy h1 {
        font-size: 32px;
    }
    .gx-service .gx-copy h2,
    .gx-service .gx-heading h2 {
        font-size: 28px;
    }
    .gx-service .gx-inbox {
        grid-template-columns: 1fr;
    }
    .gx-service .gx-sidebar {
        display: none;
    }
    .gx-service .gx-channels {
        grid-template-columns: repeat(2, 1fr);
    }
    .gx-service .gx-kpis {
        grid-template-columns: 1fr 1fr;
    }
    .gx-service .gx-operation {
        grid-template-columns: 1fr 1fr;
    }
    .gx-service .gx-ticket-data {
        grid-template-columns: 1fr;
    }
    .gx-service .gx-flow-split {
        grid-template-columns: 1fr;
    }
    .gx-service .gx-analytics {
        grid-template-columns: 1fr;
    }
    .gx-service .gx-cta h2 {
        font-size: 28px;
    }
}

/* ══════════════════════════════════════════════════════════════
   GALACTIX TMS (LOGÍSTICA) — padrão visual do b2c.html
   (conteúdo original da página preservado; aqui só entra o estilo)
   Variável --gx-green mantida porque o conteúdo usa var(--gx-green)
   em um estilo inline (SLA da Transportadora A).
══════════════════════════════════════════════════════════════ */
.gx-tms {
    --gx-green: #16a34a;
    display: block;
    overflow: hidden;
    background: #ffffff;
    color: #20222a;
    font-family: Inter, Arial, sans-serif;
}
.gx-tms * {
    box-sizing: border-box;
}
.gx-tms button {
    font-family: inherit;
    cursor: pointer;
}
.gx-tms .gx-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* ---------- Cabeçalho interno (conflita com o header fixo do site) ---------- */
.gx-tms .gx-heading {
    position: static !important;
    top: auto !important;
    left: auto !important;
    z-index: auto !important;
    width: auto !important;
    display: block !important;
    flex-direction: row !important;
    border-bottom: none !important;
}

/* ---------- Seções ---------- */
.gx-tms .gx-section {
    padding: 100px 0;
    background: #ffffff;
}
.gx-tms .gx-light {
    background: #f8fafc;
}
.gx-tms .gx-dark {
    color: #ffffff;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}

/* ---------- Tipografia comum ---------- */
.gx-tms .gx-eyebrow {
    display: inline-block;
    background: #e0f2fe;
    color: #0284c7;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    padding: 6px 16px;
    border-radius: 100px;
    margin-bottom: 20px;
    border: 1px solid rgba(56, 189, 248, 0.4);
}
.gx-tms .gx-dark .gx-eyebrow {
    background: rgba(56, 189, 248, 0.1);
    color: #38bdf8;
    border: 1px solid rgba(56, 189, 248, 0.3);
}

.gx-tms .gx-copy h1,
.gx-tms .gx-copy h2,
.gx-tms .gx-heading h2 {
    margin: 0 0 18px;
    color: #0f172a;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1px;
}
.gx-tms .gx-copy h1 {
    font-size: 46px;
}
.gx-tms .gx-hero .gx-copy h1 {
    color: #ffffff;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}
.gx-tms .gx-copy h2,
.gx-tms .gx-heading h2 {
    font-size: 38px;
    line-height: 1.25;
}
.gx-tms .gx-copy h1 span,
.gx-tms .gx-copy h2 span,
.gx-tms .gx-heading h2 span {
    display: block;
    color: #00a0e3;
}
.gx-tms .gx-dark .gx-copy h2,
.gx-tms .gx-dark .gx-heading h2 {
    color: #ffffff;
}

.gx-tms .gx-copy p,
.gx-tms .gx-heading p {
    max-width: 660px;
    margin: 0 0 25px;
    color: #475569;
    font-size: 18px;
    line-height: 1.7;
}
.gx-tms .gx-hero .gx-copy > p {
    color: #cbd5e1;
    max-width: 520px;
}
.gx-tms .gx-dark .gx-copy p,
.gx-tms .gx-dark .gx-heading p {
    color: #94a3b8;
}

.gx-tms .gx-heading {
    max-width: 780px;
    margin: 0 auto 60px;
    text-align: center;
}

.gx-tms .gx-hero-highlight {
    display: block;
    margin-top: 22px;
    color: #7dd3fc;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.5;
}

.gx-tms .gx-btns {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 28px;
}
.gx-tms .gx-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 52px;
    padding: 0 28px;
    border-radius: 8px;
    text-decoration: none;
    font-size: 15px;
    font-weight: 700;
    transition: all 0.3s ease;
    border: 1px solid transparent;
}
.gx-tms .gx-btn-primary {
    background: #00a0e3;
    color: #ffffff;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
}
.gx-tms .gx-btn-primary:hover {
    background: #008cc6;
    transform: translateY(-2px);
}
.gx-tms .gx-btn-outline {
    border: 1px solid #e2e8f0;
    color: #0f172a;
    background: #ffffff;
}
.gx-tms .gx-hero .gx-btn-outline,
.gx-tms .gx-cta .gx-btn-outline {
    border-color: rgba(255, 255, 255, 0.3);
    color: #ffffff;
    background: transparent;
}
.gx-tms .gx-btn-outline:hover {
    background: rgba(255, 255, 255, 0.05);
    border-color: #ffffff;
}

.gx-tms .gx-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 28px;
}
.gx-tms .gx-tags span {
    padding: 8px 16px;
    border: 1px solid #e2e8f0;
    border-radius: 100px;
    background: #ffffff;
    color: #334155;
    font-size: 12.5px;
    font-weight: 700;
}
.gx-tms .gx-hero .gx-tags span,
.gx-tms .gx-cta .gx-tags span,
.gx-tms .gx-dark .gx-tags span {
    border: 1px solid rgba(0, 160, 227, 0.3);
    background: rgba(0, 160, 227, 0.12);
    color: #38bdf8;
}

.gx-tms .gx-checks {
    display: grid;
    gap: 14px;
    margin-top: 28px;
}
.gx-tms .gx-check {
    display: flex;
    gap: 12px;
    align-items: flex-start;
}
.gx-tms .gx-check i {
    width: 25px;
    height: 25px;
    flex: 0 0 25px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #e0f2fe;
    color: #0284c7;
    font-size: 11px;
    font-style: normal;
    font-weight: 900;
}
.gx-tms .gx-check strong {
    display: block;
    margin-bottom: 4px;
    color: #0f172a;
    font-size: 14.5px;
}
.gx-tms .gx-check span {
    color: #64748b;
    font-size: 13px;
    line-height: 1.5;
}

.gx-tms .gx-grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}

/* ══════════════════════════════════════════════
   01. HERO
══════════════════════════════════════════════ */
.gx-tms .gx-hero {
    padding: 60px 0 100px 0;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.gx-tms .gx-hero .gx-grid-2 {
    grid-template-columns: 1fr 1fr;
}

/* ---- TORRE DE CONTROLE (mockup) ---- */
.gx-tms .gx-control {
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 30px 60px -15px rgba(0, 0, 0, 0.5);
}
.gx-tms .gx-control-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 20px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-tms .gx-control-head small {
    display: block;
    margin-bottom: 3px;
    color: #94a3b8;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 1px;
}
.gx-tms .gx-control-head strong {
    color: #0f172a;
    font-size: 14px;
}
.gx-tms .gx-live {
    color: #16a34a;
    font-size: 11px;
    font-weight: 700;
}
.gx-tms .gx-control-body {
    padding: 20px;
}
.gx-tms .gx-control-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}
.gx-tms .gx-control-kpi {
    padding: 14px;
    border-radius: 10px;
    background: #f8fafc;
}
.gx-tms .gx-control-kpi small {
    display: block;
    margin-bottom: 7px;
    color: #94a3b8;
    font-size: 8.5px;
    font-weight: 800;
}
.gx-tms .gx-control-kpi strong {
    display: block;
    color: #0f172a;
    font-size: 17px;
}
.gx-tms .gx-control-kpi span {
    color: #64748b;
    font-size: 9.5px;
}
.gx-tms .gx-control-kpi.danger strong {
    color: #ef4444;
}
.gx-tms .gx-control-kpi.success strong {
    color: #16a34a;
}
.gx-tms .gx-shipments {
    margin-top: 20px;
    border: 1px solid #f1f5f9;
    border-radius: 12px;
    overflow: hidden;
}
.gx-tms .gx-shipment-head,
.gx-tms .gx-shipment {
    display: grid;
    grid-template-columns: 1fr 1.3fr 1.3fr 1fr;
    gap: 8px;
    align-items: center;
}
.gx-tms .gx-shipment-head {
    padding: 10px 13px;
    background: #f8fafc;
    color: #94a3b8;
    font-size: 8.5px;
    font-weight: 800;
}
.gx-tms .gx-shipment {
    padding: 12px 13px;
    border-top: 1px solid #f1f5f9;
    color: #334155;
    font-size: 9.5px;
}
.gx-tms .gx-shipment strong {
    color: #0f172a;
    font-size: 9.5px;
}
.gx-tms .gx-status {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 9px;
    font-weight: 800;
}
.gx-tms .gx-status.ok {
    color: #16a34a;
}
.gx-tms .gx-status.warning {
    color: #f59e0b;
}
.gx-tms .gx-status.danger {
    color: #ef4444;
}

/* ══════════════════════════════════════════════
   02. TORRE DE CONTROLE / KPIs
══════════════════════════════════════════════ */
.gx-tms .gx-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}
.gx-tms .gx-kpi {
    padding: 22px;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #ffffff;
}
.gx-tms .gx-kpi small {
    display: block;
    margin-bottom: 8px;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.3px;
}
.gx-tms .gx-kpi strong {
    display: block;
    margin-bottom: 4px;
    color: #0f172a;
    font-size: 24px;
    font-weight: 800;
}
.gx-tms .gx-kpi span {
    color: #64748b;
    font-size: 11px;
}
.gx-tms .gx-kpi .up,
.gx-tms .gx-kpi .down {
    color: #16a34a;
    font-weight: 700;
}

/* ══════════════════════════════════════════════
   03. TRANSPORTADORAS (tabela)
══════════════════════════════════════════════ */
.gx-tms .gx-table {
    overflow: hidden;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #ffffff;
}
.gx-tms .gx-table-row {
    display: grid;
    grid-template-columns: 2fr repeat(4, 1fr);
    align-items: center;
    padding: 16px 20px;
    border-top: 1px solid #f1f5f9;
    color: #334155;
    font-size: 12px;
}
.gx-tms .gx-table-row:first-child {
    border-top: 0;
}
.gx-tms .gx-table-head {
    background: #f8fafc;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 800;
}
.gx-tms .gx-carrier {
    display: flex;
    align-items: center;
    gap: 10px;
}
.gx-tms .gx-carrier strong {
    color: #0f172a;
}
.gx-tms .gx-carrier-icon {
    width: 34px;
    height: 34px;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    border-radius: 9px;
    background: rgba(0, 160, 227, 0.1);
    color: #00a0e3;
    font-size: 11px;
    font-weight: 800;
}

/* ══════════════════════════════════════════════
   04. COTAÇÃO
══════════════════════════════════════════════ */
.gx-tms .gx-quote {
    padding: 26px;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-tms .gx-quote-head {
    display: flex;
    justify-content: space-between;
    padding-bottom: 18px;
    margin-bottom: 18px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-tms .gx-quote-head small {
    display: block;
    margin-bottom: 4px;
    color: #00a0e3;
    font-size: 9px;
    font-weight: 800;
}
.gx-tms .gx-quote-head strong {
    color: #0f172a;
    font-size: 15px;
}
.gx-tms .gx-quote-route {
    color: #64748b;
    font-size: 11px;
}
.gx-tms .gx-quote-option {
    display: grid;
    grid-template-columns: 1.7fr 1fr 1fr 1fr;
    gap: 10px;
    align-items: center;
    padding: 14px 12px;
    margin-bottom: 8px;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    font-size: 11px;
}
.gx-tms .gx-quote-option.selected {
    border-color: rgba(0, 160, 227, 0.3);
    background: #e0f2fe;
}
.gx-tms .gx-quote-option small {
    display: block;
    color: #94a3b8;
    font-size: 8.5px;
}
.gx-tms .gx-quote-option strong {
    color: #0f172a;
    font-size: 12px;
}
.gx-tms .gx-selected {
    color: #0284c7;
    font-size: 9px;
    font-weight: 800;
}

/* ══════════════════════════════════════════════
   FLUXOS (motor de frete / ERP / comunicação / atendimento)
══════════════════════════════════════════════ */
.gx-tms .gx-flow {
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
}
.gx-tms .gx-flow-node {
    display: inline-block;
    min-width: 280px;
    padding: 16px 22px;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
    color: #0f172a;
    font-size: 13px;
    font-weight: 700;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}
.gx-tms .gx-flow-node.primary {
    border-color: rgba(0, 160, 227, 0.3);
    background: #e0f2fe;
    color: #0284c7;
}
.gx-tms .gx-flow-node.success {
    border-color: #bbf7d0;
    background: #dcfce7;
    color: #16a34a;
}
.gx-tms .gx-flow-arrow {
    display: block;
    padding: 8px;
    color: #cbd5e1;
}
.gx-tms .gx-flow-split {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-top: 8px;
}
.gx-tms .gx-flow-split .gx-flow-node {
    min-width: 0;
    width: 100%;
}

/* ══════════════════════════════════════════════
   07. EXPEDIÇÃO
══════════════════════════════════════════════ */
.gx-tms .gx-expedition {
    padding: 26px;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-tms .gx-expedition-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 18px;
    margin-bottom: 18px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-tms .gx-expedition-head small {
    display: block;
    margin-bottom: 4px;
    color: #94a3b8;
    font-size: 9px;
    font-weight: 800;
}
.gx-tms .gx-expedition-head strong {
    color: #0f172a;
    font-size: 16px;
}
.gx-tms .gx-expedition-status {
    padding: 6px 12px;
    border-radius: 100px;
    background: #fef3c7;
    color: #f59e0b;
    font-size: 9px;
    font-weight: 800;
}
.gx-tms .gx-data-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}
.gx-tms .gx-data {
    padding: 12px;
    border-radius: 10px;
    background: #f8fafc;
}
.gx-tms .gx-data small {
    display: block;
    margin-bottom: 5px;
    color: #94a3b8;
    font-size: 8px;
}
.gx-tms .gx-data strong {
    color: #0f172a;
    font-size: 11px;
}
.gx-tms .gx-process {
    display: grid;
    gap: 12px;
    margin-top: 20px;
}
.gx-tms .gx-process-item {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #334155;
    font-size: 12px;
}
.gx-tms .gx-process-icon {
    width: 23px;
    height: 23px;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #dcfce7;
    color: #16a34a;
    font-size: 9px;
    font-weight: 800;
}
.gx-tms .gx-process-icon.pending {
    background: #fef3c7;
    color: #f59e0b;
}

/* ══════════════════════════════════════════════
   08. TRACKING
══════════════════════════════════════════════ */
.gx-tms .gx-tracking {
    padding: 28px;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-tms .gx-tracking-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding-bottom: 18px;
    margin-bottom: 20px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-tms .gx-tracking-head small {
    display: block;
    margin-bottom: 4px;
    color: #00a0e3;
    font-size: 9px;
    font-weight: 800;
}
.gx-tms .gx-tracking-head strong {
    color: #0f172a;
    font-size: 17px;
}
.gx-tms .gx-eta {
    text-align: right;
}
.gx-tms .gx-eta small {
    color: #94a3b8;
}
.gx-tms .gx-eta strong {
    display: block;
    color: #0f172a;
}
.gx-tms .gx-timeline {
    position: relative;
}
.gx-tms .gx-track {
    position: relative;
    display: grid;
    grid-template-columns: 30px 1fr;
    gap: 12px;
    padding-bottom: 20px;
}
.gx-tms .gx-track:not(:last-child)::before {
    content: "";
    position: absolute;
    left: 12px;
    top: 24px;
    bottom: 0;
    width: 1px;
    background: #e2e8f0;
}
.gx-tms .gx-track-dot {
    width: 25px;
    height: 25px;
    z-index: 2;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #dcfce7;
    color: #16a34a;
    font-size: 9px;
    font-weight: 800;
}
.gx-tms .gx-track.current .gx-track-dot {
    background: #00a0e3;
    color: #ffffff;
}
.gx-tms .gx-track.pending .gx-track-dot {
    background: #f1f5f9;
    color: #94a3b8;
}
.gx-tms .gx-track strong {
    display: block;
    margin-bottom: 3px;
    color: #0f172a;
    font-size: 12px;
}
.gx-tms .gx-track small {
    color: #94a3b8;
    font-size: 10px;
}

/* ══════════════════════════════════════════════
   10. EXCEPTION CENTER
══════════════════════════════════════════════ */
.gx-tms .gx-exception {
    overflow: hidden;
    border: 1px solid #1e293b;
    border-radius: 18px;
    background: #111827;
}
.gx-tms .gx-exception-head {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    border-bottom: 1px solid #1e293b;
}
.gx-tms .gx-exception-kpi {
    padding: 20px;
    text-align: center;
    border-right: 1px solid #1e293b;
}
.gx-tms .gx-exception-kpi:last-child {
    border-right: 0;
}
.gx-tms .gx-exception-kpi small {
    display: block;
    margin-bottom: 6px;
    color: #64748b;
    font-size: 9px;
    font-weight: 800;
}
.gx-tms .gx-exception-kpi strong {
    color: #ffffff;
    font-size: 22px;
}
.gx-tms .gx-exception-kpi.red strong {
    color: #f87171;
}
.gx-tms .gx-exception-kpi.orange strong {
    color: #fbbf24;
}
.gx-tms .gx-exception-list {
    padding: 12px 20px;
}
.gx-tms .gx-exception-item {
    display: grid;
    grid-template-columns: 25px 1fr auto;
    gap: 10px;
    align-items: center;
    padding: 14px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}
.gx-tms .gx-exception-item:last-child {
    border-bottom: 0;
}
.gx-tms .gx-exception-icon {
    font-size: 12px;
}
.gx-tms .gx-exception-item strong {
    display: block;
    margin-bottom: 3px;
    color: #ffffff;
    font-size: 11px;
}
.gx-tms .gx-exception-item small {
    color: #64748b;
    font-size: 9px;
}
.gx-tms .gx-exception-item span {
    color: #38bdf8;
    font-size: 9px;
    font-weight: 800;
}

/* ══════════════════════════════════════════════
   11. AUDITORIA DE FRETE
══════════════════════════════════════════════ */
.gx-tms .gx-audit {
    padding: 26px;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-tms .gx-audit > small {
    display: block;
    margin-bottom: 6px;
    color: #00a0e3;
    font-size: 9px;
    font-weight: 800;
}
.gx-tms .gx-audit h3 {
    margin: 0 0 20px;
    color: #0f172a;
    font-size: 19px;
}
.gx-tms .gx-audit-values {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
.gx-tms .gx-audit-value {
    padding: 16px;
    border-radius: 10px;
    background: #f8fafc;
}
.gx-tms .gx-audit-value small {
    display: block;
    margin-bottom: 5px;
    color: #94a3b8;
    font-size: 8.5px;
}
.gx-tms .gx-audit-value strong {
    color: #0f172a;
    font-size: 16px;
}
.gx-tms .gx-audit-diff {
    padding: 16px;
    margin-top: 12px;
    border-radius: 10px;
    background: rgba(239, 68, 68, 0.08);
}
.gx-tms .gx-audit-diff small {
    display: block;
    margin-bottom: 5px;
    color: #ef4444;
    font-size: 9px;
    font-weight: 800;
}
.gx-tms .gx-audit-diff strong {
    display: block;
    color: #ef4444;
    font-size: 20px;
}
.gx-tms .gx-audit-diff span {
    color: #b91c1c;
    font-size: 10px;
}

/* ══════════════════════════════════════════════
   13. NEWTON
══════════════════════════════════════════════ */
.gx-tms .gx-newton {
    overflow: hidden;
    border: 1px solid #1e293b;
    border-radius: 18px;
    background: #111827;
}
.gx-tms .gx-newton-head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 18px 20px;
    border-bottom: 1px solid #1e293b;
}
.gx-tms .gx-newton-logo {
    width: 38px;
    height: 38px;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    border-radius: 11px;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #ffffff;
    font-weight: 900;
}
.gx-tms .gx-newton-head strong {
    display: block;
    color: #ffffff;
    font-size: 12.5px;
}
.gx-tms .gx-newton-head small {
    color: #64748b;
    font-size: 9px;
}
.gx-tms .gx-newton-body {
    padding: 24px;
}
.gx-tms .gx-newton-body > p {
    margin: 0 0 20px;
    color: #cbd5e1;
    font-size: 13.5px;
    line-height: 1.65;
}
.gx-tms .gx-newton-body > p strong {
    color: #ffffff;
}
.gx-tms .gx-newton-kpis {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-bottom: 16px;
}
.gx-tms .gx-newton-kpi {
    padding: 14px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.05);
}
.gx-tms .gx-newton-kpi small {
    display: block;
    margin-bottom: 5px;
    color: #64748b;
    font-size: 8.5px;
    font-weight: 800;
}
.gx-tms .gx-newton-kpi strong {
    color: #ffffff;
    font-size: 13px;
}
.gx-tms .gx-newton-alert {
    padding: 16px;
    border: 1px solid rgba(0, 160, 227, 0.25);
    border-radius: 10px;
    background: rgba(0, 160, 227, 0.1);
    color: #cbd5e1;
    font-size: 12.5px;
    line-height: 1.6;
}
.gx-tms .gx-newton-alert strong {
    color: #38bdf8;
}

/* ══════════════════════════════════════════════
   14. RISCO DE ATRASO
══════════════════════════════════════════════ */
.gx-tms .gx-risk {
    padding: 26px;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-tms .gx-risk-head {
    display: flex;
    justify-content: space-between;
    padding-bottom: 18px;
    margin-bottom: 18px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-tms .gx-risk-head small {
    display: block;
    margin-bottom: 4px;
    color: #94a3b8;
    font-size: 9px;
}
.gx-tms .gx-risk-head strong {
    color: #0f172a;
    font-size: 15px;
}
.gx-tms .gx-risk-score {
    text-align: right;
}
.gx-tms .gx-risk-score strong {
    display: block;
    color: #ef4444;
    font-size: 25px;
}
.gx-tms .gx-risk-score span {
    color: #ef4444;
    font-size: 9px;
    font-weight: 800;
}
.gx-tms .gx-risk-dates {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
.gx-tms .gx-risk-date {
    padding: 14px;
    border-radius: 10px;
    background: #f8fafc;
}
.gx-tms .gx-risk-date small {
    display: block;
    margin-bottom: 5px;
    color: #94a3b8;
    font-size: 8.5px;
}
.gx-tms .gx-risk-date strong {
    color: #0f172a;
    font-size: 12.5px;
}
.gx-tms .gx-signals {
    display: grid;
    gap: 10px;
    margin-top: 18px;
}
.gx-tms .gx-signal {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #64748b;
    font-size: 11px;
}
.gx-tms .gx-signal i {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: rgba(239, 68, 68, 0.1);
    color: #ef4444;
    font-size: 8px;
    font-style: normal;
}

/* ══════════════════════════════════════════════
   12. LOGÍSTICA REVERSA
══════════════════════════════════════════════ */
.gx-tms .gx-reverse {
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}
.gx-tms .gx-reverse-node {
    min-width: 120px;
    padding: 18px 12px;
    text-align: center;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}
.gx-tms .gx-reverse-node small {
    display: block;
    margin-bottom: 5px;
    color: #94a3b8;
    font-size: 8.5px;
    font-weight: 700;
}
.gx-tms .gx-reverse-node strong {
    color: #0f172a;
    font-size: 11px;
}
.gx-tms .gx-reverse-arrow {
    color: #cbd5e1;
}

/* ══════════════════════════════════════════════
   16. ECOSSISTEMA
══════════════════════════════════════════════ */
.gx-tms .gx-ecosystem {
    max-width: 950px;
    margin: 0 auto;
}
.gx-tms .gx-eco-row {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 14px;
}
.gx-tms .gx-eco-node {
    min-width: 145px;
    padding: 18px 14px;
    text-align: center;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #ffffff;
}
.gx-tms .gx-eco-node small {
    display: block;
    margin-bottom: 6px;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.3px;
}
.gx-tms .gx-eco-node strong {
    color: #0f172a;
    font-size: 14px;
}
.gx-tms .gx-eco-core {
    max-width: 400px;
    margin: 24px auto;
    padding: 22px;
    text-align: center;
    border-radius: 16px;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #ffffff;
}
.gx-tms .gx-eco-core small {
    display: block;
    margin-bottom: 8px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
    opacity: 0.85;
}
.gx-tms .gx-eco-core strong {
    font-size: 19px;
    font-weight: 800;
}
.gx-tms .gx-eco-line {
    width: 1px;
    height: 30px;
    margin: auto;
    background: #cbd5e1;
}

/* ══════════════════════════════════════════════
   17. CTA
══════════════════════════════════════════════ */
.gx-tms .gx-cta {
    padding: 120px 0;
    text-align: center;
    color: #ffffff;
    position: relative;
    overflow: hidden;
    background: #0b0f19;
}
.gx-tms .gx-cta::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 600px;
    height: 400px;
    background: radial-gradient(circle, rgba(0, 160, 227, 0.15) 0%, rgba(11, 15, 25, 0) 70%);
}
.gx-tms .gx-cta .gx-container {
    position: relative;
    z-index: 1;
    max-width: 800px;
}
.gx-tms .gx-cta h2 {
    max-width: 850px;
    margin: 18px auto 20px;
    color: #ffffff;
    font-size: 42px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
}
.gx-tms .gx-cta h2 span {
    display: block;
    color: #94a3b8;
    font-size: 22px;
    font-weight: 500;
    margin-top: 12px;
}
.gx-tms .gx-cta p {
    max-width: 640px;
    margin: 0 auto;
    color: #94a3b8;
    font-size: 17px;
    line-height: 1.7;
}
.gx-tms .gx-cta .gx-btns {
    justify-content: center;
}
.gx-tms .gx-cta .gx-tags {
    justify-content: center;
}

/* ══════════════════════════════════════════════
   RESPONSIVO
══════════════════════════════════════════════ */
@media (max-width: 1000px) {
    .gx-tms .gx-grid-2,
    .gx-tms .gx-hero .gx-grid-2 {
        grid-template-columns: 1fr;
    }
    .gx-tms .gx-kpis,
    .gx-tms .gx-control-kpis {
        grid-template-columns: repeat(2, 1fr);
    }
    .gx-tms .gx-table-row {
        grid-template-columns: 2fr repeat(3, 1fr);
    }
    .gx-tms .gx-table-row > *:last-child {
        display: none;
    }
}
@media (max-width: 768px) {
    .gx-tms .gx-section,
    .gx-tms .gx-hero,
    .gx-tms .gx-cta {
        padding: 64px 0;
    }
    .gx-tms .gx-copy h1 {
        font-size: 32px;
    }
    .gx-tms .gx-copy h2,
    .gx-tms .gx-heading h2 {
        font-size: 28px;
    }
    .gx-tms .gx-control-kpis,
    .gx-tms .gx-kpis {
        grid-template-columns: 1fr 1fr;
    }
    .gx-tms .gx-shipment-head {
        display: none;
    }
    .gx-tms .gx-shipment {
        grid-template-columns: 1fr 1fr;
    }
    .gx-tms .gx-table-head {
        display: none;
    }
    .gx-tms .gx-table-row {
        grid-template-columns: 1fr 1fr;
        gap: 12px;
    }
    .gx-tms .gx-quote-option {
        grid-template-columns: 1fr 1fr;
    }
    .gx-tms .gx-flow-split {
        grid-template-columns: 1fr;
    }
    .gx-tms .gx-data-grid {
        grid-template-columns: 1fr 1fr;
    }
    .gx-tms .gx-newton-kpis {
        grid-template-columns: 1fr;
    }
    .gx-tms .gx-cta h2 {
        font-size: 28px;
    }
}

/* ══════════════════════════════════════════════════════════════
   NEWTON — INTELIGÊNCIA ARTIFICIAL GALACTIX — padrão visual do b2c.html
   (conteúdo original da página preservado; aqui só entra o estilo)
   Variável --green mantida porque o conteúdo usa var(--green)
   em um estilo inline (variação de vendas Newton + Dados).
══════════════════════════════════════════════════════════════ */
.newton-page {
    --green: #16a34a;
    display: block;
    overflow: hidden;
    background: #ffffff;
    color: #334155;
    font-family: Inter, Arial, sans-serif;
}
.newton-page * {
    box-sizing: border-box;
}
.newton-page a {
    color: inherit;
}
.newton-page button {
    font-family: inherit;
    cursor: pointer;
}
.newton-page .container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* ---------- Cabeçalho interno (conflita com o header fixo do site) ---------- */
.newton-page .heading {
    position: static !important;
    top: auto !important;
    left: auto !important;
    z-index: auto !important;
    width: auto !important;
    display: block !important;
    flex-direction: row !important;
    border-bottom: none !important;
}

/* ---------- Seções ---------- */
.newton-page .section {
    padding: 100px 0;
    background: #ffffff;
}
.newton-page .light {
    background: #f8fafc;
}
.newton-page .dark {
    color: #ffffff;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}

/* ---------- Tipografia comum ---------- */
.newton-page .eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #e0f2fe;
    color: #0284c7;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    padding: 6px 16px;
    border-radius: 100px;
    margin-bottom: 20px;
    border: 1px solid rgba(56, 189, 248, 0.4);
}
.newton-page .eyebrow-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #0284c7;
    box-shadow: 0 0 10px rgba(2, 132, 199, 0.6);
}
.newton-page .dark .eyebrow {
    background: rgba(56, 189, 248, 0.1);
    color: #38bdf8;
    border: 1px solid rgba(56, 189, 248, 0.3);
}
.newton-page .dark .eyebrow-dot {
    background: #38bdf8;
    box-shadow: 0 0 10px rgba(56, 189, 248, 0.6);
}

.newton-page .copy h1,
.newton-page .copy h2,
.newton-page .heading h2 {
    margin: 0 0 18px;
    color: #0f172a;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1px;
}
.newton-page .copy h1 {
    font-size: 46px;
}
.newton-page .copy h2,
.newton-page .heading h2 {
    font-size: 38px;
    line-height: 1.25;
}
.newton-page .copy h1 span,
.newton-page .copy h2 span,
.newton-page .heading h2 span {
    display: block;
    color: #00a0e3;
}
.newton-page .dark .copy h1,
.newton-page .dark .copy h2,
.newton-page .dark .heading h2 {
    color: #ffffff;
}
.newton-page .dark .copy h1 span,
.newton-page .dark .copy h2 span,
.newton-page .dark .heading h2 span {
    color: #38bdf8;
}

.newton-page .copy p,
.newton-page .heading p {
    max-width: 680px;
    margin: 0 0 25px;
    color: #475569;
    font-size: 18px;
    line-height: 1.7;
}
.newton-page .dark .copy p,
.newton-page .dark .heading p {
    color: #94a3b8;
}

.newton-page .heading {
    max-width: 800px;
    margin: 0 auto 60px;
    text-align: center;
}

.newton-page .buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 28px;
}
.newton-page .btn {
    min-height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 28px;
    border-radius: 8px;
    text-decoration: none;
    font-size: 15px;
    font-weight: 700;
    transition: all 0.3s ease;
}
.newton-page .btn:hover {
    transform: translateY(-2px);
}
.newton-page .btn-primary {
    color: #ffffff;
    background: #00a0e3;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
}
.newton-page .btn-primary:hover {
    background: #008cc6;
}
.newton-page .btn-outline {
    color: #0f172a;
    background: #ffffff;
    border: 1px solid #e2e8f0;
}
.newton-page .dark .btn-outline {
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.3);
    background: transparent;
}
.newton-page .dark .btn-outline:hover {
    background: rgba(255, 255, 255, 0.05);
    border-color: #ffffff;
}

.newton-page .tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 28px;
}
.newton-page .tags span {
    padding: 8px 16px;
    color: #334155;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 100px;
    font-size: 12.5px;
    font-weight: 700;
}
.newton-page .dark .tags span {
    color: #38bdf8;
    background: rgba(0, 160, 227, 0.12);
    border-color: rgba(0, 160, 227, 0.3);
}

.newton-page .grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}

/* ══════════════════════════════════════════════
   HERO
══════════════════════════════════════════════ */
.newton-page .hero {
    position: relative;
    min-height: 0;
    padding: 60px 0 100px 0;
    display: flex;
    align-items: center;
    color: #ffffff;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.newton-page .hero::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0.25;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
    background-size: 60px 60px;
}
.newton-page .hero .container {
    position: relative;
    z-index: 2;
}
.newton-page .hero .grid-2 {
    grid-template-columns: 1fr 1fr;
}
.newton-page .hero .copy h1 {
    color: #ffffff;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}
.newton-page .hero .copy h1 span {
    color: #38bdf8;
}
.newton-page .hero .copy > p {
    color: #cbd5e1;
    max-width: 520px;
}
.newton-page .hero-label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 22px;
    padding: 8px 16px;
    color: #7dd3fc;
    border: 1px solid rgba(56, 189, 248, 0.3);
    border-radius: 100px;
    background: rgba(0, 160, 227, 0.1);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
}

/* ══════════════════════════════════════════════
   NEWTON CHAT (mockup)
══════════════════════════════════════════════ */
.newton-page .newton-window {
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 18px;
    background: rgba(17, 24, 39, 0.92);
    box-shadow: 0 30px 60px -15px rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(18px);
}
.newton-page .window-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.newton-page .newton-brand {
    display: flex;
    align-items: center;
    gap: 11px;
}
.newton-page .newton-avatar {
    width: 38px;
    height: 38px;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    color: #ffffff;
    border-radius: 11px;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    box-shadow: 0 8px 25px rgba(0, 160, 227, 0.35);
    font-size: 15px;
    font-weight: 900;
}
.newton-page .newton-brand strong {
    display: block;
    color: #ffffff;
    font-size: 12.5px;
}
.newton-page .newton-brand small {
    color: #64748b;
    font-size: 9px;
}
.newton-page .online {
    color: #10b981;
    font-size: 10px;
    font-weight: 800;
}
.newton-page .window-body {
    padding: 22px;
}
.newton-page .chat-user {
    max-width: 75%;
    margin: 0 0 18px auto;
    padding: 12px 16px;
    color: #e2e8f0;
    background: #1e293b;
    border-radius: 14px 14px 3px 14px;
    font-size: 12px;
    line-height: 1.5;
}
.newton-page .chat-newton {
    max-width: 92%;
    color: #cbd5e1;
    font-size: 12px;
    line-height: 1.65;
}
.newton-page .chat-newton > strong {
    color: #ffffff;
}
.newton-page .chat-result {
    margin-top: 16px;
    padding: 16px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.035);
}
.newton-page .chat-kpi {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    padding-bottom: 14px;
    margin-bottom: 14px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}
.newton-page .chat-kpi small {
    display: block;
    margin-bottom: 5px;
    color: #64748b;
    font-size: 8.5px;
    font-weight: 800;
}
.newton-page .chat-kpi strong {
    color: #ffffff;
    font-size: 20px;
}
.newton-page .chat-kpi span {
    color: #10b981;
    font-size: 10px;
    font-weight: 800;
}
.newton-page .insight-list {
    display: grid;
    gap: 8px;
}
.newton-page .insight {
    display: grid;
    grid-template-columns: 24px 1fr auto;
    gap: 9px;
    align-items: center;
    padding: 9px;
    border-radius: 9px;
    background: rgba(255, 255, 255, 0.025);
}
.newton-page .insight-number {
    width: 23px;
    height: 23px;
    display: grid;
    place-items: center;
    color: #38bdf8;
    background: rgba(0, 160, 227, 0.15);
    border-radius: 7px;
    font-size: 8.5px;
    font-weight: 900;
}
.newton-page .insight strong {
    display: block;
    color: #e2e8f0;
    font-size: 10px;
}
.newton-page .insight small {
    color: #64748b;
    font-size: 8.5px;
}
.newton-page .insight-value {
    color: #38bdf8;
    font-size: 9px;
    font-weight: 900;
}
.newton-page .chat-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 15px;
}
.newton-page .chat-action {
    padding: 8px 12px;
    color: #38bdf8;
    border: 1px solid rgba(0, 160, 227, 0.25);
    border-radius: 8px;
    background: rgba(0, 160, 227, 0.08);
    font-size: 9px;
    font-weight: 800;
}

/* ══════════════════════════════════════════════
   ENTENDE / ANALISA / RECOMENDA / EXECUTA
══════════════════════════════════════════════ */
.newton-page .intelligence-flow {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
.newton-page .intelligence-card {
    position: relative;
    padding: 28px 22px;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #ffffff;
    transition: all 0.3s ease;
}
.newton-page .intelligence-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.06);
    border-color: #00a0e3;
}
.newton-page .intelligence-card::after {
    content: "→";
    position: absolute;
    top: 50%;
    right: -13px;
    z-index: 2;
    width: 25px;
    height: 25px;
    display: grid;
    place-items: center;
    color: #94a3b8;
    background: #f8fafc;
    font-size: 13px;
}
.newton-page .intelligence-card:last-child::after {
    display: none;
}
.newton-page .intelligence-number {
    display: block;
    margin-bottom: 24px;
    color: #00a0e3;
    font-size: 11px;
    font-weight: 900;
}
.newton-page .intelligence-card h3 {
    margin: 0 0 8px;
    color: #0f172a;
    font-size: 19px;
    letter-spacing: -0.3px;
}
.newton-page .intelligence-card p {
    margin: 0;
    color: #64748b;
    font-size: 13px;
    line-height: 1.6;
}

/* ══════════════════════════════════════════════
   AGENTES
══════════════════════════════════════════════ */
.newton-page .orchestrator {
    max-width: 800px;
    margin: 0 auto 32px;
    padding: 22px;
    text-align: center;
    border: 1px solid rgba(0, 160, 227, 0.3);
    border-radius: 16px;
    background: rgba(0, 160, 227, 0.1);
}
.newton-page .orchestrator small {
    display: block;
    margin-bottom: 6px;
    color: #38bdf8;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1px;
}
.newton-page .orchestrator strong {
    color: #ffffff;
    font-size: 19px;
}
.newton-page .agent-line {
    width: 1px;
    height: 36px;
    margin: 0 auto 32px auto;
    background: linear-gradient(#00a0e3, rgba(0, 160, 227, 0.1));
}
.newton-page .agents {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}
.newton-page .agent-card {
    padding: 24px;
    border: 1px solid #1e293b;
    border-radius: 16px;
    background: #111827;
    transition: all 0.3s ease;
}
.newton-page .agent-card:hover {
    transform: translateY(-4px);
    border-color: rgba(0, 160, 227, 0.4);
}
.newton-page .agent-icon {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    margin-bottom: 18px;
    color: #38bdf8;
    border-radius: 11px;
    background: rgba(0, 160, 227, 0.12);
    font-size: 11px;
    font-weight: 900;
}
.newton-page .agent-card h3 {
    margin: 0 0 8px;
    color: #ffffff;
    font-size: 15.5px;
}
.newton-page .agent-card p {
    margin: 0;
    color: #94a3b8;
    font-size: 12px;
    line-height: 1.6;
}

/* ══════════════════════════════════════════════
   DEMO (Comercial / Atendimento / Dados)
══════════════════════════════════════════════ */
.newton-page .demo {
    overflow: hidden;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.newton-page .demo-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    border-bottom: 1px solid #f1f5f9;
}
.newton-page .demo-head-left {
    display: flex;
    align-items: center;
    gap: 10px;
}
.newton-page .demo-avatar {
    width: 34px;
    height: 34px;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    color: #ffffff;
    border-radius: 10px;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    font-size: 11px;
    font-weight: 900;
}
.newton-page .demo-head strong {
    display: block;
    color: #0f172a;
    font-size: 12px;
}
.newton-page .demo-head small {
    color: #94a3b8;
    font-size: 9px;
}
.newton-page .demo-body {
    padding: 22px;
}
.newton-page .demo-question {
    max-width: 80%;
    margin: 0 0 18px auto;
    padding: 12px 16px;
    color: #ffffff;
    background: #00a0e3;
    border-radius: 14px 14px 3px 14px;
    font-size: 11.5px;
    line-height: 1.5;
}
.newton-page .demo-answer {
    color: #64748b;
    font-size: 12.5px;
    line-height: 1.65;
}
.newton-page .demo-answer strong {
    color: #0f172a;
}
.newton-page .demo-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-top: 16px;
}
.newton-page .demo-stat {
    padding: 12px;
    border-radius: 10px;
    background: #f8fafc;
}
.newton-page .demo-stat small {
    display: block;
    margin-bottom: 5px;
    color: #94a3b8;
    font-size: 8.5px;
    font-weight: 700;
}
.newton-page .demo-stat strong {
    color: #0f172a;
    font-size: 14px;
}
.newton-page .demo-stat.alert strong {
    color: #ef4444;
}
.newton-page .demo-action {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 15px;
    padding: 13px 16px;
    color: #0284c7;
    border: 1px solid rgba(0, 160, 227, 0.25);
    border-radius: 10px;
    background: #e0f2fe;
    font-size: 11px;
    font-weight: 800;
}

/* ══════════════════════════════════════════════
   COMMAND FLOW
══════════════════════════════════════════════ */
.newton-page .command-flow {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    max-width: 700px;
    margin: 0 auto;
}
.newton-page .command {
    width: 100%;
    padding: 16px 22px;
    text-align: center;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}
.newton-page .command.primary {
    color: #ffffff;
    border-color: #00a0e3;
    background: #00a0e3;
}
.newton-page .command.success {
    color: #16a34a;
    border-color: #bbf7d0;
    background: #dcfce7;
}
.newton-page .command small {
    display: block;
    margin-bottom: 5px;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.5px;
}
.newton-page .command.primary small {
    color: #d0eefc;
}
.newton-page .command strong {
    color: #0f172a;
    font-size: 13px;
}
.newton-page .command.primary strong,
.newton-page .command.success strong {
    color: inherit;
}
.newton-page .command-arrow {
    height: 24px;
    display: grid;
    place-items: center;
    color: #cbd5e1;
}

/* ══════════════════════════════════════════════
   VOZ
══════════════════════════════════════════════ */
.newton-page .voice-card {
    position: relative;
    padding: 36px;
    overflow: hidden;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.newton-page .voice-orb {
    width: 72px;
    height: 72px;
    display: grid;
    place-items: center;
    margin: 0 auto 22px;
    color: #ffffff;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    box-shadow:
        0 0 0 12px rgba(0, 160, 227, 0.08),
        0 0 0 25px rgba(0, 160, 227, 0.04);
    font-size: 24px;
}
.newton-page .voice-text {
    max-width: 470px;
    margin: 0 auto;
    text-align: center;
}
.newton-page .voice-text small {
    display: block;
    margin-bottom: 10px;
    color: #00a0e3;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.5px;
}
.newton-page .voice-text strong {
    display: block;
    color: #0f172a;
    font-size: 16px;
    line-height: 1.6;
}
.newton-page .voice-result {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-top: 28px;
}
.newton-page .voice-step {
    padding: 12px;
    text-align: center;
    border-radius: 10px;
    background: #f8fafc;
}
.newton-page .voice-step small {
    display: block;
    margin-bottom: 4px;
    color: #94a3b8;
    font-size: 8.5px;
}
.newton-page .voice-step strong {
    color: #0f172a;
    font-size: 11px;
}

/* ══════════════════════════════════════════════
   DAILY BRIEF (SFA)
══════════════════════════════════════════════ */
.newton-page .daily {
    overflow: hidden;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.newton-page .daily-head {
    padding: 20px;
    color: #ffffff;
    background: #111827;
}
.newton-page .daily-head small {
    display: block;
    margin-bottom: 5px;
    color: #64748b;
    font-size: 9px;
}
.newton-page .daily-head strong {
    font-size: 17px;
}
.newton-page .daily-body {
    padding: 20px;
}
.newton-page .daily-kpis {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
.newton-page .daily-kpi {
    padding: 14px;
    border-radius: 10px;
    background: #f8fafc;
}
.newton-page .daily-kpi small {
    display: block;
    margin-bottom: 5px;
    color: #94a3b8;
    font-size: 8.5px;
}
.newton-page .daily-kpi strong {
    color: #0f172a;
    font-size: 14px;
}
.newton-page .daily-alert {
    margin-top: 12px;
    padding: 16px;
    border-radius: 10px;
    background: #fef3c7;
}
.newton-page .daily-alert small {
    display: block;
    margin-bottom: 7px;
    color: #f59e0b;
    font-size: 9px;
    font-weight: 800;
}
.newton-page .daily-alert strong {
    display: block;
    margin-bottom: 5px;
    color: #0f172a;
    font-size: 12.5px;
}
.newton-page .daily-alert p {
    margin: 0;
    color: #92620a;
    font-size: 11px;
    line-height: 1.55;
}

/* ══════════════════════════════════════════════
   VISITA (SFA)
══════════════════════════════════════════════ */
.newton-page .visit {
    padding: 24px;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.newton-page .visit-head {
    display: flex;
    justify-content: space-between;
    padding-bottom: 16px;
    margin-bottom: 16px;
    border-bottom: 1px solid #f1f5f9;
}
.newton-page .visit-head small {
    display: block;
    margin-bottom: 4px;
    color: #00a0e3;
    font-size: 9px;
    font-weight: 800;
}
.newton-page .visit-head strong {
    color: #0f172a;
    font-size: 15px;
}
.newton-page .visit-time {
    text-align: right;
}
.newton-page .visit-time small {
    color: #94a3b8;
}
.newton-page .visit-data {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}
.newton-page .visit-data div {
    padding: 12px;
    border-radius: 9px;
    background: #f8fafc;
}
.newton-page .visit-data small {
    display: block;
    margin-bottom: 4px;
    color: #94a3b8;
    font-size: 8.5px;
}
.newton-page .visit-data strong {
    color: #0f172a;
    font-size: 12px;
}
.newton-page .opportunity {
    margin-top: 12px;
    padding: 15px;
    border: 1px solid rgba(0, 160, 227, 0.25);
    border-radius: 10px;
    background: #e0f2fe;
}
.newton-page .opportunity small {
    display: block;
    margin-bottom: 5px;
    color: #0284c7;
    font-size: 9px;
    font-weight: 800;
}
.newton-page .opportunity strong {
    display: block;
    margin-bottom: 5px;
    color: #0f172a;
    font-size: 12.5px;
}
.newton-page .opportunity p {
    margin: 0;
    color: #0c5a8a;
    font-size: 10.5px;
    line-height: 1.5;
}

/* ══════════════════════════════════════════════
   INSIGHTS PROATIVOS
══════════════════════════════════════════════ */
.newton-page .proactive {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}
.newton-page .proactive-card {
    padding: 24px;
    border: 1px solid #1e293b;
    border-radius: 16px;
    background: #111827;
}
.newton-page .proactive-type {
    display: inline-flex;
    margin-bottom: 18px;
    padding: 6px 10px;
    color: #38bdf8;
    border-radius: 7px;
    background: rgba(0, 160, 227, 0.12);
    font-size: 10px;
    font-weight: 800;
}
.newton-page .proactive-card h3 {
    margin: 0 0 9px;
    color: #ffffff;
    font-size: 17px;
}
.newton-page .proactive-card p {
    margin: 0 0 20px;
    color: #94a3b8;
    font-size: 12.5px;
    line-height: 1.6;
}
.newton-page .proactive-value {
    padding-top: 16px;
    border-top: 1px solid rgba(255, 255, 255, 0.07);
}
.newton-page .proactive-value small {
    display: block;
    margin-bottom: 5px;
    color: #64748b;
    font-size: 9px;
}
.newton-page .proactive-value strong {
    color: #ffffff;
    font-size: 20px;
}
.newton-page .proactive-value span {
    margin-left: 8px;
    color: #10b981;
    font-size: 10px;
}

/* ══════════════════════════════════════════════
   AUTOMAÇÕES
══════════════════════════════════════════════ */
.newton-page .automation {
    max-width: 820px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}
.newton-page .automation-node {
    width: 100%;
    max-width: 500px;
    padding: 16px 20px;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
    text-align: center;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}
.newton-page .automation-node small {
    display: block;
    margin-bottom: 5px;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.5px;
}
.newton-page .automation-node strong {
    color: #0f172a;
    font-size: 13px;
}
.newton-page .automation-node.newton {
    color: #ffffff;
    border-color: #00a0e3;
    background: #00a0e3;
}
.newton-page .automation-node.newton small {
    color: #d0eefc;
}
.newton-page .automation-node.newton strong {
    color: #ffffff;
}
.newton-page .automation-node.action {
    color: #16a34a;
    border-color: #bbf7d0;
    background: #dcfce7;
}
.newton-page .automation-node.action strong {
    color: #16a34a;
}
.newton-page .automation-arrow {
    height: 24px;
    display: grid;
    place-items: center;
    color: #cbd5e1;
}

/* ══════════════════════════════════════════════
   GOVERNANÇA
══════════════════════════════════════════════ */
.newton-page .governance {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}
.newton-page .permission {
    overflow: hidden;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #ffffff;
}
.newton-page .permission-head {
    padding: 18px 20px;
    border-bottom: 1px solid #f1f5f9;
}
.newton-page .permission-head small {
    display: block;
    margin-bottom: 4px;
    color: #00a0e3;
    font-size: 10px;
    font-weight: 800;
}
.newton-page .permission-head strong {
    color: #0f172a;
    font-size: 15px;
}
.newton-page .permission-body {
    padding: 14px 20px;
}
.newton-page .permission-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    color: #334155;
    font-size: 12.5px;
}
.newton-page .permission-icon {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #dcfce7;
    color: #16a34a;
    font-size: 9px;
    font-weight: 900;
}
.newton-page .permission-icon.no {
    color: #ef4444;
    background: rgba(239, 68, 68, 0.1);
}

/* ══════════════════════════════════════════════
   ECOSSISTEMA
══════════════════════════════════════════════ */
.newton-page .ecosystem {
    max-width: 1000px;
    margin: 0 auto;
}
.newton-page .eco-row {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
}
.newton-page .eco-node {
    min-width: 145px;
    padding: 17px 14px;
    text-align: center;
    color: #cbd5e1;
    border: 1px solid #1e293b;
    border-radius: 12px;
    background: #111827;
}
.newton-page .eco-node small {
    display: block;
    margin-bottom: 6px;
    color: #64748b;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.3px;
}
.newton-page .eco-node strong {
    color: #ffffff;
    font-size: 13.5px;
}
.newton-page .eco-line {
    width: 1px;
    height: 32px;
    margin: 0 auto;
    background: rgba(0, 160, 227, 0.4);
}
.newton-page .eco-newton {
    max-width: 420px;
    margin: 0 auto;
    padding: 26px;
    text-align: center;
    color: #ffffff;
    border: 1px solid rgba(0, 160, 227, 0.3);
    border-radius: 18px;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    box-shadow: 0 20px 60px rgba(0, 160, 227, 0.2);
}
.newton-page .eco-newton small {
    display: block;
    margin-bottom: 8px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 1px;
    opacity: 0.85;
}
.newton-page .eco-newton strong {
    display: block;
    font-size: 21px;
    font-weight: 800;
}

/* ══════════════════════════════════════════════
   CTA FINAL
══════════════════════════════════════════════ */
.newton-page .cta {
    position: relative;
    padding: 120px 0;
    text-align: center;
    color: #ffffff;
    overflow: hidden;
    background: #0b0f19;
}
.newton-page .cta::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 600px;
    height: 400px;
    background: radial-gradient(circle, rgba(0, 160, 227, 0.15) 0%, rgba(11, 15, 25, 0) 70%);
}
.newton-page .cta .container {
    position: relative;
    z-index: 1;
    max-width: 800px;
}
.newton-page .cta h2 {
    max-width: 850px;
    margin: 18px auto 20px;
    color: #ffffff;
    font-size: 42px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
}
.newton-page .cta h2 span {
    display: block;
    color: #38bdf8;
    font-size: 22px;
    font-weight: 500;
    margin-top: 12px;
}
.newton-page .cta p {
    max-width: 640px;
    margin: 0 auto;
    color: #94a3b8;
    font-size: 17px;
    line-height: 1.7;
}
.newton-page .cta .buttons {
    justify-content: center;
}

/* ══════════════════════════════════════════════
   RESPONSIVO
══════════════════════════════════════════════ */
@media (max-width: 1000px) {
    .newton-page .grid-2,
    .newton-page .hero .grid-2 {
        grid-template-columns: 1fr;
    }
    .newton-page .intelligence-flow {
        grid-template-columns: 1fr 1fr;
    }
    .newton-page .intelligence-card:nth-child(2)::after {
        display: none;
    }
    .newton-page .agents {
        grid-template-columns: 1fr 1fr;
    }
    .newton-page .governance {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 768px) {
    .newton-page .section,
    .newton-page .hero,
    .newton-page .cta {
        padding: 64px 0;
    }
    .newton-page .copy h1 {
        font-size: 32px;
    }
    .newton-page .copy h2,
    .newton-page .heading h2 {
        font-size: 28px;
    }
    .newton-page .intelligence-flow,
    .newton-page .agents,
    .newton-page .proactive {
        grid-template-columns: 1fr;
    }
    .newton-page .intelligence-card::after {
        content: "↓";
        top: auto;
        right: auto;
        bottom: -14px;
        left: 50%;
        transform: translateX(-50%);
    }
    .newton-page .intelligence-card:nth-child(2)::after {
        display: grid;
    }
    .newton-page .intelligence-card:last-child::after {
        display: none;
    }
    .newton-page .demo-stats,
    .newton-page .voice-result {
        grid-template-columns: 1fr;
    }
    .newton-page .daily-kpis,
    .newton-page .visit-data {
        grid-template-columns: 1fr;
    }
    .newton-page .chat-user {
        max-width: 90%;
    }
    .newton-page .window-body {
        padding: 16px;
    }
    .newton-page .voice-card {
        padding: 28px 18px;
    }
    .newton-page .cta h2 {
        font-size: 28px;
    }
}

/* ══════════════════════════════════════════════════════════════
   AGENTES DE IA — GALACTIX — padrão visual do b2c.html
   (conteúdo original da página preservado; aqui só entra o estilo)
══════════════════════════════════════════════════════════════ */
.page {
    display: block;
    overflow: hidden;
    background: #ffffff;
    color: #334155;
    font-family: Inter, Arial, sans-serif;
}
.page * {
    box-sizing: border-box;
}
.page a {
    color: inherit;
    text-decoration: none;
}
.page button {
    font-family: inherit;
    cursor: pointer;
}
.page .container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* ---------- Cabeçalho interno (conflita com o header fixo do site) ---------- */
.page .heading {
    position: static !important;
    top: auto !important;
    left: auto !important;
    z-index: auto !important;
    width: auto !important;
    display: block !important;
    flex-direction: row !important;
    border-bottom: none !important;
}

/* ---------- Seções ---------- */
.page .section {
    padding: 100px 0;
    background: #ffffff;
}
.page .light {
    background: #f8fafc;
}
.page .dark {
    color: #ffffff;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}

/* ---------- Tipografia comum ---------- */
.page .eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #e0f2fe;
    color: #0284c7;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    padding: 6px 16px;
    border-radius: 100px;
    margin-bottom: 20px;
    border: 1px solid rgba(56, 189, 248, 0.4);
}
.page .eyebrow-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #0284c7;
    box-shadow: 0 0 10px rgba(2, 132, 199, 0.6);
}
.page .dark .eyebrow {
    background: rgba(56, 189, 248, 0.1);
    color: #38bdf8;
    border: 1px solid rgba(56, 189, 248, 0.3);
}
.page .dark .eyebrow-dot {
    background: #38bdf8;
    box-shadow: 0 0 10px rgba(56, 189, 248, 0.6);
}

.page .copy h1,
.page .copy h2,
.page .heading h2 {
    margin: 0 0 18px;
    color: #0f172a;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1px;
}
.page .copy h1 {
    font-size: 46px;
}
.page .copy h2,
.page .heading h2 {
    font-size: 38px;
    line-height: 1.25;
}
.page .copy h1 span,
.page .copy h2 span,
.page .heading h2 span {
    display: block;
    color: #00a0e3;
}
.page .dark .heading h2,
.page .dark .copy h2 {
    color: #ffffff;
}
.page .dark .heading h2 span,
.page .dark .copy h2 span {
    color: #38bdf8;
}
.page .copy p,
.page .heading p {
    max-width: 700px;
    margin: 0 0 24px;
    color: #475569;
    font-size: 18px;
    line-height: 1.7;
}
.page .dark .heading p,
.page .dark .copy p {
    color: #94a3b8;
}
.page .heading {
    max-width: 800px;
    margin: 0 auto 60px;
    text-align: center;
}

.page .buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 28px;
}
.page .btn {
    min-height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 28px;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 700;
    transition: all 0.3s ease;
}
.page .btn:hover {
    transform: translateY(-2px);
}
.page .btn-primary {
    color: #ffffff;
    background: #00a0e3;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
}
.page .btn-primary:hover {
    background: #008cc6;
}
.page .btn-outline {
    border: 1px solid #e2e8f0;
    background: #ffffff;
    color: #0f172a;
}
.page .dark .btn-outline {
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.3);
    background: transparent;
}
.page .dark .btn-outline:hover {
    background: rgba(255, 255, 255, 0.05);
    border-color: #ffffff;
}

.page .tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 30px;
}
.page .tags span {
    padding: 8px 14px;
    color: #334155;
    border: 1px solid #e2e8f0;
    border-radius: 100px;
    background: #ffffff;
    font-size: 12px;
    font-weight: 700;
}
.page .dark .tags span {
    color: #38bdf8;
    background: rgba(0, 160, 227, 0.12);
    border-color: rgba(0, 160, 227, 0.3);
}

.page .grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}

/* ══════════════════════════════════════════════
   HERO
══════════════════════════════════════════════ */
.page .hero {
    position: relative;
    min-height: 0;
    padding: 60px 0 100px 0;
    display: flex;
    align-items: center;
    color: #ffffff;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.page .hero::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0.25;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
    background-size: 60px 60px;
}
.page .hero .container {
    position: relative;
    z-index: 2;
}
.page .hero .copy h1 {
    color: #ffffff;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}
.page .hero .copy h1 span {
    color: #38bdf8;
}
.page .hero .copy p {
    color: #cbd5e1;
    max-width: 520px;
}
.page .hero-label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 22px;
    padding: 8px 16px;
    color: #7dd3fc;
    border: 1px solid rgba(56, 189, 248, 0.3);
    border-radius: 100px;
    background: rgba(0, 160, 227, 0.1);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
}

/* ---- HERO: REDE DE AGENTES (mockup) ---- */
.page .agent-network {
    padding: 26px;
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 18px;
    background: rgba(17, 24, 39, 0.92);
    box-shadow: 0 30px 60px -15px rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(15px);
}
.page .network-title {
    margin-bottom: 22px;
    color: #64748b;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1px;
}
.page .newton-orchestrator {
    padding: 18px;
    text-align: center;
    border: 1px solid rgba(0, 160, 227, 0.3);
    border-radius: 14px;
    background: rgba(0, 160, 227, 0.1);
}
.page .newton-orchestrator small {
    display: block;
    margin-bottom: 5px;
    color: #38bdf8;
    font-size: 9px;
    font-weight: 800;
}
.page .newton-orchestrator strong {
    color: #ffffff;
    font-size: 17px;
}
.page .network-line {
    width: 1px;
    height: 32px;
    margin: 0 auto;
    background: linear-gradient(#00a0e3, rgba(0, 160, 227, 0.1));
}
.page .network-agents {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}
.page .network-agent {
    padding: 16px 12px;
    text-align: center;
    border: 1px solid #1e293b;
    border-radius: 12px;
    background: #111827;
}
.page .status {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-bottom: 10px;
    color: #10b981;
    font-size: 8px;
    font-weight: 800;
}
.page .status::before {
    content: "";
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #10b981;
    box-shadow: 0 0 8px #10b981;
}
.page .network-agent strong {
    display: block;
    margin-bottom: 8px;
    color: #ffffff;
    font-size: 11px;
}
.page .network-agent small {
    color: #64748b;
    font-size: 8.5px;
}
.page .network-agent b {
    display: block;
    margin-top: 4px;
    color: #38bdf8;
    font-size: 14px;
}

/* ══════════════════════════════════════════════
   OBSERVA / ENTENDE / DECIDE / EXECUTA
══════════════════════════════════════════════ */
.page .flow {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
.page .flow-card {
    position: relative;
    padding: 28px 22px;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #ffffff;
    transition: all 0.3s ease;
}
.page .flow-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.06);
    border-color: #00a0e3;
}
.page .flow-card::after {
    content: "→";
    position: absolute;
    top: 50%;
    right: -14px;
    z-index: 2;
    width: 26px;
    height: 26px;
    display: grid;
    place-items: center;
    color: #94a3b8;
    background: #f8fafc;
    font-size: 13px;
}
.page .flow-card:last-child::after {
    display: none;
}
.page .flow-number {
    display: block;
    margin-bottom: 24px;
    color: #00a0e3;
    font-size: 11px;
    font-weight: 900;
}
.page .flow-card h3 {
    margin: 0 0 8px;
    color: #0f172a;
    font-size: 19px;
}
.page .flow-card p {
    margin: 0;
    color: #64748b;
    font-size: 13px;
    line-height: 1.65;
}

/* ══════════════════════════════════════════════
   BIBLIOTECA DE AGENTES
══════════════════════════════════════════════ */
.page .library {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}
.page .agent-card {
    position: relative;
    padding: 24px;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #ffffff;
    transition: all 0.3s ease;
}
.page .agent-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.06);
    border-color: #00a0e3;
}
.page .agent-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}
.page .agent-icon {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    color: #00a0e3;
    border-radius: 11px;
    background: rgba(0, 160, 227, 0.1);
    border: 1px solid rgba(0, 160, 227, 0.2);
    font-size: 11px;
    font-weight: 900;
}
.page .agent-active {
    display: flex;
    align-items: center;
    gap: 5px;
    color: #16a34a;
    font-size: 9px;
    font-weight: 800;
}
.page .agent-active::before {
    content: "";
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #16a34a;
}
.page .agent-card h3 {
    margin: 0 0 8px;
    color: #0f172a;
    font-size: 17px;
}
.page .agent-card > p {
    min-height: 55px;
    margin: 0 0 18px;
    color: #64748b;
    font-size: 12.5px;
    line-height: 1.6;
}
.page .agent-metric {
    padding-top: 14px;
    border-top: 1px solid #f1f5f9;
}
.page .agent-metric small {
    display: block;
    margin-bottom: 4px;
    color: #94a3b8;
    font-size: 9px;
    font-weight: 700;
}
.page .agent-metric strong {
    color: #0f172a;
    font-size: 15px;
}

/* ══════════════════════════════════════════════
   DASHBOARD DE AGENTE (claro / escuro)
══════════════════════════════════════════════ */
.page .agent-dashboard {
    overflow: hidden;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.page .dashboard-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 20px;
    border-bottom: 1px solid #f1f5f9;
}
.page .dashboard-agent {
    display: flex;
    align-items: center;
    gap: 11px;
}
.page .dashboard-avatar {
    width: 38px;
    height: 38px;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    color: #ffffff;
    border-radius: 11px;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    font-size: 11px;
    font-weight: 900;
}
.page .dashboard-agent strong {
    display: block;
    color: #0f172a;
    font-size: 12px;
}
.page .dashboard-agent small {
    color: #94a3b8;
    font-size: 9px;
}
.page .dashboard-body {
    padding: 20px;
}
.page .dashboard-objective {
    padding: 14px;
    margin-bottom: 16px;
    border-radius: 10px;
    background: rgba(0, 160, 227, 0.08);
    border: 1px solid rgba(0, 160, 227, 0.2);
}
.page .dashboard-objective small {
    display: block;
    margin-bottom: 4px;
    color: #0284c7;
    font-size: 9px;
    font-weight: 800;
}
.page .dashboard-objective strong {
    color: #0f172a;
    font-size: 12px;
}
.page .metrics {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
}
.page .metric {
    padding: 14px;
    border-radius: 10px;
    background: #f8fafc;
}
.page .metric small {
    display: block;
    min-height: 20px;
    color: #94a3b8;
    font-size: 9px;
}
.page .metric strong {
    display: block;
    margin-top: 5px;
    color: #0f172a;
    font-size: 17px;
}
.page .action-list {
    margin-top: 16px;
}
.page .action-list-title {
    margin-bottom: 8px;
    color: #94a3b8;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.4px;
}
.page .action-item {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 10px 0;
    border-top: 1px solid #f1f5f9;
    color: #334155;
    font-size: 12px;
}
.page .check {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    display: grid;
    place-items: center;
    color: #16a34a;
    border-radius: 50%;
    background: #dcfce7;
    font-size: 9px;
    font-weight: 900;
}

/* ---- Variante escura ---- */
.page .dark-dashboard {
    overflow: hidden;
    border: 1px solid #1e293b;
    border-radius: 18px;
    background: #111827;
}
.page .dark-dashboard .dashboard-head {
    border-color: #1e293b;
}
.page .dark-dashboard .dashboard-agent strong {
    color: #ffffff;
}
.page .dark-dashboard .dashboard-agent small {
    color: #64748b;
}
.page .dark-dashboard .metric {
    background: rgba(255, 255, 255, 0.05);
}
.page .dark-dashboard .metric small {
    color: #64748b;
}
.page .dark-dashboard .metric strong {
    color: #ffffff;
}
.page .dark-dashboard .action-item {
    color: #cbd5e1;
    border-color: rgba(255, 255, 255, 0.07);
}
.page .warning strong {
    color: #fbbf24 !important;
}

/* ══════════════════════════════════════════════
   AUTONOMIA
══════════════════════════════════════════════ */
.page .autonomy {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}
.page .autonomy-card {
    padding: 26px;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #ffffff;
}
.page .autonomy-level {
    display: inline-flex;
    margin-bottom: 18px;
    padding: 6px 10px;
    color: #0284c7;
    border-radius: 7px;
    background: #e0f2fe;
    font-size: 9px;
    font-weight: 800;
}
.page .autonomy-card h3 {
    margin: 0 0 10px;
    color: #0f172a;
    font-size: 18px;
}
.page .autonomy-card p {
    min-height: 55px;
    margin: 0 0 20px;
    color: #64748b;
    font-size: 12.5px;
    line-height: 1.6;
}
.page .mini-flow {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.page .mini-node {
    padding: 9px;
    text-align: center;
    border-radius: 8px;
    background: #f8fafc;
    color: #475569;
    font-size: 10px;
    font-weight: 700;
}
.page .mini-node.highlight {
    color: #ffffff;
    background: #00a0e3;
}
.page .mini-node.success {
    color: #16a34a;
    background: #dcfce7;
}
.page .mini-arrow {
    text-align: center;
    color: #cbd5e1;
    font-size: 10px;
}

/* ══════════════════════════════════════════════
   PROCESSO (atendimento / personalização)
══════════════════════════════════════════════ */
.page .process {
    max-width: 750px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}
.page .process-node {
    width: 100%;
    max-width: 520px;
    padding: 16px 20px;
    text-align: center;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}
.page .process-node small {
    display: block;
    margin-bottom: 5px;
    color: #94a3b8;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.4px;
}
.page .process-node strong {
    color: #0f172a;
    font-size: 12px;
}
.page .process-node.agent {
    color: #ffffff;
    border-color: #00a0e3;
    background: #00a0e3;
}
.page .process-node.agent small {
    color: #d0eefc;
}
.page .process-node.agent strong {
    color: #ffffff;
}
.page .process-node.success {
    color: #16a34a;
    border-color: #bbf7d0;
    background: #dcfce7;
}
.page .process-node.success strong {
    color: #16a34a;
}
.page .process-arrow {
    height: 24px;
    display: grid;
    place-items: center;
    color: #cbd5e1;
}

/* ══════════════════════════════════════════════
   MULTI AGENTES
══════════════════════════════════════════════ */
.page .multi-agents {
    max-width: 850px;
    margin: 0 auto;
}
.page .multi-newton {
    max-width: 400px;
    margin: 0 auto;
    padding: 22px;
    text-align: center;
    color: #ffffff;
    border: 1px solid rgba(0, 160, 227, 0.3);
    border-radius: 16px;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    box-shadow: 0 20px 60px rgba(0, 160, 227, 0.2);
}
.page .multi-newton small {
    display: block;
    margin-bottom: 5px;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.5px;
    opacity: 0.9;
}
.page .multi-newton strong {
    font-size: 18px;
    font-weight: 800;
}
.page .multi-line {
    width: 1px;
    height: 28px;
    margin: 0 auto;
    background: rgba(0, 160, 227, 0.4);
}
.page .multi-node {
    max-width: 500px;
    margin: 0 auto;
    padding: 15px;
    text-align: center;
    color: #cbd5e1;
    border: 1px solid #1e293b;
    border-radius: 12px;
    background: #111827;
}
.page .multi-node small {
    display: block;
    margin-bottom: 5px;
    color: #38bdf8;
    font-size: 9px;
    font-weight: 800;
}
.page .multi-node strong {
    color: #ffffff;
    font-size: 12px;
}

/* ══════════════════════════════════════════════
   BUILDER (construtor de agentes)
══════════════════════════════════════════════ */
.page .builder {
    overflow: hidden;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.page .builder-head {
    padding: 18px 20px;
    border-bottom: 1px solid #f1f5f9;
}
.page .builder-head small {
    display: block;
    margin-bottom: 4px;
    color: #00a0e3;
    font-size: 9px;
    font-weight: 800;
}
.page .builder-head strong {
    color: #0f172a;
    font-size: 14px;
}
.page .builder-body {
    padding: 20px;
}
.page .field {
    margin-bottom: 16px;
}
.page .field label {
    display: block;
    margin-bottom: 7px;
    color: #94a3b8;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.4px;
}
.page .input {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #f8fafc;
    color: #334155;
    font-size: 12.5px;
}
.page .builder-block {
    margin-top: 14px;
    padding: 14px;
    border-radius: 10px;
    background: #f8fafc;
}
.page .builder-block-title {
    margin-bottom: 8px;
    color: #94a3b8;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.4px;
}
.page .option {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 0;
    color: #334155;
    font-size: 12px;
}
.page .box {
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
    display: grid;
    place-items: center;
    color: #ffffff;
    border-radius: 4px;
    background: #00a0e3;
    font-size: 9px;
    float: none;
    margin: 0;
    position: static;
    border: none;
    text-align: center;
}
.page .box.off {
    border: 1px solid #cbd5e1;
    background: #ffffff;
}
.page .builder-button {
    width: 100%;
    margin-top: 18px;
    padding: 13px;
    text-align: center;
    color: #ffffff;
    border-radius: 8px;
    background: #00a0e3;
    font-size: 12.5px;
    font-weight: 700;
    transition: background 0.3s ease;
}
.page .builder-button:hover {
    background: #008cc6;
}

/* ══════════════════════════════════════════════
   CONTEXTO
══════════════════════════════════════════════ */
.page .context {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
}
.page .context-card {
    padding: 20px;
    text-align: center;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #ffffff;
}
.page .context-icon {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    margin: 0 auto 12px;
    color: #00a0e3;
    border-radius: 10px;
    background: rgba(0, 160, 227, 0.1);
    border: 1px solid rgba(0, 160, 227, 0.2);
    font-size: 10px;
    font-weight: 800;
}
.page .context-card strong {
    display: block;
    margin-bottom: 5px;
    color: #0f172a;
    font-size: 12.5px;
}
.page .context-card small {
    color: #94a3b8;
    font-size: 10.5px;
}

/* ══════════════════════════════════════════════
   GOVERNANÇA
══════════════════════════════════════════════ */
.page .governance {
    display: grid;
    grid-template-columns: 0.8fr 1.2fr;
    gap: 24px;
    align-items: stretch;
}
.page .governance-info {
    padding: 28px;
    color: #ffffff;
    border-radius: 18px;
    background: #111827;
}
.page .governance-info small {
    display: block;
    margin-bottom: 7px;
    color: #38bdf8;
    font-size: 10px;
    font-weight: 800;
}
.page .governance-info h3 {
    margin: 0 0 16px;
    font-size: 22px;
}
.page .gov-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 11px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
    color: #94a3b8;
    font-size: 12.5px;
}
.page .gov-item strong {
    color: #ffffff;
}
.page .audit {
    padding: 26px;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #ffffff;
}
.page .audit-head {
    display: flex;
    justify-content: space-between;
    margin-bottom: 18px;
}
.page .audit-head strong {
    color: #0f172a;
    font-size: 14px;
}
.page .audit-head span {
    color: #16a34a;
    font-size: 10px;
    font-weight: 800;
}
.page .audit-row {
    display: grid;
    grid-template-columns: 50px 1fr;
    gap: 10px;
    padding: 11px 0;
    border-top: 1px solid #f1f5f9;
}
.page .audit-time {
    color: #94a3b8;
    font-size: 11px;
}
.page .audit-text {
    color: #334155;
    font-size: 12.5px;
}

/* ══════════════════════════════════════════════
   CTA
══════════════════════════════════════════════ */
.page .cta {
    position: relative;
    padding: 120px 0;
    text-align: center;
    color: #ffffff;
    overflow: hidden;
    background: #0b0f19;
}
.page .cta::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 600px;
    height: 400px;
    background: radial-gradient(circle, rgba(0, 160, 227, 0.15) 0%, rgba(11, 15, 25, 0) 70%);
}
.page .cta .container {
    position: relative;
    z-index: 1;
    max-width: 850px;
}
.page .cta h2 {
    max-width: 900px;
    margin: 18px auto 20px;
    color: #ffffff;
    font-size: 42px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
}
.page .cta h2 span {
    display: block;
    color: #38bdf8;
    font-size: 22px;
    font-weight: 500;
    margin-top: 12px;
}
.page .cta p {
    max-width: 680px;
    margin: 0 auto;
    color: #94a3b8;
    font-size: 17px;
    line-height: 1.7;
}
.page .cta .buttons {
    justify-content: center;
}

/* ══════════════════════════════════════════════
   RESPONSIVO
══════════════════════════════════════════════ */
@media (max-width: 992px) {
    .page .grid-2,
    .page .governance {
        grid-template-columns: 1fr;
    }
    .page .flow {
        grid-template-columns: 1fr 1fr;
    }
    .page .flow-card:nth-child(2)::after {
        display: none;
    }
    .page .library {
        grid-template-columns: 1fr 1fr;
    }
    .page .autonomy {
        grid-template-columns: 1fr;
    }
    .page .context {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 768px) {
    .page .section,
    .page .hero,
    .page .cta {
        padding: 64px 0;
    }
    .page .copy h1 {
        font-size: 32px;
    }
    .page .copy h2,
    .page .heading h2,
    .page .cta h2 {
        font-size: 28px;
    }
    .page .flow,
    .page .library,
    .page .context {
        grid-template-columns: 1fr;
    }
    .page .flow-card::after {
        content: "↓";
        top: auto;
        right: auto;
        bottom: -14px;
        left: 50%;
        transform: translateX(-50%);
    }
    .page .flow-card:nth-child(2)::after {
        display: grid;
    }
    .page .flow-card:last-child::after {
        display: none;
    }
    .page .network-agents,
    .page .metrics {
        grid-template-columns: 1fr;
    }
}

/* ══════════════════════════════════════════════════════════════
   ARQUITETURA GALACTIX — padrão visual do b2c.html
   (conteúdo original da página preservado; aqui só entra o estilo)
══════════════════════════════════════════════════════════════ */
.gx-architecture {
    display: block;
    overflow: hidden;
    background: #ffffff;
    color: #0f172a;
    font-family: Inter, Arial, sans-serif;
}
.gx-architecture * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
.gx-architecture .container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}
.gx-architecture section {
    padding: 100px 0;
}

/* ---------- Tipografia comum ---------- */
.gx-architecture .eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #e0f2fe;
    color: #0284c7;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    padding: 6px 16px;
    border-radius: 100px;
    margin-bottom: 20px;
    border: 1px solid rgba(56, 189, 248, 0.4);
}
.gx-architecture .eyebrow::before {
    content: none;
}
.gx-architecture .hero .eyebrow,
.gx-architecture .data-flow .eyebrow,
.gx-architecture .newton .eyebrow,
.gx-architecture .cta .eyebrow {
    background: rgba(56, 189, 248, 0.1);
    color: #38bdf8;
    border: 1px solid rgba(56, 189, 248, 0.3);
}

.gx-architecture h1 {
    font-size: 46px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1px;
    color: #ffffff;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}
.gx-architecture h2 {
    font-size: 38px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
    color: #0f172a;
}
.gx-architecture h3 {
    font-size: 19px;
    font-weight: 700;
    color: #0f172a;
}
.gx-architecture p {
    line-height: 1.7;
    color: #475569;
}
.gx-architecture .blue {
    color: #00a0e3;
}
.gx-architecture .data-flow h2,
.gx-architecture .newton h2,
.gx-architecture .cta h2 {
    color: #ffffff;
}

.gx-architecture .btns {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 28px;
}
.gx-architecture .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 52px;
    padding: 0 28px;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.3s ease;
}
.gx-architecture .btn-primary {
    background: #00a0e3;
    color: #ffffff;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
}
.gx-architecture .btn-primary:hover {
    transform: translateY(-2px);
    background: #008cc6;
}
.gx-architecture .btn-outline {
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: #ffffff;
}
.gx-architecture .btn-outline:hover {
    border-color: #ffffff;
    background: rgba(255, 255, 255, 0.05);
}

/* ══════════════════════════════════════════════
   HERO
══════════════════════════════════════════════ */
.gx-architecture .hero {
    padding: 60px 0 100px 0;
    display: flex;
    align-items: center;
    color: #ffffff;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.gx-architecture .hero-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}
.gx-architecture .hero p {
    color: #cbd5e1;
    font-size: 18px;
    max-width: 520px;
    margin-top: 22px;
}
.gx-architecture .hero-diagram {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 170px 1fr;
    gap: 24px;
    align-items: center;
}
.gx-architecture .system-column {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.gx-architecture .system {
    height: 62px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 12px;
    color: #e2e8f0;
    font-weight: 700;
    position: relative;
}
.gx-architecture .system.left::after {
    content: "";
    position: absolute;
    width: 24px;
    height: 1px;
    background: #334155;
    right: -25px;
}
.gx-architecture .system.right::before {
    content: "";
    position: absolute;
    width: 24px;
    height: 1px;
    background: #334155;
    left: -25px;
}
.gx-architecture .galactix-core {
    height: 340px;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    color: #ffffff;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    box-shadow: 0 20px 60px rgba(0, 160, 227, 0.2);
}
.gx-architecture .galactix-core small {
    display: block;
    opacity: 0.85;
    letter-spacing: 1.5px;
    font-size: 11px;
    font-weight: 700;
    margin-bottom: 8px;
}
.gx-architecture .galactix-core strong {
    font-size: 21px;
    font-weight: 800;
}

/* ══════════════════════════════════════════════
   CONCEITO / MAPA DE ARQUITETURA
══════════════════════════════════════════════ */
.gx-architecture .concept {
    background: #f8fafc;
}
.gx-architecture .center {
    text-align: center;
    max-width: 760px;
    margin: 0 auto 60px auto;
}
.gx-architecture .center p {
    max-width: 720px;
    margin: 18px auto 0;
    color: #475569;
    font-size: 18px;
}

.gx-architecture .architecture {
    margin-top: 60px;
    padding: 40px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 20px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-architecture .arch-label {
    text-align: center;
    font-size: 11px;
    font-weight: 800;
    color: #94a3b8;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    margin-bottom: 18px;
}
.gx-architecture .arch-systems {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
}
.gx-architecture .arch-system {
    padding: 14px 22px;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    font-weight: 700;
    color: #334155;
    background: #f8fafc;
}
.gx-architecture .arrow-down {
    text-align: center;
    font-size: 24px;
    color: #cbd5e1;
    margin: 18px 0;
}
.gx-architecture .hub {
    width: 380px;
    max-width: 100%;
    margin: 0 auto;
    padding: 26px;
    text-align: center;
    color: #ffffff;
    background: #00a0e3;
    border-radius: 14px;
}
.gx-architecture .hub strong {
    font-size: 16px;
}
.gx-architecture .hub small {
    display: block;
    opacity: 0.85;
    margin-top: 7px;
    font-size: 12.5px;
}
.gx-architecture .platforms {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    max-width: 800px;
    margin: 0 auto;
}
.gx-architecture .platform {
    padding: 26px;
    border-radius: 14px;
    border: 1px solid #e2e8f0;
    text-align: left;
}
.gx-architecture .platform.commerce {
    background: #e0f2fe;
}
.gx-architecture .platform.data {
    background: rgba(128, 43, 226, 0.06);
}
.gx-architecture .platform h3 {
    margin-bottom: 8px;
}
.gx-architecture .platform p {
    color: #64748b;
}

/* ══════════════════════════════════════════════
   3 CAMADAS
══════════════════════════════════════════════ */
.gx-architecture .layers {
    background: #ffffff;
}
.gx-architecture .layers-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-top: 50px;
}
.gx-architecture .layer {
    padding: 32px;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    min-height: 0;
    transition: all 0.3s ease;
}
.gx-architecture .layer:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.06);
    border-color: #00a0e3;
}
.gx-architecture .layer-number {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.5px;
    color: #94a3b8;
    margin-bottom: 28px;
}
.gx-architecture .layer-icon {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    font-size: 20px;
    margin-bottom: 20px;
}
.gx-architecture .layer:nth-child(1) .layer-icon {
    background: rgba(0, 160, 227, 0.1);
    color: #00a0e3;
}
.gx-architecture .layer:nth-child(2) .layer-icon {
    background: #e0f2fe;
    color: #0284c7;
}
.gx-architecture .layer:nth-child(3) .layer-icon {
    background: rgba(128, 43, 226, 0.1);
    color: #802be2;
}
.gx-architecture .layer p {
    color: #64748b;
    margin: 12px 0 20px;
}
.gx-architecture .tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.gx-architecture .tag {
    font-size: 12px;
    padding: 7px 12px;
    border-radius: 8px;
    background: #f1f5f9;
    color: #475569;
    font-weight: 600;
}

/* ══════════════════════════════════════════════
   FLUXO DE DADOS
══════════════════════════════════════════════ */
.gx-architecture .data-flow {
    color: #ffffff;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.gx-architecture .data-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}
.gx-architecture .data-grid p {
    color: #94a3b8;
    font-size: 18px;
    margin-top: 18px;
}
.gx-architecture .flow {
    padding: 30px;
    border: 1px solid #1e293b;
    border-radius: 18px;
    background: #111827;
}
.gx-architecture .flow-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}
.gx-architecture .flow-box {
    flex: 1;
    padding: 16px 12px;
    text-align: center;
    background: #0b0f19;
    border: 1px solid #1e293b;
    border-radius: 10px;
    color: #e2e8f0;
    font-weight: 700;
}
.gx-architecture .flow-box.active {
    color: #ffffff;
    background: #00a0e3;
    border-color: #00a0e3;
}
.gx-architecture .flow-arrow {
    color: #64748b;
}
.gx-architecture .flow-middle {
    display: flex;
    justify-content: center;
    color: #64748b;
    font-size: 22px;
    margin: 16px 0;
}

/* ══════════════════════════════════════════════
   INTEGRAÇÕES / APIs
══════════════════════════════════════════════ */
.gx-architecture .integrations {
    background: #f8fafc;
}
.gx-architecture .cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-top: 50px;
}
.gx-architecture .card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 26px;
    transition: all 0.3s ease;
}
.gx-architecture .card:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.06);
    border-color: #00a0e3;
}
.gx-architecture .card-icon {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    background: rgba(0, 160, 227, 0.1);
    color: #00a0e3;
    font-size: 18px;
    margin-bottom: 20px;
}
.gx-architecture .card p {
    margin-top: 8px;
    color: #64748b;
}

/* ══════════════════════════════════════════════
   FLUXO DO PEDIDO
══════════════════════════════════════════════ */
.gx-architecture .order {
    background: #ffffff;
}
.gx-architecture .order-flow {
    margin-top: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
}
.gx-architecture .order-node {
    padding: 16px 20px;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    font-weight: 700;
    color: #0f172a;
    background: #ffffff;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}
.gx-architecture .order-node.main {
    background: #00a0e3;
    color: #ffffff;
    border-color: #00a0e3;
}
.gx-architecture .order-arrow {
    color: #cbd5e1;
}

/* ══════════════════════════════════════════════
   EVENTOS
══════════════════════════════════════════════ */
.gx-architecture .events {
    background: #f8fafc;
}
.gx-architecture .event-map {
    max-width: 900px;
    margin: 50px auto 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}
.gx-architecture .event-main {
    width: 300px;
    max-width: 100%;
    margin: 0 auto;
    padding: 18px;
    background: #111827;
    color: #ffffff;
    text-align: center;
    border-radius: 12px;
    font-weight: 700;
}
.gx-architecture .event-line {
    height: 32px;
    width: 1px;
    background: #cbd5e1;
    margin: 0 auto;
}
.gx-architecture .event-targets {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
}
.gx-architecture .event-target {
    padding: 20px;
    text-align: center;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
    color: #0f172a;
    font-weight: 700;
}

/* ══════════════════════════════════════════════
   NEWTON
══════════════════════════════════════════════ */
.gx-architecture .newton {
    color: #ffffff;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.gx-architecture .newton-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}
.gx-architecture .newton p {
    color: #94a3b8;
    font-size: 18px;
    margin-top: 18px;
}
.gx-architecture .newton-ui {
    padding: 26px;
    border-radius: 18px;
    border: 1px solid #1e293b;
    background: #111827;
}
.gx-architecture .newton-head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 18px;
    border-bottom: 1px solid #1e293b;
}
.gx-architecture .newton-head strong {
    color: #ffffff;
    font-size: 14px;
}
.gx-architecture .newton-dot {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #ffffff;
    border-radius: 10px;
    font-weight: 800;
}
.gx-architecture .question {
    margin-top: 14px;
    padding: 15px 16px;
    background: rgba(0, 160, 227, 0.08);
    border: 1px solid rgba(0, 160, 227, 0.2);
    border-radius: 10px;
    color: #cbd5e1;
    font-size: 13.5px;
}
.gx-architecture .question:first-of-type {
    margin-top: 22px;
}

/* ══════════════════════════════════════════════
   SEGURANÇA / GOVERNANÇA
══════════════════════════════════════════════ */
.gx-architecture .security {
    background: #ffffff;
}
.gx-architecture .security-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-top: 45px;
}
.gx-architecture .security-item {
    padding: 26px;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
}
.gx-architecture .security-item span {
    display: block;
    color: #00a0e3;
    font-size: 22px;
    margin-bottom: 18px;
}
.gx-architecture .security-item p {
    color: #64748b;
    margin-top: 8px;
}

/* ══════════════════════════════════════════════
   CTA
══════════════════════════════════════════════ */
.gx-architecture .cta {
    position: relative;
    padding: 120px 0;
    text-align: center;
    color: #ffffff;
    overflow: hidden;
    background: #0b0f19;
}
.gx-architecture .cta::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 600px;
    height: 400px;
    background: radial-gradient(circle, rgba(0, 160, 227, 0.15) 0%, rgba(11, 15, 25, 0) 70%);
}
.gx-architecture .cta .container {
    position: relative;
    z-index: 1;
    max-width: 800px;
}
.gx-architecture .cta p {
    max-width: 640px;
    margin: 20px auto 0;
    color: #94a3b8;
    font-size: 17px;
}
.gx-architecture .cta .btns {
    justify-content: center;
}

/* ══════════════════════════════════════════════
   RESPONSIVO
══════════════════════════════════════════════ */
@media (max-width: 992px) {
    .gx-architecture h1 {
        font-size: 36px;
    }
    .gx-architecture h2 {
        font-size: 30px;
    }
    .gx-architecture .hero-grid,
    .gx-architecture .data-grid,
    .gx-architecture .newton-grid {
        grid-template-columns: 1fr;
    }
    .gx-architecture .hero-diagram {
        margin-top: 20px;
    }
    .gx-architecture .layers-grid,
    .gx-architecture .cards {
        grid-template-columns: 1fr 1fr;
    }
    .gx-architecture .security-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 768px) {
    .gx-architecture section {
        padding: 64px 0;
    }
    .gx-architecture h1 {
        font-size: 30px;
    }
    .gx-architecture h2 {
        font-size: 26px;
    }
    .gx-architecture .hero {
        padding: 90px 0;
    }
    .gx-architecture .hero-diagram {
        grid-template-columns: 1fr;
    }
    .gx-architecture .system.left::after,
    .gx-architecture .system.right::before {
        display: none;
    }
    .gx-architecture .galactix-core {
        height: 150px;
    }
    .gx-architecture .layers-grid,
    .gx-architecture .cards,
    .gx-architecture .security-grid,
    .gx-architecture .platforms,
    .gx-architecture .event-targets {
        grid-template-columns: 1fr;
    }
    .gx-architecture .architecture {
        padding: 24px 18px;
    }
}

/* ══════════════════════════════════════════════════════════════
   DISTRIBUIDORA — padrão visual do b2c.html
   (conteúdo original da página preservado; aqui só entra o estilo)
   O <header> próprio da página (duplicado do {header} do site) e o
   footer{} customizado foram removidos/omitidos: a página já usa o
   {header}/{footer} compartilhados do site, que seguem este mesmo
   padrão visual em todas as outras páginas.
══════════════════════════════════════════════════════════════ */
.gx-distribuidora {
    display: block;
    overflow: hidden;
    background: #ffffff;
    color: #0f172a;
    font-family: Inter, Arial, sans-serif;
    line-height: 1.6;
}
.gx-distribuidora * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
.gx-distribuidora a {
    text-decoration: none;
    color: inherit;
}
.gx-distribuidora .container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}
.gx-distribuidora section {
    padding: 100px 0;
}
.gx-distribuidora #solucoes {
    width: auto;
    left: auto;
}
.gx-distribuidora .section-light {
    background: #f8fafc;
}

/* ---------- Tipografia comum ---------- */
.gx-distribuidora .eyebrow {
    display: inline-block;
    background: #e0f2fe;
    color: #0284c7;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    padding: 6px 16px;
    border-radius: 100px;
    margin-bottom: 20px;
    border: 1px solid rgba(56, 189, 248, 0.4);
}
.gx-distribuidora .eyebrow-light {
    background: rgba(56, 189, 248, 0.1);
    color: #38bdf8;
    border: 1px solid rgba(56, 189, 248, 0.3);
}

.gx-distribuidora .section-heading {
    max-width: 760px;
    margin-bottom: 60px;
}
.gx-distribuidora .section-heading.center {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}
.gx-distribuidora .section-heading h2 {
    font-size: 38px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
    color: #0f172a;
}
.gx-distribuidora .section-heading p {
    margin-top: 18px;
    color: #475569;
    font-size: 18px;
    line-height: 1.7;
}
.gx-distribuidora .operation .section-heading h2 {
    color: #ffffff;
}
.gx-distribuidora .operation .section-heading p {
    color: #94a3b8;
}

.gx-distribuidora .btn {
    min-height: 52px;
    padding: 0 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 700;
    transition: all 0.3s ease;
}
.gx-distribuidora .btn-primary {
    background: #00a0e3;
    color: #ffffff;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
}
.gx-distribuidora .btn-primary:hover {
    background: #008cc6;
    transform: translateY(-2px);
}
.gx-distribuidora .btn-outline {
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: #ffffff;
}
.gx-distribuidora .btn-outline:hover {
    background: rgba(255, 255, 255, 0.05);
    border-color: #ffffff;
}

/* ══════════════════════════════════════════════
   HERO
══════════════════════════════════════════════ */
.gx-distribuidora .hero {
    padding: 60px 0 100px 0;
    color: #ffffff;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.gx-distribuidora .hero-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}
.gx-distribuidora .hero h1 {
    font-size: 46px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1px;
    color: #ffffff;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
    max-width: 620px;
}
.gx-distribuidora .hero h1 span {
    color: #38bdf8;
}
.gx-distribuidora .hero-description {
    max-width: 520px;
    margin-top: 22px;
    color: #cbd5e1;
    font-size: 18px;
    line-height: 1.7;
}
.gx-distribuidora .hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 28px;
}
.gx-distribuidora .hero-benefits {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
    margin-top: 44px;
}
.gx-distribuidora .hero-benefit {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #cbd5e1;
    font-size: 13px;
}
.gx-distribuidora .benefit-icon {
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 160, 227, 0.12);
    color: #38bdf8;
    font-weight: 700;
}

/* ---- DASHBOARD (mockup) ---- */
.gx-distribuidora .dashboard {
    width: 100%;
    padding: 22px;
    background: #ffffff;
    color: #0f172a;
    border-radius: 18px;
    box-shadow: 0 30px 60px -15px rgba(0, 0, 0, 0.5);
    transform: perspective(1200px) rotateY(-3deg) rotateX(1deg);
}
.gx-distribuidora .dashboard-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}
.gx-distribuidora .dashboard-title strong {
    display: block;
    font-size: 15px;
    color: #0f172a;
}
.gx-distribuidora .dashboard-title span {
    font-size: 11.5px;
    color: #94a3b8;
}
.gx-distribuidora .dashboard-user {
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    border-radius: 50%;
    background: #e0f2fe;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #0284c7;
    font-weight: 700;
    font-size: 12px;
}
.gx-distribuidora .stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}
.gx-distribuidora .stat {
    padding: 14px;
    background: #f8fafc;
    border: 1px solid #f1f5f9;
    border-radius: 10px;
}
.gx-distribuidora .stat-label {
    font-size: 10px;
    color: #94a3b8;
}
.gx-distribuidora .stat-value {
    display: block;
    margin-top: 6px;
    font-size: 15px;
    font-weight: 700;
    color: #0f172a;
}
.gx-distribuidora .stat-up {
    margin-top: 4px;
    display: block;
    color: #16a34a;
    font-size: 10px;
    font-weight: 600;
}
.gx-distribuidora .dashboard-main {
    display: grid;
    grid-template-columns: 1.7fr 0.8fr;
    gap: 12px;
    margin-top: 12px;
}
.gx-distribuidora .chart-card,
.gx-distribuidora .channel-card {
    background: #ffffff;
    border: 1px solid #f1f5f9;
    border-radius: 12px;
    padding: 16px;
}
.gx-distribuidora .card-title {
    font-size: 12.5px;
    font-weight: 700;
    color: #0f172a;
}
.gx-distribuidora .chart {
    height: 170px;
    margin-top: 20px;
    position: relative;
    background: repeating-linear-gradient(0deg, transparent, transparent 33px, #f1f5f9 34px);
}
.gx-distribuidora .chart svg {
    width: 100%;
    height: 100%;
}
.gx-distribuidora .channel-circle {
    width: 110px;
    height: 110px;
    margin: 24px auto 18px;
    border-radius: 50%;
    background: conic-gradient(#00a0e3 0 48%, #0284c7 48% 80%, #7dd3fc 80% 94%, #e2e8f0 94%);
    position: relative;
}
.gx-distribuidora .channel-circle::after {
    content: "";
    position: absolute;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: #ffffff;
    top: 23px;
    left: 23px;
}
.gx-distribuidora .channel-list {
    display: grid;
    gap: 6px;
    font-size: 11px;
    color: #64748b;
}

/* ══════════════════════════════════════════════
   DESAFIOS
══════════════════════════════════════════════ */
.gx-distribuidora .challenge-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
.gx-distribuidora .challenge {
    min-height: 0;
    padding: 26px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    transition: all 0.3s ease;
}
.gx-distribuidora .challenge:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.06);
    border-color: #00a0e3;
}
.gx-distribuidora .challenge-number {
    color: #00a0e3;
    font-weight: 800;
    font-size: 12px;
    margin-bottom: 40px;
}
.gx-distribuidora .challenge h3 {
    font-size: 18px;
    color: #0f172a;
}
.gx-distribuidora .challenge p {
    margin-top: 12px;
    color: #64748b;
    font-size: 13.5px;
    line-height: 1.6;
}

/* ══════════════════════════════════════════════
   OPERAÇÃO (fluxo)
══════════════════════════════════════════════ */
.gx-distribuidora .operation {
    color: #ffffff;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.gx-distribuidora .flow {
    margin-top: 60px;
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    align-items: center;
    gap: 12px;
}
.gx-distribuidora .flow-item {
    min-height: 130px;
    padding: 18px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 14px;
}
.gx-distribuidora .flow-item strong {
    font-size: 14px;
}
.gx-distribuidora .flow-item span {
    margin-top: 6px;
    font-size: 10.5px;
    color: #94a3b8;
}
.gx-distribuidora .flow-item.highlight {
    background: #00a0e3;
    border-color: #00a0e3;
}
.gx-distribuidora .flow-item.highlight span {
    color: #ffffff;
    opacity: 0.85;
}
.gx-distribuidora .flow-arrow {
    text-align: center;
    color: #38bdf8;
    font-size: 18px;
}

/* ══════════════════════════════════════════════
   CANAIS
══════════════════════════════════════════════ */
.gx-distribuidora .channel-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}
.gx-distribuidora .channel {
    width: 100%;
    float: none;
    min-height: 0;
    padding: 30px;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    display: flex;
    flex-direction: column;
    transition: all 0.3s ease;
}
.gx-distribuidora .channel:hover {
    transform: translateY(-5px);
    border-color: #00a0e3;
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.06);
}
.gx-distribuidora .channel-badge {
    width: fit-content;
    padding: 6px 12px;
    background: #e0f2fe;
    color: #0284c7;
    border-radius: 100px;
    font-size: 11px;
    font-weight: 700;
    margin-bottom: 40px;
}
.gx-distribuidora .channel h3 {
    font-size: 24px;
    color: #0f172a;
}
.gx-distribuidora .channel p {
    margin-top: 14px;
    color: #64748b;
    font-size: 14px;
}
.gx-distribuidora .channel ul {
    list-style: none;
    margin-top: 22px;
    display: grid;
    gap: 10px;
    font-size: 13px;
    color: #334155;
}
.gx-distribuidora .channel li::before {
    content: "✓";
    color: #10b981;
    font-weight: 800;
    margin-right: 8px;
}
.gx-distribuidora .channel a {
    margin-top: auto;
    padding-top: 26px;
    color: #00a0e3;
    font-weight: 700;
    font-size: 13px;
}

/* ══════════════════════════════════════════════
   FORÇA DE VENDAS (SFA)
══════════════════════════════════════════════ */
.gx-distribuidora .feature-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 64px;
}
.gx-distribuidora .feature-text h2 {
    font-size: 34px;
    font-weight: 800;
    letter-spacing: -1px;
    line-height: 1.25;
    color: #0f172a;
}
.gx-distribuidora .feature-text p {
    margin-top: 18px;
    color: #475569;
    font-size: 16px;
    line-height: 1.7;
}
.gx-distribuidora .feature-list {
    list-style: none !important;
    margin: 26px 0 0 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
}
.gx-distribuidora .feature-list li {
    font-size: 14px;
    font-weight: 500;
    color: #334155;
}
.gx-distribuidora .feature-list li::before {
    content: "✓";
    color: #10b981;
    margin-right: 8px;
    font-weight: 800;
}

.gx-distribuidora .sfa-app {
    padding: 22px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-distribuidora .app-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 16px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-distribuidora .app-header strong {
    color: #0f172a;
    font-size: 14px;
}
.gx-distribuidora .app-header span {
    color: #16a34a;
    font-size: 12px;
    font-weight: 600;
}
.gx-distribuidora .app-client {
    margin-top: 18px;
    padding: 18px;
    background: #f8fafc;
    border-radius: 12px;
}
.gx-distribuidora .app-client small {
    color: #94a3b8;
}
.gx-distribuidora .app-client h3 {
    color: #0f172a;
    font-size: 16px;
    margin-top: 4px;
}
.gx-distribuidora .client-info {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-top: 18px;
}
.gx-distribuidora .client-info div {
    padding: 13px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
}
.gx-distribuidora .client-info span {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
}
.gx-distribuidora .client-info strong {
    display: block;
    margin-top: 5px;
    color: #0f172a;
    font-size: 13.5px;
}
.gx-distribuidora .app-button {
    margin-top: 16px;
    padding: 13px;
    text-align: center;
    background: #00a0e3;
    color: #ffffff;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 700;
}

/* ══════════════════════════════════════════════
   ERP
══════════════════════════════════════════════ */
.gx-distribuidora .erp {
    color: #ffffff;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.gx-distribuidora .erp-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}
.gx-distribuidora .erp h2 {
    font-size: 34px;
    font-weight: 800;
    letter-spacing: -1px;
    line-height: 1.25;
    color: #ffffff;
}
.gx-distribuidora .erp h2 span {
    color: #38bdf8;
}
.gx-distribuidora .erp p {
    margin-top: 20px;
    color: #94a3b8;
    font-size: 16px;
    line-height: 1.7;
}
.gx-distribuidora .erp-flow {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}
.gx-distribuidora .erp-box {
    min-height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px;
    text-align: center;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 12px;
    font-size: 13px;
    font-weight: 700;
}
.gx-distribuidora .erp-box.main {
    background: #00a0e3;
    border-color: #00a0e3;
    grid-column: 1 / -1;
    min-height: 100px;
    font-size: 19px;
}

/* ══════════════════════════════════════════════
   CRM
══════════════════════════════════════════════ */
.gx-distribuidora .crm-card {
    padding: 26px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-distribuidora .crm-name {
    font-size: 16px;
    font-weight: 700;
    color: #0f172a;
}
.gx-distribuidora .crm-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    margin-top: 20px;
}
.gx-distribuidora .crm-info {
    padding: 14px;
    background: #f8fafc;
    border-radius: 10px;
}
.gx-distribuidora .crm-info span {
    display: block;
    font-size: 10.5px;
    color: #94a3b8;
}
.gx-distribuidora .crm-info strong {
    display: block;
    margin-top: 4px;
    font-size: 14px;
    color: #0f172a;
}
.gx-distribuidora .crm-alert {
    margin-top: 16px;
    padding: 14px;
    background: #fef3c7;
    border-radius: 10px;
    color: #92620a;
    font-size: 12.5px;
    font-weight: 600;
}

/* ══════════════════════════════════════════════
   NEWTON
══════════════════════════════════════════════ */
.gx-distribuidora .newton {
    color: #ffffff;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.gx-distribuidora .newton-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}
.gx-distribuidora .newton h2 {
    font-size: 36px;
    font-weight: 800;
    letter-spacing: -1px;
    color: #ffffff;
}
.gx-distribuidora .newton p {
    margin-top: 20px;
    color: #94a3b8;
    font-size: 16px;
    line-height: 1.7;
}
.gx-distribuidora .chat {
    padding: 24px;
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 18px;
}
.gx-distribuidora .message {
    max-width: 84%;
    padding: 13px 16px;
    margin-bottom: 12px;
    border-radius: 14px;
    font-size: 13px;
    line-height: 1.5;
}
.gx-distribuidora .message.user {
    margin-left: auto;
    background: #00a0e3;
    color: #ffffff;
    border-radius: 14px 14px 3px 14px;
}
.gx-distribuidora .message.ai {
    background: rgba(255, 255, 255, 0.06);
    color: #cbd5e1;
    border-radius: 14px 14px 14px 3px;
}

/* ══════════════════════════════════════════════
   RESULTADOS
══════════════════════════════════════════════ */
.gx-distribuidora .result-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
    margin-top: 50px;
}
.gx-distribuidora .result {
    padding: 24px;
    border-left: 2px solid #00a0e3;
}
.gx-distribuidora .result strong {
    display: block;
    font-size: 19px;
    color: #0f172a;
}
.gx-distribuidora .result span {
    display: block;
    margin-top: 8px;
    color: #64748b;
    font-size: 13px;
    line-height: 1.5;
}

/* ══════════════════════════════════════════════
   ECOSSISTEMA
══════════════════════════════════════════════ */
.gx-distribuidora .ecosystem-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-top: 44px;
}
.gx-distribuidora .ecosystem-column {
    padding: 22px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
}
.gx-distribuidora .ecosystem-head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
}
.gx-distribuidora .ecosystem-icon {
    width: 38px;
    height: 38px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    background: rgba(0, 160, 227, 0.1);
    color: #00a0e3;
    font-size: 17px;
}
.gx-distribuidora .ecosystem-column h3 {
    color: #00a0e3;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1px;
}
.gx-distribuidora .ecosystem-column ul {
    list-style: none;
    margin-top: 18px;
    display: grid;
    gap: 10px;
    font-size: 13.5px;
    color: #334155;
}

/* ══════════════════════════════════════════════
   CTA
══════════════════════════════════════════════ */
.gx-distribuidora .cta {
    position: relative;
    padding: 120px 0;
    text-align: center;
    color: #ffffff;
    overflow: hidden;
    background: #0b0f19;
}
.gx-distribuidora .cta::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 600px;
    height: 400px;
    background: radial-gradient(circle, rgba(0, 160, 227, 0.15) 0%, rgba(11, 15, 25, 0) 70%);
}
.gx-distribuidora .cta .container {
    position: relative;
    z-index: 1;
    max-width: 800px;
}
.gx-distribuidora .cta h2 {
    max-width: 850px;
    margin: 0 auto;
    font-size: 42px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
    color: #ffffff;
}
.gx-distribuidora .cta h2 span {
    display: block;
    color: #94a3b8;
    font-size: 22px;
    font-weight: 500;
    margin-top: 12px;
}
.gx-distribuidora .cta p {
    max-width: 640px;
    margin: 20px auto 32px;
    color: #94a3b8;
    font-size: 17px;
    line-height: 1.7;
}

/* ══════════════════════════════════════════════
   RESPONSIVO
══════════════════════════════════════════════ */
@media (max-width: 992px) {
    .gx-distribuidora .hero-grid,
    .gx-distribuidora .feature-grid,
    .gx-distribuidora .erp-grid,
    .gx-distribuidora .newton-grid {
        grid-template-columns: 1fr;
    }
    .gx-distribuidora .hero {
        padding: 60px 0;
    }
    .gx-distribuidora .challenge-grid,
    .gx-distribuidora .result-grid,
    .gx-distribuidora .ecosystem-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .gx-distribuidora .channel-grid {
        grid-template-columns: 1fr;
    }
    .gx-distribuidora .flow {
        grid-template-columns: 1fr;
    }
    .gx-distribuidora .flow-arrow {
        transform: rotate(90deg);
    }
}
@media (max-width: 768px) {
    .gx-distribuidora section {
        padding: 64px 0;
    }
    .gx-distribuidora .hero h1 {
        font-size: 32px;
    }
    .gx-distribuidora .hero-actions {
        flex-direction: column;
    }
    .gx-distribuidora .hero-benefits {
        flex-direction: column;
        gap: 16px;
    }
    .gx-distribuidora .stats {
        grid-template-columns: repeat(2, 1fr);
    }
    .gx-distribuidora .dashboard-main {
        grid-template-columns: 1fr;
    }
    .gx-distribuidora .challenge-grid,
    .gx-distribuidora .result-grid,
    .gx-distribuidora .ecosystem-grid {
        grid-template-columns: 1fr;
    }
    .gx-distribuidora .feature-list {
        grid-template-columns: 1fr !important;
    }
    .gx-distribuidora .section-heading h2,
    .gx-distribuidora .feature-text h2,
    .gx-distribuidora .erp h2,
    .gx-distribuidora .newton h2,
    .gx-distribuidora .cta h2 {
        font-size: 26px;
    }
}

/* ══════════════════════════════════════════════════════════════
   INDÚSTRIA — padrão visual do b2c.html
   (conteúdo original da página preservado; aqui só entra o estilo)
══════════════════════════════════════════════════════════════ */
.gx-industria {
    display: block;
    overflow: hidden;
    background: #ffffff;
    color: #172033;
    font-family: Inter, Arial, sans-serif;
    line-height: 1.6;
}
.gx-industria * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
.gx-industria a {
    text-decoration: none;
    color: inherit;
}
.gx-industria .container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}
.gx-industria section {
    padding: 100px 0;
}
.gx-industria #solucoes {
    width: auto;
    left: auto;
}
.gx-industria .section-light {
    background: #f8fafc;
}

/* ---------- Tipografia comum ---------- */
.gx-industria .eyebrow {
    display: inline-block;
    background: #e0f2fe;
    color: #0284c7;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    padding: 6px 16px;
    border-radius: 100px;
    margin-bottom: 20px;
    border: 1px solid rgba(56, 189, 248, 0.4);
}
.gx-industria .eyebrow-light {
    background: rgba(56, 189, 248, 0.1);
    color: #38bdf8;
    border: 1px solid rgba(56, 189, 248, 0.3);
}

.gx-industria .section-heading {
    max-width: 780px;
    margin-bottom: 60px;
}
.gx-industria .section-heading.center {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}
.gx-industria .section-heading h2 {
    font-size: 38px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
    color: #0f172a;
}
.gx-industria .section-heading p {
    margin-top: 18px;
    color: #475569;
    font-size: 18px;
    line-height: 1.7;
}
.gx-industria .chain-section .section-heading h2 {
    color: #ffffff;
}
.gx-industria .chain-section .section-heading p {
    color: #94a3b8;
}

.gx-industria .btn {
    min-height: 52px;
    padding: 0 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 700;
    transition: all 0.3s ease;
}
.gx-industria .btn-primary {
    background: #00a0e3;
    color: #ffffff;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
}
.gx-industria .btn-primary:hover {
    background: #008cc6;
    transform: translateY(-2px);
}
.gx-industria .btn-outline {
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: #ffffff;
}
.gx-industria .btn-outline:hover {
    background: rgba(255, 255, 255, 0.05);
    border-color: #ffffff;
}

/* ══════════════════════════════════════════════
   HERO
══════════════════════════════════════════════ */
.gx-industria .hero {
    padding: 60px 0 100px 0;
    color: #ffffff;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.gx-industria .hero-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}
.gx-industria .hero h1 {
    max-width: 620px;
    font-size: 46px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1px;
    color: #ffffff;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}
.gx-industria .hero h1 span {
    color: #38bdf8;
}
.gx-industria .hero-description {
    max-width: 520px;
    margin-top: 22px;
    color: #cbd5e1;
    font-size: 18px;
    line-height: 1.7;
}
.gx-industria .hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 28px;
}
.gx-industria .hero-benefits {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
    margin-top: 44px;
}
.gx-industria .hero-benefit {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #cbd5e1;
    font-size: 13px;
}
.gx-industria .benefit-icon {
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 160, 227, 0.12);
    color: #38bdf8;
    font-weight: 700;
}

/* ---- DASHBOARD (mockup) ---- */
.gx-industria .dashboard {
    width: 100%;
    padding: 22px;
    background: #ffffff;
    color: #0f172a;
    border-radius: 18px;
    box-shadow: 0 30px 60px -15px rgba(0, 0, 0, 0.5);
}
.gx-industria .dashboard-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}
.gx-industria .dashboard-header strong {
    display: block;
    font-size: 15px;
    color: #0f172a;
}
.gx-industria .dashboard-header span {
    color: #94a3b8;
    font-size: 11.5px;
}
.gx-industria .status {
    padding: 6px 12px;
    background: #dcfce7;
    color: #16a34a;
    border-radius: 100px;
    font-size: 10.5px;
    font-weight: 700;
}
.gx-industria .stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}
.gx-industria .stat {
    padding: 14px;
    background: #f8fafc;
    border: 1px solid #f1f5f9;
    border-radius: 10px;
}
.gx-industria .stat span {
    display: block;
    color: #94a3b8;
    font-size: 10px;
}
.gx-industria .stat strong {
    display: block;
    margin-top: 6px;
    font-size: 15px;
    color: #0f172a;
}
.gx-industria .stat small {
    color: #16a34a;
    font-size: 10px;
    font-weight: 600;
}
.gx-industria .dashboard-main {
    display: grid;
    grid-template-columns: 1.55fr 0.85fr;
    gap: 12px;
    margin-top: 12px;
}
.gx-industria .chart-card,
.gx-industria .channel-card {
    padding: 16px;
    background: #ffffff;
    border: 1px solid #f1f5f9;
    border-radius: 12px;
}
.gx-industria .chart-title {
    font-size: 12.5px;
    font-weight: 700;
    color: #0f172a;
}
.gx-industria .chart {
    height: 170px;
    position: relative;
    margin-top: 20px;
    background: repeating-linear-gradient(0deg, transparent, transparent 33px, #f1f5f9 34px);
}
.gx-industria .chart svg {
    width: 100%;
    height: 100%;
}
.gx-industria .sales-channel {
    display: grid;
    gap: 8px;
    margin-top: 22px;
}
.gx-industria .sales-channel-item {
    padding: 12px;
    background: #f8fafc;
    border-radius: 9px;
}
.gx-industria .sales-channel-item span {
    display: block;
    color: #94a3b8;
    font-size: 10px;
}
.gx-industria .sales-channel-item strong {
    color: #0f172a;
    font-size: 13px;
}

/* ══════════════════════════════════════════════
   DESAFIOS
══════════════════════════════════════════════ */
.gx-industria .challenge-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
.gx-industria .challenge {
    min-height: 0;
    padding: 26px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    transition: all 0.3s ease;
}
.gx-industria .challenge:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.06);
    border-color: #00a0e3;
}
.gx-industria .challenge-number {
    color: #00a0e3;
    font-weight: 800;
    font-size: 12px;
    margin-bottom: 40px;
}
.gx-industria .challenge h3 {
    font-size: 18px;
    color: #0f172a;
}
.gx-industria .challenge p {
    margin-top: 12px;
    color: #64748b;
    font-size: 13.5px;
    line-height: 1.6;
}

/* ══════════════════════════════════════════════
   CADEIA COMERCIAL (fluxo)
══════════════════════════════════════════════ */
.gx-industria .chain-section {
    color: #ffffff;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.gx-industria .chain {
    margin-top: 56px;
    display: grid;
    grid-template-columns: 1fr 40px 1fr 40px 1fr 40px 1fr;
    align-items: center;
    gap: 8px;
}
.gx-industria .chain-card {
    min-height: 140px;
    padding: 22px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 14px;
}
.gx-industria .chain-card strong {
    font-size: 16px;
}
.gx-industria .chain-card span {
    margin-top: 8px;
    color: #94a3b8;
    font-size: 11px;
}
.gx-industria .chain-card.main {
    background: #00a0e3;
    border-color: #00a0e3;
}
.gx-industria .chain-card.main span {
    color: #ffffff;
    opacity: 0.85;
}
.gx-industria .chain-arrow {
    text-align: center;
    color: #38bdf8;
    font-size: 20px;
}

/* ══════════════════════════════════════════════
   CANAIS
══════════════════════════════════════════════ */
.gx-industria .channel-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}
.gx-industria .channel-card-large {
    min-height: 0;
    padding: 30px;
    display: flex;
    flex-direction: column;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #ffffff;
    transition: all 0.3s ease;
}
.gx-industria .channel-card-large:hover {
    transform: translateY(-5px);
    border-color: #00a0e3;
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.06);
}
.gx-industria .channel-tag {
    width: fit-content;
    margin-bottom: 40px;
    padding: 6px 12px;
    background: #e0f2fe;
    color: #0284c7;
    border-radius: 100px;
    font-size: 11px;
    font-weight: 700;
}
.gx-industria .channel-card-large h3 {
    font-size: 24px;
    color: #0f172a;
}
.gx-industria .channel-card-large p {
    margin-top: 14px;
    color: #64748b;
    font-size: 14px;
}
.gx-industria .channel-card-large ul {
    list-style: none;
    margin-top: 22px;
    display: grid;
    gap: 10px;
    font-size: 13px;
    color: #334155;
}
.gx-industria .channel-card-large li::before {
    content: "✓";
    margin-right: 8px;
    color: #10b981;
    font-weight: 800;
}
.gx-industria .channel-card-large a {
    margin-top: auto;
    padding-top: 24px;
    color: #00a0e3;
    font-size: 13px;
    font-weight: 700;
}

/* ══════════════════════════════════════════════
   FORÇA DE VENDAS
══════════════════════════════════════════════ */
.gx-industria .feature-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}
.gx-industria .feature-text h2 {
    font-size: 34px;
    font-weight: 800;
    letter-spacing: -1px;
    line-height: 1.25;
    color: #0f172a;
}
.gx-industria .feature-text p {
    margin-top: 18px;
    color: #475569;
    font-size: 16px;
    line-height: 1.7;
}
.gx-industria .feature-list {
    list-style: none !important;
    margin: 26px 0 0 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
}
.gx-industria .feature-list li {
    font-size: 14px;
    font-weight: 500;
    color: #334155;
}
.gx-industria .feature-list li::before {
    content: "✓";
    margin-right: 8px;
    color: #10b981;
    font-weight: 800;
}

.gx-industria .sales-app {
    padding: 22px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-industria .sales-app-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 16px;
    border-bottom: 1px solid #f1f5f9;
}
.gx-industria .sales-app-header strong {
    color: #0f172a;
    font-size: 14px;
}
.gx-industria .sales-app-header span {
    color: #16a34a;
    font-size: 12px;
    font-weight: 600;
}
.gx-industria .sales-app-body {
    margin-top: 18px;
}
.gx-industria .client-card {
    padding: 18px;
    background: #f8fafc;
    border-radius: 12px;
}
.gx-industria .client-card small {
    color: #94a3b8;
}
.gx-industria .client-card h3 {
    margin-top: 4px;
    color: #0f172a;
    font-size: 16px;
}
.gx-industria .client-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    margin-top: 18px;
}
.gx-industria .client-grid div {
    padding: 13px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
}
.gx-industria .client-grid span {
    display: block;
    color: #94a3b8;
    font-size: 10.5px;
}
.gx-industria .client-grid strong {
    display: block;
    margin-top: 4px;
    color: #0f172a;
    font-size: 13.5px;
}
.gx-industria .app-btn {
    margin-top: 16px;
    padding: 13px;
    background: #00a0e3;
    color: #ffffff;
    border-radius: 8px;
    text-align: center;
    font-size: 13px;
    font-weight: 700;
}

/* ══════════════════════════════════════════════
   INTEGRAÇÃO (ERP)
══════════════════════════════════════════════ */
.gx-industria .erp-section {
    color: #ffffff;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.gx-industria .erp-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}
.gx-industria .erp-grid h2 {
    font-size: 34px;
    font-weight: 800;
    letter-spacing: -1px;
    line-height: 1.25;
    color: #ffffff;
}
.gx-industria .erp-grid h2 span {
    color: #38bdf8;
}
.gx-industria .erp-grid p {
    margin-top: 20px;
    color: #94a3b8;
    font-size: 16px;
    line-height: 1.7;
}
.gx-industria .integration-map {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}
.gx-industria .integration-box {
    min-height: 90px;
    padding: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 12px;
    font-size: 13px;
    font-weight: 700;
}
.gx-industria .integration-box.main {
    grid-column: 1 / -1;
    min-height: 100px;
    background: #00a0e3;
    border-color: #00a0e3;
    font-size: 19px;
}

/* ══════════════════════════════════════════════
   CRM
══════════════════════════════════════════════ */
.gx-industria .crm-card {
    padding: 26px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08);
}
.gx-industria .crm-title {
    font-size: 16px;
    font-weight: 700;
    color: #0f172a;
}
.gx-industria .crm-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    margin-top: 20px;
}
.gx-industria .crm-item {
    padding: 14px;
    background: #f8fafc;
    border-radius: 10px;
}
.gx-industria .crm-item span {
    display: block;
    font-size: 10.5px;
    color: #94a3b8;
}
.gx-industria .crm-item strong {
    display: block;
    margin-top: 4px;
    color: #0f172a;
    font-size: 14px;
}
.gx-industria .crm-alert {
    margin-top: 16px;
    padding: 14px;
    background: #fef3c7;
    border-radius: 10px;
    color: #92620a;
    font-size: 12.5px;
    font-weight: 600;
}

/* ══════════════════════════════════════════════
   NEWTON
══════════════════════════════════════════════ */
.gx-industria .newton-section {
    color: #ffffff;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.gx-industria .newton-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}
.gx-industria .newton-grid h2 {
    font-size: 36px;
    font-weight: 800;
    letter-spacing: -1px;
    color: #ffffff;
}
.gx-industria .newton-grid p {
    margin-top: 20px;
    color: #94a3b8;
    font-size: 16px;
    line-height: 1.7;
}
.gx-industria .chat {
    padding: 24px;
    background: #111827;
    border: 1px solid #1e293b;
    border-radius: 18px;
}
.gx-industria .message {
    max-width: 84%;
    padding: 13px 16px;
    margin-bottom: 12px;
    border-radius: 14px;
    font-size: 13px;
    line-height: 1.5;
}
.gx-industria .message.user {
    margin-left: auto;
    background: #00a0e3;
    color: #ffffff;
    border-radius: 14px 14px 3px 14px;
}
.gx-industria .message.ai {
    background: rgba(255, 255, 255, 0.06);
    color: #cbd5e1;
    border-radius: 14px 14px 14px 3px;
}

/* ══════════════════════════════════════════════
   RESULTADOS
══════════════════════════════════════════════ */
.gx-industria .result-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
    margin-top: 50px;
}
.gx-industria .result {
    padding: 24px;
    border-left: 2px solid #00a0e3;
}
.gx-industria .result strong {
    display: block;
    font-size: 19px;
    color: #0f172a;
}
.gx-industria .result span {
    display: block;
    margin-top: 8px;
    color: #64748b;
    font-size: 13px;
    line-height: 1.5;
}

/* ══════════════════════════════════════════════
   ECOSSISTEMA
══════════════════════════════════════════════ */
.gx-industria .ecosystem {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-top: 44px;
}
.gx-industria .ecosystem-column {
    padding: 22px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
}
.gx-industria .ecosystem-column h3 {
    color: #00a0e3;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1px;
}
.gx-industria .ecosystem-column ul {
    list-style: none;
    margin-top: 18px;
    display: grid;
    gap: 10px;
    font-size: 13.5px;
    color: #334155;
}

/* ══════════════════════════════════════════════
   CTA
══════════════════════════════════════════════ */
.gx-industria .cta {
    position: relative;
    text-align: center;
    color: #ffffff;
    overflow: hidden;
    background: #0b0f19;
}
.gx-industria .cta::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 600px;
    height: 400px;
    background: radial-gradient(circle, rgba(0, 160, 227, 0.15) 0%, rgba(11, 15, 25, 0) 70%);
}
.gx-industria .cta .container {
    position: relative;
    z-index: 1;
    max-width: 800px;
}
.gx-industria .cta h2 {
    max-width: 850px;
    margin: 0 auto;
    font-size: 42px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
    color: #ffffff;
}
.gx-industria .cta h2 span {
    display: block;
    color: #94a3b8;
    font-size: 22px;
    font-weight: 500;
    margin-top: 12px;
}
.gx-industria .cta p {
    max-width: 640px;
    margin: 20px auto 32px;
    color: #94a3b8;
    font-size: 17px;
    line-height: 1.7;
}

/* ══════════════════════════════════════════════
   RESPONSIVO
══════════════════════════════════════════════ */
@media (max-width: 992px) {
    .gx-industria .hero-grid,
    .gx-industria .feature-grid,
    .gx-industria .erp-grid,
    .gx-industria .newton-grid {
        grid-template-columns: 1fr;
    }
    .gx-industria .hero {
        padding: 60px 0;
    }
    .gx-industria .challenge-grid,
    .gx-industria .result-grid,
    .gx-industria .ecosystem {
        grid-template-columns: repeat(2, 1fr);
    }
    .gx-industria .channel-grid {
        grid-template-columns: 1fr;
    }
    .gx-industria .chain {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .gx-industria .chain-arrow {
        transform: rotate(90deg);
    }
}
@media (max-width: 768px) {
    .gx-industria section {
        padding: 64px 0;
    }
    .gx-industria .hero h1 {
        font-size: 32px;
    }
    .gx-industria .hero-actions {
        flex-direction: column;
    }
    .gx-industria .hero-benefits {
        flex-direction: column;
        gap: 16px;
    }
    .gx-industria .stats {
        grid-template-columns: repeat(2, 1fr);
    }
    .gx-industria .dashboard-main {
        grid-template-columns: 1fr;
    }
    .gx-industria .challenge-grid,
    .gx-industria .result-grid,
    .gx-industria .ecosystem {
        grid-template-columns: 1fr;
    }
    .gx-industria .feature-list {
        grid-template-columns: 1fr !important;
    }
    .gx-industria .integration-map {
        grid-template-columns: 1fr;
    }
    .gx-industria .integration-box.main {
        grid-column: auto;
    }
    .gx-industria .section-heading h2,
    .gx-industria .feature-text h2,
    .gx-industria .erp-grid h2,
    .gx-industria .newton-grid h2,
    .gx-industria .cta h2 {
        font-size: 26px;
    }
}

/* ══════════════════════════════════════════════════════════
   CARREIRA (Carreira.html) — padrão visual b2c
══════════════════════════════════════════════════════════ */
.career {
    display: block;
    overflow: hidden;
    background: #ffffff;
    color: #0f172a;
    font-family: Inter, Arial, sans-serif;
    line-height: 1.6;
}
.career * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
.career a {
    text-decoration: none;
    color: inherit;
}
.career .container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}
.career section {
    padding: 100px 0;
}
.career .growth {
    border: none;
}

/* ---------- Tipografia comum ---------- */
.career .eyebrow {
    display: inline-block;
    background: #e0f2fe;
    color: #0284c7;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    padding: 6px 16px;
    border-radius: 100px;
    margin-bottom: 20px;
    border: 1px solid rgba(56, 189, 248, 0.4);
}
.career .eyebrow.dark {
    background: #0f172a;
    color: #38bdf8;
    border: 1px solid #0f172a;
}

.career .section-header {
    max-width: 760px;
    margin-bottom: 60px;
}
.career .section-header-center {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}
.career .section-header h2 {
    font-size: 38px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
    color: #0f172a;
}
.career .section-header h2 span {
    color: #00a0e3;
}
.career .section-header p {
    margin-top: 18px;
    color: #475569;
    font-size: 18px;
    line-height: 1.7;
}

.career .btn {
    min-height: 52px;
    padding: 0 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 700;
    transition: all 0.3s ease;
}
.career .btn-primary {
    background: #00a0e3;
    color: #ffffff;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
}
.career .btn-primary:hover {
    background: #008cc6;
    transform: translateY(-2px);
}
.career .btn-secondary {
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.3);
}
.career .btn-secondary:hover {
    background: rgba(255, 255, 255, 0.14);
    border-color: #ffffff;
}
.career .btn-dark {
    background: #ffffff;
    color: #0f172a;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
}
.career .btn-dark:hover {
    background: #f1f5f9;
    transform: translateY(-2px);
}

/* ══════════════════════════════════════════════
   HERO
══════════════════════════════════════════════ */
.career .hero {
    padding: 60px 0 100px 0;
    color: #ffffff;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.career .hero-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}
.career .hero h1 {
    max-width: 560px;
    font-size: 46px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1px;
    color: #ffffff;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}
.career .hero h1 span {
    color: #38bdf8;
}
.career .hero-description {
    max-width: 520px;
    margin-top: 22px;
    color: #cbd5e1;
    font-size: 18px;
    line-height: 1.7;
}
.career .hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 28px;
}
.career .hero-actions .btn span {
    margin-left: 8px;
}

/* ---- HERO VISUAL (mockup) ---- */
.career .hero-visual {
    position: relative;
}
.career .hero-image {
    background: #ffffff;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 30px 60px -15px rgba(0, 0, 0, 0.5);
    transform: perspective(1200px) rotateY(-3deg) rotateX(1deg);
}
.career .placeholder-top {
    display: flex;
    gap: 8px;
    padding: 16px 20px;
    background: #f8fafc;
    border-bottom: 1px solid #f1f5f9;
}
.career .placeholder-top span {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #e2e8f0;
}
.career .placeholder-top span:nth-child(1) {
    background: #f87171;
}
.career .placeholder-top span:nth-child(2) {
    background: #fbbf24;
}
.career .placeholder-top span:nth-child(3) {
    background: #34d399;
}
.career .placeholder-content {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 16px;
    padding: 40px 30px;
    min-height: 260px;
    background: linear-gradient(180deg, #f8fafc, #eef2f7);
}
.career .person {
    width: 90px;
    border-radius: 16px 16px 0 0;
    background: linear-gradient(180deg, #00a0e3, #0284c7);
}
.career .person-1 {
    height: 150px;
}
.career .person-2 {
    height: 190px;
    background: linear-gradient(180deg, #38bdf8, #00a0e3);
}
.career .person-3 {
    height: 130px;
}
.career .hero-floating-card {
    position: absolute;
    bottom: -22px;
    left: -22px;
    background: #ffffff;
    color: #0f172a;
    padding: 16px 20px;
    border-radius: 14px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.25);
}
.career .hero-floating-card small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
}
.career .hero-floating-card strong {
    display: block;
    margin-top: 4px;
    font-size: 14px;
    color: #0f172a;
}

/* ══════════════════════════════════════════════
   O QUE ESTAMOS CONSTRUINDO (ecosystem)
══════════════════════════════════════════════ */
.career .ecosystem {
    display: grid;
    grid-template-columns: 200px 60px 160px 60px 1fr;
    align-items: center;
    gap: 20px;
    margin-top: 60px;
}
.career .ecosystem-inputs {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.career .eco-node {
    padding: 14px 20px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    min-width: 160px;
}
.career .eco-node small {
    display: block;
    color: #00a0e3;
    font-weight: 800;
    font-size: 11px;
}
.career .eco-node strong {
    display: block;
    margin-top: 4px;
    font-size: 14px;
    color: #0f172a;
}
.career .eco-connector {
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, rgba(0, 160, 227, 0.15), #00a0e3, rgba(0, 160, 227, 0.15));
}
.career .eco-core {
    justify-self: center;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    box-shadow: 0 20px 40px rgba(0, 160, 227, 0.3);
}
.career .eco-core span {
    color: rgba(255, 255, 255, 0.8);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
}
.career .eco-core strong {
    display: block;
    color: #ffffff;
    font-size: 16px;
    font-weight: 800;
    margin-top: 4px;
}
.career .ecosystem-products {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}
.career .product-card {
    flex: 1;
    min-width: 180px;
    padding: 22px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    transition: all 0.3s ease;
}
.career .product-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.06);
    border-color: #00a0e3;
}
.career .product-number {
    color: #00a0e3;
    font-weight: 800;
    font-size: 12px;
    margin-bottom: 14px;
}
.career .hub-card .product-number {
    color: #802be2;
}
.career .data-card .product-number {
    color: #f59e0b;
}
.career .product-card h3 {
    font-size: 17px;
    color: #0f172a;
}
.career .product-card p {
    margin-top: 8px;
    color: #64748b;
    font-size: 13px;
    line-height: 1.6;
}
.career .mini-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 14px;
}
.career .mini-tags span {
    padding: 4px 10px;
    background: #f1f5f9;
    color: #475569;
    font-size: 11px;
    font-weight: 600;
    border-radius: 100px;
}

/* ══════════════════════════════════════════════
   IMPACTO
══════════════════════════════════════════════ */
.career .impact {
    background: #f8fafc;
}
.career .impact-intro {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 40px;
    flex-wrap: wrap;
    margin-bottom: 50px;
}
.career .impact-intro h2 {
    font-size: 34px;
    font-weight: 800;
    letter-spacing: -1px;
    color: #0f172a;
    line-height: 1.25;
}
.career .impact-intro h2 span {
    display: block;
    color: #00a0e3;
}
.career .impact-intro > p {
    max-width: 380px;
    color: #475569;
    font-size: 16px;
    line-height: 1.7;
}
.career .impact-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
.career .impact-card {
    padding: 26px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    transition: all 0.3s ease;
}
.career .impact-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.06);
    border-color: #00a0e3;
}
.career .impact-card.highlight {
    background: #0f172a;
    border-color: #0f172a;
}
.career .impact-card.highlight h3 {
    color: #ffffff;
}
.career .impact-card.highlight p {
    color: #94a3b8;
}
.career .impact-icon {
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(0, 160, 227, 0.1);
    color: #00a0e3;
    font-weight: 800;
    font-size: 13px;
    margin-bottom: 18px;
}
.career .impact-card.highlight .impact-icon {
    background: rgba(56, 189, 248, 0.15);
    color: #38bdf8;
}
.career .impact-card h3 {
    font-size: 17px;
    color: #0f172a;
}
.career .impact-card p {
    margin-top: 10px;
    color: #64748b;
    font-size: 13.5px;
    line-height: 1.6;
}

/* ══════════════════════════════════════════════
   PRINCÍPIOS
══════════════════════════════════════════════ */
.career .principles-grid {
    display: grid;
    grid-template-columns: 0.8fr 1.2fr;
    gap: 60px;
}
.career .principles-heading h2 {
    font-size: 34px;
    font-weight: 800;
    letter-spacing: -1px;
    color: #0f172a;
    line-height: 1.25;
}
.career .principles-heading h2 span {
    display: block;
    color: #00a0e3;
}
.career .principles-heading p {
    margin-top: 18px;
    color: #475569;
    font-size: 16px;
    line-height: 1.7;
}
.career .principles-list {
    display: grid;
    gap: 28px;
}
.career .principle {
    display: flex;
    gap: 20px;
    padding-bottom: 28px;
    border-bottom: 1px solid #f1f5f9;
}
.career .principle:last-child {
    border-bottom: none;
    padding-bottom: 0;
}
.career .principle > span {
    flex-shrink: 0;
    color: #00a0e3;
    font-weight: 800;
    font-size: 13px;
}
.career .principle h3 {
    font-size: 16px;
    color: #0f172a;
}
.career .principle p {
    margin-top: 6px;
    color: #64748b;
    font-size: 13.5px;
    line-height: 1.6;
}

/* ══════════════════════════════════════════════
   DESAFIOS
══════════════════════════════════════════════ */
.career .challenges {
    background: #f8fafc;
}
.career .challenge-grid {
    display: grid;
    grid-template-columns: 0.9fr 1.1fr;
    gap: 50px;
}
.career .challenge-map {
    display: grid;
    gap: 0;
}
.career .challenge-layer {
    padding: 22px 24px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
}
.career .challenge-layer small {
    display: block;
    color: #00a0e3;
    font-weight: 800;
    font-size: 11px;
    letter-spacing: 1px;
}
.career .challenge-layer strong {
    display: block;
    margin-top: 6px;
    font-size: 18px;
    color: #0f172a;
}
.career .challenge-layer p {
    margin-top: 6px;
    color: #64748b;
    font-size: 13px;
}
.career .challenge-arrow {
    text-align: center;
    padding: 10px 0;
    color: #94a3b8;
    font-size: 18px;
}
.career .challenge-questions {
    display: grid;
    gap: 18px;
}
.career .question {
    display: flex;
    gap: 16px;
    padding: 18px 20px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
}
.career .question span {
    flex-shrink: 0;
    color: #00a0e3;
    font-weight: 800;
    font-size: 13px;
}
.career .question p {
    color: #475569;
    font-size: 14px;
    line-height: 1.6;
}

/* ══════════════════════════════════════════════
   ÁREAS
══════════════════════════════════════════════ */
.career .areas-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
.career .area-card {
    padding: 26px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    transition: all 0.3s ease;
}
.career .area-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.06);
    border-color: #00a0e3;
    background: #ffffff;
}
.career .area-icon {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: rgba(0, 160, 227, 0.1);
    color: #00a0e3;
    font-size: 17px;
    font-weight: 700;
    margin-bottom: 20px;
}
.career .area-card h3 {
    font-size: 17px;
    color: #0f172a;
}
.career .area-card p {
    margin-top: 10px;
    color: #64748b;
    font-size: 13.5px;
    line-height: 1.6;
}
.career .area-tags {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #e2e8f0;
    color: #94a3b8;
    font-size: 11.5px;
    font-weight: 600;
}

/* ══════════════════════════════════════════════
   COMO TRABALHAMOS
══════════════════════════════════════════════ */
.career .work {
    background: #f8fafc;
}
.career .work-grid {
    display: grid;
    grid-template-columns: 1fr 1.1fr;
    gap: 60px;
    align-items: center;
}
.career .work-image {
    background: #ffffff;
    border-radius: 18px;
    padding: 30px;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.08);
}
.career .work-placeholder {
    position: relative;
}
.career .work-screen {
    height: 220px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(0, 160, 227, 0.12), rgba(128, 43, 226, 0.08));
    border: 1px solid #e2e8f0;
}
.career .work-person {
    position: absolute;
    bottom: -20px;
    right: 20px;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    border: 5px solid #ffffff;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
}
.career .work-content h2 {
    font-size: 34px;
    font-weight: 800;
    letter-spacing: -1px;
    color: #0f172a;
    line-height: 1.25;
}
.career .work-content h2 span {
    display: block;
    color: #00a0e3;
}
.career .work-description {
    margin-top: 18px;
    color: #475569;
    font-size: 17px;
    line-height: 1.7;
    max-width: 520px;
}
.career .work-items {
    margin-top: 36px;
    display: grid;
    gap: 24px;
}
.career .work-items article {
    display: flex;
    gap: 18px;
}
.career .work-items article > span {
    flex-shrink: 0;
    color: #00a0e3;
    font-weight: 800;
    font-size: 13px;
}
.career .work-items h3 {
    font-size: 16px;
    color: #0f172a;
}
.career .work-items p {
    margin-top: 6px;
    color: #64748b;
    font-size: 13.5px;
    line-height: 1.6;
}

/* ══════════════════════════════════════════════
   CRESCIMENTO
══════════════════════════════════════════════ */
.career .growth-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}
.career .growth-grid > div > h2 {
    font-size: 34px;
    font-weight: 800;
    letter-spacing: -1px;
    color: #0f172a;
    line-height: 1.25;
}
.career .growth-grid > div > h2 span {
    display: block;
    color: #00a0e3;
}
.career .growth-grid > div > p {
    margin-top: 18px;
    color: #475569;
    font-size: 16px;
    line-height: 1.7;
}
.career .growth-path {
    display: flex;
    flex-direction: column;
}
.career .growth-step {
    display: flex;
    align-items: center;
    gap: 16px;
}
.career .growth-step span {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #f1f5f9;
    color: #64748b;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 13px;
}
.career .growth-step strong {
    font-size: 15px;
    color: #0f172a;
}
.career .growth-step.active span {
    background: #00a0e3;
    color: #ffffff;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
}
.career .growth-step.active strong {
    color: #00a0e3;
}
.career .growth-line {
    width: 2px;
    height: 28px;
    background: #e2e8f0;
    margin-left: 19px;
}

/* ══════════════════════════════════════════════
   VAGAS
══════════════════════════════════════════════ */
.career .jobs {
    background: #f8fafc;
}
.career .jobs-heading {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 40px;
    flex-wrap: wrap;
    margin-bottom: 40px;
}
.career .jobs-heading h2 {
    font-size: 34px;
    font-weight: 800;
    letter-spacing: -1px;
    color: #0f172a;
    line-height: 1.25;
}
.career .jobs-heading h2 span {
    display: block;
    color: #00a0e3;
}
.career .jobs-heading p {
    max-width: 380px;
    color: #475569;
    font-size: 16px;
    line-height: 1.7;
}
.career .job-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 30px;
}
.career .job-filters button {
    padding: 10px 20px;
    border-radius: 100px;
    border: 1px solid #e2e8f0;
    background: #ffffff;
    color: #475569;
    font-size: 13px;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: all 0.2s ease;
}
.career .job-filters button:hover {
    border-color: #00a0e3;
    color: #00a0e3;
}
.career .job-filters button.active {
    background: #0f172a;
    border-color: #0f172a;
    color: #ffffff;
}
.career .job-list {
    display: grid;
    gap: 12px;
}
.career .job {
    display: flex;
    align-items: center;
    gap: 24px;
    padding: 22px 26px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    transition: all 0.3s ease;
}
.career .job:hover {
    border-color: #00a0e3;
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.06);
    transform: translateY(-2px);
}
.career .job-type {
    flex-shrink: 0;
    width: 130px;
    color: #00a0e3;
    font-weight: 800;
    font-size: 11px;
    letter-spacing: 1px;
}
.career .job-main {
    flex: 1;
}
.career .job-main h3 {
    font-size: 16px;
    color: #0f172a;
}
.career .job-meta {
    display: flex;
    gap: 14px;
    margin-top: 6px;
    color: #94a3b8;
    font-size: 12.5px;
}
.career .job-arrow {
    flex-shrink: 0;
    color: #00a0e3;
    font-size: 18px;
}
.career .spontaneous {
    margin-top: 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
    padding: 30px 34px;
    background: #0f172a;
    border-radius: 16px;
}
.career .spontaneous small {
    display: block;
    color: #38bdf8;
    font-weight: 700;
    font-size: 11px;
    letter-spacing: 1px;
}
.career .spontaneous h3 {
    margin-top: 6px;
    color: #ffffff;
    font-size: 18px;
    font-weight: 700;
}

/* ══════════════════════════════════════════════
   PROCESSO
══════════════════════════════════════════════ */
.career .process-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
.career .process-step {
    padding: 26px 22px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
}
.career .process-step > span {
    display: block;
    color: #00a0e3;
    font-weight: 800;
    font-size: 20px;
    margin-bottom: 16px;
}
.career .process-step h3 {
    font-size: 16px;
    color: #0f172a;
}
.career .process-step p {
    margin-top: 8px;
    color: #64748b;
    font-size: 13px;
    line-height: 1.6;
}

/* ══════════════════════════════════════════════
   CTA FINAL
══════════════════════════════════════════════ */
.career .final-cta {
    position: relative;
    padding: 120px 0;
    text-align: center;
    color: #ffffff;
    overflow: hidden;
    background: #0b0f19;
}
.career .final-cta::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 600px;
    height: 400px;
    background: radial-gradient(circle, rgba(0, 160, 227, 0.15) 0%, rgba(11, 15, 25, 0) 70%);
}
.career .final-cta-inner {
    position: relative;
    z-index: 1;
    max-width: 800px;
    margin: 0 auto;
}
.career .final-cta h2 {
    font-size: 42px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
    color: #ffffff;
}
.career .final-cta h2 span {
    display: block;
    color: #94a3b8;
    font-size: 22px;
    font-weight: 500;
    margin-top: 12px;
}
.career .final-cta p {
    max-width: 640px;
    margin: 20px auto 32px;
    color: #94a3b8;
    font-size: 17px;
    line-height: 1.7;
}
.career .final-actions {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 16px;
}

/* ══════════════════════════════════════════════
   RESPONSIVO
══════════════════════════════════════════════ */
@media (max-width: 992px) {
    .career .hero-grid,
    .career .principles-grid,
    .career .challenge-grid,
    .career .work-grid,
    .career .growth-grid {
        grid-template-columns: 1fr;
    }
    .career .impact-grid,
    .career .areas-grid,
    .career .process-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .career .ecosystem {
        grid-template-columns: 1fr;
        justify-items: center;
    }
    .career .eco-connector {
        width: 2px;
        height: 40px;
    }
    .career .ecosystem-inputs,
    .career .ecosystem-products {
        width: 100%;
    }
    .career .work-grid {
        gap: 40px;
    }
    .career .work-image {
        order: -1;
    }
}
@media (max-width: 640px) {
    .career section {
        padding: 60px 0;
    }
    .career .hero {
        padding: 40px 0 60px 0;
    }
    .career .hero h1 {
        font-size: 32px;
    }
    .career .hero-actions,
    .career .final-actions {
        flex-direction: column;
        align-items: stretch;
    }
    .career .impact-grid,
    .career .areas-grid,
    .career .process-grid {
        grid-template-columns: 1fr;
    }
    .career .impact-intro,
    .career .jobs-heading {
        flex-direction: column;
        align-items: flex-start;
    }
    .career .job {
        flex-wrap: wrap;
    }
    .career .job-type {
        width: auto;
    }
    .career .spontaneous {
        flex-direction: column;
        align-items: flex-start;
    }
    .career .final-cta h2 {
        font-size: 30px;
    }
}

/* ══════════════════════════════════════════════════════════
   CASES (Case.html) — padrão visual b2c
══════════════════════════════════════════════════════════ */
.gx-cases {
    display: block;
    overflow: hidden;
    background: #ffffff;
    color: #0f172a;
    font-family: Inter, Arial, sans-serif;
    line-height: 1.6;
}
.gx-cases * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
.gx-cases a {
    text-decoration: none;
    color: inherit;
}
.gx-cases .container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}
.gx-cases section {
    padding: 100px 0;
}

/* ---------- Tipografia comum ---------- */
.gx-cases .eyebrow {
    display: inline-block;
    background: #e0f2fe;
    color: #0284c7;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    padding: 6px 16px;
    border-radius: 100px;
    margin-bottom: 20px;
    border: 1px solid rgba(56, 189, 248, 0.4);
}
.gx-cases .eyebrow.dark {
    background: rgba(56, 189, 248, 0.1);
    color: #38bdf8;
    border: 1px solid rgba(56, 189, 248, 0.3);
}

.gx-cases .btn {
    min-height: 52px;
    padding: 0 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 700;
    transition: all 0.3s ease;
}
.gx-cases .btn-primary {
    background: #00a0e3;
    color: #ffffff;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
}
.gx-cases .btn-primary:hover {
    background: #008cc6;
    transform: translateY(-2px);
}
.gx-cases .btn-outline {
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: #ffffff;
}
.gx-cases .btn-outline:hover {
    background: rgba(255, 255, 255, 0.05);
    border-color: #ffffff;
}
.gx-cases .text-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #00a0e3;
    font-weight: 700;
    font-size: 14px;
    margin-top: 20px;
}
.gx-cases .text-link:hover {
    color: #008cc6;
}
.gx-cases .text-link.dark-link {
    color: #38bdf8;
}
.gx-cases .text-link.dark-link:hover {
    color: #7dd3fc;
}

/* ══════════════════════════════════════════════
   HERO
══════════════════════════════════════════════ */
.gx-cases .hero {
    padding: 60px 0 100px 0;
    color: #ffffff;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.gx-cases .hero-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}
.gx-cases .hero-content h1 {
    max-width: 560px;
    font-size: 46px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1px;
    color: #ffffff;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}
.gx-cases .hero-content h1 span {
    color: #38bdf8;
}
.gx-cases .hero-content > p {
    max-width: 520px;
    margin-top: 22px;
    color: #cbd5e1;
    font-size: 18px;
    line-height: 1.7;
}
.gx-cases .hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 28px;
}

/* ---- HERO VISUAL (mockup) ---- */
.gx-cases .hero-visual {
    position: relative;
}
.gx-cases .hero-window {
    background: #0f172a;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 30px 60px -15px rgba(0, 0, 0, 0.5);
}
.gx-cases .window-top {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 14px 18px;
    background: rgba(255, 255, 255, 0.03);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.gx-cases .window-dots {
    display: flex;
    gap: 6px;
}
.gx-cases .window-dots span {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.15);
}
.gx-cases .window-top small {
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
}
.gx-cases .operation {
    padding: 40px 30px;
    display: grid;
    gap: 20px;
}
.gx-cases .operation-row {
    display: flex;
    gap: 16px;
}
.gx-cases .operation-row.three {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}
.gx-cases .operation-node {
    flex: 1;
    padding: 16px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    text-align: center;
}
.gx-cases .operation-node small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
}
.gx-cases .operation-node strong {
    display: block;
    margin-top: 6px;
    color: #ffffff;
    font-size: 14px;
}
.gx-cases .operation-line {
    width: 2px;
    height: 28px;
    margin: 0 auto;
    background: linear-gradient(180deg, rgba(0, 160, 227, 0.15), #00a0e3, rgba(0, 160, 227, 0.15));
}
.gx-cases .operation-core {
    width: 150px;
    margin: 0 auto;
    padding: 16px;
    border-radius: 14px;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    text-align: center;
    box-shadow: 0 20px 40px rgba(0, 160, 227, 0.3);
}
.gx-cases .operation-core small {
    display: block;
    color: rgba(255, 255, 255, 0.8);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
}
.gx-cases .operation-core strong {
    display: block;
    margin-top: 4px;
    color: #ffffff;
    font-size: 15px;
    font-weight: 800;
}
.gx-cases .operation-product {
    padding: 14px 10px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 10px;
    text-align: center;
    color: #e2e8f0;
    font-size: 12.5px;
    font-weight: 600;
}
.gx-cases .hero-status {
    position: absolute;
    bottom: -22px;
    left: -22px;
    display: flex;
    align-items: center;
    gap: 12px;
    background: #ffffff;
    color: #0f172a;
    padding: 14px 20px;
    border-radius: 14px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.25);
}
.gx-cases .status-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #16a34a;
    box-shadow: 0 0 0 4px rgba(22, 163, 74, 0.15);
    flex-shrink: 0;
}
.gx-cases .hero-status small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
}
.gx-cases .hero-status strong {
    display: block;
    margin-top: 2px;
    font-size: 13px;
    color: #0f172a;
}

/* ══════════════════════════════════════════════
   INTRO
══════════════════════════════════════════════ */
.gx-cases .intro-grid {
    display: grid;
    grid-template-columns: 0.8fr 1.2fr;
    gap: 60px;
    align-items: start;
}
.gx-cases .intro-grid h2 {
    font-size: 32px;
    font-weight: 800;
    letter-spacing: -1px;
    color: #0f172a;
    line-height: 1.3;
}
.gx-cases .intro-grid h2 span {
    display: block;
    color: #00a0e3;
}
.gx-cases .intro-copy p {
    color: #475569;
    font-size: 16px;
    line-height: 1.75;
}
.gx-cases .intro-copy p + p {
    margin-top: 16px;
}

/* ══════════════════════════════════════════════
   CASE DESTAQUE
══════════════════════════════════════════════ */
.gx-cases .section-label {
    color: #00a0e3;
    font-weight: 800;
    font-size: 12px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    margin-bottom: 24px;
}
.gx-cases .featured-case {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}
.gx-cases .case-brand {
    display: inline-block;
    padding: 6px 14px;
    background: #f1f5f9;
    color: #475569;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1px;
    border-radius: 100px;
    margin-bottom: 18px;
}
.gx-cases .featured-content h2 {
    font-size: 32px;
    font-weight: 800;
    letter-spacing: -1px;
    color: #0f172a;
    line-height: 1.3;
}
.gx-cases .featured-content h2 span {
    display: block;
    color: #00a0e3;
}
.gx-cases .featured-content > p {
    margin-top: 16px;
    color: #475569;
    font-size: 16px;
    line-height: 1.7;
    max-width: 480px;
}
.gx-cases .case-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 22px;
}
.gx-cases .case-tags span {
    padding: 6px 14px;
    background: #f1f5f9;
    color: #475569;
    font-size: 12px;
    font-weight: 600;
    border-radius: 100px;
}

.gx-cases .featured-product {
    position: relative;
}
.gx-cases .product-browser {
    background: #ffffff;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid #e2e8f0;
    box-shadow: 0 30px 60px -15px rgba(0, 0, 0, 0.15);
    transform: perspective(1200px) rotateY(3deg) rotateX(1deg);
}
.gx-cases .browser-header {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 12px 16px;
    background: #f8fafc;
    border-bottom: 1px solid #f1f5f9;
}
.gx-cases .browser-dots {
    display: flex;
    gap: 6px;
}
.gx-cases .browser-dots span {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #e2e8f0;
}
.gx-cases .browser-dots span:nth-child(1) {
    background: #f87171;
}
.gx-cases .browser-dots span:nth-child(2) {
    background: #fbbf24;
}
.gx-cases .browser-dots span:nth-child(3) {
    background: #34d399;
}
.gx-cases .browser-address {
    flex: 1;
    height: 18px;
    background: #eef2f7;
    border-radius: 5px;
    max-width: 220px;
}
.gx-cases .product-interface {
    display: flex;
    min-height: 260px;
}
.gx-cases .product-sidebar {
    width: 64px;
    flex-shrink: 0;
    background: #f8fafc;
    border-right: 1px solid #f1f5f9;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: 20px 0;
}
.gx-cases .side-logo {
    width: 32px;
    height: 32px;
    border-radius: 9px;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #ffffff;
    font-weight: 800;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 8px;
}
.gx-cases .product-sidebar span {
    width: 22px;
    height: 22px;
    border-radius: 6px;
    background: #e2e8f0;
}
.gx-cases .product-main {
    flex: 1;
    padding: 24px;
}
.gx-cases .product-title {
    width: 55%;
    height: 16px;
    border-radius: 5px;
    background: #e2e8f0;
    margin-bottom: 20px;
}
.gx-cases .product-kpis {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-bottom: 24px;
}
.gx-cases .product-kpis div {
    height: 56px;
    border-radius: 10px;
    background: #f8fafc;
    border: 1px solid #f1f5f9;
}
.gx-cases .product-chart {
    display: flex;
    align-items: flex-end;
    gap: 8px;
    height: 100px;
}
.gx-cases .chart-bar {
    flex: 1;
    border-radius: 6px 6px 0 0;
    background: linear-gradient(180deg, #38bdf8, #00a0e3);
}
.gx-cases .chart-bar.b1 { height: 45%; }
.gx-cases .chart-bar.b2 { height: 65%; }
.gx-cases .chart-bar.b3 { height: 38%; }
.gx-cases .chart-bar.b4 { height: 80%; }
.gx-cases .chart-bar.b5 { height: 55%; }
.gx-cases .chart-bar.b6 { height: 95%; }
.gx-cases .chart-bar.b7 { height: 70%; }
.gx-cases .product-card-floating {
    position: absolute;
    bottom: -20px;
    right: -16px;
    background: #0f172a;
    color: #ffffff;
    padding: 14px 18px;
    border-radius: 12px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.25);
}
.gx-cases .product-card-floating small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
}
.gx-cases .product-card-floating strong {
    display: block;
    margin-top: 2px;
    font-size: 13px;
    color: #ffffff;
}

/* ══════════════════════════════════════════════
   FILTROS + CASES
══════════════════════════════════════════════ */
.gx-cases .cases-list {
    background: #f8fafc;
}
.gx-cases .cases-heading {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 40px;
    flex-wrap: wrap;
    margin-bottom: 40px;
}
.gx-cases .cases-heading h2 {
    font-size: 32px;
    font-weight: 800;
    letter-spacing: -1px;
    color: #0f172a;
    line-height: 1.3;
}
.gx-cases .cases-heading h2 span {
    display: block;
    color: #00a0e3;
}
.gx-cases .cases-heading p {
    max-width: 380px;
    color: #475569;
    font-size: 16px;
    line-height: 1.7;
}
.gx-cases .filters {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 34px;
}
.gx-cases .filters button {
    padding: 10px 20px;
    border-radius: 100px;
    border: 1px solid #e2e8f0;
    background: #ffffff;
    color: #475569;
    font-size: 13px;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: all 0.2s ease;
}
.gx-cases .filters button:hover {
    border-color: #00a0e3;
    color: #00a0e3;
}
.gx-cases .filters button.active {
    background: #0f172a;
    border-color: #0f172a;
    color: #ffffff;
}
.gx-cases .case-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}
.gx-cases .case-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    overflow: hidden;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
}
.gx-cases .case-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.06);
    border-color: #00a0e3;
}
.gx-cases .case-image {
    height: 170px;
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.gx-cases .case-image-blue {
    background: linear-gradient(135deg, #e0f2fe, #eef2ff);
}
.gx-cases .case-image-dark {
    background: #0f172a;
}
.gx-cases .case-image-marketcoop{
    background-image: url('../../assets/img/clientes/marketcoop/min_background_marketcoop.jpg');
}
.gx-cases .case-image-prestige{
    background-image: url('../../assets/img/clientes/prestigeeyewear/min-background-prestige.png');
}
.gx-cases .case-image-zipit{
    background-image: url('../../assets/img/clientes/zipit/background-min-zipit.png');
}
.gx-cases .case-image-anze{
    background-image: url('../../assets/img/clientes/anze/background-min-anze.png');
}
.gx-cases .fake-dashboard {
    width: 100%;
    height: 100%;
    display: flex;
    gap: 10px;
    background: #ffffff;
    border-radius: 10px;
    padding: 14px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
}
.gx-cases .fake-sidebar {
    width: 24%;
    background: #f1f5f9;
    border-radius: 6px;
}
.gx-cases .fake-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.gx-cases .fake-line.title {
    width: 60%;
    height: 10px;
    border-radius: 4px;
    background: #e2e8f0;
}
.gx-cases .fake-kpis {
    display: flex;
    gap: 6px;
}
.gx-cases .fake-kpis span {
    flex: 1;
    height: 24px;
    border-radius: 6px;
    background: #eef2f7;
}
.gx-cases .fake-chart {
    flex: 1;
    border-radius: 6px;
    background: linear-gradient(180deg, rgba(0, 160, 227, 0.15), rgba(0, 160, 227, 0.02));
}
.gx-cases .case-network {
    position: relative;
    width: 120px;
    height: 120px;
}
.gx-cases .network-node {
    position: absolute;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #38bdf8;
}
.gx-cases .network-node.n1 {
    top: 0;
    left: 10px;
}
.gx-cases .network-node.n2 {
    bottom: 10px;
    left: 0;
}
.gx-cases .network-node.n3 {
    bottom: 0;
    right: 0;
}
.gx-cases .network-core {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    color: #ffffff;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 25px rgba(0, 160, 227, 0.35);
}
.gx-cases .case-body {
    padding: 24px;
    flex: 1;
    display: flex;
    flex-direction: column;
}
.gx-cases .case-category {
    color: #00a0e3;
    font-weight: 800;
    font-size: 11px;
    letter-spacing: 1px;
    margin-bottom: 10px;
}
.gx-cases .case-body h3 {
    font-size: 18px;
    color: #0f172a;
}
.gx-cases .case-body p {
    margin-top: 8px;
    color: #64748b;
    font-size: 13.5px;
    line-height: 1.6;
    flex: 1;
}
.gx-cases .case-tags.small {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 14px;
}
.gx-cases .case-tags.small span {
    padding: 4px 10px;
    background: #f1f5f9;
    color: #475569;
    font-size: 11px;
    font-weight: 600;
    border-radius: 100px;
}
.gx-cases .case-body a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 16px;
    color: #00a0e3;
    font-weight: 700;
    font-size: 13px;
}
.gx-cases .case-card.case-coming {
    background: #f8fafc;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 30px;
}
.gx-cases .coming-content small {
    display: block;
    color: #94a3b8;
    font-weight: 700;
    font-size: 11px;
    letter-spacing: 1px;
}
.gx-cases .coming-content h3 {
    margin-top: 10px;
    font-size: 17px;
    color: #0f172a;
}
.gx-cases .coming-content p {
    margin-top: 8px;
    color: #64748b;
    font-size: 13px;
    line-height: 1.6;
}

/* ══════════════════════════════════════════════
   COMO CONSTRUÍMOS
══════════════════════════════════════════════ */
.gx-cases .method-heading {
    max-width: 640px;
    margin: 0 auto 60px;
    text-align: center;
}
.gx-cases .method-heading h2 {
    font-size: 34px;
    font-weight: 800;
    letter-spacing: -1px;
    color: #0f172a;
    line-height: 1.25;
}
.gx-cases .method-heading h2 span {
    color: #00a0e3;
}
.gx-cases .method-heading p {
    margin-top: 18px;
    color: #475569;
    font-size: 17px;
    line-height: 1.7;
}
.gx-cases .method-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
.gx-cases .method-step {
    padding: 28px 24px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
}
.gx-cases .step-number {
    color: #cbd5e1;
    font-weight: 800;
    font-size: 26px;
}
.gx-cases .step-icon {
    width: 44px;
    height: 44px;
    margin-top: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: rgba(0, 160, 227, 0.1);
    color: #00a0e3;
    font-size: 18px;
}
.gx-cases .method-step h3 {
    margin-top: 18px;
    font-size: 17px;
    color: #0f172a;
}
.gx-cases .method-step p {
    margin-top: 8px;
    color: #64748b;
    font-size: 13.5px;
    line-height: 1.6;
}

/* ══════════════════════════════════════════════
   ECOSSISTEMA
══════════════════════════════════════════════ */
.gx-cases .ecosystem {
    color: #ffffff;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.gx-cases .ecosystem-grid {
    display: grid;
    grid-template-columns: 0.9fr 1.1fr;
    gap: 60px;
    align-items: center;
}
.gx-cases .ecosystem-content h2 {
    font-size: 34px;
    font-weight: 800;
    letter-spacing: -1px;
    color: #ffffff;
    line-height: 1.25;
}
.gx-cases .ecosystem-content h2 span {
    display: block;
    color: #38bdf8;
}
.gx-cases .ecosystem-content p {
    margin-top: 18px;
    color: #94a3b8;
    font-size: 16px;
    line-height: 1.7;
    max-width: 480px;
}
.gx-cases .ecosystem-map {
    display: flex;
    flex-direction: column;
    gap: 0;
    align-items: center;
}
.gx-cases .eco-external {
    display: flex;
    gap: 12px;
    width: 100%;
}
.gx-cases .eco-external div {
    flex: 1;
    padding: 14px;
    text-align: center;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 10px;
    color: #cbd5e1;
    font-size: 12.5px;
    font-weight: 600;
}
.gx-cases .eco-line {
    width: 2px;
    height: 32px;
    background: linear-gradient(180deg, rgba(0, 160, 227, 0.15), #00a0e3, rgba(0, 160, 227, 0.15));
}
.gx-cases .eco-hub {
    width: 100%;
    padding: 18px;
    text-align: center;
    background: linear-gradient(135deg, #00a0e3, #802be2);
    border-radius: 14px;
    box-shadow: 0 20px 40px rgba(0, 160, 227, 0.3);
}
.gx-cases .eco-hub small {
    display: block;
    color: rgba(255, 255, 255, 0.8);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
}
.gx-cases .eco-hub strong {
    display: block;
    margin-top: 4px;
    color: #ffffff;
    font-size: 16px;
    font-weight: 800;
}
.gx-cases .eco-products {
    display: flex;
    gap: 12px;
    width: 100%;
}
.gx-cases .eco-product {
    flex: 1;
    padding: 16px;
    text-align: center;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
}
.gx-cases .eco-product small {
    display: block;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
}
.gx-cases .eco-product strong {
    display: block;
    margin-top: 6px;
    color: #ffffff;
    font-size: 14px;
}

/* ══════════════════════════════════════════════
   RESULTADOS
══════════════════════════════════════════════ */
.gx-cases .results {
    background: #f8fafc;
}
.gx-cases .results-intro {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 40px;
    flex-wrap: wrap;
    margin-bottom: 50px;
}
.gx-cases .results-intro h2 {
    font-size: 34px;
    font-weight: 800;
    letter-spacing: -1px;
    color: #0f172a;
    line-height: 1.25;
}
.gx-cases .results-intro h2 span {
    display: block;
    color: #00a0e3;
}
.gx-cases .results-intro > p {
    max-width: 380px;
    color: #475569;
    font-size: 16px;
    line-height: 1.7;
}
.gx-cases .results-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
.gx-cases .results-grid article {
    padding: 26px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    transition: all 0.3s ease;
}
.gx-cases .results-grid article:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.06);
    border-color: #00a0e3;
}
.gx-cases .results-grid article > span {
    display: block;
    color: #00a0e3;
    font-weight: 800;
    font-size: 12px;
    margin-bottom: 16px;
}
.gx-cases .results-grid h3 {
    font-size: 17px;
    color: #0f172a;
}
.gx-cases .results-grid p {
    margin-top: 10px;
    color: #64748b;
    font-size: 13.5px;
    line-height: 1.6;
}

/* ══════════════════════════════════════════════
   CTA
══════════════════════════════════════════════ */
.gx-cases .cta {
    position: relative;
    padding: 120px 0;
    text-align: center;
    color: #ffffff;
    overflow: hidden;
    background: #0b0f19;
}
.gx-cases .cta::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 600px;
    height: 400px;
    background: radial-gradient(circle, rgba(0, 160, 227, 0.15) 0%, rgba(11, 15, 25, 0) 70%);
}
.gx-cases .cta .container {
    position: relative;
    z-index: 1;
    max-width: 800px;
}
.gx-cases .cta h2 {
    max-width: 850px;
    margin: 0 auto;
    font-size: 42px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
    color: #ffffff;
}
.gx-cases .cta h2 span {
    display: block;
    color: #94a3b8;
    font-size: 22px;
    font-weight: 500;
    margin-top: 12px;
}
.gx-cases .cta p {
    max-width: 640px;
    margin: 20px auto 32px;
    color: #94a3b8;
    font-size: 17px;
    line-height: 1.7;
}
.gx-cases .cta-actions {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 16px;
}

/* ══════════════════════════════════════════════
   RESPONSIVO
══════════════════════════════════════════════ */
@media (max-width: 992px) {
    .gx-cases .hero-grid,
    .gx-cases .intro-grid,
    .gx-cases .featured-case,
    .gx-cases .ecosystem-grid {
        grid-template-columns: 1fr;
    }
    .gx-cases .case-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .gx-cases .method-grid,
    .gx-cases .results-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 640px) {
    .gx-cases section {
        padding: 60px 0;
    }
    .gx-cases .hero {
        padding: 40px 0 60px 0;
    }
    .gx-cases .hero-content h1 {
        font-size: 32px;
    }
    .gx-cases .hero-actions,
    .gx-cases .cta-actions {
        flex-direction: column;
        align-items: stretch;
    }
    .gx-cases .case-grid,
    .gx-cases .method-grid,
    .gx-cases .results-grid {
        grid-template-columns: 1fr;
    }
    .gx-cases .cases-heading,
    .gx-cases .results-intro {
        flex-direction: column;
        align-items: flex-start;
    }
    .gx-cases .cta h2 {
        font-size: 30px;
    }
}

/* ══════════════════════════════════════════════════════════
   CASE — PRESTIGE EYEWEAR (pages/cases/Prestige-eyewear.html)
   padrão visual b2c
══════════════════════════════════════════════════════════ */
.case-page {
    --blue: #00a0e3;
    --blue-light: #38bdf8;
    --blue-dark: #008cc6;
    --purple: #802be2;
    --green: #16a34a;
    --dark: #060913;
    --dark-2: #0b0f19;
    --dark-3: #0f172a;
    --white: #ffffff;
    --bg: #f8fafc;
    --bg-2: #f1f5f9;
    --text: #0f172a;
    --muted: #64748b;
    --muted-dark: #94a3b8;
    --border: #e2e8f0;
    --border-dark: #202e43;
    --container: 1200px;

    display: block;
    overflow: hidden;
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: var(--text);
    background: #ffffff;
    -webkit-font-smoothing: antialiased;
    line-height: 1.6;
}
.case-page * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

.case-page img {
    display:block;
    width:100%;
}

.case-page a {
    color:inherit;
}

.case-page svg {
    width:22px;
    height:22px;

    fill:none;
    stroke:currentColor;
    stroke-width:1.6;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.case-page .container {
    width:min(var(--container),calc(100% - 48px));
    margin:auto;
}

.case-page section {
    padding:20px 0;
}


/* ============================================================
   TYPOGRAPHY
============================================================ */

.case-page h1,
.case-page h2,
.case-page h3 {
    letter-spacing:-.035em;
}

.case-page h1 {
    max-width:750px;

    font-size:68px;
    line-height:1.02;
    font-weight:800;
}

.case-page h2 {
    font-size:48px;
    line-height:1.07;
    font-weight:800;
}

.case-page h3 {
    font-size:22px;
    line-height:1.2;
}

.case-page h1 span,
.case-page h2 span {
    display:block;
    color:var(--blue);
}

.case-page p {
    line-height:1.7;
}

.case-page .eyebrow {
    display:flex;
    align-items:center;
    gap:13px;

    margin-bottom:24px;

    color:var(--blue-light);

    font-size:12px;
    font-weight:800;
    letter-spacing:1.8px;
}

.case-page .eyebrow::before {
    content:"";

    width:34px;
    height:2px;

    background:currentColor;
}

.case-page .eyebrow.dark {
    color:var(--blue);
}

.case-page .section-header {
    max-width:760px;
}

.case-page .section-header.center {
    margin:auto;
    text-align:center;
}

.case-page .section-header.center .eyebrow {
    justify-content:center;
}

.case-page .section-header > p {
    max-width:650px;

    margin:22px auto 0;

    color:var(--muted);

    font-size:17px;
}


/* ============================================================
   BUTTON
============================================================ */

.case-page .btn {
    min-height:58px;

    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:17px;

    padding:0 28px;

    border-radius:10px;

    text-decoration:none;

    font-size:14px;
    font-weight:750;

    transition:
        transform .2s ease,
        background .2s ease,
        border-color .2s ease;
}

.case-page .btn:hover {
    transform:translateY(-2px);
}

.case-page .btn-primary {
    color:#fff;
    background:var(--blue);
}

.case-page .btn-primary:hover {
    background:var(--blue-light);
}

.case-page .btn-outline {
    color:#fff;

    border:1px solid #394a62;
}

.case-page .btn-outline:hover {
    border-color:var(--blue);
}


/* ============================================================
   HERO
============================================================ */

.case-page .hero {
    min-height:790px;

    display:flex;
    align-items:center;

    overflow:hidden;

    color:#fff;

    background:
        radial-gradient(
            circle at 78% 40%,
            rgba(8,167,232,.16),
            transparent 30%
        ),
        radial-gradient(
            circle at 30% 100%,
            rgba(8,90,180,.08),
            transparent 35%
        ),
        var(--dark);
}

.case-page .hero-grid {
    display:grid;
    grid-template-columns:.95fr 1.05fr;

    gap:70px;

    align-items:center;
}

.case-page .back-link {
    display:inline-block;

    margin-bottom:45px;

    color:#7e8ea4;

    text-decoration:none;

    font-size:12px;
    font-weight:650;

    transition:color .2s;
}

.case-page .back-link:hover {
    color:#fff;
}

.case-page .hero-description {
    max-width:620px;

    margin-top:27px;

    color:#a6b4c8;

    font-size:18px;
}

.case-page .tags {
    display:flex;
    flex-wrap:wrap;
    gap:8px;

    margin-top:32px;
}

.case-page .tags span {
    padding:9px 12px;

    color:#aebdd0;

    border:1px solid #293a52;
    border-radius:7px;

    background:#111b2b;

    font-size:10px;
    font-weight:750;
}


/* HERO PRODUCT */

.case-page .hero-product {
    position:relative;

    min-height:550px;

    display:flex;
    align-items:center;
}

.case-page .product-glow {
    position:absolute;

    width:450px;
    height:450px;

    left:50%;
    top:50%;

    transform:translate(-50%,-50%);

    border-radius:50%;

    background:rgba(8,167,232,.15);

    filter:blur(100px);
}

.case-page .browser {
    position:relative;

    width:100%;

    overflow:hidden;

    border:1px solid #2a394e;
    border-radius:15px;

    background:#f6f8fb;

    box-shadow:
        0 35px 80px rgba(0,0,0,.3);
}

.case-page .browser-main {
    z-index:2;

    transform:
        perspective(1200px)
        rotateY(-3deg)
        rotateX(1deg);
}

.case-page .browser-top {
    height:43px;

    display:flex;
    align-items:center;
    gap:18px;

    padding:0 15px;

    border-bottom:1px solid #e2e6ec;

    background:#fff;
}

.case-page .browser-dots {
    display:flex;
    gap:5px;
}

.case-page .browser-dots span {
    width:6px;
    height:6px;

    border-radius:50%;

    background:#c2cad4;
}

.case-page .browser-address {
    width:52%;
    height:8px;

    border-radius:20px;

    background:#edf0f4;
}


/* DASHBOARD MOCK */

.case-page .dashboard {
    height:400px;

    display:grid;
    grid-template-columns:62px 1fr;
}

.case-page .dashboard-sidebar {
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:20px;

    padding:17px 0;

    background:#0f1928;
}

.case-page .gx-symbol {
    width:30px;
    height:30px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin-bottom:7px;

    color:#fff;

    border-radius:8px;

    background:var(--blue);

    font-size:12px;
    font-weight:900;
}

.case-page .side-item {
    width:20px;
    height:5px;

    border-radius:10px;

    background:#35445a;
}

.case-page .side-item.active {
    background:var(--blue);
}

.case-page .dashboard-main {
    padding:26px;

    background:#f5f7fa;
}

.case-page .dashboard-heading {
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.case-page .dashboard-heading small {
    display:block;

    margin-bottom:4px;

    color:#9aa5b3;

    font-size:7px;
    font-weight:800;
}

.case-page .dashboard-heading strong {
    color:#182537;

    font-size:15px;
}

.case-page .dashboard-heading > span {
    width:30px;
    height:30px;

    border-radius:50%;

    background:#e2e8ef;
}

.case-page .dashboard-kpis {
    display:grid;
    grid-template-columns:repeat(3,1fr);

    gap:9px;

    margin-top:23px;
}

.case-page .dashboard-kpis > div {
    padding:14px;

    border:1px solid #e1e6ed;
    border-radius:8px;

    background:#fff;
}

.case-page .dashboard-kpis small {
    display:block;

    color:#9aa5b3;

    font-size:6px;
    font-weight:800;
}

.case-page .dashboard-kpis strong {
    display:block;

    margin-top:7px;

    color:#253449;

    font-size:18px;
}

.case-page .dashboard-content {
    display:grid;
    grid-template-columns:1.5fr .7fr;

    gap:9px;

    margin-top:10px;
}

.case-page .chart,
.case-page .dashboard-list {
    height:210px;

    padding:17px;

    border:1px solid #e1e6ed;
    border-radius:8px;

    background:#fff;
}

.case-page .chart-title {
    width:80px;
    height:7px;

    border-radius:10px;

    background:#dbe2ea;
}

.case-page .bars {
    height:150px;

    display:flex;
    align-items:flex-end;
    gap:8px;

    margin-top:16px;
}

.case-page .bars span {
    flex:1;

    border-radius:4px 4px 0 0;

    background:#d9edf7;
}

.case-page .bars span:nth-child(6) {
    background:var(--blue);
}

.case-page .dashboard-list {
    display:flex;
    flex-direction:column;
    gap:12px;
}

.case-page .dashboard-list span {
    height:30px;

    border-radius:5px;

    background:#f0f3f6;
}


/* FLOATING MODULES */

.case-page .floating-module {
    position:absolute;
    z-index:3;

    min-width:125px;

    padding:14px 17px;

    border:1px solid #304159;
    border-radius:11px;

    background:rgba(11,18,30,.95);

    box-shadow:0 15px 35px rgba(0,0,0,.25);

    backdrop-filter:blur(12px);
}

.case-page .floating-module small {
    display:block;

    margin-bottom:4px;

    color:#74869e;

    font-size:7px;
    font-weight:800;
    letter-spacing:1px;
}

.case-page .floating-module strong {
    font-size:14px;
}

.case-page .module-crm {
    top:35px;
    right:-20px;
}

.case-page .module-b2b {
    right:-35px;
    bottom:55px;
}

.case-page .floating-status {
    position:absolute;
    z-index:4;

    left:-30px;
    bottom:20px;

    display:flex;
    align-items:center;
    gap:12px;

    padding:15px 18px;

    border:1px solid #2b3b52;
    border-radius:11px;

    background:rgba(10,17,28,.95);

    box-shadow:0 15px 35px rgba(0,0,0,.3);
}

.case-page .floating-status > span {
    width:9px;
    height:9px;

    border-radius:50%;

    background:var(--green);

    box-shadow:
        0 0 0 5px rgba(41,207,145,.10);
}

.case-page .floating-status small {
    display:block;

    margin-bottom:3px;

    color:#75879e;

    font-size:7px;
    font-weight:800;
}

.case-page .floating-status strong {
    font-size:11px;
}


/* ============================================================
   SUMMARY
============================================================ */

.case-page .summary {
    padding:0;

    background:#fff;
}

.case-page .summary-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);

    border-left:1px solid var(--border);
}

.case-page .summary-item {
    min-height:120px;

    display:flex;
    flex-direction:column;
    justify-content:center;

    padding:25px 30px;

    border-right:1px solid var(--border);
    border-bottom:1px solid var(--border);
}

.case-page .summary-item small {
    margin-bottom:8px;

    color:#929eae;

    font-size:9px;
    font-weight:800;
    letter-spacing:1.2px;
}

.case-page .summary-item strong {
    font-size:14px;
}

.case-page .summary-statement {
    position:relative;

    max-width:950px;

    margin:auto;

    padding:120px 0;

    text-align:center;
}

.case-page .summary-statement h2 {
    font-size:46px;
}

.case-page .quote-mark {
    display:block;

    height:50px;

    color:#d7edf7;

    font-family:Georgia,serif;
    font-size:90px;
    line-height:1;
}


/* ============================================================
   SCENARIO
============================================================ */

.case-page .scenario {
    background:var(--bg);
}

.case-page .scenario-heading {
    display:grid;
    grid-template-columns:1fr .7fr;

    gap:90px;

    align-items:end;
}

.case-page .scenario-heading > p {
    color:var(--muted);

    font-size:17px;
}

.case-page .scenario-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);

    gap:15px;

    margin-top:65px;
}

.case-page .scenario-grid article {
    position:relative;

    min-height:310px;

    padding:27px;

    border:1px solid var(--border);
    border-radius:16px;

    background:#fff;
}

.case-page .scenario-number {
    position:absolute;

    top:25px;
    right:25px;

    color:#a1acba;

    font-size:9px;
    font-weight:800;
}

.case-page .scenario-icon {
    width:50px;
    height:50px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin-bottom:65px;

    color:var(--blue);

    border-radius:12px;

    background:#e9f7fd;
}

.case-page .scenario-grid h3 {
    font-size:19px;
}

.case-page .scenario-grid p {
    margin-top:10px;

    color:var(--muted);

    font-size:13px;
}


/* ============================================================
   SOLUTION
============================================================ */

.case-page .solution {
    color:#fff;

    background:
        radial-gradient(
            circle at 50% 80%,
            rgba(8,167,232,.11),
            transparent 30%
        ),
        var(--dark);
}

.case-page .solution .section-header > p {
    color:#94a4b9;
}

.case-page .solution-map {
    max-width:1000px;

    margin:70px auto 0;
}

.case-page .solution-products {
    display:grid;
    grid-template-columns:repeat(3,1fr);

    gap:14px;
}

.case-page .solution-card {
    min-height:270px;

    padding:26px;

    border:1px solid var(--border-dark);
    border-radius:15px;

    background:var(--dark-2);
}

.case-page .solution-index {
    float:right;

    color:#63758c;

    font-size:9px;
    font-weight:800;
}

.case-page .solution-icon {
    width:45px;
    height:45px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin-bottom:40px;

    color:var(--blue-light);

    border-radius:10px;

    background:#14273a;
}

.case-page .solution-card > small {
    display:block;

    margin-bottom:6px;

    color:#687b93;

    font-size:8px;
    font-weight:800;
    letter-spacing:1px;
}

.case-page .solution-card h3 {
    font-size:27px;
}

.case-page .solution-card p {
    margin-top:9px;

    color:#93a2b6;

    font-size:13px;
}

.case-page .solution-connectors {
    display:grid;
    grid-template-columns:repeat(3,1fr);
}

.case-page .solution-connectors span {
    width:1px;
    height:38px;

    margin:auto;

    background:#2c4159;
}

.case-page .hub-core {
    max-width:520px;

    margin:auto;

    padding:27px 30px !important;

    display:grid !important;
    grid-template-columns:auto 1fr 1.5fr;

    gap:20px !important;

    align-items:center !important;

    border:1px solid #178fc8;
    border-radius:14px !important;

    background:
        linear-gradient(
            135deg,
            rgba(8,167,232,.20),
            rgba(8,126,192,.10)
        ) !important;

    animation:none !important;
}

.case-page .hub-badge {
    padding:8px 9px;

    color:#7dd8fa;

    border:1px solid #235c79;
    border-radius:6px;

    font-size:7px;
    font-weight:800;
}

.case-page .hub-core small {
    display:block;

    color:#7da5b9;

    font-size:7px;
}

.case-page .hub-core strong {
    display:block;

    margin-top:2px;

    font-size:22px;
}

.case-page .hub-core p {
    color:#90a8b8;

    font-size:11px;
}


/* ============================================================
   ARCHITECTURE
============================================================ */

.case-page .architecture {
    color:#fff;
    background:#0b111c;
}

.case-page .architecture-grid {
    display:grid;
    grid-template-columns:.8fr 1.2fr;

    gap:100px;

    align-items:center;
}

.case-page .architecture-content > p {
    max-width:520px;

    margin-top:25px;

    color:#98a7bb;

    font-size:16px;
}

.case-page .architecture-note {
    display:flex;
    gap:15px;

    margin-top:35px;
    padding-top:25px;

    border-top:1px solid var(--border-dark);
}

.case-page .architecture-note > span {
    width:8px;
    height:8px;

    flex:none;

    margin-top:8px;

    border-radius:50%;

    background:var(--blue);
}

.case-page .architecture-note p {
    color:#c2ccda;

    font-size:13px;
}

.case-page .architecture-map {
    padding:40px;

    border:1px solid var(--border-dark);
    border-radius:20px;

    background:var(--dark-2);
}

.case-page .arch-title {
    margin-bottom:28px;

    color:#667990;

    text-align:center;

    font-size:9px;
    font-weight:800;
    letter-spacing:1.5px;
}

.case-page .arch-systems {
    display:grid;
    grid-template-columns:repeat(3,1fr);

    gap:8px;
}

.case-page .arch-systems span,
.case-page .arch-audiences span {
    padding:13px;

    text-align:center;

    border:1px solid #27374d;
    border-radius:8px;

    background:#111c2d;

    color:#9babc0;

    font-size:10px;
}

.case-page .arch-line {
    width:1px;
    height:25px;

    margin:auto;

    background:#2d425a;
}

.case-page .arch-hub {
    max-width:300px;

    margin:auto;

    padding:20px;

    text-align:center;

    border-radius:11px;

    background:var(--blue);
}

.case-page .arch-hub small {
    display:block;

    margin-bottom:4px;

    font-size:7px;
    letter-spacing:1px;
    opacity:.7;
}

.case-page .arch-hub strong {
    font-size:16px;
}

.case-page .arch-branches {
    height:40px;

    display:grid;
    grid-template-columns:repeat(3,1fr);

    position:relative;
}

.case-page .arch-branches::before {
    content:"";

    position:absolute;

    top:20px;
    left:16.66%;
    right:16.66%;

    height:1px;

    background:#2d425a;
}

.case-page .arch-branches div {
    position:relative;
}

.case-page .arch-branches div::before {
    content:"";

    position:absolute;

    left:50%;

    width:1px;
    height:40px;

    background:#2d425a;
}

.case-page .arch-products,
.case-page .arch-audiences {
    display:grid;
    grid-template-columns:repeat(3,1fr);

    gap:8px;
}

.case-page .arch-product {
    padding:17px;

    text-align:center;

    border:1px solid #2c4058;
    border-radius:9px;

    background:#121f31;
}

.case-page .arch-product small {
    display:block;

    margin-bottom:5px;

    color:#687b93;

    font-size:6px;
    font-weight:800;
}

.case-page .arch-product strong {
    color:#fff;
    font-size:15px;
}

.case-page .arch-audiences {
    margin-top:8px;
}


/* ============================================================
   JOURNEY
============================================================ */

.case-page .journey {
    background:var(--bg);
}

.case-page .journey-grid {
    display:grid;
    grid-template-columns:repeat(2,1fr);

    gap:18px;

    margin-top:65px;
}

.case-page .journey-card {
    padding:35px;

    border:1px solid var(--border);
    border-radius:18px;

    background:#fff;
}

.case-page .journey-top {
    display:flex;
    gap:17px;

    align-items:flex-start;
}

.case-page .journey-top > span {
    color:var(--blue);

    font-size:10px;
    font-weight:800;
}

.case-page .journey-top small {
    display:block;

    margin-bottom:4px;

    color:#929dad;

    font-size:8px;
    font-weight:800;
    letter-spacing:1px;
}

.case-page .journey-top h3 {
    font-size:23px;
}

.case-page .journey-flow {
    display:grid;
    grid-template-columns:1fr auto 1fr auto 1fr;

    gap:7px;

    align-items:center;

    margin:40px 0 25px;
}

.case-page .flow-item {
    padding:17px 10px;

    text-align:center;

    border:1px solid var(--border);
    border-radius:9px;

    background:var(--bg);
}

.case-page .flow-item span {
    display:block;

    margin-bottom:5px;

    color:#a0aaba;

    font-size:7px;
    font-weight:800;
}

.case-page .flow-item strong {
    font-size:11px;
}

.case-page .flow-item.highlight {
    color:#fff;

    border-color:var(--blue);
    background:var(--blue);
}

.case-page .flow-item.highlight span {
    color:#d8f3fd;
}

.case-page .flow-item.highlight.purple {
    border-color:var(--purple);
    background:var(--purple);
}

.case-page .flow-arrow {
    color:#a5afbd;
}

.case-page .journey-card > p {
    color:var(--muted);

    font-size:13px;
}

.case-page .crm-across {
    display:grid;
    grid-template-columns:auto 1fr auto;

    gap:25px;

    align-items:center;

    margin-top:20px;

    padding:25px 30px;

    color:#fff;

    border-radius:13px;

    background:var(--dark);
}

.case-page .crm-across small {
    display:block;

    margin-bottom:3px;

    color:#72849c;

    font-size:7px;
    font-weight:800;
}

.case-page .crm-across strong {
    color:var(--blue-light);

    font-size:18px;
}

.case-page .crm-line {
    height:1px;

    background:#314158;
}

.case-page .crm-across p {
    color:#8fa0b6;

    font-size:11px;
}


/* ============================================================
   PRODUCT SHOWCASE
============================================================ */

.case-page .product-showcase {
    overflow:hidden;
}

.case-page .showcase-sfa {
    color:#fff;
    background:var(--dark);
}

.case-page .showcase-b2b {
    background:#fff;
}

.case-page .product-grid {
    display:grid;
    grid-template-columns:.75fr 1.25fr;

    gap:80px;

    align-items:center;
}

.case-page .product-grid.reverse {
    grid-template-columns:1.25fr .75fr;
}

.case-page .product-number {
    margin-bottom:35px;

    color:#65778f;

    font-size:9px;
    font-weight:800;
    letter-spacing:1.3px;
}

.case-page .dark-number {
    color:#9ba6b5;
}

.case-page .product-copy > p {
    max-width:500px;

    margin-top:23px;

    color:#98a8bc;

    font-size:16px;
}

.case-page .showcase-b2b .product-copy > p {
    color:var(--muted);
}

.case-page .feature-list {
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:wrap !important;
    gap:7px !important;

    margin:30px 0 0 0 !important;
}

.case-page .feature-list span {
    padding:9px 11px;

    color:#a9b8cb;

    border:1px solid #293b52;
    border-radius:7px;

    background:#101b2b;

    font-size:9px;
    font-weight:700;
}

.case-page .feature-list.light span {
    color:#667386;

    border-color:var(--border);
    background:var(--bg);
}


/* SCREEN PLACEHOLDER */

.case-page .showcase-browser {
    position:relative;
}

.case-page .screen-placeholder {
    height:440px;

    display:grid;
    grid-template-columns:65px 1fr;

    background:#f5f7fa;
}

.case-page .screen-placeholder aside {
    background:#101a29;
}

.case-page .screen-main {
    padding:30px;
}

.case-page .screen-header {
    width:180px;
    height:15px;

    border-radius:5px;

    background:#1d2c3e;
}

.case-page .screen-cards {
    display:grid;
    grid-template-columns:repeat(4,1fr);

    gap:9px;

    margin-top:25px;
}

.case-page .screen-cards span {
    height:70px;

    border:1px solid #e2e7ee;
    border-radius:8px;

    background:#fff;
}

.case-page .screen-bottom {
    display:grid;
    grid-template-columns:1.5fr .7fr;

    gap:10px;

    margin-top:10px;
}

.case-page .screen-bottom div {
    height:250px;

    border:1px solid #e2e7ee;
    border-radius:8px;

    background:#fff;
}


/* B2B MOCK */

.case-page .light-browser {
    border-color:#e1e6ed;
}

.case-page .store-placeholder {
    height:440px;

    background:#fff;
}

.case-page .store-header {
    height:60px;

    display:flex;
    align-items:center;

    gap:30px;

    padding:0 25px;

    border-bottom:1px solid #edf0f4;
}

.case-page .store-header strong {
    margin-right:auto;

    color:#111827;

    font-size:13px;
    letter-spacing:2px;
}

.case-page .store-header div {
    width:45px;
    height:6px;

    border-radius:10px;

    background:#e2e6ec;
}

.case-page .store-hero {
    height:190px;

    display:flex;
    align-items:center;

    padding:35px;

    background:
        linear-gradient(
            120deg,
            #e9edf2,
            #cbd5df
        );
}

.case-page .store-hero small {
    display:block;

    margin-bottom:5px;

    color:#7c8999;

    font-size:7px;
}

.case-page .store-hero strong {
    display:block;

    color:#1d2a3a;

    font-size:25px;
}

.case-page .store-hero span {
    display:block;

    width:70px;
    height:7px;

    margin-top:14px;

    border-radius:10px;

    background:#1d2a3a;
}

.case-page .store-products {
    display:grid;
    grid-template-columns:repeat(4,1fr);

    gap:10px;

    padding:20px;
}

.case-page .store-products div {
    height:140px;

    border-radius:7px;

    background:#f0f2f5;
}


/* ============================================================
   CRM
============================================================ */

.case-page .crm-section {
    background:var(--bg);
}

.case-page .crm-heading {
    display:grid;
    grid-template-columns:1fr .7fr;

    gap:80px;

    align-items:end;
}

.case-page .crm-heading > p {
    color:var(--muted);

    font-size:16px;
}

.case-page .crm-flow {
    display:grid;
    grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;

    gap:12px;

    align-items:center;

    margin-top:65px;
}

.case-page .crm-node {
    min-height:130px;

    display:flex;
    flex-direction:column;
    justify-content:space-between;

    padding:20px;

    border:1px solid var(--border);
    border-radius:12px;

    background:#fff;
}

.case-page .crm-node span {
    color:var(--blue);

    font-size:9px;
    font-weight:800;
}

.case-page .crm-node strong {
    font-size:14px;
}

.case-page .crm-arrow {
    color:#a4afbd;
}


/* ============================================================
   HUB
============================================================ */

.case-page .hub-section {
    color:#fff;

    background:
        radial-gradient(
            circle at 75% 50%,
            rgba(8,167,232,.12),
            transparent 28%
        ),
        var(--dark);
}

.case-page .hub-grid {
    display:grid;
    grid-template-columns:.8fr 1.2fr;

    gap:100px;

    align-items:center;
}

.case-page .hub-content > p {
    max-width:500px;

    margin-top:23px;

    color:#98a8bd;

    font-size:16px;
}

.case-page .hub-diagram {
    padding:38px;

    border:1px solid var(--border-dark);
    border-radius:20px;

    background:var(--dark-2);
}

.case-page .hub-modules,
.case-page .hub-data {
    display:grid;
    grid-template-columns:repeat(3,1fr);

    gap:8px;
}

.case-page .hub-modules span,
.case-page .hub-data span,
.case-page .prestige-system {
    padding:14px;

    text-align:center;

    border:1px solid #293b53;
    border-radius:8px;

    background:#111d2e;

    color:#a0b0c4;

    font-size:10px;
    font-weight:700;
}

.case-page .diagram-line {
    width:1px;
    height:28px;

    margin:auto;

    background:#30465f;
}

.case-page .diagram-hub {
    max-width:300px;

    margin:auto;

    padding:21px;

    text-align:center;

    border-radius:11px;

    background:var(--blue);
}

.case-page .diagram-hub small {
    display:block;

    margin-bottom:4px;

    font-size:7px;
    opacity:.7;
}

.case-page .diagram-hub strong {
    font-size:16px;
}

.case-page .prestige-system {
    max-width:300px;

    margin:auto;

    color:#fff;
}


/* ============================================================
   RESULTS
============================================================ */

.case-page .results {
    background:#fff;
}

.case-page .results-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);

    gap:15px;

    margin-top:60px;
}

.case-page .results-grid article {
    min-height:270px;

    padding:28px;

    border:1px solid var(--border);
    border-radius:15px;

    background:#fff;
}

.case-page .results-grid article > span {
    display:block;

    margin-bottom:65px;

    color:var(--blue);

    font-size:9px;
    font-weight:800;
}

.case-page .results-grid h3 {
    font-size:18px;
}

.case-page .results-grid p {
    margin-top:10px;

    color:var(--muted);

    font-size:13px;
}


/* ============================================================
   STACK
============================================================ */

.case-page .stack-section {
    background:var(--bg);
}

.case-page .stack-grid {
    display:grid;
    grid-template-columns:.8fr 1.2fr;

    gap:100px;

    align-items:center;
}

.case-page .stack-content > p {
    max-width:480px;

    margin-top:22px;

    color:var(--muted);
}

.case-page .stack-map {
    display:grid;
    grid-template-columns:1fr auto 1fr;

    gap:20px;

    align-items:center;
}

.case-page .stack-group {
    min-height:250px;

    padding:28px;

    border:1px solid var(--border);
    border-radius:17px;

    background:#fff;
}

.case-page .stack-title {
    padding-bottom:22px;

    border-bottom:1px solid var(--border);
}

.case-page .stack-title small {
    display:block;

    margin-bottom:5px;

    color:#9aa5b3;

    font-size:7px;
    font-weight:800;
    letter-spacing:1px;
}

.case-page .stack-title strong {
    font-size:18px;
}

.case-page .stack-products {
    display:flex;
    flex-direction:column;
    gap:10px;

    margin-top:20px;
}

.case-page .stack-products div {
    display:flex;
    align-items:center;
    gap:10px;

    padding:10px;

    border-radius:7px;

    background:var(--bg);

    color:#566376;

    font-size:11px;
    font-weight:650;
}

.case-page .stack-products span {
    color:var(--blue);

    font-weight:900;
}

.case-page .stack-plus {
    color:#a1adbb;

    font-size:25px;
}

.case-page .hub-stack {
    border-color:#b9e8fa;
}


/* ============================================================
   FINAL
============================================================ */

.case-page .final {
    padding:140px 0;

    color:#fff;

    background:
        radial-gradient(
            circle at 50% 100%,
            rgba(8,167,232,.18),
            transparent 40%
        ),
        var(--dark);
}

.case-page .final-content {
    max-width:900px;

    margin:auto;

    text-align:center;
}

.case-page .final .eyebrow {
    justify-content:center;
}

.case-page .final h2 {
    font-size:56px;
}

.case-page .final p {
    max-width:680px;

    margin:25px auto 0;

    color:#9aa9bd;

    font-size:17px;
}

.case-page .final-actions {
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:12px;

    margin-top:38px;
}


/* ============================================================
   RESPONSIVE
============================================================ */

@media(max-width:1050px){

    .case-page h1 {
        font-size:55px;
    }

    .case-page h2 {
        font-size:41px;
    }

    .case-page .hero-grid,
    .case-page .architecture-grid,
    .case-page .product-grid,
    .case-page .product-grid.reverse,
    .case-page .hub-grid,
    .case-page .stack-grid {
        grid-template-columns:1fr;
    }

    .case-page .scenario-grid,
    .case-page .results-grid {
        grid-template-columns:repeat(2,1fr);
    }

    .case-page .summary-grid {
        grid-template-columns:repeat(2,1fr);
    }

    .case-page .product-grid.reverse .showcase-browser {
        order:2;
    }

    .case-page .product-grid.reverse .product-copy {
        order:1;
    }

}


@media(max-width:760px){

    .case-page section {
        padding:80px 0;
    }

    .case-page .container {
        width:min(100% - 30px,var(--container));
    }

    .case-page h1 {
        font-size:43px;
    }

    .case-page h2 {
        font-size:35px;
    }

    .case-page .hero {
        min-height:auto;
        padding:80px 0;
    }

    .case-page .hero-grid {
        gap:50px;
    }

    .case-page .hero-product {
        min-height:auto;
    }

    .case-page .floating-module,
    .case-page .floating-status {
        display:none;
    }

    .case-page .dashboard {
        height:330px;
    }

    .case-page .dashboard-content {
        grid-template-columns:1fr;
    }

    .case-page .dashboard-list {
        display:none;
    }

    .case-page .scenario-heading,
    .case-page .crm-heading {
        grid-template-columns:1fr;
        gap:25px;
    }

    .case-page .scenario-grid,
    .case-page .solution-products,
    .case-page .journey-grid,
    .case-page .results-grid {
        grid-template-columns:1fr;
    }

    .case-page .solution-connectors {
        display:none;
    }

    .case-page .hub-core {
        margin-top:15px;

        grid-template-columns:1fr;

        text-align:center;
    }

    .case-page .arch-systems,
    .case-page .arch-products,
    .case-page .arch-audiences {
        grid-template-columns:1fr;
    }

    .case-page .arch-branches {
        display:none;
    }

    .case-page .arch-products {
        margin-top:10px;
    }

    .case-page .crm-across {
        grid-template-columns:1fr;
    }

    .case-page .crm-line {
        display:none;
    }

    .case-page .crm-flow {
        grid-template-columns:1fr;
    }

    .case-page .crm-arrow {
        text-align:center;
        transform:rotate(90deg);
    }

    .case-page .hub-modules,
    .case-page .hub-data {
        grid-template-columns:1fr;
    }

    .case-page .stack-map {
        grid-template-columns:1fr;
    }

    .case-page .stack-plus {
        text-align:center;
    }

    .case-page .screen-placeholder,
    .case-page .store-placeholder {
        height:350px;
    }

    .case-page .screen-bottom div {
        height:180px;
    }

    .case-page .summary-statement {
        padding:80px 0;
    }

    .case-page .summary-statement h2 {
        font-size:35px;
    }

    .case-page .final h2 {
        font-size:40px;
    }

}


@media(max-width:480px){

    .case-page h1 {
        font-size:38px;
    }

    .case-page h2 {
        font-size:31px;
    }

    .case-page .summary-grid {
        grid-template-columns:1fr;
    }

    .case-page .architecture-map,
    .case-page .hub-diagram {
        padding:22px;
    }

    .case-page .journey-flow {
        grid-template-columns:1fr;
    }

    .case-page .flow-arrow {
        text-align:center;
        transform:rotate(90deg);
    }

    .case-page .screen-cards {
        grid-template-columns:repeat(2,1fr);
    }

    .case-page .store-products {
        grid-template-columns:repeat(2,1fr);
    }

    .case-page .final-actions {
        flex-direction:column;
    }

    .case-page .final-actions .btn {
        width:100%;
    }

}

/* ══════════════════════════════════════════════════════════
   CASE — MARKETCOOP (pages/cases/Marketcoop.html)
   padrão visual b2c
══════════════════════════════════════════════════════════ */
.gx-case-marketcoop {
    --blue: #00a0e3;
    --blue-light: #38bdf8;
    --blue-dark: #008cc6;
    --green: #16a34a;
    --green-light: #dcfce7;
    --green-market: #15803d;
    --dark: #060913;
    --dark-2: #0b0f19;
    --dark-3: #0f172a;
    --white: #ffffff;
    --bg: #f8fafc;
    --bg-2: #f1f5f9;
    --text: #0f172a;
    --muted: #64748b;
    --border: #e2e8f0;
    --border-dark: #202e43;
    --container: 1200px;

    display: block;
    overflow: hidden;
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: var(--text);
    background: #ffffff;
    -webkit-font-smoothing: antialiased;
    line-height: 1.6;
}
.gx-case-marketcoop * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

.gx-case-marketcoop img {
    display:block;
    width:100%;
}

.gx-case-marketcoop a {
    color:inherit;
}

.gx-case-marketcoop svg {
    width:22px;
    height:22px;

    fill:none;
    stroke:currentColor;
    stroke-width:1.6;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.gx-case-marketcoop .container {
    width:min(var(--container),calc(100% - 48px));
    margin:auto;
}

.gx-case-marketcoop section {
    padding:40px 0;
}


/* ============================================================
   TYPOGRAPHY
============================================================ */

.gx-case-marketcoop h1,
.gx-case-marketcoop h2,
.gx-case-marketcoop h3 {
    letter-spacing:-.035em;
}

.gx-case-marketcoop h1 {
    font-size:68px;
    line-height:1.02;
    font-weight:800;
}

.gx-case-marketcoop h2 {
    font-size:48px;
    line-height:1.08;
    font-weight:800;
}

.gx-case-marketcoop h3 {
    font-size:22px;
    line-height:1.2;
}

.gx-case-marketcoop h1 span,
.gx-case-marketcoop h2 span {
    display:block;
    color:var(--blue);
}

.gx-case-marketcoop p {
    line-height:1.7;
}

.gx-case-marketcoop .eyebrow {
    display:flex;
    align-items:center;
    gap:13px;

    margin-bottom:24px;

    color:var(--blue-light);

    font-size:12px;
    font-weight:800;
    letter-spacing:1.8px;
}

.gx-case-marketcoop .eyebrow::before {
    content:"";

    width:34px;
    height:2px;

    background:currentColor;
}

.gx-case-marketcoop .eyebrow.dark {
    color:var(--blue);
}

.gx-case-marketcoop .section-header {
    max-width:780px;
}

.gx-case-marketcoop .section-header.center {
    margin:auto;
    text-align:center;
}

.gx-case-marketcoop .section-header.center .eyebrow {
    justify-content:center;
}

.gx-case-marketcoop .section-header > p {
    max-width:650px;

    margin:22px auto 0;

    color:#95a5ba;

    font-size:17px;
}


/* ============================================================
   BUTTONS
============================================================ */

.gx-case-marketcoop .btn {
    min-height:58px;

    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:17px;

    padding:0 28px;

    border-radius:10px;

    text-decoration:none;

    font-size:14px;
    font-weight:750;

    transition:.2s ease;
}

.gx-case-marketcoop .btn:hover {
    transform:translateY(-2px);
}

.gx-case-marketcoop .btn-primary {
    color:#fff;
    background:var(--blue);
}

.gx-case-marketcoop .btn-primary:hover {
    background:var(--blue-light);
}

.gx-case-marketcoop .btn-outline {
    color:#fff;

    border:1px solid #3b4b61;
}

.gx-case-marketcoop .btn-outline:hover {
    border-color:var(--blue);
}


/* ============================================================
   HERO
============================================================ */

.gx-case-marketcoop .hero {
    min-height:790px;

    display:flex;
    align-items:center;

    overflow:hidden;

    color:#fff;

    background:
        radial-gradient(
            circle at 78% 42%,
            rgba(8,167,232,.16),
            transparent 30%
        ),
        radial-gradient(
            circle at 30% 100%,
            rgba(8,100,190,.08),
            transparent 35%
        ),
        var(--dark);
}

.gx-case-marketcoop .hero-grid {
    display:grid;
    grid-template-columns:.95fr 1.05fr;

    gap:75px;

    align-items:center;
}

.gx-case-marketcoop .back-link {
    display:inline-block;

    margin-bottom:45px;

    color:#7f8fa5;

    text-decoration:none;

    font-size:12px;
    font-weight:650;
}

.gx-case-marketcoop .back-link:hover {
    color:#fff;
}

.gx-case-marketcoop .hero-description {
    max-width:620px;

    margin-top:27px;

    color:#a6b5c8;

    font-size:18px;
}

.gx-case-marketcoop .hero-tags {
    display:flex;
    flex-wrap:wrap;
    gap:8px;

    margin-top:32px;
}

.gx-case-marketcoop .hero-tags span {
    padding:9px 12px;

    color:#adbbce;

    border:1px solid #293a52;
    border-radius:7px;

    background:#111b2b;

    font-size:10px;
    font-weight:750;
}


/* HERO VISUAL */

.gx-case-marketcoop .hero-visual {
    position:relative;

    min-height:550px;

    display:flex;
    align-items:center;
}

.gx-case-marketcoop .hero-glow {
    position:absolute;

    left:50%;
    top:50%;

    width:480px;
    height:480px;

    transform:translate(-50%,-50%);

    border-radius:50%;

    background:rgba(8,167,232,.14);

    filter:blur(100px);
}

.gx-case-marketcoop .browser {
    position:relative;

    width:100%;

    overflow:hidden;

    border:1px solid #2b3a50;
    border-radius:15px;

    background:#f6f8fb;

    box-shadow:0 35px 80px rgba(0,0,0,.3);
}

.gx-case-marketcoop .hero-browser {
    z-index:2;

    transform:
        perspective(1200px)
        rotateY(-3deg)
        rotateX(1deg);
}

.gx-case-marketcoop .browser-top {
    height:43px;

    display:flex;
    align-items:center;
    gap:18px;

    padding:0 15px;

    background:#fff;

    border-bottom:1px solid #e2e7ed;
}

.gx-case-marketcoop .browser-dots {
    display:flex;
    gap:5px;
}

.gx-case-marketcoop .browser-dots span {
    width:6px;
    height:6px;

    border-radius:50%;

    background:#c4cbd4;
}

.gx-case-marketcoop .browser-address {
    width:52%;
    height:8px;

    border-radius:20px;

    background:#edf0f4;
}


/* MARKET DASHBOARD */

.gx-case-marketcoop .market-dashboard {
    height:400px;

    display:grid;
    grid-template-columns:60px 1fr;
}

.gx-case-marketcoop .dashboard-sidebar {
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:20px;

    padding-top:17px;

    background:#14261f;
}

.gx-case-marketcoop .dashboard-logo {
    width:30px;
    height:30px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin-bottom:10px;

    color:#fff;

    border-radius:8px;

    background:var(--green);

    font-size:12px;
    font-weight:900;
}

.gx-case-marketcoop .dashboard-sidebar span {
    width:20px;
    height:5px;

    border-radius:10px;

    background:#365147;
}

.gx-case-marketcoop .dashboard-sidebar span.active {
    background:var(--green);
}

.gx-case-marketcoop .dashboard-main {
    padding:26px;

    background:#f6f8f7;
}

.gx-case-marketcoop .dashboard-heading {
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.gx-case-marketcoop .dashboard-heading small {
    display:block;

    margin-bottom:4px;

    color:#91a099;

    font-size:7px;
    font-weight:800;
}

.gx-case-marketcoop .dashboard-heading strong {
    color:#18271f;

    font-size:15px;
}

.gx-case-marketcoop .dashboard-user {
    width:30px;
    height:30px;

    border-radius:50%;

    background:#e0e8e4;
}

.gx-case-marketcoop .dashboard-kpis {
    display:grid;
    grid-template-columns:repeat(3,1fr);

    gap:9px;

    margin-top:23px;
}

.gx-case-marketcoop .dashboard-kpis > div {
    padding:14px;

    border:1px solid #e0e7e3;
    border-radius:8px;

    background:#fff;
}

.gx-case-marketcoop .dashboard-kpis small {
    display:block;

    color:#93a199;

    font-size:6px;
    font-weight:800;
}

.gx-case-marketcoop .dashboard-kpis strong {
    display:block;

    margin-top:6px;

    color:#24352c;

    font-size:11px;
}

.gx-case-marketcoop .dashboard-panels {
    display:grid;
    grid-template-columns:1.5fr .7fr;

    gap:9px;

    margin-top:10px;
}

.gx-case-marketcoop .dashboard-chart,
.gx-case-marketcoop .dashboard-ranking {
    height:210px;

    padding:17px;

    border:1px solid #e0e7e3;
    border-radius:8px;

    background:#fff;
}

.gx-case-marketcoop .chart-title {
    width:85px;
    height:7px;

    border-radius:10px;

    background:#dde5e1;
}

.gx-case-marketcoop .chart-bars {
    height:150px;

    display:flex;
    align-items:flex-end;
    gap:8px;

    margin-top:16px;
}

.gx-case-marketcoop .chart-bars span {
    flex:1;

    border-radius:4px 4px 0 0;

    background:#d8eee4;
}

.gx-case-marketcoop .chart-bars span:nth-child(6) {
    background:var(--green);
}

.gx-case-marketcoop .dashboard-ranking {
    display:flex;
    flex-direction:column;
    gap:12px;
}

.gx-case-marketcoop .dashboard-ranking span {
    height:30px;

    border-radius:5px;

    background:#f0f4f2;
}


/* FLOATING */

.gx-case-marketcoop .floating-card {
    position:absolute;
    z-index:4;

    min-width:145px;

    padding:15px 18px;

    border:1px solid #304159;
    border-radius:11px;

    background:rgba(10,17,28,.95);

    box-shadow:0 15px 35px rgba(0,0,0,.28);

    backdrop-filter:blur(12px);
}

.gx-case-marketcoop .floating-card small {
    display:block;

    margin-bottom:4px;

    color:#74869e;

    font-size:7px;
    font-weight:800;
    letter-spacing:1px;
}

.gx-case-marketcoop .floating-card strong {
    font-size:13px;
}

.gx-case-marketcoop .seller-card {
    top:35px;
    right:-25px;
}

.gx-case-marketcoop .logistics-card {
    right:-35px;
    bottom:65px;
}

.gx-case-marketcoop .floating-status {
    position:absolute;
    z-index:4;

    left:-30px;
    bottom:25px;

    display:flex;
    align-items:center;
    gap:12px;

    padding:15px 18px;

    border:1px solid #2c3c53;
    border-radius:11px;

    background:rgba(10,17,28,.96);

    box-shadow:0 15px 35px rgba(0,0,0,.3);
}

.gx-case-marketcoop .floating-status > span {
    width:9px;
    height:9px;

    border-radius:50%;

    background:#2bd493;

    box-shadow:
        0 0 0 5px rgba(43,212,147,.1);
}

.gx-case-marketcoop .floating-status small {
    display:block;

    margin-bottom:3px;

    color:#74869e;

    font-size:7px;
    font-weight:800;
}

.gx-case-marketcoop .floating-status strong {
    font-size:11px;
}


/* ============================================================
   SUMMARY
============================================================ */

.gx-case-marketcoop .summary {
    padding:0;

    background:#fff;
}

.gx-case-marketcoop .summary-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);

    border-left:1px solid var(--border);
}

.gx-case-marketcoop .summary-item {
    min-height:120px;

    display:flex;
    flex-direction:column;
    justify-content:center;

    padding:25px 30px;

    border-right:1px solid var(--border);
    border-bottom:1px solid var(--border);
}

.gx-case-marketcoop .summary-item small {
    margin-bottom:8px;

    color:#929ead;

    font-size:9px;
    font-weight:800;
    letter-spacing:1.2px;
}

.gx-case-marketcoop .summary-item strong {
    font-size:14px;
}

.gx-case-marketcoop .summary-statement {
    max-width:950px;

    margin:auto;

    padding:120px 0;

    text-align:center;
}

.gx-case-marketcoop .quote-mark {
    display:block;

    height:50px;

    color:#d7edf7;

    font-family:Georgia,serif;
    font-size:90px;
    line-height:1;
}

.gx-case-marketcoop .summary-statement h2 {
    font-size:46px;
}


/* ============================================================
   CONTEXT
============================================================ */

.gx-case-marketcoop .context {
    background:var(--bg);
}

.gx-case-marketcoop .context-heading {
    display:grid;
    grid-template-columns:1fr .7fr;

    gap:90px;

    align-items:end;
}

.gx-case-marketcoop .context-heading > p {
    color:var(--muted);

    font-size:17px;
}

.gx-case-marketcoop .context-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);

    gap:15px;

    margin-top:65px;
}

.gx-case-marketcoop .context-grid article {
    position:relative;

    min-height:320px;

    padding:27px;

    border:1px solid var(--border);
    border-radius:16px;

    background:#fff;
}

.gx-case-marketcoop .card-number {
    position:absolute;

    top:25px;
    right:25px;

    color:#a0abba;

    font-size:9px;
    font-weight:800;
}

.gx-case-marketcoop .context-icon {
    width:50px;
    height:50px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin-bottom:65px;

    color:var(--blue);

    border-radius:12px;

    background:#e9f7fd;
}

.gx-case-marketcoop .context-grid h3 {
    font-size:19px;
}

.gx-case-marketcoop .context-grid p {
    margin-top:10px;

    color:var(--muted);

    font-size:13px;
}


/* ============================================================
   PLATFORM ARCHITECTURE
============================================================ */

.gx-case-marketcoop .platform-architecture {
    color:#fff;

    background:
        radial-gradient(
            circle at 50% 60%,
            rgba(8,167,232,.1),
            transparent 35%
        ),
        var(--dark);
}

.gx-case-marketcoop .platform-map {
    max-width:1000px;

    margin:70px auto 0;
}

.gx-case-marketcoop .platform-layer {
    position:relative;

    padding:35px;

    border:1px solid var(--border-dark);
    border-radius:18px;

    background:var(--dark-2);
}

.gx-case-marketcoop .layer-label {
    position:absolute;

    top:20px;
    right:25px;

    color:#667990;

    font-size:8px;
    font-weight:800;
    letter-spacing:1.2px;
}

.gx-case-marketcoop .platform-brand {
    margin-bottom:25px;
}

.gx-case-marketcoop .platform-brand small {
    display:block;

    margin-bottom:5px;

    color:#73849b;

    font-size:8px;
    font-weight:800;
    letter-spacing:1px;
}

.gx-case-marketcoop .platform-brand strong {
    font-size:30px;
}

.gx-case-marketcoop .platform-capabilities {
    display:grid;
    grid-template-columns:repeat(3,1fr);

    gap:8px;
}

.gx-case-marketcoop .platform-capabilities span {
    padding:14px;

    text-align:center;

    color:#a4b3c6;

    border:1px solid #2a3a51;
    border-radius:8px;

    background:#111c2d;

    font-size:10px;
}

.gx-case-marketcoop .integration-bridge {
    height:85px;

    display:flex;
    flex-direction:column;
    align-items:center;
}

.gx-case-marketcoop .integration-bridge span {
    width:1px;
    flex:1;

    background:#2e435c;
}

.gx-case-marketcoop .integration-bridge div {
    padding:6px 10px;

    color:#65c9ef;

    border:1px solid #24526a;
    border-radius:20px;

    font-size:7px;
    font-weight:800;
    letter-spacing:1px;
}

.gx-case-marketcoop .galactix-layer {
    border-color:#24425a;
}

.gx-case-marketcoop .galactix-brand strong {
    color:var(--blue-light);
}

.gx-case-marketcoop .galactix-products {
    display:grid;
    grid-template-columns:repeat(5,1fr);

    gap:8px;
}

.gx-case-marketcoop .galactix-products div {
    padding:17px 10px;

    text-align:center;

    border:1px solid #2b3e55;
    border-radius:9px;

    background:#111e30;
}

.gx-case-marketcoop .galactix-products small {
    display:block;

    margin-bottom:5px;

    color:#667b94;

    font-size:6px;
    font-weight:800;
}

.gx-case-marketcoop .galactix-products strong {
    font-size:10px;
}


/* ============================================================
   SOLUTION
============================================================ */

.gx-case-marketcoop .solution {
    background:#fff;
}

.gx-case-marketcoop .solution-heading {
    display:grid;
    grid-template-columns:1fr .7fr;

    gap:80px;

    align-items:end;
}

.gx-case-marketcoop .solution-heading > p {
    color:var(--muted);
}

.gx-case-marketcoop .solution-grid {
    display:grid;
    grid-template-columns:repeat(6,1fr);

    gap:15px;

    margin-top:60px;
}

.gx-case-marketcoop .solution-card {
    grid-column:span 2;

    min-height:310px;

    display:flex;
    flex-direction:column;

    padding:28px;

    border:1px solid var(--border);
    border-radius:16px;

    background:#fff;

    transition:.2s ease;
}

.gx-case-marketcoop .solution-card:hover {
    transform:translateY(-4px);

    box-shadow:0 18px 45px rgba(23,45,70,.08);
}

.gx-case-marketcoop .solution-card.featured {
    border-color:#b9e7f9;
}

.gx-case-marketcoop .solution-card.integration-card {
    grid-column:3 / span 2;

    color:#fff;

    border-color:var(--dark);

    background:var(--dark);
}

.gx-case-marketcoop .solution-number {
    margin-left:auto;

    color:#9aa6b5;

    font-size:9px;
    font-weight:800;
}

.gx-case-marketcoop .solution-label {
    margin-top:65px;
    margin-bottom:7px;

    color:var(--blue);

    font-size:8px;
    font-weight:800;
    letter-spacing:1px;
}

.gx-case-marketcoop .integration-card .solution-label {
    color:var(--blue-light);
}

.gx-case-marketcoop .solution-card h3 {
    font-size:24px;
}

.gx-case-marketcoop .solution-card p {
    margin-top:10px;

    color:var(--muted);

    font-size:13px;
}

.gx-case-marketcoop .integration-card p {
    color:#91a1b6;
}

.gx-case-marketcoop .solution-arrow {
    margin-top:auto;
    padding-top:25px;

    color:var(--blue);

    font-size:18px;
}


/* ============================================================
   PRODUCT SECTIONS
============================================================ */

.gx-case-marketcoop .product-section {
    color:#fff;
    background:var(--dark);
}

.gx-case-marketcoop .product-grid {
    display:grid;
    grid-template-columns:.75fr 1.25fr;

    gap:80px;

    align-items:center;
}

.gx-case-marketcoop .product-index {
    margin-bottom:35px;

    color:#667990;

    font-size:9px;
    font-weight:800;
    letter-spacing:1.2px;
}

.gx-case-marketcoop .product-index.dark {
    color:#9ba6b4;
}

.gx-case-marketcoop .product-copy > p {
    max-width:520px;

    margin-top:23px;

    color:#98a8bc;

    font-size:16px;
}

.gx-case-marketcoop .product-copy.light > p {
    color:var(--muted);
}

.gx-case-marketcoop .feature-tags {
    display:flex;
    flex-wrap:wrap;
    gap:7px;

    margin-top:30px;
}

.gx-case-marketcoop .feature-tags span {
    padding:9px 11px;

    color:#a9b8ca;

    border:1px solid #293b52;
    border-radius:7px;

    background:#101b2b;

    font-size:9px;
    font-weight:700;
}

.gx-case-marketcoop .feature-tags.light span {
    color:#667386;

    border-color:var(--border);
    background:var(--bg);
}


/* SELLER MOCK */

.gx-case-marketcoop .seller-dashboard {
    height:440px;

    display:grid;
    grid-template-columns:65px 1fr;

    background:#f5f7fa;
    border-radius:0;
    overflow:visible;
    box-shadow:none;
    border:none;
}

.gx-case-marketcoop .seller-dashboard aside {
    background:#101a29;
}

.gx-case-marketcoop .seller-main {
    padding:30px;
}

.gx-case-marketcoop .seller-heading {
    width:180px;
    height:15px;

    border-radius:5px;

    background:#1d2c3e;
}

.gx-case-marketcoop .seller-kpis {
    display:grid;
    grid-template-columns:repeat(3,1fr);

    gap:9px;

    margin-top:25px;
    margin-bottom:0;
}

.gx-case-marketcoop .seller-kpis span {
    height:70px;

    border:1px solid #e2e7ee;
    border-radius:8px;

    background:#fff;
}

.gx-case-marketcoop .seller-content {
    display:grid;
    grid-template-columns:1.5fr .7fr;

    gap:10px;

    margin-top:10px;
}

.gx-case-marketcoop .seller-content > div {
    height:250px;

    border:1px solid #e2e7ee;
    border-radius:8px;

    background:#fff;
}

.gx-case-marketcoop .seller-list {
    display:flex;
    flex-direction:column;
    gap:10px;

    padding:15px;
}

.gx-case-marketcoop .seller-list span {
    height:30px;

    border-radius:5px;

    background:#f0f3f6;
}


/* ============================================================
   CRM
============================================================ */

.gx-case-marketcoop .crm-section {
    background:var(--bg);
}

.gx-case-marketcoop .crm-heading {
    display:grid;
    grid-template-columns:1fr .7fr;

    gap:80px;

    align-items:end;
}

.gx-case-marketcoop .crm-heading > p {
    color:var(--muted);
    font-size:16px;
}

.gx-case-marketcoop .crm-flow {
    display:grid;
    grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;

    gap:12px;

    align-items:center;

    margin-top:65px;
}

.gx-case-marketcoop .crm-node {
    min-height:130px;

    display:flex;
    flex-direction:column;
    justify-content:space-between;

    padding:20px;

    border:1px solid var(--border);
    border-radius:12px;

    background:#fff;
}

.gx-case-marketcoop .crm-node small {
    color:#9ba7b6;

    font-size:8px;
    font-weight:800;
}

.gx-case-marketcoop .crm-node strong {
    font-size:14px;
}

.gx-case-marketcoop .crm-node.active {
    color:#fff;

    border-color:var(--blue);
    background:var(--blue);
}

.gx-case-marketcoop .crm-node.active small {
    color:#d5f2fd;
}

.gx-case-marketcoop .flow-arrow {
    color:#a4afbd;
}


/* ============================================================
   SERVICE
============================================================ */

.gx-case-marketcoop .service-section {
    background:#fff;
}

.gx-case-marketcoop .service-grid {
    display:grid;
    grid-template-columns:1.2fr .8fr;

    gap:90px;

    align-items:center;
}

.gx-case-marketcoop .service-window {
    overflow:hidden;

    border:1px solid var(--border);
    border-radius:15px;

    box-shadow:0 25px 60px rgba(25,45,70,.1);
}

.gx-case-marketcoop .service-top {
    height:55px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    padding:0 20px;

    border-bottom:1px solid var(--border);
}

.gx-case-marketcoop .service-top strong {
    font-size:12px;
}

.gx-case-marketcoop .service-top span {
    width:28px;
    height:28px;

    border-radius:50%;

    background:#eef2f5;
}

.gx-case-marketcoop .service-interface {
    height:420px;

    display:grid;
    grid-template-columns:190px 1fr;
}

.gx-case-marketcoop .conversations {
    padding:18px 12px;

    border-right:1px solid var(--border);

    background:#f8fafc;
}

.gx-case-marketcoop .conversations > small {
    display:block;

    margin:0 8px 15px;

    color:#9aa6b4;

    font-size:7px;
    font-weight:800;
}

.gx-case-marketcoop .conversation {
    display:flex;
    align-items:center;
    gap:10px;

    padding:10px;

    margin-bottom:5px;

    border-radius:8px;
}

.gx-case-marketcoop .conversation.active {
    background:#eaf7fc;
}

.gx-case-marketcoop .conversation > span {
    width:28px;
    height:28px;

    display:flex;
    align-items:center;
    justify-content:center;

    flex:none;

    color:#fff;

    border-radius:50%;

    background:var(--blue);

    font-size:8px;
    font-weight:800;
}

.gx-case-marketcoop .conversation strong {
    display:block;

    font-size:9px;
}

.gx-case-marketcoop .conversation small {
    display:block;

    margin-top:2px;

    color:#9aa5b3;

    font-size:7px;
}

.gx-case-marketcoop .chat {
    display:flex;
    flex-direction:column;

    padding:20px;
}

.gx-case-marketcoop .chat-heading {
    padding-bottom:15px;

    border-bottom:1px solid var(--border);
}

.gx-case-marketcoop .chat-heading strong {
    display:block;

    font-size:11px;
}

.gx-case-marketcoop .chat-heading small {
    color:#9aa5b3;

    font-size:7px;
}

.gx-case-marketcoop .messages {
    flex:1;

    padding:25px 0;
}

.gx-case-marketcoop .message {
    max-width:70%;

    margin-bottom:10px;

    padding:10px 13px;

    border-radius:10px;

    font-size:9px;
    line-height:1.5;
}

.gx-case-marketcoop .message.received {
    background:#f0f3f6;
}

.gx-case-marketcoop .message.sent {
    margin-left:auto;

    color:#fff;

    background:var(--blue);
}

.gx-case-marketcoop .chat-context {
    padding-top:12px;

    border-top:1px solid var(--border);
}

.gx-case-marketcoop .chat-context > small {
    display:block;

    margin-bottom:7px;

    color:#9aa5b3;

    font-size:6px;
    font-weight:800;
}

.gx-case-marketcoop .chat-context div {
    display:flex;
    gap:5px;
}

.gx-case-marketcoop .chat-context span {
    padding:5px 7px;

    border-radius:5px;

    background:#f1f4f7;

    color:#6c7889;

    font-size:7px;
}


/* ============================================================
   TMS
============================================================ */

.gx-case-marketcoop .tms-section {
    color:#fff;
    background:var(--dark);
}

.gx-case-marketcoop .tms-heading {
    display:grid;
    grid-template-columns:1fr .7fr;

    gap:80px;

    align-items:end;
}

.gx-case-marketcoop .tms-heading > p {
    color:#96a6ba;
}

.gx-case-marketcoop .logistics-flow {
    display:grid;
    grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;

    align-items:center;

    margin-top:70px;
}

.gx-case-marketcoop .logistics-node {
    min-height:190px;

    display:flex;
    flex-direction:column;

    padding:22px;

    border:1px solid var(--border-dark);
    border-radius:13px;

    background:var(--dark-2);
}

.gx-case-marketcoop .logistics-node > span {
    margin-left:auto;

    color:#64768e;

    font-size:8px;
    font-weight:800;
}

.gx-case-marketcoop .logistics-icon {
    width:45px;
    height:45px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin-top:25px;
    margin-bottom:22px;

    color:var(--blue-light);

    border-radius:10px;

    background:#14273a;
}

.gx-case-marketcoop .logistics-node strong {
    margin-top:auto;

    font-size:13px;
}

.gx-case-marketcoop .logistics-line {
    width:40px;
    height:1px;

    background:#30445c;
}


/* ============================================================
   INTEGRATOR
============================================================ */

.gx-case-marketcoop .integrator-section {
    color:#fff;

    background:
        radial-gradient(
            circle at 75% 50%,
            rgba(8,167,232,.12),
            transparent 30%
        ),
        #0b111c;
}

.gx-case-marketcoop .integrator-grid {
    display:grid;
    grid-template-columns:.8fr 1.2fr;

    gap:100px;

    align-items:center;
}

.gx-case-marketcoop .integrator-copy > p {
    max-width:500px;

    margin-top:23px;

    color:#98a8bc;

    font-size:16px;
}

.gx-case-marketcoop .integrator-map {
    padding:38px;

    border:1px solid var(--border-dark);
    border-radius:20px;

    background:var(--dark-2);
}

.gx-case-marketcoop .integrator-top,
.gx-case-marketcoop .integrator-bottom {
    display:grid;
    grid-template-columns:repeat(3,1fr);

    gap:8px;
}

.gx-case-marketcoop .integrator-top > div,
.gx-case-marketcoop .integrator-bottom > div {
    padding:16px 10px;

    text-align:center;

    border:1px solid #293b52;
    border-radius:8px;

    background:#111d2e;
}

.gx-case-marketcoop .integrator-map small {
    display:block;

    margin-bottom:4px;

    color:#687b93;

    font-size:6px;
    font-weight:800;
}

.gx-case-marketcoop .integrator-map strong {
    font-size:10px;
}

.gx-case-marketcoop .connector-tree {
    position:relative;

    height:45px;

    display:grid;
    grid-template-columns:repeat(3,1fr);
}

.gx-case-marketcoop .connector-tree::after {
    content:"";

    position:absolute;

    left:16.66%;
    right:16.66%;

    height:1px;

    background:#30445d;
}

.gx-case-marketcoop .top-tree::after {
    bottom:0;
}

.gx-case-marketcoop .bottom-tree::after {
    top:0;
}

.gx-case-marketcoop .connector-tree span {
    position:relative;
}

.gx-case-marketcoop .connector-tree span::before {
    content:"";

    position:absolute;

    left:50%;

    width:1px;
    height:45px;

    background:#30445d;
}

.gx-case-marketcoop .top-tree span::before {
    top:0;
}

.gx-case-marketcoop .bottom-tree span::before {
    bottom:0;
}

.gx-case-marketcoop .integrator-core {
    max-width:300px;

    margin:auto;

    padding:22px;

    text-align:center;

    border-radius:11px;

    background:var(--blue);
}

.gx-case-marketcoop .integrator-core small {
    color:#d7f4ff;
}

.gx-case-marketcoop .integrator-core strong {
    display:block;

    font-size:17px;
}


/* ============================================================
   JOURNEY
============================================================ */

.gx-case-marketcoop .order-journey {
    background:var(--bg);
}

.gx-case-marketcoop .order-journey .section-header > p {
    color:var(--muted);
}

.gx-case-marketcoop .journey {
    display:grid;
    grid-template-columns:1fr auto 1fr auto 1fr auto 1fr auto 1fr;

    gap:8px;

    align-items:center;

    margin-top:65px;
}

.gx-case-marketcoop .journey-item {
    min-height:145px;

    display:flex;
    flex-direction:column;

    padding:18px;

    border:1px solid var(--border);
    border-radius:11px;

    background:#fff;
}

.gx-case-marketcoop .journey-item > span {
    margin-left:auto;

    color:#a0abba;

    font-size:7px;
    font-weight:800;
}

.gx-case-marketcoop .journey-item small {
    margin-top:auto;

    margin-bottom:5px;

    color:#929ead;

    font-size:6px;
    font-weight:800;
}

.gx-case-marketcoop .journey-item strong {
    font-size:13px;
}

.gx-case-marketcoop .journey-item.vtex {
    border-color:#cfd6df;
}

.gx-case-marketcoop .journey-item.galactix {
    color:#fff;

    border-color:var(--blue);
    background:var(--blue);
}

.gx-case-marketcoop .journey-item.galactix small,
.gx-case-marketcoop .journey-item.galactix > span {
    color:#d8f3fd;
}

.gx-case-marketcoop .journey-arrow {
    color:#a3afbd;
}

.gx-case-marketcoop .journey-support {
    display:grid;
    grid-template-columns:1fr auto 1fr;

    gap:20px;

    align-items:center;

    margin-top:25px;

    text-align:center;
}

.gx-case-marketcoop .journey-support > span {
    height:1px;

    background:#d4dbe4;
}

.gx-case-marketcoop .journey-support small {
    display:block;

    margin-bottom:4px;

    color:#99a5b4;

    font-size:7px;
    font-weight:800;
}

.gx-case-marketcoop .journey-support strong {
    font-size:11px;
}


/* ============================================================
   PARTICIPANTS
============================================================ */

.gx-case-marketcoop .participants {
    color:#fff;
    background:var(--dark);
}

.gx-case-marketcoop .participants-heading {
    display:grid;
    grid-template-columns:1fr .7fr;

    gap:80px;

    align-items:end;
}

.gx-case-marketcoop .participants-heading > p {
    color:#96a6ba;
}

.gx-case-marketcoop .participants-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);

    gap:15px;

    margin-top:60px;
}

.gx-case-marketcoop .participants-grid article {
    min-height:350px;

    padding:28px;

    border:1px solid var(--border-dark);
    border-radius:16px;

    background:var(--dark-2);
}

.gx-case-marketcoop .participant-icon {
    width:48px;
    height:48px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin-bottom:45px;

    color:var(--blue-light);

    border-radius:11px;

    background:#14273a;

    font-weight:800;
}

.gx-case-marketcoop .participants-grid article > small {
    display:block;

    margin-bottom:5px;

    color:#687b93;

    font-size:7px;
    font-weight:800;
}

.gx-case-marketcoop .participants-grid h3 {
    font-size:24px;
}

.gx-case-marketcoop .participant-flow {
    display:flex;
    flex-direction:column;

    gap:7px;

    margin-top:25px;
}

.gx-case-marketcoop .participant-flow span {
    padding:9px 11px;

    color:#9dacbf;

    border:1px solid #26374d;
    border-radius:7px;

    background:#111c2d;

    font-size:9px;
}

.gx-case-marketcoop .participants-core {
    display:grid;
    grid-template-columns:1fr auto 1fr;

    gap:25px;

    align-items:center;

    margin-top:35px;

    text-align:center;
}

.gx-case-marketcoop .participants-core > span {
    height:1px;

    background:#263b53;
}

.gx-case-marketcoop .participants-core small {
    display:block;

    margin-bottom:4px;

    color:#677b94;

    font-size:7px;
    font-weight:800;
}

.gx-case-marketcoop .participants-core strong {
    color:var(--blue-light);

    font-size:13px;
}


/* ============================================================
   STACK
============================================================ */

.gx-case-marketcoop .stack-section {
    background:#fff;
}

.gx-case-marketcoop .stack-grid {
    display:grid;
    grid-template-columns:.8fr 1.2fr;

    gap:100px;

    align-items:center;
}

.gx-case-marketcoop .stack-copy > p {
    max-width:470px;

    margin-top:22px;

    color:var(--muted);
}

.gx-case-marketcoop .stack {
    display:grid;
    grid-template-columns:1fr auto 1fr;

    gap:20px;

    align-items:center;
}

.gx-case-marketcoop .stack-platform {
    min-height:290px;

    padding:28px;

    border:1px solid var(--border);
    border-radius:17px;

    background:var(--bg);
}

.gx-case-marketcoop .stack-platform.hub {
    border-color:#bce8f9;
}

.gx-case-marketcoop .stack-title {
    padding-bottom:22px;

    border-bottom:1px solid var(--border);
}

.gx-case-marketcoop .stack-title small {
    display:block;

    margin-bottom:5px;

    color:#9aa6b5;

    font-size:7px;
    font-weight:800;
}

.gx-case-marketcoop .stack-title strong {
    font-size:18px;
}

.gx-case-marketcoop .stack-items {
    display:flex;
    flex-direction:column;

    gap:9px;

    margin-top:20px;
}

.gx-case-marketcoop .stack-items div {
    display:flex;
    align-items:center;
    gap:10px;

    padding:10px;

    border-radius:7px;

    background:#fff;

    color:#566376;

    font-size:11px;
    font-weight:650;
}

.gx-case-marketcoop .stack-items span {
    color:var(--blue);

    font-weight:900;
}

.gx-case-marketcoop .stack-plus {
    color:#a1adbb;

    font-size:25px;
}


/* ============================================================
   FINAL
============================================================ */

.gx-case-marketcoop .final {
    padding:50px 0;

    color:#fff;

    background:
        radial-gradient(
            circle at 50% 100%,
            rgba(8,167,232,.18),
            transparent 40%
        ),
        var(--dark);
}

.gx-case-marketcoop .final-content {
    max-width:950px;

    margin:auto;

    text-align:center;
}

.gx-case-marketcoop .final .eyebrow {
    justify-content:center;
}

.gx-case-marketcoop .final h2 {
    font-size:55px;
}

.gx-case-marketcoop .final p {
    max-width:700px;

    margin:25px auto 0;

    color:#9baabd;

    font-size:17px;
}

.gx-case-marketcoop .final-actions {
    display:flex;
    justify-content:center;
    flex-wrap:wrap;

    gap:12px;

    margin-top:38px;
}


/* ============================================================
   RESPONSIVE
============================================================ */

@media(max-width:1050px){

    .gx-case-marketcoop h1 {
        font-size:55px;
    }

    .gx-case-marketcoop h2 {
        font-size:41px;
    }

    .gx-case-marketcoop .hero-grid,
    .gx-case-marketcoop .product-grid,
    .gx-case-marketcoop .service-grid,
    .gx-case-marketcoop .integrator-grid,
    .gx-case-marketcoop .stack-grid {
        grid-template-columns:1fr;
    }

    .gx-case-marketcoop .context-grid {
        grid-template-columns:repeat(2,1fr);
    }

    .gx-case-marketcoop .summary-grid {
        grid-template-columns:repeat(2,1fr);
    }

    .gx-case-marketcoop .galactix-products {
        grid-template-columns:repeat(3,1fr);
    }

    .gx-case-marketcoop .participants-grid {
        grid-template-columns:repeat(3,1fr);
    }

}


@media(max-width:760px){

    .gx-case-marketcoop section {
        padding:80px 0;
    }

    .gx-case-marketcoop .container {
        width:min(100% - 30px,var(--container));
    }

    .gx-case-marketcoop h1 {
        font-size:43px;
    }

    .gx-case-marketcoop h2 {
        font-size:35px;
    }

    .gx-case-marketcoop .hero {
        min-height:auto;
        padding:80px 0;
    }

    .gx-case-marketcoop .hero-grid {
        gap:50px;
    }

    .gx-case-marketcoop .hero-visual {
        min-height:auto;
    }

    .gx-case-marketcoop .floating-card,
    .gx-case-marketcoop .floating-status {
        display:none;
    }

    .gx-case-marketcoop .market-dashboard {
        height:340px;
    }

    .gx-case-marketcoop .dashboard-panels {
        grid-template-columns:1fr;
    }

    .gx-case-marketcoop .dashboard-ranking {
        display:none;
    }

    .gx-case-marketcoop .summary-grid {
        grid-template-columns:1fr;
    }

    .gx-case-marketcoop .summary-statement {
        padding:80px 0;
    }

    .gx-case-marketcoop .summary-statement h2 {
        font-size:35px;
    }

    .gx-case-marketcoop .context-heading,
    .gx-case-marketcoop .solution-heading,
    .gx-case-marketcoop .crm-heading,
    .gx-case-marketcoop .tms-heading,
    .gx-case-marketcoop .participants-heading {
        grid-template-columns:1fr;

        gap:25px;
    }

    .gx-case-marketcoop .context-grid {
        grid-template-columns:1fr;
    }

    .gx-case-marketcoop .platform-capabilities,
    .gx-case-marketcoop .galactix-products {
        grid-template-columns:1fr;
    }

    .gx-case-marketcoop .solution-grid {
        grid-template-columns:1fr;
    }

    .gx-case-marketcoop .solution-card,
    .gx-case-marketcoop .solution-card.integration-card {
        grid-column:auto;
    }

    .gx-case-marketcoop .crm-flow {
        grid-template-columns:1fr;
    }

    .gx-case-marketcoop .flow-arrow {
        text-align:center;
        transform:rotate(90deg);
    }

    .gx-case-marketcoop .service-interface {
        grid-template-columns:120px 1fr;
    }

    .gx-case-marketcoop .conversation > div {
        display:none;
    }

    .gx-case-marketcoop .conversation {
        justify-content:center;
    }

    .gx-case-marketcoop .logistics-flow {
        grid-template-columns:1fr;
        gap:10px;
    }

    .gx-case-marketcoop .logistics-line {
        width:1px;
        height:25px;

        margin:auto;
    }

    .gx-case-marketcoop .integrator-top,
    .gx-case-marketcoop .integrator-bottom {
        grid-template-columns:1fr;
    }

    .gx-case-marketcoop .connector-tree {
        display:none;
    }

    .gx-case-marketcoop .integrator-core {
        margin:20px auto;
    }

    .gx-case-marketcoop .journey {
        grid-template-columns:1fr;
    }

    .gx-case-marketcoop .journey-arrow {
        text-align:center;
        transform:rotate(90deg);
    }

    .gx-case-marketcoop .journey-support {
        grid-template-columns:1fr;
    }

    .gx-case-marketcoop .journey-support > span {
        display:none;
    }

    .gx-case-marketcoop .participants-grid {
        grid-template-columns:1fr;
    }

    .gx-case-marketcoop .participants-core {
        grid-template-columns:1fr;
    }

    .gx-case-marketcoop .participants-core > span {
        display:none;
    }

    .gx-case-marketcoop .stack {
        grid-template-columns:1fr;
    }

    .gx-case-marketcoop .stack-plus {
        text-align:center;
    }

    .gx-case-marketcoop .final h2 {
        font-size:40px;
    }

}


@media(max-width:480px){

    .gx-case-marketcoop h1 {
        font-size:38px;
    }

    .gx-case-marketcoop h2 {
        font-size:31px;
    }

    .gx-case-marketcoop .platform-layer,
    .gx-case-marketcoop .integrator-map {
        padding:22px;
    }

    .gx-case-marketcoop .dashboard-kpis {
        grid-template-columns:1fr;
    }

    .gx-case-marketcoop .dashboard-kpis > div:nth-child(n+2) {
        display:none;
    }

    .gx-case-marketcoop .service-interface {
        grid-template-columns:70px 1fr;
    }

    .gx-case-marketcoop .conversations > small {
        display:none;
    }

    .gx-case-marketcoop .final-actions {
        flex-direction:column;
    }

    .gx-case-marketcoop .final-actions .btn {
        width:100%;
    }

}

/* ══════════════════════════════════════════════════════════
   CASE — ZIPIT (pages/cases/Zipit.html)
   padrão visual b2c
══════════════════════════════════════════════════════════ */
.gx-case-zipit {
    --blue: #00a0e3;
    --blue-light: #38bdf8;
    --blue-dark: #008cc6;
    --orange: #f59e0b;
    --orange-light: #fef3c7;
    --green: #16a34a;
    --dark: #060913;
    --dark-2: #0b0f19;
    --dark-3: #0f172a;
    --white: #ffffff;
    --bg: #f8fafc;
    --bg-2: #f1f5f9;
    --text: #0f172a;
    --muted: #64748b;
    --border: #e2e8f0;
    --border-dark: #202e43;
    --container: 1200px;

    display: block;
    overflow: hidden;
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: var(--text);
    background: #ffffff;
    -webkit-font-smoothing: antialiased;
    line-height: 1.6;
}
.gx-case-zipit * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

.gx-case-zipit img {
    display:block;
    width:100%;
}

.gx-case-zipit a {
    color:inherit;
}

.gx-case-zipit svg {
    width:22px;
    height:22px;

    fill:none;
    stroke:currentColor;
    stroke-width:1.6;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.gx-case-zipit .container {
    width:min(var(--container),calc(100% - 48px));
    margin:auto;
}

.gx-case-zipit section {
    padding:20px 0;
}


/* ============================================================
   TYPOGRAPHY
============================================================ */

.gx-case-zipit h1,
.gx-case-zipit h2,
.gx-case-zipit h3 {
    letter-spacing:-.035em;
}

.gx-case-zipit h1 {
    font-size:66px;
    line-height:1.02;
    font-weight:800;
}

.gx-case-zipit h2 {
    font-size:48px;
    line-height:1.08;
    font-weight:800;
}

.gx-case-zipit h3 {
    font-size:22px;
    line-height:1.2;
}

.gx-case-zipit h1 span,
.gx-case-zipit h2 span {
    display:block;
    color:var(--blue);
}

.gx-case-zipit p {
    line-height:1.7;
}

.gx-case-zipit .eyebrow {
    display:flex;
    align-items:center;
    gap:13px;

    margin-bottom:24px;

    color:var(--blue-light);

    font-size:12px;
    font-weight:800;
    letter-spacing:1.8px;
}

.gx-case-zipit .eyebrow::before {
    content:"";

    width:34px;
    height:2px;

    background:currentColor;
}

.gx-case-zipit .eyebrow.dark {
    color:var(--blue);
}

.gx-case-zipit .section-header {
    max-width:790px;
}

.gx-case-zipit .section-header.center {
    margin:auto;
    text-align:center;
}

.gx-case-zipit .section-header.center .eyebrow {
    justify-content:center;
}

.gx-case-zipit .section-header > p {
    max-width:650px;

    margin:22px auto 0;

    color:var(--muted);

    font-size:17px;
}


/* ============================================================
   BUTTONS
============================================================ */

.gx-case-zipit .btn {
    min-height:58px;

    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:17px;

    padding:0 28px;

    border-radius:10px;

    text-decoration:none;

    font-size:14px;
    font-weight:750;

    transition:.2s ease;
}

.gx-case-zipit .btn:hover {
    transform:translateY(-2px);
}

.gx-case-zipit .btn-primary {
    color:#fff;
    background:var(--blue);
}

.gx-case-zipit .btn-primary:hover {
    background:var(--blue-light);
}

.gx-case-zipit .btn-outline {
    color:#fff;

    border:1px solid #3a4b62;
}

.gx-case-zipit .btn-outline:hover {
    border-color:var(--blue);
}


/* ============================================================
   HERO
============================================================ */

.gx-case-zipit .hero {
    min-height:790px;

    display:flex;
    align-items:center;

    overflow:hidden;

    color:#fff;

    background:
        radial-gradient(
            circle at 78% 42%,
            rgba(8,167,232,.16),
            transparent 30%
        ),
        radial-gradient(
            circle at 30% 100%,
            rgba(8,100,190,.08),
            transparent 35%
        ),
        var(--dark);
}

.gx-case-zipit .hero-grid {
    display:grid;
    grid-template-columns:.96fr 1.04fr;

    gap:75px;

    align-items:center;
}

.gx-case-zipit .back-link {
    display:inline-block;

    margin-bottom:45px;

    color:#7f8fa5;

    text-decoration:none;

    font-size:12px;
    font-weight:650;
}

.gx-case-zipit .back-link:hover {
    color:#fff;
}

.gx-case-zipit .hero-description {
    max-width:610px;

    margin-top:27px;

    color:#a5b4c8;

    font-size:18px;
}

.gx-case-zipit .hero-tags {
    display:flex;
    flex-wrap:wrap;
    gap:8px;

    margin-top:32px;
}

.gx-case-zipit .hero-tags span {
    padding:9px 12px;

    color:#adbbce;

    border:1px solid #293a52;
    border-radius:7px;

    background:#111b2b;

    font-size:10px;
    font-weight:750;
}


/* HERO VISUAL */

.gx-case-zipit .hero-visual {
    position:relative;

    min-height:550px;

    display:flex;
    align-items:center;
}

.gx-case-zipit .hero-glow {
    position:absolute;

    left:50%;
    top:50%;

    width:480px;
    height:480px;

    transform:translate(-50%,-50%);

    border-radius:50%;

    background:rgba(8,167,232,.14);

    filter:blur(100px);
}

.gx-case-zipit .browser {
    position:relative;

    width:100%;

    overflow:hidden;

    border:1px solid #2b3a50;
    border-radius:15px;

    background:#f6f8fb;

    box-shadow:0 35px 80px rgba(0,0,0,.30);
}

.gx-case-zipit .hero-browser {
    z-index:2;

    transform:
        perspective(1200px)
        rotateY(-3deg)
        rotateX(1deg);
}

.gx-case-zipit .browser-top {
    height:43px;

    display:flex;
    align-items:center;
    gap:18px;

    padding:0 15px;

    background:#fff;

    border-bottom:1px solid #e2e7ed;
}

.gx-case-zipit .browser-dots {
    display:flex;
    gap:5px;
}

.gx-case-zipit .browser-dots span {
    width:6px;
    height:6px;

    border-radius:50%;

    background:#c4cbd4;
}

.gx-case-zipit .browser-address {
    width:52%;
    height:8px;

    border-radius:20px;

    background:#edf0f4;
}


/* DASHBOARD */

.gx-case-zipit .sfa-dashboard {
    height:400px;

    display:grid;
    grid-template-columns:60px 1fr;
}

.gx-case-zipit .dashboard-sidebar {
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:20px;

    padding-top:17px;

    background:#101a29;
}

.gx-case-zipit .dashboard-logo {
    width:30px;
    height:30px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin-bottom:10px;

    color:#fff;

    border-radius:8px;

    background:var(--blue);

    font-size:12px;
    font-weight:900;
}

.gx-case-zipit .dashboard-sidebar span {
    width:20px;
    height:5px;

    border-radius:10px;

    background:#35455a;
}

.gx-case-zipit .dashboard-sidebar span.active {
    background:var(--blue);
}

.gx-case-zipit .dashboard-main {
    padding:26px;

    background:#f5f7fa;
}

.gx-case-zipit .dashboard-heading {
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.gx-case-zipit .dashboard-heading small {
    display:block;

    margin-bottom:4px;

    color:#9aa5b3;

    font-size:7px;
    font-weight:800;
}

.gx-case-zipit .dashboard-heading strong {
    color:#182537;

    font-size:15px;
}

.gx-case-zipit .dashboard-user {
    width:30px;
    height:30px;

    border-radius:50%;

    background:#e2e8ef;
}

.gx-case-zipit .dashboard-kpis {
    display:grid;
    grid-template-columns:repeat(3,1fr);

    gap:9px;

    margin-top:23px;
}

.gx-case-zipit .dashboard-kpis > div {
    padding:14px;

    border:1px solid #e1e6ed;
    border-radius:8px;

    background:#fff;
}

.gx-case-zipit .dashboard-kpis small {
    display:block;

    color:#9aa5b3;

    font-size:6px;
    font-weight:800;
}

.gx-case-zipit .dashboard-kpis strong {
    display:block;

    margin-top:6px;

    color:#253449;

    font-size:11px;
}

.gx-case-zipit .dashboard-panels {
    display:grid;
    grid-template-columns:1.5fr .7fr;

    gap:9px;

    margin-top:10px;
}

.gx-case-zipit .dashboard-chart,
.gx-case-zipit .dashboard-list {
    height:210px;

    padding:17px;

    border:1px solid #e1e6ed;
    border-radius:8px;

    background:#fff;
}

.gx-case-zipit .chart-title {
    width:85px;
    height:7px;

    border-radius:10px;

    background:#dbe2ea;
}

.gx-case-zipit .chart-bars {
    height:150px;

    display:flex;
    align-items:flex-end;
    gap:8px;

    margin-top:16px;
}

.gx-case-zipit .chart-bars span {
    flex:1;

    border-radius:4px 4px 0 0;

    background:#d9edf7;
}

.gx-case-zipit .chart-bars span:nth-child(6) {
    background:var(--blue);
}

.gx-case-zipit .dashboard-list {
    display:flex;
    flex-direction:column;
    gap:12px;
}

.gx-case-zipit .dashboard-list span {
    height:30px;

    border-radius:5px;

    background:#f0f3f6;
}


/* FLOATING CARDS */

.gx-case-zipit .floating-card {
    position:absolute;
    z-index:4;

    min-width:155px;

    display:flex;
    align-items:center;
    gap:11px;

    padding:15px 17px;

    border:1px solid #304159;
    border-radius:11px;

    background:rgba(10,17,28,.96);

    box-shadow:0 15px 35px rgba(0,0,0,.28);

    backdrop-filter:blur(12px);
}

.gx-case-zipit .floating-card small {
    display:block;

    margin-bottom:3px;

    color:#74869e;

    font-size:7px;
    font-weight:800;
    letter-spacing:1px;
}

.gx-case-zipit .floating-card strong {
    font-size:12px;
}

.gx-case-zipit .import-card {
    top:38px;
    right:-30px;
}

.gx-case-zipit .hub-card {
    right:-35px;
    bottom:65px;
}

.gx-case-zipit .status-dot {
    width:9px;
    height:9px;

    flex:none;

    border-radius:50%;

    background:var(--orange);

    box-shadow:
        0 0 0 5px rgba(255,155,66,.10);
}

.gx-case-zipit .hub-icon {
    width:28px;
    height:28px;

    display:flex;
    align-items:center;
    justify-content:center;

    flex:none;

    color:var(--blue-light);

    border-radius:7px;

    background:#14283b;
}

.gx-case-zipit .floating-flow {
    position:absolute;
    z-index:4;

    left:-35px;
    bottom:20px;

    display:flex;
    align-items:center;
    gap:8px;

    padding:13px 16px;

    border:1px solid #2d3e55;
    border-radius:10px;

    background:rgba(10,17,28,.96);

    box-shadow:0 15px 35px rgba(0,0,0,.28);
}

.gx-case-zipit .floating-flow span {
    color:#a3b2c5;

    font-size:8px;
    font-weight:700;
}

.gx-case-zipit .floating-flow i {
    color:var(--blue);

    font-size:9px;
    font-style:normal;
}


/* ============================================================
   SUMMARY
============================================================ */

.gx-case-zipit .summary {
    padding:0;

    background:#fff;
}

.gx-case-zipit .summary-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);

    border-left:1px solid var(--border);
}

.gx-case-zipit .summary-item {
    min-height:120px;

    display:flex;
    flex-direction:column;
    justify-content:center;

    padding:25px 30px;

    border-right:1px solid var(--border);
    border-bottom:1px solid var(--border);
}

.gx-case-zipit .summary-item small {
    margin-bottom:8px;

    color:#929ead;

    font-size:9px;
    font-weight:800;
    letter-spacing:1.2px;
}

.gx-case-zipit .summary-item strong {
    font-size:14px;
}

.gx-case-zipit .summary-statement {
    max-width:970px;

    margin:auto;

    padding:120px 0;

    text-align:center;
}

.gx-case-zipit .quote-mark {
    display:block;

    height:50px;

    color:#d7edf7;

    font-family:Georgia,serif;
    font-size:90px;
    line-height:1;
}

.gx-case-zipit .summary-statement h2 {
    font-size:46px;
}


/* ============================================================
   SCENARIO
============================================================ */

.gx-case-zipit .scenario {
    background:var(--bg);
}

.gx-case-zipit .scenario-heading {
    display:grid;
    grid-template-columns:1fr .7fr;

    gap:90px;

    align-items:end;
}

.gx-case-zipit .scenario-heading > p {
    color:var(--muted);

    font-size:17px;
}

.gx-case-zipit .scenario-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);

    gap:15px;

    margin-top:65px;
}

.gx-case-zipit .scenario-grid article {
    position:relative;

    min-height:330px;

    padding:28px;

    border:1px solid var(--border);
    border-radius:16px;

    background:#fff;
}

.gx-case-zipit .card-number {
    position:absolute;

    top:25px;
    right:25px;

    color:#a0abba;

    font-size:9px;
    font-weight:800;
}

.gx-case-zipit .scenario-icon {
    width:50px;
    height:50px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin-bottom:55px;

    color:var(--blue);

    border-radius:12px;

    background:#e9f7fd;
}

.gx-case-zipit .scenario-grid article > small {
    display:block;

    margin-bottom:6px;

    color:#9aa6b4;

    font-size:7px;
    font-weight:800;
    letter-spacing:1px;
}

.gx-case-zipit .scenario-grid h3 {
    font-size:21px;
}

.gx-case-zipit .scenario-grid p {
    margin-top:10px;

    color:var(--muted);

    font-size:13px;
}


/* ============================================================
   SOLUTION
============================================================ */

.gx-case-zipit .solution {
    color:#fff;

    background:
        radial-gradient(
            circle at 50% 70%,
            rgba(8,167,232,.11),
            transparent 32%
        ),
        var(--dark);
}

.gx-case-zipit .solution .section-header > p {
    color:#94a4b9;
}

.gx-case-zipit .solution-flow {
    display:grid;
    grid-template-columns:1fr auto 1fr auto 1fr;

    gap:14px;

    align-items:center;

    margin-top:70px;
}

.gx-case-zipit .solution-card {
    min-height:310px;

    padding:28px;

    border:1px solid var(--border-dark);
    border-radius:16px;

    background:var(--dark-2);
}

.gx-case-zipit .solution-number {
    float:right;

    color:#65778f;

    font-size:9px;
    font-weight:800;
}

.gx-case-zipit .solution-icon {
    width:46px;
    height:46px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin-bottom:55px;

    color:var(--blue-light);

    border-radius:11px;

    background:#14273a;

    font-size:17px;
}

.gx-case-zipit .solution-card.import .solution-icon {
    color:var(--orange);

    background:rgba(255,155,66,.10);
}

.gx-case-zipit .solution-card > small {
    display:block;

    margin-bottom:6px;

    color:#6c7e95;

    font-size:7px;
    font-weight:800;
    letter-spacing:1px;
}

.gx-case-zipit .solution-card h3 {
    font-size:25px;
}

.gx-case-zipit .solution-card p {
    margin-top:10px;

    color:#93a3b7;

    font-size:13px;
}

.gx-case-zipit .solution-card.hub {
    border-color:#176e99;

    background:
        linear-gradient(
            145deg,
            rgba(8,167,232,.12),
            rgba(13,21,34,1) 55%
        );
}

.gx-case-zipit .solution-connector {
    display:flex;
    align-items:center;
}

.gx-case-zipit .solution-connector span {
    width:15px;
    height:1px;

    background:#30445c;
}

.gx-case-zipit .solution-connector i {
    color:#62758d;

    font-size:10px;
    font-style:normal;
}


/* ============================================================
   ARCHITECTURE
============================================================ */

.gx-case-zipit .architecture {
    color:#fff;
    background:#0b111c;
}

.gx-case-zipit .architecture-grid {
    display:grid;
    grid-template-columns:.8fr 1.2fr;

    gap:100px;

    align-items:center;
}

.gx-case-zipit .architecture-copy > p {
    max-width:520px;

    margin-top:25px;

    color:#98a8bc;

    font-size:16px;
}

.gx-case-zipit .architecture-message {
    display:flex;
    gap:14px;

    margin-top:35px;
    padding-top:25px;

    border-top:1px solid var(--border-dark);
}

.gx-case-zipit .architecture-message > span {
    width:8px;
    height:8px;

    flex:none;

    margin-top:8px;

    border-radius:50%;

    background:var(--blue);
}

.gx-case-zipit .architecture-message p {
    color:#c1cbda;

    font-size:13px;
}

.gx-case-zipit .architecture-map {
    padding:40px;

    border:1px solid var(--border-dark);
    border-radius:20px;

    background:var(--dark-2);
}

.gx-case-zipit .architecture-title {
    margin-bottom:30px;

    color:#667990;

    text-align:center;

    font-size:9px;
    font-weight:800;
    letter-spacing:1.5px;
}

.gx-case-zipit .arch-node {
    max-width:350px;

    margin:auto;

    padding:22px;

    text-align:center;

    border:1px solid #2b3e55;
    border-radius:11px;

    background:#111e30;
}

.gx-case-zipit .arch-node small {
    display:block;

    margin-bottom:5px;

    color:#687b93;

    font-size:7px;
    font-weight:800;
}

.gx-case-zipit .arch-node strong {
    font-size:17px;
}

.gx-case-zipit .operation-node {
    border-color:#5d4835;
}

.gx-case-zipit .operation-node strong {
    color:#ffb36f;
}

.gx-case-zipit .hub-node {
    border-color:var(--blue);
    background:var(--blue);
}

.gx-case-zipit .hub-node small {
    color:#d9f4ff;
}

.gx-case-zipit .sfa-node {
    border-color:#2d5368;
}

.gx-case-zipit .sfa-node strong {
    color:var(--blue-light);
}

.gx-case-zipit .arch-line {
    height:70px;

    display:flex;
    flex-direction:column;
    align-items:center;
}

.gx-case-zipit .arch-line span {
    width:1px;
    flex:1;

    background:#30445d;
}

.gx-case-zipit .arch-line small {
    padding:4px 8px;

    color:#65788f;

    font-size:6px;
    font-weight:800;
}

.gx-case-zipit .arch-people {
    display:grid;
    grid-template-columns:1fr auto 1fr;

    gap:12px;

    align-items:center;

    margin-top:20px;
}

.gx-case-zipit .arch-people > div {
    padding:14px;

    text-align:center;

    border:1px solid #293b52;
    border-radius:8px;

    background:#111c2d;
}

.gx-case-zipit .arch-people small {
    display:block;

    margin-bottom:4px;

    color:#667990;

    font-size:6px;
    font-weight:800;
}

.gx-case-zipit .arch-people strong {
    font-size:10px;
}

.gx-case-zipit .arch-people > span {
    color:#5f7289;
}


/* ============================================================
   PRODUCT GRID
============================================================ */

.gx-case-zipit .product-grid {
    display:grid;
    grid-template-columns:.75fr 1.25fr;

    gap:80px;

    align-items:center;
}

.gx-case-zipit .product-grid.reverse {
    grid-template-columns:1.25fr .75fr;
}

.gx-case-zipit .product-index {
    margin-bottom:35px;

    color:#667990;

    font-size:9px;
    font-weight:800;
    letter-spacing:1.2px;
}

.gx-case-zipit .product-index.dark {
    color:#9aa6b4;
}

.gx-case-zipit .product-copy > p {
    max-width:520px;

    margin-top:23px;

    color:#98a8bc;

    font-size:16px;
}

.gx-case-zipit .product-copy.light > p {
    color:var(--muted);
}


/* ============================================================
   IMPORT
============================================================ */

.gx-case-zipit .import-section {
    color:#fff;

    background:var(--dark);
}

.gx-case-zipit .import-dashboard {
    height:440px;

    display:grid;
    grid-template-columns:65px 1fr;

    background:#f5f7fa;
}

.gx-case-zipit .import-dashboard aside {
    background:#101a29;
}

.gx-case-zipit .import-main {
    padding:28px;
}

.gx-case-zipit .import-heading {
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.gx-case-zipit .import-heading small {
    display:block;

    margin-bottom:4px;

    color:#9ba5b2;

    font-size:7px;
    font-weight:800;
}

.gx-case-zipit .import-heading strong {
    color:#1c293a;

    font-size:15px;
}

.gx-case-zipit .import-heading > span {
    width:30px;
    height:30px;

    border-radius:50%;

    background:#e1e7ed;
}

.gx-case-zipit .import-kpis {
    display:grid;
    grid-template-columns:repeat(3,1fr);

    gap:9px;

    margin-top:22px;
}

.gx-case-zipit .import-kpis div {
    padding:14px;

    border:1px solid #e1e6ec;
    border-radius:8px;

    background:#fff;
}

.gx-case-zipit .import-kpis small {
    display:block;

    color:#9ba6b4;

    font-size:6px;
    font-weight:800;
}

.gx-case-zipit .import-kpis strong {
    display:block;

    margin-top:6px;

    color:#253449;

    font-size:17px;
}

.gx-case-zipit .import-table {
    margin-top:12px;

    overflow:hidden;

    border:1px solid #e1e6ec;
    border-radius:8px;

    background:#fff;
}

.gx-case-zipit .table-header,
.gx-case-zipit .table-row {
    display:grid;
    grid-template-columns:1.4fr 1fr 1fr .5fr;

    gap:15px;

    align-items:center;

    padding:13px 15px;

    border-bottom:1px solid #edf0f3;
}

.gx-case-zipit .table-header {
    background:#f8fafb;
}

.gx-case-zipit .table-header span,
.gx-case-zipit .table-row span {
    height:6px;

    border-radius:10px;

    background:#e2e7ec;
}

.gx-case-zipit .table-row i {
    width:30px;
    height:14px;

    margin-left:auto;

    border-radius:10px;

    background:#e6f6ee;
}


/* ============================================================
   IMPORT JOURNEY
============================================================ */

.gx-case-zipit .import-journey {
    background:var(--bg);
}

.gx-case-zipit .journey-flow {
    display:grid;
    grid-template-columns:1fr auto 1fr auto 1fr auto 1fr auto 1fr;

    align-items:center;

    margin-top:65px;
}

.gx-case-zipit .journey-node {
    min-height:185px;

    display:flex;
    flex-direction:column;

    padding:20px;

    border:1px solid var(--border);
    border-radius:12px;

    background:#fff;
}

.gx-case-zipit .journey-node > span {
    margin-left:auto;

    color:#a0abba;

    font-size:8px;
    font-weight:800;
}

.gx-case-zipit .journey-icon {
    width:38px;
    height:38px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin-top:25px;
    margin-bottom:20px;

    color:var(--blue);

    border-radius:9px;

    background:#eaf7fc;
}

.gx-case-zipit .journey-node small {
    margin-top:auto;
    margin-bottom:4px;

    color:#99a5b4;

    font-size:6px;
    font-weight:800;
}

.gx-case-zipit .journey-node strong {
    font-size:12px;
}

.gx-case-zipit .journey-node.active {
    color:#fff;

    border-color:var(--blue);
    background:var(--blue);
}

.gx-case-zipit .journey-node.active .journey-icon {
    color:#fff;

    background:rgba(255,255,255,.14);
}

.gx-case-zipit .journey-node.active small,
.gx-case-zipit .journey-node.active > span {
    color:#d6f2fc;
}

.gx-case-zipit .journey-line {
    width:30px;
    height:1px;

    background:#ccd5df;
}


/* ============================================================
   HUB
============================================================ */

.gx-case-zipit .hub-section {
    color:#fff;

    background:
        radial-gradient(
            circle at 75% 50%,
            rgba(8,167,232,.13),
            transparent 30%
        ),
        #0b111c;
}

.gx-case-zipit .hub-grid {
    display:grid;
    grid-template-columns:.8fr 1.2fr;

    gap:100px;

    align-items:center;
}

.gx-case-zipit .hub-copy > p {
    max-width:500px;

    margin-top:23px;

    color:#98a8bc;

    font-size:16px;
}

.gx-case-zipit .hub-map {
    padding:38px;

    border:1px solid var(--border-dark);
    border-radius:20px;

    background:var(--dark-2);
}

.gx-case-zipit .hub-top {
    display:grid;
    grid-template-columns:repeat(2,1fr);

    gap:10px;
}

.gx-case-zipit .hub-top > div,
.gx-case-zipit .hub-output {
    padding:17px;

    text-align:center;

    border:1px solid #293b52;
    border-radius:9px;

    background:#111d2e;
}

.gx-case-zipit .hub-map small {
    display:block;

    margin-bottom:4px;

    color:#687b93;

    font-size:6px;
    font-weight:800;
}

.gx-case-zipit .hub-map strong {
    font-size:11px;
}

.gx-case-zipit .hub-connectors {
    position:relative;

    display:grid;

    height:45px;
}

.gx-case-zipit .hub-connectors.top {
    grid-template-columns:repeat(2,1fr);
}

.gx-case-zipit .hub-connectors span {
    position:relative;
}

.gx-case-zipit .hub-connectors span::before {
    content:"";

    position:absolute;

    left:50%;

    width:1px;
    height:45px;

    background:#30445d;
}

.gx-case-zipit .hub-connectors.top::after {
    content:"";

    position:absolute;

    left:25%;
    right:25%;
    bottom:0;

    height:1px;

    background:#30445d;
}

.gx-case-zipit .hub-core {
    max-width:300px;

    margin:auto;

    padding:22px !important;

    display:block !important;

    text-align:center;

    border-radius:11px !important;

    background:var(--blue) !important;

    animation:none !important;
}

.gx-case-zipit .hub-core small {
    color:#d8f3fd;
}

.gx-case-zipit .hub-core strong {
    display:block;

    font-size:17px;
}

.gx-case-zipit .hub-connectors.bottom {
    grid-template-columns:1fr;
}

.gx-case-zipit .hub-output {
    max-width:300px;
    margin:auto;
}

.gx-case-zipit .hub-output strong {
    color:var(--blue-light);

    font-size:16px;
}

.gx-case-zipit .hub-users {
    display:grid;
    grid-template-columns:repeat(2,1fr);

    gap:8px;

    max-width:400px;

    margin:12px auto 0;
}

.gx-case-zipit .hub-users span {
    padding:11px;

    text-align:center;

    color:#8fa0b5;

    border:1px solid #26374d;
    border-radius:7px;

    background:#101b2b;

    font-size:8px;
}


/* ============================================================
   SFA
============================================================ */

.gx-case-zipit .sfa-section {
    background:#fff;
}

.gx-case-zipit .light-browser {
    border-color:#e1e6ed;
}

.gx-case-zipit .sfa-screen {
    height:440px;

    display:grid;
    grid-template-columns:65px 1fr;

    background:#f5f7fa;
}

.gx-case-zipit .sfa-screen aside {
    background:#101a29;
}

.gx-case-zipit .sfa-main {
    padding:28px;
}

.gx-case-zipit .sfa-title {
    width:170px;
    height:15px;

    border-radius:5px;

    background:#1e2c3e;
}

.gx-case-zipit .sfa-cards {
    display:grid;
    grid-template-columns:repeat(4,1fr);

    gap:9px;

    margin-top:25px;
}

.gx-case-zipit .sfa-cards span {
    height:70px;

    border:1px solid #e2e7ed;
    border-radius:8px;

    background:#fff;
}

.gx-case-zipit .sfa-content {
    display:grid;
    grid-template-columns:1.5fr .7fr;

    gap:10px;

    margin-top:10px;
}

.gx-case-zipit .sfa-chart,
.gx-case-zipit .sfa-list {
    height:245px;

    padding:16px;

    border:1px solid #e2e7ed;
    border-radius:8px;

    background:#fff;
}

.gx-case-zipit .mini-bars {
    height:200px;

    display:flex;
    align-items:flex-end;
    gap:10px;
}

.gx-case-zipit .mini-bars span {
    flex:1;

    border-radius:4px 4px 0 0;

    background:#d9edf7;
}

.gx-case-zipit .mini-bars span:nth-child(4) {
    background:var(--blue);
}

.gx-case-zipit .sfa-list {
    display:flex;
    flex-direction:column;
    gap:10px;
}

.gx-case-zipit .sfa-list span {
    height:32px;

    border-radius:5px;

    background:#f0f3f6;
}

.gx-case-zipit .feature-tags {
    display:flex;
    flex-wrap:wrap;
    gap:7px;

    margin-top:30px;
}

.gx-case-zipit .feature-tags span {
    padding:9px 11px;

    border-radius:7px;

    font-size:9px;
    font-weight:700;
}

.gx-case-zipit .feature-tags.light span {
    color:#667386;

    border:1px solid var(--border);
    background:var(--bg);
}


/* ============================================================
   END TO END
============================================================ */

.gx-case-zipit .end-to-end {
    color:#fff;
    background:var(--dark);
}

.gx-case-zipit .end-to-end .section-header > p {
    color:#94a4b9;
}

.gx-case-zipit .dual-flow {
    margin-top:70px;

    border:1px solid var(--border-dark);
    border-radius:18px;

    overflow:hidden;

    background:var(--dark-2);
}

.gx-case-zipit .flow-row {
    display:grid;
    grid-template-columns:180px 1fr;

    min-height:150px;

    padding:30px;

    align-items:center;
}

.gx-case-zipit .flow-row + .flow-row {
    border-top:1px solid var(--border-dark);
}

.gx-case-zipit .flow-label small {
    display:block;

    margin-bottom:5px;

    color:#677a92;

    font-size:7px;
    font-weight:800;
}

.gx-case-zipit .flow-label strong {
    font-size:18px;
}

.gx-case-zipit .flow-track {
    display:grid;
    grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;

    gap:10px;

    align-items:center;
}

.gx-case-zipit .flow-track > div {
    padding:17px;

    border:1px solid #293b52;
    border-radius:8px;

    background:#111d2e;
}

.gx-case-zipit .flow-track div span {
    display:block;

    margin-bottom:5px;

    color:#667a92;

    font-size:7px;
    font-weight:800;
}

.gx-case-zipit .flow-track div strong {
    font-size:10px;
}

.gx-case-zipit .flow-track i {
    color:#53677f;

    font-style:normal;
}

.gx-case-zipit .flow-track .highlight {
    border-color:var(--blue);
    background:var(--blue);
}

.gx-case-zipit .flow-track .highlight span {
    color:#d8f3fd;
}


/* ============================================================
   ROLE
============================================================ */

.gx-case-zipit .role-section {
    background:var(--bg);
}

.gx-case-zipit .role-heading {
    display:grid;
    grid-template-columns:1fr .7fr;

    gap:80px;

    align-items:end;
}

.gx-case-zipit .role-heading > p {
    color:var(--muted);
}

.gx-case-zipit .role-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);

    gap:15px;

    margin-top:60px;
}

.gx-case-zipit .role-grid article {
    min-height:330px;

    padding:28px;

    border:1px solid var(--border);
    border-radius:16px;

    background:#fff;
}

.gx-case-zipit .role-number {
    margin-bottom:65px;

    color:#a0abba;

    font-size:9px;
    font-weight:800;
}

.gx-case-zipit .role-grid article > small {
    display:block;

    margin-bottom:6px;

    color:#98a4b3;

    font-size:7px;
    font-weight:800;
    letter-spacing:1px;
}

.gx-case-zipit .role-grid h3 {
    font-size:23px;
}

.gx-case-zipit .role-grid ul {
    margin-top:20px;

    list-style:none;
}

.gx-case-zipit .role-grid li {
    padding:10px 0;

    color:#667386;

    border-bottom:1px solid #edf0f3;

    font-size:11px;
}

.gx-case-zipit .role-center {
    color:#fff !important;

    border-color:var(--dark) !important;

    background:var(--dark) !important;
}

.gx-case-zipit .role-center > small {
    color:#657990 !important;
}

.gx-case-zipit .role-center h3 {
    color:var(--blue-light);
}

.gx-case-zipit .role-center p {
    margin-top:20px;

    color:#98a8bc;

    font-size:13px;
}


/* ============================================================
   RESULTS
============================================================ */

.gx-case-zipit .results {
    color:#fff;
    background:#0b111c;
}

.gx-case-zipit .results .section-header > p {
    color:#94a4b9;
}

.gx-case-zipit .results-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);

    gap:15px;

    margin-top:60px;
}

.gx-case-zipit .results-grid article {
    min-height:280px;

    padding:28px;

    border:1px solid var(--border-dark);
    border-radius:15px;

    background:var(--dark-2);
}

.gx-case-zipit .results-grid article > span {
    display:block;

    margin-bottom:65px;

    color:var(--blue);

    font-size:9px;
    font-weight:800;
}

.gx-case-zipit .results-grid h3 {
    font-size:18px;
}

.gx-case-zipit .results-grid p {
    margin-top:10px;

    color:#93a3b7;

    font-size:13px;
}


/* ============================================================
   STACK
============================================================ */

.gx-case-zipit .stack-section {
    background:#fff;
}

.gx-case-zipit .stack-grid {
    display:grid;
    grid-template-columns:.8fr 1.2fr;

    gap:100px;

    align-items:center;
}

.gx-case-zipit .stack-copy > p {
    max-width:470px;

    margin-top:22px;

    color:var(--muted);
}

.gx-case-zipit .stack {
    display:grid;
    grid-template-columns:1fr auto 1fr;

    gap:20px;

    align-items:center;
}

.gx-case-zipit .stack-platform {
    min-height:260px;

    padding:28px;

    border:1px solid var(--border);
    border-radius:17px;

    background:var(--bg);
}

.gx-case-zipit .stack-platform.hub-stack {
    border-color:#bce8f9;
}

.gx-case-zipit .stack-title {
    padding-bottom:22px;

    border-bottom:1px solid var(--border);
}

.gx-case-zipit .stack-title small {
    display:block;

    margin-bottom:5px;

    color:#9aa6b5;

    font-size:7px;
    font-weight:800;
}

.gx-case-zipit .stack-title strong {
    font-size:18px;
}

.gx-case-zipit .stack-items {
    display:flex;
    flex-direction:column;

    gap:9px;

    margin-top:20px;
}

.gx-case-zipit .stack-items div {
    display:flex;
    align-items:center;
    gap:10px;

    padding:10px;

    border-radius:7px;

    background:#fff;

    color:#566376;

    font-size:11px;
    font-weight:650;
}

.gx-case-zipit .stack-items span {
    color:var(--blue);

    font-weight:900;
}

.gx-case-zipit .stack-plus {
    color:#a1adbb;

    font-size:25px;
}


/* ============================================================
   FINAL
============================================================ */

.gx-case-zipit .final {
    padding:40px 0;

    color:#fff;

    background:
        radial-gradient(
            circle at 50% 100%,
            rgba(8,167,232,.18),
            transparent 40%
        ),
        var(--dark);
}

.gx-case-zipit .final-content {
    max-width:950px;

    margin:auto;

    text-align:center;
}

.gx-case-zipit .final .eyebrow {
    justify-content:center;
}

.gx-case-zipit .final h2 {
    font-size:58px;
}

.gx-case-zipit .final p {
    max-width:700px;

    margin:25px auto 0;

    color:#9baabd;

    font-size:17px;
}

.gx-case-zipit .final-actions {
    display:flex;
    justify-content:center;
    flex-wrap:wrap;

    gap:12px;

    margin-top:38px;
}


/* ============================================================
   RESPONSIVE — 1050
============================================================ */

@media(max-width:1050px){

    .gx-case-zipit h1 {
        font-size:54px;
    }

    .gx-case-zipit h2 {
        font-size:41px;
    }

    .gx-case-zipit .hero-grid,
    .gx-case-zipit .architecture-grid,
    .gx-case-zipit .product-grid,
    .gx-case-zipit .product-grid.reverse,
    .gx-case-zipit .hub-grid,
    .gx-case-zipit .stack-grid {
        grid-template-columns:1fr;
    }

    .gx-case-zipit .results-grid {
        grid-template-columns:repeat(2,1fr);
    }

    .gx-case-zipit .summary-grid {
        grid-template-columns:repeat(2,1fr);
    }

    .gx-case-zipit .product-grid.reverse .sfa-window {
        order:2;
    }

    .gx-case-zipit .product-grid.reverse .product-copy {
        order:1;
    }

}


/* ============================================================
   RESPONSIVE — 760
============================================================ */

@media(max-width:760px){

    .gx-case-zipit section {
        padding:80px 0;
    }

    .gx-case-zipit .container {
        width:min(100% - 30px,var(--container));
    }

    .gx-case-zipit h1 {
        font-size:43px;
    }

    .gx-case-zipit h2 {
        font-size:35px;
    }

    .gx-case-zipit .hero {
        min-height:auto;

        padding:80px 0;
    }

    .gx-case-zipit .hero-grid {
        gap:50px;
    }

    .gx-case-zipit .hero-visual {
        min-height:auto;
    }

    .gx-case-zipit .floating-card,
    .gx-case-zipit .floating-flow {
        display:none;
    }

    .gx-case-zipit .sfa-dashboard {
        height:340px;
    }

    .gx-case-zipit .dashboard-panels {
        grid-template-columns:1fr;
    }

    .gx-case-zipit .dashboard-list {
        display:none;
    }

    .gx-case-zipit .summary-grid {
        grid-template-columns:1fr;
    }

    .gx-case-zipit .summary-statement {
        padding:80px 0;
    }

    .gx-case-zipit .summary-statement h2 {
        font-size:35px;
    }

    .gx-case-zipit .scenario-heading,
    .gx-case-zipit .role-heading {
        grid-template-columns:1fr;

        gap:25px;
    }

    .gx-case-zipit .scenario-grid,
    .gx-case-zipit .role-grid {
        grid-template-columns:1fr;
    }

    .gx-case-zipit .solution-flow {
        grid-template-columns:1fr;
    }

    .gx-case-zipit .solution-connector {
        justify-content:center;

        transform:rotate(90deg);

        padding:5px;
    }

    .gx-case-zipit .arch-people {
        grid-template-columns:1fr;
    }

    .gx-case-zipit .arch-people > span {
        transform:rotate(90deg);

        text-align:center;
    }

    .gx-case-zipit .journey-flow {
        grid-template-columns:1fr;

        gap:10px;
    }

    .gx-case-zipit .journey-line {
        width:1px;
        height:25px;

        margin:auto;
    }

    .gx-case-zipit .hub-top {
        grid-template-columns:1fr;
    }

    .gx-case-zipit .hub-connectors {
        display:none;
    }

    .gx-case-zipit .hub-core {
        margin:20px auto;
    }

    .gx-case-zipit .hub-output {
        margin-top:20px;
    }

    .gx-case-zipit .dual-flow {
        border:none;
        background:transparent;
    }

    .gx-case-zipit .flow-row {
        grid-template-columns:1fr;

        gap:20px;

        padding:25px;

        border:1px solid var(--border-dark);
        border-radius:14px;

        background:var(--dark-2);
    }

    .gx-case-zipit .flow-row + .flow-row {
        margin-top:15px;

        border-top:1px solid var(--border-dark);
    }

    .gx-case-zipit .flow-track {
        grid-template-columns:1fr;
    }

    .gx-case-zipit .flow-track i {
        text-align:center;

        transform:rotate(90deg);
    }

    .gx-case-zipit .results-grid {
        grid-template-columns:1fr;
    }

    .gx-case-zipit .stack {
        grid-template-columns:1fr;
    }

    .gx-case-zipit .stack-plus {
        text-align:center;
    }

    .gx-case-zipit .final h2 {
        font-size:40px;
    }

}


/* ============================================================
   RESPONSIVE — 480
============================================================ */

@media(max-width:480px){

    .gx-case-zipit h1 {
        font-size:37px;
    }

    .gx-case-zipit h2 {
        font-size:31px;
    }

    .gx-case-zipit .architecture-map,
    .gx-case-zipit .hub-map {
        padding:22px;
    }

    .gx-case-zipit .dashboard-kpis {
        grid-template-columns:1fr;
    }

    .gx-case-zipit .dashboard-kpis > div:nth-child(n+2) {
        display:none;
    }

    .gx-case-zipit .import-dashboard,
    .gx-case-zipit .sfa-screen {
        height:360px;

        grid-template-columns:45px 1fr;
    }

    .gx-case-zipit .import-main,
    .gx-case-zipit .sfa-main {
        padding:18px;
    }

    .gx-case-zipit .import-kpis {
        grid-template-columns:1fr;
    }

    .gx-case-zipit .import-kpis > div:nth-child(n+2) {
        display:none;
    }

    .gx-case-zipit .sfa-cards {
        grid-template-columns:repeat(2,1fr);
    }

    .gx-case-zipit .sfa-content {
        grid-template-columns:1fr;
    }

    .gx-case-zipit .sfa-list {
        display:none;
    }

    .gx-case-zipit .hub-users {
        grid-template-columns:1fr;
    }

    .gx-case-zipit .final-actions {
        flex-direction:column;
    }

    .gx-case-zipit .final-actions .btn {
        width:100%;
    }

}

/* ══════════════════════════════════════════════════════════
   CASE — ANZE COSMETICS (pages/cases/Anze.html)
   padrão visual b2c
══════════════════════════════════════════════════════════ */
.gx-case-anze {
    --blue: #00a0e3;
    --blue-light: #38bdf8;
    --rose: #c98080;
    --rose-dark: #985b5c;
    --rose-soft: #f8e9e8;
    --rose-soft-2: #fdf5f4;
    --peach: #f4e7dc;
    --green: #16a34a;
    --green-soft: #dcfce7;
    --dark: #060913;
    --dark-2: #0b0f19;
    --dark-3: #0f172a;
    --white: #ffffff;
    --bg: #f8fafc;
    --bg-warm: #fbf8f6;
    --text: #0f172a;
    --muted: #64748b;
    --border: #e2e8f0;
    --border-dark: #202e43;
    --container: 1200px;

    display: block;
    overflow: hidden;
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: var(--text);
    background: #ffffff;
    -webkit-font-smoothing: antialiased;
    line-height: 1.6;
}
.gx-case-anze * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

.gx-case-anze a {
    color:inherit;
}

.gx-case-anze img {
    display:block;
    width:100%;
}

.gx-case-anze .container {
    width:min(var(--container),calc(100% - 48px));
    margin:auto;
}

.gx-case-anze section {
    padding:40px 0;
}


/* ==========================================================
   TYPOGRAPHY
========================================================== */

.gx-case-anze h1,
.gx-case-anze h2,
.gx-case-anze h3 {
    letter-spacing:-.04em;
}

.gx-case-anze h1 {
    font-size:66px;
    line-height:1.02;
    font-weight:800;
}

.gx-case-anze h2 {
    font-size:48px;
    line-height:1.07;
    font-weight:800;
}

.gx-case-anze h3 {
    font-size:21px;
}

.gx-case-anze h1 span,
.gx-case-anze h2 span {
    display:block;
    color:var(--rose-dark);
}

.gx-case-anze p {
    line-height:1.7;
}

.gx-case-anze .eyebrow {
    display:flex;
    align-items:center;
    gap:12px;

    margin-bottom:24px;

    color:var(--blue-light);

    font-size:11px;
    font-weight:800;
    letter-spacing:1.7px;
}

.gx-case-anze .eyebrow::before {
    content:"";

    width:32px;
    height:2px;

    background:currentColor;
}

.gx-case-anze .eyebrow.dark {
    color:var(--rose-dark);
}

.gx-case-anze .product-index {
    margin-bottom:30px;

    color:#718096;

    font-size:9px;
    font-weight:800;
    letter-spacing:1.3px;
}

.gx-case-anze .product-index.dark {
    color:#9a7b7b;
}

.gx-case-anze .section-heading.center {
    max-width:790px;
    margin:auto;
    text-align:center;
}

.gx-case-anze .section-heading.center .eyebrow {
    justify-content:center;
}

.gx-case-anze .section-heading.center > p {
    max-width:650px;

    margin:22px auto 0;

    color:var(--muted);

    font-size:16px;
}

.gx-case-anze .section-heading.split {
    display:grid;
    grid-template-columns:1fr .7fr;

    gap:90px;

    align-items:end;
}

.gx-case-anze .section-heading.split > p {
    color:var(--muted);
    font-size:16px;
}


/* ==========================================================
   BUTTONS
========================================================== */

.gx-case-anze .btn {
    min-height:58px;

    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:16px;

    padding:0 28px;

    border-radius:10px;

    text-decoration:none;

    font-size:14px;
    font-weight:750;

    transition:.2s ease;
}

.gx-case-anze .btn:hover {
    transform:translateY(-2px);
}

.gx-case-anze .btn-primary {
    color:#fff;
    background:var(--blue);
}

.gx-case-anze .btn-outline {
    color:#fff;
    border:1px solid #3b495e;
}


/* ==========================================================
   HERO
========================================================== */

.gx-case-anze .hero {
    position:relative;

    min-height:790px;

    display:flex;
    align-items:center;

    overflow:hidden;

    background:
        linear-gradient(
            110deg,
            #faf5f3 0%,
            #f8efec 53%,
            #ead4cd 100%
        );
}

.gx-case-anze .hero::after {
    content:"";

    position:absolute;

    right:-130px;
    top:-180px;

    width:600px;
    height:900px;

    transform:rotate(22deg);

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.42),
            transparent
        );
}

.gx-case-anze .hero-grid {
    position:relative;
    z-index:2;

    display:grid;
    grid-template-columns:1fr .9fr;

    gap:70px;

    align-items:center;
}

.gx-case-anze .back-link {
    display:inline-block;

    margin-bottom:45px;

    color:#8d7b7b;

    text-decoration:none;

    font-size:11px;
    font-weight:650;
}

.gx-case-anze .hero .eyebrow {
    color:var(--rose-dark);
}

.gx-case-anze .hero-description {
    max-width:650px;

    margin-top:26px;

    color:#605c60;

    font-size:17px;
}

.gx-case-anze .hero-tags {
    display:flex;
    flex-wrap:wrap;
    gap:8px;

    max-width:650px;

    margin-top:30px;
}

.gx-case-anze .hero-tags span {
    padding:9px 12px;

    border:1px solid rgba(140,92,92,.15);
    border-radius:20px;

    background:rgba(255,255,255,.7);

    color:#665d60;

    font-size:9px;
    font-weight:700;
}


/* HERO VISUAL */

.gx-case-anze .hero-visual {
    position:relative;

    min-height:520px;
}

.gx-case-anze .beauty-label {
    position:absolute;

    top:20px;
    right:0;

    color:#a88c8c;

    font-size:8px;
    font-weight:800;
    letter-spacing:1.4px;
    line-height:1.7;
}

.gx-case-anze .product-stage {
    position:absolute;

    left:0;
    right:0;
    bottom:75px;

    height:310px;

    display:flex;
    justify-content:center;
    align-items:flex-end;
    gap:12px;
}

.gx-case-anze .product {
    position:relative;

    border-radius:12px 12px 5px 5px;

    background:
        linear-gradient(
            145deg,
            #e7b4a7,
            #b66e67
        );

    box-shadow:
        0 30px 60px rgba(115,69,66,.18);
}

.gx-case-anze .product::before {
    content:"";

    position:absolute;

    left:50%;
    top:-45px;

    width:42%;
    height:48px;

    transform:translateX(-50%);

    border-radius:5px 5px 0 0;

    background:
        linear-gradient(
            90deg,
            #b47b72,
            #e3b4a8,
            #8f5d58
        );
}

.gx-case-anze .product-one {
    width:75px;
    height:180px;
}

.gx-case-anze .product-two {
    width:85px;
    height:235px;
}

.gx-case-anze .product-main {
    width:155px;
    height:195px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    color:#704e4c;

    background:
        linear-gradient(
            145deg,
            #f0c9bf,
            #d79c91
        );
}

.gx-case-anze .product-main::before {
    width:35%;
}

.gx-case-anze .product-main small {
    font-size:9px;
    letter-spacing:2px;
}

.gx-case-anze .product-main strong {
    margin-top:5px;
    font-size:7px;
    letter-spacing:2px;
}

.gx-case-anze .product-three {
    width:85px;
    height:250px;
}

.gx-case-anze .hero-message {
    position:absolute;

    right:-10px;
    bottom:15px;

    width:220px;

    padding:20px;

    color:#fff;

    border-radius:13px;

    background:rgba(145,83,79,.9);

    box-shadow:0 20px 45px rgba(96,51,48,.2);
}

.gx-case-anze .hero-message small {
    display:block;

    margin-bottom:8px;

    opacity:.7;

    font-size:7px;
    font-weight:800;
}

.gx-case-anze .hero-message strong {
    display:block;

    font-size:14px;
    line-height:1.4;
}


/* ==========================================================
   SUMMARY
========================================================== */

.gx-case-anze .summary {
    padding:0;
}

.gx-case-anze .summary-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);

    border-left:1px solid var(--border);
}

.gx-case-anze .summary-item {
    min-height:120px;

    display:flex;
    flex-direction:column;
    justify-content:center;

    padding:25px 30px;

    border-right:1px solid var(--border);
    border-bottom:1px solid var(--border);
}

.gx-case-anze .summary-item small {
    margin-bottom:8px;

    color:#9a9da5;

    font-size:8px;
    font-weight:800;
    letter-spacing:1px;
}

.gx-case-anze .summary-item strong {
    font-size:14px;
}

.gx-case-anze .summary-quote {
    max-width:850px;

    margin:auto;

    padding:110px 0;

    text-align:center;
}

.gx-case-anze .summary-quote > span {
    display:block;

    height:45px;

    color:#ead4d1;

    font-family:Georgia,serif;
    font-size:80px;
}

.gx-case-anze .summary-quote h2 {
    font-size:43px;
}

.gx-case-anze .summary-quote h2 strong {
    display:block;
    color:var(--rose-dark);
}


/* ==========================================================
   SCENARIO
========================================================== */

.gx-case-anze .scenario {
    background:var(--bg-warm);
}

.gx-case-anze .scenario-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);

    gap:15px;

    margin-top:60px;
}

.gx-case-anze .scenario-grid article {
    position:relative;

    min-height:310px;

    padding:26px;

    border:1px solid #ede5e2;
    border-radius:16px;

    background:#fff;
}

.gx-case-anze .scenario-grid article:nth-child(1) {
    background:#faecec;
}

.gx-case-anze .scenario-grid article:nth-child(2) {
    background:#f8eee4;
}

.gx-case-anze .scenario-grid article:nth-child(3) {
    background:#edf3fa;
}

.gx-case-anze .scenario-grid article:nth-child(4) {
    background:#edf6f0;
}

.gx-case-anze .card-index {
    position:absolute;

    top:22px;
    right:22px;

    color:#a7a2a2;

    font-size:8px;
    font-weight:800;
}

.gx-case-anze .scenario-icon {
    width:48px;
    height:48px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin-bottom:55px;

    color:var(--rose-dark);

    border:1px solid rgba(152,91,92,.18);
    border-radius:50%;

    background:rgba(255,255,255,.6);

    font-weight:800;
}

.gx-case-anze .scenario-grid small {
    display:block;

    margin-bottom:5px;

    color:#9c8b8b;

    font-size:7px;
    font-weight:800;
}

.gx-case-anze .scenario-grid p {
    margin-top:10px;

    color:#68666b;

    font-size:13px;
}


/* ==========================================================
   ECOSYSTEM
========================================================== */

.gx-case-anze .ecosystem {
    color:#fff;

    background:
        radial-gradient(
            circle at 70% 50%,
            rgba(8,167,232,.09),
            transparent 32%
        ),
        var(--dark);
}

.gx-case-anze .ecosystem-grid {
    display:grid;
    grid-template-columns:.7fr 1.3fr;

    gap:80px;

    align-items:center;
}

.gx-case-anze .ecosystem-copy p {
    max-width:500px;

    margin-top:23px;

    color:#98a7b9;
}

.gx-case-anze .ecosystem-map {
    display:grid;
    grid-template-columns:1fr 190px 1fr;

    gap:25px;

    align-items:center;
}

.gx-case-anze .ecosystem-column {
    display:flex;
    flex-direction:column;
    gap:25px;
}

.gx-case-anze .ecosystem-group > small {
    display:block;

    margin-bottom:10px;

    color:#73849a;

    font-size:7px;
    font-weight:800;
    letter-spacing:1px;
}

.gx-case-anze .eco-item {
    display:flex;
    align-items:center;
    gap:10px;

    min-height:43px;

    margin-bottom:7px;
    padding:0 13px;

    color:#dbe4ee;

    border:1px solid #334256;
    border-radius:8px;

    background:#121c2a;

    font-size:10px;
    font-weight:650;
}

.gx-case-anze .eco-item > span {
    width:20px;
    height:20px;

    display:flex;
    align-items:center;
    justify-content:center;

    flex:none;

    color:#f2a9a9;

    border-radius:5px;

    background:#38282d;

    font-size:6px;
}

.gx-case-anze .eco-item.relationship > span {
    color:#9ccbf0;
    background:#1b3043;
}

.gx-case-anze .eco-item.network > span {
    color:#f3bc88;
    background:#3c2e21;
}

.gx-case-anze .eco-item.operation > span {
    color:#9fe0c0;
    background:#1c382f;
}

.gx-case-anze .eco-item.secondary {
    opacity:.72;
}

.gx-case-anze .ecosystem-center {
    position:relative;

    display:flex;
    align-items:center;
    justify-content:center;
}

.gx-case-anze .ecosystem-center::before,
.gx-case-anze .ecosystem-center::after {
    content:"";

    position:absolute;

    left:-30px;
    right:-30px;

    height:1px;

    background:#334256;
}

.gx-case-anze .center-ring {
    position:relative;
    z-index:2;

    width:175px;
    height:175px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    border:1px solid #647185;
    border-radius:50%;

    background:#0d1522;

    box-shadow:
        0 0 0 12px rgba(255,255,255,.015);
}

.gx-case-anze .center-ring small {
    color:#718196;

    font-size:6px;
    font-weight:800;
}

.gx-case-anze .center-ring strong {
    margin-top:6px;

    font-size:20px;
}

.gx-case-anze .center-ring span {
    margin-top:5px;

    color:#9a7880;

    font-size:7px;
    letter-spacing:1px;
}


/* ==========================================================
   JOURNEY
========================================================== */

.gx-case-anze .journey {
    background:var(--bg-warm);
}

.gx-case-anze .journey-map {
    display:grid;
    grid-template-columns:1fr 210px 1fr;

    gap:35px;

    max-width:1000px;

    margin:65px auto 0;
}

.gx-case-anze .journey-title {
    margin-bottom:13px;

    color:#79747a;

    text-align:center;

    font-size:9px;
    font-weight:800;
    letter-spacing:1px;
}

.gx-case-anze .journey-column {
    display:flex;
    flex-direction:column;
    gap:7px;
}

.gx-case-anze .journey-step {
    min-height:52px;

    display:flex;
    align-items:center;
    gap:12px;

    padding:8px 13px;

    border:1px solid #e5e5e8;
    border-radius:9px;

    background:#fff;
}

.gx-case-anze .journey-step > span {
    width:25px;
    height:25px;

    display:flex;
    align-items:center;
    justify-content:center;

    flex:none;

    color:#6d94ac;

    border-radius:7px;

    background:#edf5fa;

    font-size:7px;
    font-weight:800;
}

.gx-case-anze .journey-step small {
    display:block;

    margin-bottom:2px;

    color:#a2a5ad;

    font-size:6px;
    font-weight:800;
}

.gx-case-anze .journey-step strong {
    display:block;

    font-size:10px;
}

.gx-case-anze .journey-column.bonus .journey-step > span {
    color:#b56b6d;
    background:#faecec;
}

.gx-case-anze .journey-step.active {
    border-color:#d6b3b0;
    background:#fff8f7;
}

.gx-case-anze .journey-center {
    position:relative;

    display:flex;
    align-items:center;
    justify-content:center;
}

.gx-case-anze .journey-core {
    position:relative;
    z-index:2;

    width:170px;
    height:170px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    border:1px solid #ddd0cd;
    border-radius:50%;

    background:#fff;

    box-shadow:0 20px 50px rgba(102,73,70,.08);
}

.gx-case-anze .journey-core small {
    color:#a3918e;

    font-size:7px;
    font-weight:800;
}

.gx-case-anze .journey-core strong {
    margin-top:5px;

    font-size:21px;
}

.gx-case-anze .center-line {
    position:absolute;

    left:-35px;
    right:-35px;

    height:1px;

    background:#ddd3d0;
}

.gx-case-anze .relationship-bar {
    display:grid;
    grid-template-columns:1fr auto 1fr;

    gap:20px;

    align-items:center;

    margin-top:40px;

    text-align:center;
}

.gx-case-anze .relationship-bar > span {
    height:1px;
    background:#ded7d4;
}

.gx-case-anze .relationship-bar div {
    min-width:300px;

    padding:13px 25px;

    border:1px solid #e5dfdc;
    border-radius:30px;

    background:#fff;
}

.gx-case-anze .relationship-bar small {
    display:block;

    margin-bottom:3px;

    color:#a39c99;

    font-size:6px;
    font-weight:800;
}

.gx-case-anze .relationship-bar strong {
    font-size:11px;
}


/* ==========================================================
   B2C
========================================================== */

.gx-case-anze .b2c {
    background:#fff;
}

.gx-case-anze .product-grid {
    display:grid;
    grid-template-columns:.72fr 1.28fr;

    gap:80px;

    align-items:center;
}

.gx-case-anze .product-copy > p {
    max-width:500px;

    margin-top:23px;

    color:var(--muted);
}

.gx-case-anze .feature-list {
    display:flex !important;
    flex-direction:column !important;
    gap:10px !important;

    margin:30px 0 0 0 !important;
}

.gx-case-anze .feature-list div {
    display:flex;
    align-items:center;
    gap:10px;

    color:#626672;

    font-size:12px;
}

.gx-case-anze .feature-list span {
    color:var(--rose-dark);
    font-weight:900;
}

.gx-case-anze .commerce-visual {
    position:relative;

    padding-right:130px;
}

.gx-case-anze .browser {
    overflow:hidden;

    border:1px solid #dedfe3;
    border-radius:15px;

    background:#fff;

    box-shadow:0 30px 70px rgba(35,38,45,.12);
}

.gx-case-anze .browser-top {
    height:40px;

    display:flex;
    align-items:center;
    gap:15px;

    padding:0 14px;

    border-bottom:1px solid #e8e8ea;
}

.gx-case-anze .browser-dots {
    display:flex;
    gap:5px;
}

.gx-case-anze .browser-dots span {
    width:6px;
    height:6px;

    border-radius:50%;

    background:#d0d1d5;
}

.gx-case-anze .browser-address {
    width:50%;
    height:7px;

    border-radius:20px;

    background:#eff0f2;
}

.gx-case-anze .storefront {
    height:390px;
    background:#fff;
}

.gx-case-anze .store-nav {
    height:52px;

    display:flex;
    align-items:center;
    gap:20px;

    padding:0 20px;

    border-bottom:1px solid #eee;
}

.gx-case-anze .store-nav strong {
    color:#6d5353;

    font-size:10px;
    letter-spacing:1px;
}

.gx-case-anze .store-nav > span {
    flex:1;
}

.gx-case-anze .store-nav div {
    width:60px;
    height:7px;

    border-radius:10px;

    background:#eee;
}

.gx-case-anze .store-hero {
    height:190px;

    display:grid;
    grid-template-columns:1fr .75fr;

    background:#f8eeee;
}

.gx-case-anze .store-hero > div:first-child {
    display:flex;
    flex-direction:column;
    justify-content:center;

    padding:30px;
}

.gx-case-anze .store-hero small {
    color:#a28383;

    font-size:6px;
    font-weight:800;
}

.gx-case-anze .store-hero strong {
    max-width:210px;

    margin-top:8px;

    color:#513f40;

    font-size:23px;
    line-height:1.05;
}

.gx-case-anze .store-hero > div:first-child > span {
    width:max-content;

    margin-top:15px;
    padding:7px 10px;

    color:#fff;

    border-radius:5px;

    background:#a86f6e;

    font-size:7px;
}

.gx-case-anze .store-product {
    position:relative;

    background:
        radial-gradient(
            circle at 50% 70%,
            #e4b5ad,
            transparent 42%
        );
}

.gx-case-anze .store-product::before {
    content:"";

    position:absolute;

    left:50%;
    bottom:25px;

    width:75px;
    height:110px;

    transform:translateX(-50%);

    border-radius:8px 8px 3px 3px;

    background:
        linear-gradient(
            145deg,
            #edc2ba,
            #bd7d77
        );
}

.gx-case-anze .store-products {
    display:grid;
    grid-template-columns:repeat(4,1fr);

    gap:8px;

    padding:18px;
}

.gx-case-anze .store-products div {
    height:100px;

    border-radius:8px;

    background:#f6f3f2;
}

.gx-case-anze .payment-card {
    position:absolute;

    top:50%;
    right:0;

    width:180px;

    transform:translateY(-50%);

    padding:18px;

    border:1px solid #e3e3e6;
    border-radius:13px;

    background:#fff;

    box-shadow:0 20px 50px rgba(35,38,45,.13);
}

.gx-case-anze .payment-card > small {
    display:block;

    margin-bottom:13px;

    color:#999da6;

    font-size:6px;
    font-weight:800;
}

.gx-case-anze .payment-card > div {
    display:flex;
    align-items:center;
    gap:8px;

    margin-bottom:11px;

    color:#626773;

    font-size:9px;
}

.gx-case-anze .payment-card hr {
    height:1px;

    margin:15px 0;

    border:0;
    background:#eee;
}

.gx-case-anze .payment-icon {
    width:23px;
    height:23px;

    display:flex;
    align-items:center;
    justify-content:center;

    flex:none;

    border-radius:6px;

    background:#f2f4f6;

    font-size:9px;
}

.gx-case-anze .payment-icon.pix {
    color:#1caa9c;
}

.gx-case-anze .payment-icon.card {
    color:#477dc8;
}

.gx-case-anze .payment-icon.boleto {
    color:#d88b4c;
}

.gx-case-anze .payment-icon.check {
    color:#46a87e;
}


/* ==========================================================
   COMMERCIAL
========================================================== */

.gx-case-anze .commercial {
    padding-top:0;
    background:#fff;
}

.gx-case-anze .commercial-grid {
    display:grid;
    grid-template-columns:.8fr 1.2fr;

    gap:15px;
}

.gx-case-anze .magazine-card,
.gx-case-anze .mlm-card {
    min-height:500px;

    padding:35px;

    overflow:hidden;

    border:1px solid #eadfdd;
    border-radius:18px;
}

.gx-case-anze .magazine-card {
    background:#faf0ee;
}

.gx-case-anze .mlm-card {
    background:#fdf6f4;
}

.gx-case-anze .commercial-content {
    display:grid;
    grid-template-columns:1fr .8fr;

    gap:20px;

    align-items:center;
}

.gx-case-anze .commercial p {
    margin-top:15px;

    color:var(--muted);

    font-size:13px;
}

.gx-case-anze .commercial h2 {
    font-size:35px;
}

.gx-case-anze .tablet {
    padding:9px;

    transform:rotate(4deg);

    border-radius:17px;

    background:#171717;

    box-shadow:0 25px 45px rgba(65,40,40,.18);
}

.gx-case-anze .tablet-screen {
    height:300px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    padding:20px;

    text-align:center;

    border-radius:10px;

    background:
        radial-gradient(
            circle at 50% 80%,
            #d99f9b,
            transparent 35%
        ),
        #f2d9d4;
}

.gx-case-anze .tablet-screen small {
    color:#705252;

    font-size:8px;
    letter-spacing:2px;
}

.gx-case-anze .tablet-screen strong {
    margin-top:25px;

    color:#8c5555;

    font-size:20px;
    line-height:1.2;
}

.gx-case-anze .tablet-screen span {
    width:60px;
    height:60px;

    margin-top:30px;

    border-radius:50% 50% 50% 5px;

    background:#dfa9a5;

    transform:rotate(45deg);
}

.gx-case-anze .bonus-flow {
    display:grid;
    grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;

    gap:8px;

    align-items:center;

    margin-top:60px;
}

.gx-case-anze .bonus-flow > div {
    min-height:120px;

    display:flex;
    flex-direction:column;
    justify-content:center;

    padding:15px;

    text-align:center;

    border:1px solid #ebd8d5;
    border-radius:10px;

    background:rgba(255,255,255,.65);
}

.gx-case-anze .bonus-flow span {
    width:28px;
    height:28px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin:0 auto 10px;

    color:var(--rose-dark);

    border-radius:50%;

    background:#f6dfdc;

    font-size:7px;
    font-weight:800;
}

.gx-case-anze .bonus-flow strong {
    font-size:10px;
}

.gx-case-anze .bonus-flow small {
    margin-top:2px;

    color:#9d8988;

    font-size:7px;
}

.gx-case-anze .bonus-flow i {
    color:#c8aaa7;
    font-style:normal;
}


/* ==========================================================
   RELATIONSHIP
========================================================== */

.gx-case-anze .relationship {
    color:#fff;

    background:
        radial-gradient(
            circle at 50% 100%,
            rgba(8,167,232,.10),
            transparent 40%
        ),
        var(--dark);
}

.gx-case-anze .relationship .section-heading p {
    color:#98a7b9;
}

.gx-case-anze .relationship-map {
    display:grid;
    grid-template-columns:180px auto 1fr auto 180px;

    gap:25px;

    align-items:center;

    max-width:1000px;

    margin:70px auto 0;
}

.gx-case-anze .relationship-node {
    min-height:130px;

    display:flex;
    flex-direction:column;
    justify-content:center;

    padding:22px;

    text-align:center;

    border:1px solid var(--border-dark);
    border-radius:14px;

    background:var(--dark-2);
}

.gx-case-anze .relationship-node small,
.gx-case-anze .relationship-modules small {
    display:block;

    margin-bottom:5px;

    color:#718197;

    font-size:7px;
    font-weight:800;
}

.gx-case-anze .relationship-node strong {
    font-size:16px;
}

.gx-case-anze .relationship-arrow {
    color:#50637a;
}

.gx-case-anze .relationship-modules {
    display:grid;
    grid-template-columns:1fr auto 1fr;

    gap:15px;

    align-items:center;
}

.gx-case-anze .relationship-modules > div {
    min-height:145px;

    display:flex;
    flex-direction:column;
    justify-content:center;

    padding:25px;

    text-align:center;

    border:1px solid #30455e;
    border-radius:14px;

    background:#101d2e;
}

.gx-case-anze .relationship-modules > div strong {
    color:var(--blue-light);
    font-size:18px;
}

.gx-case-anze .relationship-modules > span {
    color:#5b6f87;
}


/* ==========================================================
   SELLER
========================================================== */

.gx-case-anze .seller {
    color:#fff;
    background:#0b111c;
}

.gx-case-anze .seller-grid {
    display:grid;
    grid-template-columns:.7fr 1.3fr;

    gap:90px;

    align-items:center;
}

.gx-case-anze .seller-copy p {
    max-width:500px;

    margin-top:22px;

    color:#98a7b9;
}

.gx-case-anze .seller-dashboard {
    padding:25px;

    border:1px solid var(--border-dark);
    border-radius:17px;

    background:var(--dark-2);
    overflow:visible;
    box-shadow:none;
}

.gx-case-anze .seller-top {
    display:flex;
    align-items:center;
    justify-content:space-between;

    padding-bottom:20px;

    border-bottom:1px solid var(--border-dark);
}

.gx-case-anze .seller-top small {
    display:block;

    color:#6c7c92;

    font-size:7px;
    font-weight:800;
}

.gx-case-anze .seller-top strong {
    font-size:15px;
}

.gx-case-anze .seller-top > span {
    width:28px;
    height:28px;

    border-radius:50%;

    background:#1a293b;
}

.gx-case-anze .seller-kpis {
    display:grid;
    grid-template-columns:repeat(3,1fr);

    gap:9px;

    margin-top:20px;
    margin-bottom:0;
}

.gx-case-anze .seller-kpis div {
    padding:15px;

    border:1px solid #28384e;
    border-radius:8px;

    background:#111c2b;
}

.gx-case-anze .seller-kpis small {
    display:block;

    margin-bottom:5px;

    color:#6c7c92;

    font-size:6px;
    font-weight:800;
}

.gx-case-anze .seller-kpis strong {
    font-size:10px;
}

.gx-case-anze .seller-body {
    display:grid;
    grid-template-columns:1.5fr .7fr;

    gap:10px;

    margin-top:10px;
}

.gx-case-anze .seller-chart,
.gx-case-anze .seller-list {
    height:230px;

    padding:20px;

    border:1px solid #28384e;
    border-radius:8px;

    background:#111c2b;
}

.gx-case-anze .seller-chart {
    display:flex;
    align-items:flex-end;
    gap:10px;
}

.gx-case-anze .seller-chart span {
    flex:1;

    border-radius:4px 4px 0 0;

    background:#21445a;
}

.gx-case-anze .seller-chart span:nth-child(6) {
    background:var(--blue);
}

.gx-case-anze .seller-list {
    display:flex;
    flex-direction:column;
    gap:10px;
}

.gx-case-anze .seller-list span {
    height:30px;

    border-radius:5px;

    background:#192638;
}


/* ==========================================================
   HUB
========================================================== */

.gx-case-anze .hub {
    color:#fff;

    background:
        radial-gradient(
            circle at 75% 50%,
            rgba(8,167,232,.13),
            transparent 30%
        ),
        var(--dark);
}

.gx-case-anze .hub-grid {
    display:grid;
    grid-template-columns:.72fr 1.28fr;

    gap:90px;

    align-items:center;
}

.gx-case-anze .hub-copy p {
    max-width:500px;

    margin-top:23px;

    color:#98a7b9;
}

.gx-case-anze .hub-map {
    padding:35px;

    border:1px solid var(--border-dark);
    border-radius:18px;

    background:var(--dark-2);
}

.gx-case-anze .hub-row {
    display:grid;
    grid-template-columns:repeat(3,1fr);

    gap:8px;
}

.gx-case-anze .hub-row > div {
    padding:16px 10px;

    text-align:center;

    border:1px solid #293a50;
    border-radius:8px;

    background:#111d2d;
}

.gx-case-anze .hub-row small {
    display:block;

    margin-bottom:4px;

    color:#697b92;

    font-size:6px;
    font-weight:800;
}

.gx-case-anze .hub-row strong {
    font-size:10px;
}

.gx-case-anze .hub-lines {
    position:relative;

    height:45px;

    display:grid;
    grid-template-columns:repeat(3,1fr);
}

.gx-case-anze .hub-lines::after {
    content:"";

    position:absolute;

    left:16.6%;
    right:16.6%;

    height:1px;

    background:#30445d;
}

.gx-case-anze .top-lines::after {
    bottom:0;
}

.gx-case-anze .bottom-lines::after {
    top:0;
}

.gx-case-anze .hub-lines span {
    position:relative;
}

.gx-case-anze .hub-lines span::before {
    content:"";

    position:absolute;

    left:50%;

    width:1px;
    height:45px;

    background:#30445d;
}

.gx-case-anze .top-lines span::before {
    top:0;
}

.gx-case-anze .bottom-lines span::before {
    bottom:0;
}

.gx-case-anze .hub-core {
    max-width:300px;

    margin:auto;

    padding:22px !important;

    display:block !important;

    text-align:center;

    border-radius:11px !important;

    background:var(--blue) !important;

    animation:none !important;
}

.gx-case-anze .hub-core small {
    display:block;

    margin-bottom:4px;

    color:#d9f4ff;

    font-size:7px;
    font-weight:800;
}

.gx-case-anze .hub-core strong {
    font-size:17px;
}


/* ==========================================================
   TMS
========================================================== */

.gx-case-anze .tms {
    background:#f5f8f6;
}

.gx-case-anze .logistics-flow {
    display:grid;
    grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;

    align-items:center;

    margin-top:65px;
}

.gx-case-anze .logistics-node {
    min-height:170px;

    display:flex;
    flex-direction:column;

    padding:20px;

    border:1px solid #dfe8e2;
    border-radius:12px;

    background:#fff;
}

.gx-case-anze .logistics-node > span {
    margin-left:auto;

    color:#a0aaa4;

    font-size:8px;
    font-weight:800;
}

.gx-case-anze .logistics-node small {
    margin-top:auto;
    margin-bottom:5px;

    color:#8f9b94;

    font-size:7px;
    font-weight:800;
}

.gx-case-anze .logistics-node strong {
    font-size:13px;
}

.gx-case-anze .logistics-node.active {
    color:#fff;

    border-color:var(--green);
    background:var(--green);
}

.gx-case-anze .logistics-node.active small,
.gx-case-anze .logistics-node.active > span {
    color:#dff7ed;
}

.gx-case-anze .logistics-line {
    width:45px;
    height:1px;

    background:#ccd8d0;
}


/* ==========================================================
   FINANCIAL
========================================================== */

.gx-case-anze .financial {
    color:#fff;

    background:
        radial-gradient(
            circle at 75% 30%,
            rgba(201,128,128,.12),
            transparent 30%
        ),
        var(--dark);
}

.gx-case-anze .financial-grid {
    display:grid;
    grid-template-columns:.7fr 1.3fr;

    gap:90px;

    align-items:center;
}

.gx-case-anze .financial-copy p {
    max-width:510px;

    margin-top:23px;

    color:#98a7b9;
}

.gx-case-anze .financial-board {
    display:grid;
    grid-template-columns:1fr 100px 1fr;

    gap:20px;

    padding:30px;

    border:1px solid var(--border-dark);
    border-radius:18px;

    background:var(--dark-2);
}

.gx-case-anze .financial-title {
    margin-bottom:20px;
    padding-bottom:17px;

    border-bottom:1px solid #27364b;
}

.gx-case-anze .financial-title small {
    display:block;

    margin-bottom:4px;

    color:#6e7f95;

    font-size:7px;
    font-weight:800;
}

.gx-case-anze .financial-title strong {
    font-size:15px;
}

.gx-case-anze .financial-item {
    display:flex;
    align-items:center;
    gap:10px;

    min-height:42px;

    margin-bottom:6px;
    padding:0 12px;

    color:#aab6c6;

    border:1px solid #27374c;
    border-radius:7px;

    background:#111c2b;

    font-size:9px;
}

.gx-case-anze .financial-item span {
    color:#efb0a7;
}

.gx-case-anze .financial-divider {
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
}

.gx-case-anze .financial-divider span {
    width:1px;
    flex:1;

    background:#2a3b51;
}

.gx-case-anze .financial-divider strong {
    padding:12px 0;

    color:var(--blue-light);

    font-size:8px;
    letter-spacing:1px;
}


/* ==========================================================
   RESULTS
========================================================== */

.gx-case-anze .results {
    background:var(--bg-warm);
}

.gx-case-anze .results-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);

    gap:15px;

    margin-top:60px;
}

.gx-case-anze .results-grid article {
    min-height:270px;

    padding:25px;

    border:1px solid #e9e2df;
    border-radius:15px;

    background:#fff;
}

.gx-case-anze .results-grid article:nth-child(1) {
    background:#faecea;
}

.gx-case-anze .results-grid article:nth-child(2) {
    background:#eef3fa;
}

.gx-case-anze .results-grid article:nth-child(3) {
    background:#edf6f0;
}

.gx-case-anze .results-grid article:nth-child(4) {
    background:#faf0ee;
}

.gx-case-anze .results-grid article > span {
    display:block;

    margin-bottom:55px;

    color:var(--rose-dark);

    font-size:8px;
    font-weight:800;
}

.gx-case-anze .results-grid small {
    display:block;

    margin-bottom:5px;

    color:#999095;

    font-size:7px;
    font-weight:800;
}

.gx-case-anze .results-grid h3 {
    font-size:18px;
}

.gx-case-anze .results-grid p {
    margin-top:10px;

    color:#696a71;

    font-size:12px;
}


/* ==========================================================
   STACK
========================================================== */

.gx-case-anze .stack-section {
    color:#fff;
    background:#0b111c;
}

.gx-case-anze .stack-grid {
    display:grid;
    grid-template-columns:.7fr 1.3fr;

    gap:90px;

    align-items:center;
}

.gx-case-anze .stack-copy p {
    max-width:500px;

    margin-top:22px;

    color:#98a7b9;
}

.gx-case-anze .stack-platforms {
    display:grid;
    grid-template-columns:1.25fr auto .75fr;

    gap:20px;

    align-items:center;
}

.gx-case-anze .stack-platform {
    min-height:330px;

    padding:27px;

    border:1px solid var(--border-dark);
    border-radius:16px;

    background:var(--dark-2);
}

.gx-case-anze .stack-title {
    padding-bottom:20px;

    border-bottom:1px solid var(--border-dark);
}

.gx-case-anze .stack-title small {
    display:block;

    margin-bottom:5px;

    color:#6e7f95;

    font-size:7px;
    font-weight:800;
}

.gx-case-anze .stack-title strong {
    font-size:17px;
}

.gx-case-anze .stack-items {
    display:flex;
    flex-direction:column;
    gap:7px;

    margin-top:18px;
}

.gx-case-anze .stack-items div {
    display:flex;
    align-items:center;
    gap:9px;

    padding:9px 10px;

    color:#aab6c6;

    border-radius:6px;

    background:#111c2b;

    font-size:10px;
}

.gx-case-anze .stack-items span {
    color:var(--blue-light);
}

.gx-case-anze .stack-plus {
    color:#53677e;
    font-size:25px;
}


/* ==========================================================
   FINAL
========================================================== */

.gx-case-anze .final {
    padding:140px 0;

    color:#fff;

    background:
        radial-gradient(
            circle at 20% 100%,
            rgba(201,128,128,.12),
            transparent 30%
        ),
        radial-gradient(
            circle at 80% 100%,
            rgba(8,167,232,.13),
            transparent 30%
        ),
        var(--dark);
}

.gx-case-anze .final-content {
    max-width:950px;
    text-align:center;
}

.gx-case-anze .final .eyebrow {
    justify-content:center;
}

.gx-case-anze .final h2 {
    font-size:56px;
}

.gx-case-anze .final h2 span {
    color:var(--blue-light);
}

.gx-case-anze .final p {
    max-width:720px;

    margin:25px auto 0;

    color:#9caabd;

    font-size:17px;
}

.gx-case-anze .final-actions {
    display:flex;
    justify-content:center;
    gap:12px;
    flex-wrap:wrap;

    margin-top:38px;
}


/* ==========================================================
   RESPONSIVE
========================================================== */

@media(max-width:1050px){

    .gx-case-anze h1 {
        font-size:54px;
    }

    .gx-case-anze h2 {
        font-size:41px;
    }

    .gx-case-anze .hero-grid,
    .gx-case-anze .ecosystem-grid,
    .gx-case-anze .product-grid,
    .gx-case-anze .seller-grid,
    .gx-case-anze .hub-grid,
    .gx-case-anze .financial-grid,
    .gx-case-anze .stack-grid {
        grid-template-columns:1fr;
    }

    .gx-case-anze .scenario-grid,
    .gx-case-anze .results-grid {
        grid-template-columns:repeat(2,1fr);
    }

    .gx-case-anze .ecosystem-copy {
        max-width:700px;
    }

    .gx-case-anze .commercial-grid {
        grid-template-columns:1fr;
    }

}


@media(max-width:760px){

    .gx-case-anze section {
        padding:80px 0;
    }

    .gx-case-anze .container {
        width:min(var(--container),calc(100% - 30px));
    }

    .gx-case-anze h1 {
        font-size:42px;
    }

    .gx-case-anze h2 {
        font-size:34px;
    }

    .gx-case-anze .hero {
        min-height:auto;
        padding:80px 0;
    }

    .gx-case-anze .hero-grid {
        gap:35px;
    }

    .gx-case-anze .hero-visual {
        min-height:420px;
    }

    .gx-case-anze .summary-grid {
        grid-template-columns:1fr;
    }

    .gx-case-anze .summary-quote {
        padding:80px 0;
    }

    .gx-case-anze .summary-quote h2 {
        font-size:34px;
    }

    .gx-case-anze .section-heading.split {
        grid-template-columns:1fr;
        gap:25px;
    }

    .gx-case-anze .scenario-grid,
    .gx-case-anze .results-grid {
        grid-template-columns:1fr;
    }

    .gx-case-anze .ecosystem-map {
        grid-template-columns:1fr;
    }

    .gx-case-anze .ecosystem-center {
        order:-1;
    }

    .gx-case-anze .ecosystem-center::before,
    .gx-case-anze .ecosystem-center::after {
        display:none;
    }

    .gx-case-anze .journey-map {
        grid-template-columns:1fr;
    }

    .gx-case-anze .journey-center {
        min-height:190px;
        order:-1;
    }

    .gx-case-anze .center-line {
        display:none;
    }

    .gx-case-anze .relationship-bar {
        grid-template-columns:1fr;
    }

    .gx-case-anze .relationship-bar > span {
        display:none;
    }

    .gx-case-anze .commerce-visual {
        padding-right:0;
    }

    .gx-case-anze .payment-card {
        position:relative;

        top:auto;
        right:auto;

        width:100%;

        margin-top:15px;

        transform:none;
    }

    .gx-case-anze .commercial-content {
        grid-template-columns:1fr;
    }

    .gx-case-anze .tablet {
        max-width:270px;
        margin:20px auto 0;
    }

    .gx-case-anze .bonus-flow {
        grid-template-columns:1fr;
    }

    .gx-case-anze .bonus-flow i {
        text-align:center;
        transform:rotate(90deg);
    }

    .gx-case-anze .relationship-map {
        grid-template-columns:1fr;
    }

    .gx-case-anze .relationship-arrow {
        text-align:center;
        transform:rotate(90deg);
    }

    .gx-case-anze .relationship-modules {
        grid-template-columns:1fr;
    }

    .gx-case-anze .relationship-modules > span {
        text-align:center;
    }

    .gx-case-anze .hub-row {
        grid-template-columns:1fr;
    }

    .gx-case-anze .hub-lines {
        display:none;
    }

    .gx-case-anze .hub-core {
        margin:20px auto;
    }

    .gx-case-anze .logistics-flow {
        grid-template-columns:1fr;
        gap:10px;
    }

    .gx-case-anze .logistics-line {
        width:1px;
        height:25px;

        margin:auto;
    }

    .gx-case-anze .financial-board {
        grid-template-columns:1fr;
    }

    .gx-case-anze .financial-divider {
        flex-direction:row;
    }

    .gx-case-anze .financial-divider span {
        height:1px;
        width:auto;
    }

    .gx-case-anze .financial-divider strong {
        padding:0 12px;
    }

    .gx-case-anze .stack-platforms {
        grid-template-columns:1fr;
    }

    .gx-case-anze .stack-plus {
        text-align:center;
    }

    .gx-case-anze .final h2 {
        font-size:40px;
    }

}


@media(max-width:480px){

    .gx-case-anze h1 {
        font-size:36px;
    }

    .gx-case-anze h2 {
        font-size:30px;
    }

    .gx-case-anze .hero-visual {
        min-height:350px;
    }

    .gx-case-anze .product-stage {
        transform:scale(.8);
    }

    .gx-case-anze .hero-message {
        right:0;
        width:180px;
    }

    .gx-case-anze .storefront {
        height:340px;
    }

    .gx-case-anze .store-hero {
        grid-template-columns:1fr;
    }

    .gx-case-anze .store-product {
        display:none;
    }

    .gx-case-anze .store-products {
        grid-template-columns:repeat(2,1fr);
    }

    .gx-case-anze .seller-kpis {
        grid-template-columns:1fr;
    }

    .gx-case-anze .seller-kpis > div:nth-child(n+2) {
        display:none;
    }

    .gx-case-anze .seller-body {
        grid-template-columns:1fr;
    }

    .gx-case-anze .seller-list {
        display:none;
    }

    .gx-case-anze .financial-board,
    .gx-case-anze .hub-map {
        padding:20px;
    }

    .gx-case-anze .final-actions {
        flex-direction:column;
    }

    .gx-case-anze .final-actions .btn {
        width:100%;
    }

}

/* ══════════════════════════════════════════════════════════
   CSIRT (pages/Csirt.html)
   padrão visual b2c
══════════════════════════════════════════════════════════ */
.gx-csirt {
    --navy: #060913;
    --navy-light: #0b0f19;
    --blue: #00a0e3;
    --cyan: #38bdf8;
    --purple: #802be2;
    --white: #ffffff;
    --text: #0f172a;
    --muted: #64748b;
    --border: #e2e8f0;
    --background: #f8fafc;
    --container: 1180px;

    display: block;
    overflow: hidden;
    font-family: "Inter", sans-serif;
    color: var(--text);
    background: var(--white);
    line-height: 1.6;
}
.gx-csirt * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

.gx-csirt a {
    text-decoration: none;
}

.gx-csirt .container {
    width: min(calc(100% - 48px), var(--container));
    margin: 0 auto;
}


/* --------------------------------
   HERO
-------------------------------- */

.gx-csirt .hero {
    min-height: 780px;
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(
            circle at 80% 35%,
            rgba(0, 164, 255, .15),
            transparent 32%
        ),
        linear-gradient(
            135deg,
            #031023 0%,
            #061a34 55%,
            #041327 100%
        );

    color: white;
}

.gx-csirt .hero-grid {
    position: absolute;
    inset: 0;

    opacity: .15;

    background-image:
        linear-gradient(
            rgba(255,255,255,.08) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255,255,255,.08) 1px,
            transparent 1px
        );

    background-size: 80px 80px;

    mask-image:
        linear-gradient(
            to bottom,
            black,
            transparent 90%
        );
}

.gx-csirt .hero-glow {
    width: 700px;
    height: 700px;

    position: absolute;
    right: -250px;
    top: -200px;

    border-radius: 50%;

    background: var(--blue);

    filter: blur(200px);
    opacity: .13;
}

.gx-csirt .hero-content {
    position: relative;
    z-index: 2;

    min-height: 650px;

    display: grid;
    grid-template-columns: 1.2fr .8fr;
    align-items: center;

    gap: 80px;

    padding-top: 10px;
}

.gx-csirt .eyebrow,
.gx-csirt .section-label {
    display: inline-flex;
    align-items: center;

    gap: 10px;

    font-size: 11px;
    font-weight: 700;

    letter-spacing: 3px;

    color: var(--cyan);
}

.gx-csirt .eyebrow-dot {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: var(--cyan);

    box-shadow:
        0 0 14px var(--cyan);
}

.gx-csirt .hero h1 {
    max-width: 760px;

    margin-top: 26px;

    
    font-size: clamp(48px, 6vw, 82px);
    font-weight: 500;

    letter-spacing: -4px;
    line-height: .98;
}

.gx-csirt .hero h1 span,
.gx-csirt .section-heading h2 span,
.gx-csirt .disclosure h2 span,
.gx-csirt .security-cta h2 span {
    color: var(--cyan);
}

.gx-csirt .hero-description {
    max-width: 660px;

    margin-top: 32px;

    color: #aab9cb;

    font-size: 17px;
    line-height: 1.8;
}

.gx-csirt .hero-actions {
    display: flex;
    flex-wrap: wrap;

    gap: 14px;

    margin-top: 38px;
}

.gx-csirt .btn {
    min-height: 54px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 30px;

    padding: 0 25px;

    border-radius: 6px;

    font-size: 13px;
    font-weight: 600;

    transition: .25s ease;
}

.gx-csirt .btn-primary {
    color: #001423;

    background:
        linear-gradient(
            90deg,
            var(--cyan),
            #08a7ee
        );
}

.gx-csirt .btn-primary:hover {
    transform: translateY(-2px);

    box-shadow:
        0 10px 40px rgba(15, 207, 239, .25);
}

.gx-csirt .btn-secondary {
    color: white;

    border:
        1px solid rgba(255,255,255,.18);

    background:
        rgba(255,255,255,.04);
}

.gx-csirt .btn-secondary:hover {
    background:
        rgba(255,255,255,.09);
}


/* SECURITY VISUAL */

.gx-csirt .hero-security {
    display: flex;
    flex-direction: column;

    align-items: center;
    justify-content: center;
}

.gx-csirt .security-orbit {
    width: 340px;
    height: 340px;

    position: relative;

    display: flex;
    align-items: center;
    justify-content: center;
}

.gx-csirt .orbit {
    position: absolute;

    border:
        1px solid rgba(19, 211, 239, .2);

    transform: rotate(45deg);
}

.gx-csirt .orbit-one {
    width: 270px;
    height: 270px;
}

.gx-csirt .orbit-two {
    width: 200px;
    height: 200px;

    border-color:
        rgba(119, 87, 255, .3);
}

.gx-csirt .security-symbol {
    width: 130px;
    height: 130px;

    position: relative;
    z-index: 3;

    display: flex;
    align-items: center;
    justify-content: center;

    color: var(--cyan);

    background:
        linear-gradient(
            135deg,
            rgba(19,211,239,.12),
            rgba(119,87,255,.08)
        );

    border:
        1px solid rgba(19,211,239,.35);

    transform: rotate(45deg);

    box-shadow:
        0 0 70px rgba(19,211,239,.12);
}

.gx-csirt .security-symbol svg {
    width: 65px;

    transform: rotate(-45deg);
}

.gx-csirt .security-status {
    margin-top: 15px;

    display: flex;
    align-items: center;

    gap: 9px;

    font-size: 9px;
    letter-spacing: 2px;

    color: #71859c;
}

.gx-csirt .security-status span {
    width: 6px;
    height: 6px;

    border-radius: 50%;

    background: #21dca5;

    box-shadow:
        0 0 10px #21dca5;
}


/* HERO FOOTER */

.gx-csirt .hero-footer {
    position: relative;
    z-index: 3;

    display: grid;
    grid-template-columns: repeat(3, 1fr);

    border-top:
        1px solid rgba(255,255,255,.09);
}

.gx-csirt .hero-footer div {
    padding: 27px 0;
}

.gx-csirt .hero-footer strong {
    display: block;

    font-size: 9px;
    letter-spacing: 2px;

    color: #d5e1ee;
}

.gx-csirt .hero-footer span {
    display: block;

    margin-top: 4px;

    font-size: 11px;

    color: #60748b;
}


/* --------------------------------
   GLOBAL SECTIONS
-------------------------------- */

.gx-csirt .section {
    padding: 40px 0;
}

.gx-csirt .section-dark {
    color: white;

    background:
        linear-gradient(
            135deg,
            #041327,
            #071d37
        );
}

.gx-csirt .section-heading {
    max-width: 720px;
}

.gx-csirt .section-heading.centered {
    margin: 0 auto 70px;

    text-align: center;
}

.gx-csirt .section-number {
    margin-right: 15px;

    font-size: 12px;

    color: #9aabbc;
}

.gx-csirt .section-heading h2,
.gx-csirt .disclosure h2,
.gx-csirt .security-cta h2 {
    margin-top: 18px;

    
    font-size: clamp(38px, 4vw, 58px);
    font-weight: 500;

    letter-spacing: -2px;
    line-height: 1.08;
}

.gx-csirt .section-heading p {
    margin-top: 24px;

    color: #758397;

    font-size: 16px;
    line-height: 1.8;
}

.gx-csirt .section-dark .section-heading p {
    color: #8194aa;
}


/* --------------------------------
   INTRO
-------------------------------- */

.gx-csirt .intro {
    background: #fff;
}


/* --------------------------------
   INCIDENTS
-------------------------------- */

.gx-csirt .incident-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);

    gap: 1px;

    margin-top: 70px;

    background:
        rgba(255,255,255,.08);

    border:
        1px solid rgba(255,255,255,.08);
}

.gx-csirt .incident-card {
    min-height: 300px;

    position: relative;

    padding: 36px;

    background: #06172d;

    transition: .3s ease;
}

.gx-csirt .incident-card:hover {
    background: #09213d;
}

.gx-csirt .card-number {
    position: absolute;

    top: 25px;
    right: 25px;

    color: #344a63;

    font-size: 10px;
}

.gx-csirt .card-icon {
    height: 70px;

    display: flex;
    align-items: center;

    color: var(--cyan);

    font-size: 25px;
}

.gx-csirt .incident-card h3 {
    margin-top: 20px;

    font-size: 17px;
}

.gx-csirt .incident-card p {
    margin-top: 12px;

    color: #71869d;

    font-size: 13px;
    line-height: 1.7;
}


/* --------------------------------
   REPORT
-------------------------------- */

.gx-csirt .report-section {
    background: var(--background);
}

.gx-csirt .report-layout {
    display: grid;
    grid-template-columns: 1.3fr .7fr;

    gap: 90px;
}

.gx-csirt .report-items {
    margin-top: 60px;
}

.gx-csirt .report-item {
    display: grid;
    grid-template-columns: 50px 1fr;

    gap: 20px;

    padding: 28px 0;

    border-top:
        1px solid var(--border);
}

.gx-csirt .report-item > span {
    color: var(--blue);

    font-size: 11px;
    font-weight: 700;
}

.gx-csirt .report-item h3 {
    font-size: 15px;
}

.gx-csirt .report-item p {
    max-width: 570px;

    margin-top: 6px;

    color: var(--muted);

    font-size: 13px;
}

.gx-csirt .contact-card {
    align-self: start;

    position: sticky;
    top: 40px;

    padding: 45px;

    color: white;

    background:
        linear-gradient(
            150deg,
            #06182f,
            #092744
        );

    border-radius: 8px;
}

.gx-csirt .contact-icon {
    width: 55px;
    height: 55px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-bottom: 30px;

    border:
        1px solid rgba(22,211,239,.3);

    color: var(--cyan);

    font-size: 23px;
}

.gx-csirt .contact-card > span {
    color: var(--cyan);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: 2px;
}

.gx-csirt .contact-card h3 {
    margin-top: 12px;

    
    font-size: 28px;
}

.gx-csirt .contact-card > p {
    margin-top: 15px;

    color: #8295aa;

    font-size: 13px;
}

.gx-csirt .contact-card > a {
    display: block;

    margin-top: 25px;

    color: var(--cyan);

    font-size: 14px;
}

.gx-csirt .contact-warning {
    margin-top: 35px;

    padding-top: 25px;

    border-top:
        1px solid rgba(255,255,255,.1);
}

.gx-csirt .contact-warning strong {
    color: white;

    font-size: 11px;
}

.gx-csirt .contact-warning p {
    margin-top: 8px;

    color: #70859b;

    font-size: 11px;
}


/* --------------------------------
   PROCESS
-------------------------------- */

.gx-csirt .process-section {
    background: white;
}

.gx-csirt .process {
    display: grid;
    grid-template-columns: repeat(7, 1fr);

    margin-top: 40px;
}

.gx-csirt .process-item {
    min-height: 220px;

    position: relative;

    padding: 28px 22px;

    border-left:
        1px solid var(--border);
}

.gx-csirt .process-item:last-child {
    border-right:
        1px solid var(--border);
}

.gx-csirt .process-item > span {
    color: var(--blue);

    font-size: 10px;
    font-weight: 700;
}

.gx-csirt .process-item h3 {
    margin-top: 60px;

    font-size: 14px;
}

.gx-csirt .process-item p {
    margin-top: 8px;

    color: var(--muted);

    font-size: 11px;
}


/* --------------------------------
   DISCLOSURE
-------------------------------- */

.gx-csirt .disclosure {
    color: white;

    background: #041327;
}

.gx-csirt .disclosure-layout {
    display: grid;
    grid-template-columns: .8fr 1.2fr;

    gap: 120px;
}

.gx-csirt .disclosure-intro {
    margin-top: 30px;

    color: #7f91a6;

    font-size: 14px;
    line-height: 1.8;
}

.gx-csirt .rules {
    border-top:
        1px solid rgba(255,255,255,.1);
}

.gx-csirt .rule {
    display: grid;
    grid-template-columns: 60px 1fr;

    gap: 20px;

    padding: 27px 0;

    border-bottom:
        1px solid rgba(255,255,255,.1);
}

.gx-csirt .rule span {
    color: var(--cyan);

    font-size: 10px;
}

.gx-csirt .rule p {
    color: #a0afbf;

    font-size: 13px;
}


/* --------------------------------
   PRIVACY
-------------------------------- */

.gx-csirt .privacy {
    background: #f5f8fb;
}

.gx-csirt .privacy-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;

    gap: 1px;

    background: var(--border);
}

.gx-csirt .privacy article {
    padding: 55px;

    background: white;
}

.gx-csirt .mini-label {
    color: var(--blue);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: 2px;
}

.gx-csirt .privacy h3 {
    margin-top: 15px;

    
    font-size: 25px;
}

.gx-csirt .privacy p {
    margin-top: 18px;

    color: var(--muted);

    font-size: 13px;
    line-height: 1.8;
}


/* --------------------------------
   ECOSYSTEM
-------------------------------- */

.gx-csirt .ecosystem {
    padding: 45px 0;

    background: white;

    border-top:
        1px solid var(--border);

    border-bottom:
        1px solid var(--border);
}

.gx-csirt .ecosystem-list {
    display: flex;
    flex-wrap: wrap;

    gap: 10px 30px;

    margin-top: 25px;
}

.gx-csirt .ecosystem-list span {
    
    font-size: 11px;
    font-weight: 600;

    letter-spacing: 1.5px;

    color: #8190a0;
}


/* --------------------------------
   CTA
-------------------------------- */

.gx-csirt .security-cta {
    min-height: 580px;

    position: relative;
    overflow: hidden;

    display: flex;
    align-items: center;

    color: white;

    text-align: center;

    background:
        linear-gradient(
            135deg,
            #031126,
            #06203d
        );
}

.gx-csirt .security-cta-glow {
    position: absolute;

    width: 600px;
    height: 600px;

    left: 50%;
    top: 50%;

    transform:
        translate(-50%, -50%);

    background:
        var(--blue);

    border-radius: 50%;

    filter: blur(220px);

    opacity: .12;
}

.gx-csirt .cta-content {
    position: relative;
    z-index: 2;
}

.gx-csirt .security-cta h2 {
    margin-top: 20px;
}

.gx-csirt .security-cta p {
    max-width: 560px;

    margin: 25px auto;

    color: #8599ae;

    font-size: 14px;
}

.gx-csirt .btn-large {
    min-height: 60px;

    margin-top: 10px;

    padding: 0 32px;
}

.gx-csirt .security-cta small {
    display: block;

    margin-top: 20px;

    color: #61768c;

    font-size: 10px;
    letter-spacing: 1px;
}


/* --------------------------------
   RESPONSIVE
-------------------------------- */

@media (max-width: 1000px) {

    .gx-csirt .hero-content {
        grid-template-columns: 1fr;
        gap: 20px;

        padding: 130px 0 80px;
    }

    .gx-csirt .hero-security {
        display: none;
    }

    .gx-csirt .incident-grid {
        grid-template-columns: 1fr 1fr;
    }

    .gx-csirt .report-layout,
    .gx-csirt .disclosure-layout {
        grid-template-columns: 1fr;
    }

    .gx-csirt .contact-card {
        position: static;
    }

    .gx-csirt .process {
        grid-template-columns: repeat(2, 1fr);
    }

    .gx-csirt .process-item {
        border:
            1px solid var(--border);
    }

}


@media (max-width: 700px) {

    .gx-csirt .container {
        width: min(calc(100% - 32px), var(--container));
    }

    .gx-csirt .section {
        padding: 80px 0;
    }

    .gx-csirt .hero {
        min-height: auto;
    }

    .gx-csirt .hero h1 {
        font-size: 48px;

        letter-spacing: -2.5px;
    }

    .gx-csirt .hero-footer {
        grid-template-columns: 1fr;
    }

    .gx-csirt .hero-footer div {
        padding: 14px 0;
    }

    .gx-csirt .incident-grid,
    .gx-csirt .privacy-grid {
        grid-template-columns: 1fr;
    }

    .gx-csirt .process {
        grid-template-columns: 1fr;
    }

    .gx-csirt .report-layout {
        gap: 50px;
    }

    .gx-csirt .contact-card,
    .gx-csirt .privacy article {
        padding: 32px;
    }

    .gx-csirt .disclosure-layout {
        gap: 55px;
    }

}

/* ══════════════════════════════════════════════════════════
   SEJA UM PARCEIRO (pages/Sejaumparceiro.html)
   padrão visual b2c
══════════════════════════════════════════════════════════ */
.partner-page {
    --partner-navy: #060913;
    --partner-navy-2: #0b0f19;
    --partner-blue: #00a0e3;
    --partner-cyan: #38bdf8;
    --partner-purple: #802be2;
    --partner-white: #ffffff;
    --partner-bg: #f8fafc;
    --partner-text: #0f172a;
    --partner-muted: #64748b;
    --partner-border: #e2e8f0;
    --partner-container: 1180px;

    display: block;
    overflow: hidden;
    margin: 0;
    font-family: "Inter", sans-serif;
    color: var(--partner-text);
    background: #ffffff;
    line-height: 1.6;
}
.partner-page * {
    box-sizing: border-box;
}
.partner-page a {
    text-decoration: none;
}

.partner-page .partner-container {
    width: min(
        calc(100% - 48px),
        var(--partner-container)
    );

    margin: 0 auto;
}


/* ================================
   HERO
================================ */

.partner-page .partner-hero {
    min-height: 800px;

    position: relative;
    overflow: hidden;

    color: white;

    background:
        radial-gradient(
            circle at 78% 30%,
            rgba(0, 155, 255, .17),
            transparent 32%
        ),
        linear-gradient(
            135deg,
            #020d1d 0%,
            #04182e 55%,
            #06203c 100%
        );
}

.partner-page .partner-hero-grid {
    position: absolute;
    inset: 0;

    opacity: .12;

    background-image:
        linear-gradient(
            rgba(255,255,255,.08) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255,255,255,.08) 1px,
            transparent 1px
        );

    background-size: 70px 70px;

    mask-image:
        linear-gradient(
            to bottom,
            #000 30%,
            transparent
        );
}

.partner-page .partner-hero-glow {
    position: absolute;

    border-radius: 50%;

    filter: blur(180px);
}

.partner-page .partner-glow-1 {
    width: 500px;
    height: 500px;

    right: -150px;
    top: -150px;

    background: var(--partner-blue);

    opacity: .13;
}

.partner-page .partner-glow-2 {
    width: 450px;
    height: 450px;

    left: 30%;
    bottom: -350px;

    background: var(--partner-purple);

    opacity: .1;
}

.partner-page .partner-hero-content {
    min-height: 670px;

    position: relative;
    z-index: 2;

    display: grid;

    grid-template-columns:
        minmax(0, 1.15fr)
        minmax(380px, .85fr);

    align-items: center;

    gap: 70px;

    padding-top: 0px;
}

.partner-page .partner-eyebrow,
.partner-page .partner-label {
    display: inline-flex;

    align-items: center;

    gap: 10px;

    color: var(--partner-cyan);

    font-size: 10px;
    font-weight: 700;

    letter-spacing: 2.8px;
}

.partner-page .partner-eyebrow i {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: var(--partner-cyan);

    box-shadow:
        0 0 12px var(--partner-cyan);
}

.partner-page .partner-hero h1 {
    max-width: 750px;

    margin:
        26px 0
        0;

    
    font-size:
        clamp(48px, 5.5vw, 76px);

    font-weight: 500;

    letter-spacing: -4px;

    line-height: 1;
}

.partner-page .partner-hero h1 span,
.partner-page .partner-section h2 span,
.partner-page .partner-form-section h2 span {
    color: var(--partner-cyan);
}

.partner-page .partner-hero-copy > p {
    max-width: 650px;

    margin: 30px 0 0;

    color: #a4b4c7;

    font-size: 16px;

    line-height: 1.8;
}

.partner-page .partner-hero-actions {
    display: flex;
    flex-wrap: wrap;

    gap: 12px;

    margin-top: 38px;
}

.partner-page .partner-btn {
    min-height: 54px;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 28px;

    padding: 0 25px;

    border-radius: 5px;

    font-size: 12px;
    font-weight: 600;

    transition: .25s ease;
}

.partner-page .partner-btn-primary {
    color: #001725;

    background:
        linear-gradient(
            90deg,
            var(--partner-cyan),
            #04a6ef
        );
}

.partner-page .partner-btn-primary:hover {
    transform: translateY(-2px);

    box-shadow:
        0 15px 45px
        rgba(23,211,237,.2);
}

.partner-page .partner-btn-outline {
    color: #fff;

    border:
        1px solid rgba(255,255,255,.17);

    background:
        rgba(255,255,255,.03);
}

.partner-page .partner-btn-outline:hover {
    background:
        rgba(255,255,255,.08);
}


/* ================================
   NETWORK
================================ */

.partner-page .partner-network {
    width: 430px;
    height: 430px;

    position: relative;

    margin: auto;

    display: flex;

    align-items: center;
    justify-content: center;
}

.partner-page .network-ring {
    position: absolute;

    border-radius: 50%;

    border:
        1px solid rgba(23,211,237,.14);
}

.partner-page .ring-1 {
    width: 420px;
    height: 420px;
}

.partner-page .ring-2 {
    width: 310px;
    height: 310px;

    border-style: dashed;
}

.partner-page .ring-3 {
    width: 205px;
    height: 205px;

    border-color:
        rgba(115,87,255,.28);
}

.partner-page .network-core {
    width: 135px;
    height: 135px;

    position: relative;
    z-index: 3;

    display: flex;

    flex-direction: column;

    align-items: center;
    justify-content: center;

    transform: rotate(45deg);

    border:
        1px solid rgba(23,211,237,.4);

    background:
        linear-gradient(
            135deg,
            rgba(23,211,237,.12),
            rgba(115,87,255,.1)
        );

    box-shadow:
        0 0 70px
        rgba(23,211,237,.1);
}

.partner-page .network-core strong,
.partner-page .network-core span {
    transform: rotate(-45deg);
}

.partner-page .network-core strong {
    color: var(--partner-cyan);

    font-size: 40px;
}

.partner-page .network-core span {
    margin-top: 8px;

    color: #7890a8;

    font-size: 7px;

    letter-spacing: 2px;
}

.partner-page .network-node {
    position: absolute;

    padding: 7px 10px;

    color: #7890a8;

    border:
        1px solid rgba(255,255,255,.1);

    background: #061a32;

    font-size: 7px;

    letter-spacing: 1.5px;
}

.partner-page .node-1 {
    top: 25px;
    left: 185px;
}

.partner-page .node-2 {
    right: 5px;
    top: 180px;
}

.partner-page .node-3 {
    right: 60px;
    bottom: 45px;
}

.partner-page .node-4 {
    left: 50px;
    bottom: 55px;
}

.partner-page .node-5 {
    left: 0;
    top: 180px;
}

.partner-page .node-6 {
    left: 80px;
    top: 65px;
}


/* HERO BOTTOM */

.partner-page .partner-hero-bottom {
    position: relative;
    z-index: 3;

    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    border-top:
        1px solid rgba(255,255,255,.08);
}

.partner-page .partner-hero-bottom div {
    padding: 26px 0;
}

.partner-page .partner-hero-bottom strong {
    display: block;

    color: #d8e2ed;

    font-size: 9px;

    letter-spacing: 2px;
}

.partner-page .partner-hero-bottom span {
    display: block;

    margin-top: 5px;

    color: #5e7389;

    font-size: 10px;
}


/* ================================
   SECTIONS
================================ */

.partner-page .partner-section {
    padding: 40px 0;
}

.partner-page .partner-section h2,
.partner-page .partner-form-section h2 {
    margin: 18px 0 0;


    font-size:
        clamp(38px, 4.2vw, 58px);

    font-weight: 500;

    letter-spacing: -2.7px;

    line-height: 1.06;
}

.partner-page .partner-section-header {
    display: grid;

    grid-template-columns:
        1fr 420px;

    align-items: end;

    gap: 80px;

    margin-bottom: 65px;
}

.partner-page .partner-section-header > p {
    margin: 0;

    color: var(--partner-muted);

    font-size: 14px;

    line-height: 1.8;
}


/* ================================
   MANIFESTO
================================ */

.partner-page .partner-manifesto {
    background: #fff;
}

.partner-page .manifesto-grid {
    display: grid;

    grid-template-columns:
        .95fr 1.05fr;

    gap: 130px;

    align-items: start;
}

.partner-page .manifesto-content {
    padding-top: 35px;
}

.partner-page .manifesto-content p {
    color: var(--partner-muted);

    font-size: 14px;

    line-height: 1.9;
}

.partner-page .manifesto-content .manifesto-lead {
    color: var(--partner-text);


    font-size: 24px;

    line-height: 1.4;
}

.partner-page .manifesto-stats {
    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 1px;

    margin-top: 50px;

    background:
        var(--partner-border);

    border:
        1px solid var(--partner-border);
}

.partner-page .manifesto-stats div {
    padding: 30px;

    background: white;
}

.partner-page .manifesto-stats strong {
    display: block;

    color: var(--partner-blue);


    font-size: 35px;
}

.partner-page .manifesto-stats span {
    color: var(--partner-muted);

    font-size: 10px;
}


/* ================================
   MODELS
================================ */

.partner-page .partner-models {
    color: white;

    background:
        linear-gradient(
            135deg,
            #031326,
            #061c35
        );
}

.partner-page .partner-model-grid {
    display: grid;

    grid-template-columns:
        repeat(3, 1fr);

    gap: 1px;

    background:
        rgba(255,255,255,.08);

    border:
        1px solid rgba(255,255,255,.08);
}

.partner-page .partner-model-card {
    min-height: 420px;

    position: relative;

    padding: 35px;

    display: flex;

    flex-direction: column;

    background: #06172d;

    transition: .3s ease;
}

.partner-page .partner-model-card:hover {
    background: #09213c;
}

.partner-page .partner-model-card.featured {
    background:
        linear-gradient(
            145deg,
            #08223d,
            #0a2444
        );
}

.partner-page .featured-tag {
    position: absolute;

    right: 0;
    top: 0;

    padding: 7px 12px;

    color: #001623;

    background:
        var(--partner-cyan);

    font-size: 7px;
    font-weight: 700;

    letter-spacing: 1.5px;
}

.partner-page .model-top {
    display: flex;

    align-items: center;
    justify-content: space-between;
}

.partner-page .model-number {
    color: #40566f;

    font-size: 9px;
}

.partner-page .model-icon {
    color: var(--partner-cyan);


    font-size: 23px;
}

.partner-page .model-type {
    margin-top: 55px;

    color: var(--partner-cyan);

    font-size: 7px;
    font-weight: 700;

    letter-spacing: 1.8px;
}

.partner-page .partner-model-card h3 {
    margin:
        13px 0 0;


    font-size: 22px;

    font-weight: 500;
}

.partner-page .partner-model-card p {
    margin:
        15px 0 0;

    color: #8799ad;

    font-size: 12px;

    line-height: 1.7;
}

.partner-page .partner-model-card small {
    display: block;

    margin-top: 17px;

    color: #536a82;

    font-size: 10px;

    line-height: 1.6;
}

.partner-page .partner-model-card a {
    margin-top: auto;

    padding-top: 30px;

    color: #dce6ef;

    font-size: 10px;

    font-weight: 600;
}

.partner-page .partner-model-card a span {
    float: right;

    color: var(--partner-cyan);
}


/* ================================
   ECOSYSTEM
================================ */

.partner-page .ecosystem-section {
    color: white;

    background: #020d1c;
}

.partner-page .ecosystem-header {
    max-width: 700px;

    margin: 0 auto;

    text-align: center;
}

.partner-page .ecosystem-header p {
    max-width: 550px;

    margin:
        25px auto 0;

    color: #74899e;

    font-size: 13px;

    line-height: 1.8;
}

.partner-page .ecosystem-map {
    max-width: 950px;
    min-height: 520px;

    position: relative;

    margin:
        80px auto 0;

    border:
        1px solid rgba(255,255,255,.06);

    background:
        radial-gradient(
            circle at center,
            rgba(23,211,237,.09),
            transparent 38%
        );
}

.partner-page .ecosystem-core {
    position: absolute;

    left: 50%;
    top: 50%;

    transform:
        translate(-50%, -50%)
        rotate(45deg);

    width: 150px;
    height: 150px;

    display: flex;

    align-items: center;
    justify-content: center;

    border:
        1px solid rgba(23,211,237,.45);

    background: #061b33;

    box-shadow:
        0 0 80px
        rgba(23,211,237,.12);
}

.partner-page .ecosystem-core div {
    text-align: center;

    transform: rotate(-45deg);
}

.partner-page .ecosystem-core strong {
    display: block;

    color: var(--partner-cyan);



    font-size: 42px;
}

.partner-page .ecosystem-core span {
    color: #71869c;

    font-size: 7px;

    letter-spacing: 2px;
}

.partner-page .ecosystem-product {
    width: 200px;

    position: absolute;

    padding: 17px 20px;

    border:
        1px solid rgba(255,255,255,.08);

    background:
        rgba(6,25,47,.8);
}

.partner-page .ecosystem-product span {
    color: var(--partner-cyan);

    font-size: 7px;
}

.partner-page .ecosystem-product strong {
    display: block;

    margin-top: 6px;

    font-size: 10px;

    letter-spacing: 1px;
}

.partner-page .ecosystem-product small {
    display: block;

    margin-top: 5px;

    color: #566d84;

    font-size: 7px;

    letter-spacing: .8px;
}

.partner-page .platform {
    left: 50%;
    top: 35px;

    transform: translateX(-50%);
}

.partner-page .crm {
    right: 70px;
    top: 130px;
}

.partner-page .atendimento {
    right: 70px;
    bottom: 100px;
}

.partner-page .integrador {
    left: 50%;
    bottom: 35px;

    transform: translateX(-50%);
}

.partner-page .tms {
    left: 70px;
    bottom: 100px;
}

.partner-page .newton {
    left: 70px;
    top: 130px;
}


/* ================================
   CATEGORIES
================================ */

.partner-page .categories-section {
    background:
        var(--partner-bg);
}

.partner-page .category-grid {
    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    gap: 1px;

    background:
        var(--partner-border);

    border:
        1px solid var(--partner-border);
}

.partner-page .category-grid article {
    min-height: 230px;

    padding: 30px;

    background: white;
}

.partner-page .category-grid article > span {
    color: var(--partner-blue);

    font-size: 9px;
}

.partner-page .category-grid h3 {
    margin:
        45px 0 0;


    font-size: 17px;
}

.partner-page .category-grid p {
    color: var(--partner-muted);

    font-size: 11px;

    line-height: 1.7;
}

.partner-page .category-grid .category-cta {
    color: white;

    background:
        linear-gradient(
            145deg,
            #071d36,
            #092846
        );
}

.partner-page .category-cta h3 {
    color: white;
}

.partner-page .category-cta p {
    color: #8195aa;
}

.partner-page .category-cta a {
    display: inline-block;

    margin-top: 15px;

    color: var(--partner-cyan);

    font-size: 9px;
}


/* ================================
   BENEFITS
================================ */

.partner-page .benefits-section {
    background: white;
}

.partner-page .benefits-layout {
    display: grid;

    grid-template-columns:
        .8fr 1.2fr;

    gap: 120px;
}

.partner-page .benefits-copy {
    position: sticky;

    top: 80px;

    align-self: start;
}

.partner-page .benefits-copy > p {
    max-width: 380px;

    color: var(--partner-muted);

    font-size: 13px;

    line-height: 1.8;
}

.partner-page .benefits-list {
    border-top:
        1px solid var(--partner-border);
}

.partner-page .benefits-list article {
    display: grid;

    grid-template-columns:
        60px 1fr;

    gap: 20px;

    padding: 30px 0;

    border-bottom:
        1px solid var(--partner-border);
}

.partner-page .benefits-list article > span {
    color: var(--partner-blue);

    font-size: 9px;
}

.partner-page .benefits-list h3 {
    margin: 0;


    font-size: 18px;
}

.partner-page .benefits-list p {
    margin:
        8px 0 0;

    color: var(--partner-muted);

    font-size: 12px;
}


/* ================================
   PROCESS
================================ */

.partner-page .process-section {
    color: white;

    background: #041326;
}

.partner-page .process-heading {
    max-width: 650px;
}

.partner-page .partner-process {
    display: grid;

    grid-template-columns:
        repeat(6, 1fr);

    margin-top: 70px;
}

.partner-page .partner-process article {
    min-height: 240px;

    position: relative;

    padding-right: 25px;
}

.partner-page .partner-process article > span {
    color: var(--partner-cyan);

    font-size: 9px;
}

.partner-page .process-line {
    height: 1px;

    position: relative;

    margin:
        22px 0
        50px;

    background:
        rgba(255,255,255,.13);
}

.partner-page .process-line::before {
    content: "";

    width: 7px;
    height: 7px;

    position: absolute;

    left: 0;
    top: -3px;

    border-radius: 50%;

    background:
        var(--partner-cyan);

    box-shadow:
        0 0 10px
        rgba(23,211,237,.7);
}

.partner-page .partner-process h3 {
   
    font-size: 15px;

    font-weight: 500;
}

.partner-page .partner-process p {
    color: #6f8499;

    font-size: 10px;

    line-height: 1.7;
}


/* ================================
   REQUIREMENTS
================================ */

.partner-page .requirements-section {
    background: var(--partner-bg);
}

.partner-page .requirements-layout {
    display: grid;

    grid-template-columns:
        .85fr 1.15fr;

    gap: 120px;
}

.partner-page .requirements-layout > div:first-child p {
    max-width: 400px;

    color: var(--partner-muted);

    font-size: 13px;

    line-height: 1.8;
}

.partner-page .requirements {
    border-top:
        1px solid var(--partner-border);
}

.partner-page .requirements div {
    display: grid;

    grid-template-columns:
        55px 1fr;

    padding: 23px 0;

    border-bottom:
        1px solid var(--partner-border);
}

.partner-page .requirements span {
    color: var(--partner-blue);

    font-size: 9px;
}

.partner-page .requirements strong {
    
    font-size: 15px;

    font-weight: 500;
}


/* ================================
   FORM
================================ */

.partner-page .partner-form-section {
    position: relative;
    overflow: hidden;

    padding: 130px 0;

    color: white;

    background:
        linear-gradient(
            140deg,
            #020d1c,
            #061d38
        );
}

.partner-page .partner-form-glow {
    width: 500px;
    height: 500px;

    position: absolute;

    left: -200px;
    top: 20%;

    border-radius: 50%;

    background:
        var(--partner-blue);

    filter: blur(200px);

    opacity: .1;
}

.partner-page .form-layout {
    position: relative;
    z-index: 2;

    display: grid;

    grid-template-columns:
        .8fr 1.2fr;

    gap: 100px;
}

.partner-page .form-copy > p {
    max-width: 450px;

    color: #8195a9;

    font-size: 13px;

    line-height: 1.8;
}

.partner-page .form-phrase {
    display: flex;
    flex-wrap: wrap;

    gap: 10px 18px;

    margin-top: 50px;
}

.partner-page .form-phrase strong {
    color: #50667d;

    font-size: 8px;

    letter-spacing: 1.5px;
}

.partner-page .partner-form {
    padding: 45px;

    border:
        1px solid rgba(255,255,255,.1);

    background:
        rgba(255,255,255,.025);
}

.partner-page .form-row {
    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 18px;
}

.partner-page .form-group {
    margin-bottom: 20px;
}

.partner-page .form-group label {
    display: block;

    margin-bottom: 8px;

    color: #8fa2b5;

    font-size: 9px;

    letter-spacing: .8px;
}

.partner-page .form-group input,
.partner-page .form-group select,
.partner-page .form-group textarea {
    width: 100%;

    border:
        1px solid rgba(255,255,255,.12);

    outline: none;

    padding: 15px 16px;

    color: white;

    font-family:
        "Inter" !important;

    background:
        rgba(255,255,255,.035);

    transition: .2s ease;
}

.partner-page .form-group input,
.partner-page .form-group select {
    height: 50px;
}

.partner-page .form-group textarea {
    resize: vertical;
}

.partner-page .form-group input:focus,
.partner-page .form-group select:focus,
.partner-page .form-group textarea:focus {
    border-color:
        var(--partner-cyan);

    background:
        rgba(255,255,255,.055);
}

.partner-page .form-group input::placeholder,
.partner-page .form-group textarea::placeholder {
    color: #53677c;
}

.partner-page .form-group select option {
    color: #111;

    background: white;
}

.partner-page .form-consent {
    display: flex;

    align-items: flex-start;

    gap: 12px;

    color: #687d92;

    font-size: 9px;

    line-height: 1.6;
}

.partner-page .form-consent input {
    margin-top: 2px;

    accent-color:
        var(--partner-cyan);
}

.partner-page .partner-submit {
    width: 100%;
    height: 56px;

    margin-top: 25px;

    display: flex;

    align-items: center;
    justify-content: space-between;

    padding: 0 22px;

    border: 0;

    cursor: pointer;

    color: #001521;

    font-family:
        "Inter" !important;

    font-size: 11px;
    font-weight: 700;

    background:
        linear-gradient(
            90deg,
            var(--partner-cyan),
            #08a6ed
        );

    transition: .25s ease;
}

.partner-page .partner-submit:hover {
    transform:
        translateY(-2px);

    box-shadow:
        0 15px 40px
        rgba(23,211,237,.15);
}


/* ================================
   RESPONSIVE
================================ */

@media (max-width: 1050px) {

    .partner-page .partner-hero-content {
        grid-template-columns: 1fr;

        padding:
            130px 0
            90px;
    }

    .partner-page .partner-network {
        display: none;
    }

    .partner-page .partner-model-grid {
        grid-template-columns:
            repeat(2, 1fr);
    }

    .partner-page .category-grid {
        grid-template-columns:
            repeat(2, 1fr);
    }

    .partner-page .partner-process {
        grid-template-columns:
            repeat(3, 1fr);

        gap: 30px 0;
    }

    .partner-page .partner-section-header,
    .partner-page .manifesto-grid,
    .partner-page .benefits-layout,
    .partner-page .requirements-layout,
    .partner-page .form-layout {
        grid-template-columns: 1fr;

        gap: 60px;
    }

    .partner-page .benefits-copy {
        position: static;
    }

}


@media (max-width: 720px) {

    .partner-page .partner-container {
        width:
            min(
                calc(100% - 32px),
                var(--partner-container)
            );
    }

    .partner-page .partner-section,
    .partner-page .partner-form-section {
        padding: 40px 0;
    }

    .partner-page .partner-hero {
        min-height: auto;
    }

    .partner-page .partner-hero h1 {
        font-size: 47px;

        letter-spacing: -2.5px;
    }

    .partner-page .partner-hero-bottom {
        grid-template-columns:
            repeat(2, 1fr);
    }

    .partner-page .partner-model-grid,
    .partner-page .category-grid {
        grid-template-columns: 1fr;
    }

    .partner-page .partner-model-card {
        min-height: 380px;
    }

    .partner-page .ecosystem-map {
        min-height: auto;

        display: grid;

        grid-template-columns: 1fr;

        gap: 10px;

        padding: 20px;
    }

    .partner-page .ecosystem-core,
    .partner-page .ecosystem-product {
        width: 100%;

        position: static;

        transform: none;
    }

    .partner-page .ecosystem-core {
        height: 140px;
    }

    .partner-page .ecosystem-core div {
        transform: none;
    }

    .partner-page .partner-process {
        grid-template-columns:
            1fr 1fr;
    }

    .partner-page .form-row {
        grid-template-columns: 1fr;
    }

    .partner-page .partner-form {
        padding: 25px;
    }

}


@media (max-width: 480px) {

    .partner-page .partner-hero-bottom {
        grid-template-columns: 1fr;
    }

    .partner-page .partner-process {
        grid-template-columns: 1fr;
    }

    .partner-page .partner-hero h1 {
        font-size: 41px;
    }

}

/* ══════════════════════════════════════════════════════════
   MARCA / BRAND CENTER (pages/Marca.html)
   padrão visual b2c — cores oficiais preservadas
══════════════════════════════════════════════════════════ */
.brand-page {
    --galactix-blue: #1C9FDA;
    --galactix-black: #1D1D1B;
    --galactix-dark: #060913;
    --galactix-dark-2: #0b0f19;
    --galactix-white: #ffffff;
    --galactix-bg: #f8fafc;
    --galactix-text: #0f172a;
    --galactix-muted: #64748b;
    --galactix-border: #e2e8f0;
    --galactix-danger: #ef4444;
    --brand-container: 1180px;

    display: block;
    overflow: hidden;
    margin: 0;
    font-family: "Inter", sans-serif;
    color: var(--galactix-text);
    background: var(--galactix-white);
    line-height: 1.6;
}
.brand-page * {
    box-sizing: border-box;
}
.brand-page a {
    text-decoration: none;
}

.brand-page .brand-container {
    width:
        min(
            calc(100% - 48px),
            var(--brand-container)
        );

    margin:
        0 auto;
}


/* =========================================================
   HERO
========================================================= */

.brand-page .brand-hero {
    min-height: 790px;

    position: relative;
    overflow: hidden;

    color: white;

    background:
        radial-gradient(
            circle at 78% 40%,
            rgba(28,159,218,.20),
            transparent 32%
        ),
        linear-gradient(
            135deg,
            #050c13 0%,
            #071827 55%,
            #092237 100%
        );
}


.brand-page .brand-hero-grid {
    position: absolute;

    inset: 0;

    opacity: .13;

    background-image:

        linear-gradient(
            rgba(255,255,255,.08) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(255,255,255,.08) 1px,
            transparent 1px
        );

    background-size:
        75px 75px;

    mask-image:
        linear-gradient(
            to bottom,
            black,
            transparent 95%
        );
}


.brand-page .brand-hero-glow {
    width: 650px;
    height: 650px;

    position: absolute;

    right: -200px;
    top: -220px;

    border-radius: 50%;

    background:
        var(--galactix-blue);

    filter:
        blur(210px);

    opacity: .14;
}


.brand-page .brand-hero-content {
    min-height: 660px;

    position: relative;
    z-index: 2;

    display: grid;

    grid-template-columns:
        1.1fr .9fr;

    align-items: center;

    gap: 80px;

    padding-top:0px;
}


.brand-page .brand-eyebrow,
.brand-page .brand-label {
    display: inline-flex;

    align-items: center;

    gap: 10px;

    color:
        var(--galactix-blue);

    font-size: 10px;
    font-weight: 700;

    letter-spacing: 2.7px;
}


.brand-page .brand-eyebrow i {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background:
        var(--galactix-blue);

    box-shadow:
        0 0 12px
        var(--galactix-blue);
}


.brand-page .brand-hero h1 {
    max-width: 760px;

    margin:
        26px 0 0;

    font-family:
        "Poppins",
        sans-serif !important;

    font-size:
        clamp(
            50px,
            6vw,
            82px
        );

    font-weight: 500;

    letter-spacing: -4px;

    line-height: .98;
}


.brand-page .brand-hero h1 span,
.brand-page .brand-section h2 span,
.brand-page .brand-downloads h2 span {
    color:
        var(--galactix-blue);
}


.brand-page .brand-hero-copy > p {
    max-width: 620px;

    margin:
        30px 0 0;

    color: #9babb9;

    font-size: 16px;

    line-height: 1.8;
}


.brand-page .brand-actions {
    display: flex;
    flex-wrap: wrap;

    gap: 12px;

    margin-top: 38px;
}


.brand-page .brand-btn {
    min-height: 54px;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 28px;

    padding:
        0 24px;

    border-radius: 4px;

    font-size: 11px;

    font-weight: 600;

    transition: .25s ease;
}


.brand-page .brand-btn-primary {
    color: #00131c;

    background:
        var(--galactix-blue);
}


.brand-page .brand-btn-primary:hover {
    transform:
        translateY(-2px);

    box-shadow:
        0 14px 40px
        rgba(28,159,218,.22);
}


.brand-page .brand-btn-outline {
    color: white;

    border:
        1px solid
        rgba(255,255,255,.17);

    background:
        rgba(255,255,255,.025);
}


.brand-page .brand-btn-outline:hover {
    background:
        rgba(255,255,255,.07);
}


/* =========================================================
   HERO SYMBOL
========================================================= */

.brand-page .brand-symbol-stage {
    width: 430px;
    height: 430px;

    position: relative;

    margin: auto;

    display: flex;

    align-items: center;
    justify-content: center;
}


.brand-page .symbol-orbit {
    position: absolute;

    border:
        1px solid
        rgba(28,159,218,.18);

    border-radius: 50%;
}


.brand-page .orbit-a {
    width: 420px;
    height: 420px;
}


.brand-page .orbit-b {
    width: 315px;
    height: 315px;

    border-style: dashed;
}


.brand-page .orbit-c {
    width: 215px;
    height: 215px;

    border-color:
        rgba(255,255,255,.12);
}


.brand-page .brand-hexagon {
    width: 145px;
    height: 165px;

    position: relative;

    display: flex;

    align-items: center;
    justify-content: center;

    background:
        var(--galactix-blue);

    clip-path:
        polygon(
            25% 6%,
            75% 6%,
            100% 25%,
            100% 75%,
            75% 94%,
            25% 94%,
            0 75%,
            0 25%
        );

    filter:
        drop-shadow(
            0 0 35px
            rgba(28,159,218,.35)
        );
}


.brand-page .brand-hexagon-inner {
    width: 105px;
    height: 120px;

    display: flex;

    align-items: center;
    justify-content: center;

    background:
        #071827;

    color:
        var(--galactix-blue);

    font-family:
        "Poppins",
        sans-serif !important;

    font-size: 50px;
    font-weight: 600;

    clip-path:
        polygon(
            25% 6%,
            75% 6%,
            100% 25%,
            100% 75%,
            75% 94%,
            25% 94%,
            0 75%,
            0 25%
        );
}


.brand-page .brand-node {
    position: absolute;

    padding:
        7px 10px;

    border:
        1px solid
        rgba(255,255,255,.1);

    color: #6e8496;

    background:
        #071827;

    font-size: 7px;

    letter-spacing: 1.3px;
}


.brand-page .node-a {
    top: 20px;
}


.brand-page .node-b {
    right: 0;
    top: 190px;
}


.brand-page .node-c {
    bottom: 30px;
}


.brand-page .node-d {
    left: 0;
    top: 190px;
}


/* =========================================================
   HERO FOOTER
========================================================= */

.brand-page .brand-hero-footer {
    position: relative;
    z-index: 3;

    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    border-top:
        1px solid
        rgba(255,255,255,.08);
}


.brand-page .brand-hero-footer div {
    padding:
        25px 0;
}


.brand-page .brand-hero-footer span {
    margin-right: 12px;

    color:
        var(--galactix-blue);

    font-size: 8px;
}


.brand-page .brand-hero-footer strong {
    color: #8ca0b1;

    font-size: 8px;

    letter-spacing: 1.7px;
}


/* =========================================================
   NAV
========================================================= */

.brand-page .brand-navigation {
    position: sticky;

    top: 0;

    z-index: 20;

    background:
        rgba(255,255,255,.94);

    border-bottom:
        1px solid
        var(--galactix-border);

    backdrop-filter:
        blur(15px);
}


.brand-page .brand-navigation-inner {
    min-height: 65px;

    display: flex;

    align-items: center;

    gap: 32px;

    overflow-x: auto;
}


.brand-page .brand-navigation a {
    flex: none;

    color:
        var(--galactix-muted);

    font-size: 10px;

    font-weight: 600;

    transition: .2s ease;
}


.brand-page .brand-navigation a:hover {
    color:
        var(--galactix-blue);
}


/* =========================================================
   GENERIC SECTIONS
========================================================= */

.brand-page .brand-section {
    padding:
        40px 0;
}


.brand-page .brand-section-header {
    display: grid;

    grid-template-columns:
        1fr 420px;

    align-items: end;

    gap: 80px;

    margin-bottom: 65px;
}


.brand-page .brand-section h2,
.brand-page .brand-downloads h2 {
    margin:
        18px 0 0;

    font-family:
        "Poppins",
        sans-serif !important;

    font-size:
        clamp(
            38px,
            4vw,
            58px
        );

    font-weight: 500;

    letter-spacing: -2.6px;

    line-height: 1.05;
}


.brand-page .brand-section-header > p {
    margin: 0;

    color:
        var(--galactix-muted);

    font-size: 13px;

    line-height: 1.8;
}


.brand-page .brand-small-label {
    color:
        var(--galactix-blue);

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 1.7px;
}


/* =========================================================
   CONCEPT
========================================================= */

.brand-page .brand-concept {
    background:
        var(--galactix-bg);
}


.brand-page .concept-grid {
    display: grid;

    grid-template-columns:
        repeat(3, 1fr);

    gap: 1px;

    background:
        var(--galactix-border);

    border:
        1px solid
        var(--galactix-border);
}


.brand-page .concept-card {
    min-height: 490px;

    position: relative;

    display: flex;

    flex-direction: column;

    padding: 35px;

    background:
        white;
}


.brand-page .concept-card.concept-dark {
    color: white;

    background:
        var(--galactix-black);
}


.brand-page .concept-number {
    color: #9aa5ae;

    font-size: 9px;
}


.brand-page .concept-symbol,
.brand-page .concept-letter,
.brand-page .concept-network {
    height: 175px;

    display: flex;

    align-items: center;

    color:
        var(--galactix-blue);
}


.brand-page .concept-symbol span {
    font-size: 90px;
}


.brand-page .concept-letter {
    font-family:
        "Poppins" !important;

    font-size: 95px;

    font-weight: 600;
}


.brand-page .concept-network {
    position: relative;
}


.brand-page .concept-network i {
    width: 9px;
    height: 9px;

    position: absolute;

    border-radius: 50%;

    background:
        var(--galactix-blue);

    box-shadow:
        0 0 12px
        rgba(28,159,218,.5);
}


.brand-page .concept-network i:nth-child(1) {
    left: 20%;
    top: 30%;
}


.brand-page .concept-network i:nth-child(2) {
    left: 55%;
    top: 20%;
}


.brand-page .concept-network i:nth-child(3) {
    left: 70%;
    top: 60%;
}


.brand-page .concept-network i:nth-child(4) {
    left: 35%;
    top: 70%;
}


.brand-page .concept-content h3 {
    margin:
        13px 0 0;

    font-family:
        "Poppins" !important;

    font-size: 24px;

    font-weight: 500;

    line-height: 1.3;
}


.brand-page .concept-content p {
    color:
        var(--galactix-muted);

    font-size: 11px;

    line-height: 1.8;
}


.brand-page .concept-dark .concept-content p {
    color: #798793;
}


/* =========================================================
   LOGO
========================================================= */

.brand-page .logo-section {
    background: white;
}


.brand-page .logo-showcase {
    min-height: 460px;

    display: grid;

    grid-template-columns:
        1.4fr .6fr;

    border:
        1px solid
        var(--galactix-border);
}


.brand-page .logo-primary {
    position: relative;

    display: flex;

    align-items: center;
    justify-content: center;

    background:
        #f7f8f9;
}


.brand-page .logo-version {
    position: absolute;

    left: 25px;
    top: 25px;

    color: #89949d;

    font-size: 8px;

    letter-spacing: 1.4px;
}


.brand-page .logo-placeholder,
.brand-page .fake-logo {
    display: flex;

    align-items: center;
}


.brand-page .logo-placeholder-symbol,
.brand-page .fake-logo i,
.brand-page .symbol-only {
    display: flex;

    align-items: center;
    justify-content: center;

    color: white;

    background:
        var(--galactix-blue);

    font-style: normal;

    font-weight: 700;
}


.brand-page .logo-placeholder-symbol {
    width: 80px;
    height: 80px;

    margin-right: 15px;

    font-size: 32px;
}


.brand-page .logo-placeholder strong {
    color:
        var(--galactix-black);

    font-family:
        "Poppins" !important;

    font-size: 55px;

    font-weight: 500;
}


.brand-page .logo-placeholder sup {
    color:
        var(--galactix-black);
}


.brand-page .logo-description {
    padding: 50px;

    color: white;

    background:
        var(--galactix-black);
}


.brand-page .logo-description > span {
    color:
        var(--galactix-blue);

    font-size: 8px;

    letter-spacing: 1.6px;
}


.brand-page .logo-description h3 {
    margin:
        70px 0 0;

    font-family:
        "Poppins" !important;

    font-size: 28px;

    font-weight: 500;

    line-height: 1.25;
}


.brand-page .logo-description p {
    color: #929292;

    font-size: 11px;

    line-height: 1.8;
}


.brand-page .brand-subsection-title {
    margin:
        75px 0 25px;

    display: flex;

    justify-content: space-between;

    gap: 30px;
}


.brand-page .brand-subsection-title span {
    color:
        var(--galactix-blue);

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 1.6px;
}


.brand-page .brand-subsection-title p {
    max-width: 400px;

    margin: 0;

    color:
        var(--galactix-muted);

    font-size: 11px;
}


.brand-page .logo-versions {
    display: grid;

    grid-template-columns:
        repeat(3, 1fr);

    gap: 1px;

    background:
        var(--galactix-border);

    border:
        1px solid
        var(--galactix-border);
}


.brand-page .logo-versions article {
    background: white;
}


.brand-page .logo-versions article > span {
    display: block;

    padding: 20px;

    color: #8c969e;

    font-size: 8px;
}


.brand-page .version-preview {
    min-height: 230px;

    display: flex;

    align-items: center;
    justify-content: center;
}


.brand-page .fake-logo {
    gap: 8px;
}


.brand-page .fake-logo i {
    width: 42px;
    height: 42px;
}


.brand-page .fake-logo strong {
    color:
        var(--galactix-black);

    font-family:
        "Poppins" !important;

    font-size: 26px;

    font-weight: 500;
}


.brand-page .fake-logo.vertical {
    flex-direction: column;
}


.brand-page .symbol-only {
    width: 75px;
    height: 75px;

    font-size: 30px;
}


/* =========================================================
   COLORS
========================================================= */

.brand-page .colors-section {
    color: white;

    background:
        #07131f;
}


.brand-page .colors-section .brand-section-header > p {
    color: #8091a0;
}


.brand-page .color-grid {
    display: grid;

    grid-template-columns:
        1fr 1fr;

    min-height: 500px;
}


.brand-page .color-card {
    padding: 45px;

    display: flex;

    flex-direction: column;

    justify-content: space-between;
}


.brand-page .color-blue {
    background:
        #1C9FDA;
}


.brand-page .color-black {
    background:
        #1D1D1B;
}


.brand-page .color-name span {
    display: block;

    margin-bottom: 10px;

    font-size: 8px;

    letter-spacing: 1.6px;

    opacity: .7;
}


.brand-page .color-name strong {
    font-family:
        "Poppins" !important;

    font-size: 34px;

    font-weight: 500;
}


.brand-page .color-values {
    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 25px;
}


.brand-page .color-values span {
    display: block;

    margin-bottom: 7px;

    font-size: 7px;

    letter-spacing: 1.4px;

    opacity: .65;
}


.brand-page .color-values strong,
.brand-page .color-values button {
    color: white;

    font-family:
        "Inter" !important;

    font-size: 11px;

    font-weight: 600;
}


.brand-page .color-values button {
    padding: 0;

    border: 0;

    cursor: pointer;

    background: none;
}


.brand-page .color-guidance {
    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 1px;

    margin-top: 1px;

    background:
        rgba(255,255,255,.08);
}


.brand-page .color-guidance > div {
    padding: 35px;

    background:
        #0a1926;
}


.brand-page .color-guidance span {
    color:
        var(--galactix-blue);

    font-size: 8px;

    letter-spacing: 1.5px;
}


.brand-page .color-guidance h3 {
    margin:
        12px 0 0;

    font-family:
        "Poppins" !important;

    font-size: 20px;

    font-weight: 500;
}


.brand-page .color-guidance p {
    max-width: 400px;

    color: #718291;

    font-size: 10px;

    line-height: 1.7;
}


/* =========================================================
   TYPOGRAPHY
========================================================= */

.brand-page .typography-section {
    background:
        var(--galactix-bg);
}


.brand-page .font-showcase {
    min-height: 300px;

    display: grid;

    grid-template-columns:
        1fr .55fr 1fr;

    align-items: center;

    gap: 40px;

    padding:
        45px 0;

    border-top:
        1px solid
        var(--galactix-border);
}


.brand-page .font-showcase:last-of-type {
    border-bottom:
        1px solid
        var(--galactix-border);
}


.brand-page .font-info > span {
    color:
        var(--galactix-blue);

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 1.5px;
}


.brand-page .font-info h3 {
    margin:
        12px 0;

    font-family:
        "Poppins" !important;

    font-size: 38px;

    font-weight: 500;
}


.brand-page .font-info p {
    max-width: 350px;

    color:
        var(--galactix-muted);

    font-size: 11px;

    line-height: 1.7;
}


.brand-page .font-example {
    font-size: 95px;

    line-height: 1;
}


.brand-page .conthrax-example {
    font-family:
        "Conthrax",
        "Poppins",
        sans-serif !important;
}


.brand-page .poppins-example {
    font-family:
        "Poppins" !important;
}


.brand-page .font-alphabet {
    font-family:
        "Conthrax",
        "Poppins" !important;

    font-size: 18px;

    letter-spacing: 2px;

    line-height: 1.8;
}


.brand-page .text-fonts {
    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 1px;

    margin-top: 60px;

    background:
        var(--galactix-border);
}


.brand-page .text-fonts article {
    padding: 40px;

    background: white;
}


.brand-page .text-fonts article > span {
    color:
        var(--galactix-blue);

    font-size: 8px;

    letter-spacing: 1.5px;
}


.brand-page .text-fonts h3 {
    margin:
        10px 0;

    font-size: 25px;
}


.brand-page .text-fonts p {
    color:
        var(--galactix-muted);

    font-size: 11px;
}


.brand-page .text-font-demo {
    margin-top: 35px;

    font-size: 25px;
}


.brand-page .inter-demo {
    font-family:
        "Inter" !important;
}


.brand-page .roboto-demo {
    font-family:
        "Roboto" !important;
}


/* =========================================================
   PROTECTION
========================================================= */

.brand-page .protection-section {
    background: white;
}


.brand-page .protection-layout {
    display: grid;

    grid-template-columns:
        .8fr 1.2fr;

    align-items: center;

    gap: 100px;
}


.brand-page .protection-layout p {
    max-width: 470px;

    color:
        var(--galactix-muted);

    font-size: 12px;

    line-height: 1.8;
}


.brand-page .protection-demo {
    min-height: 500px;

    position: relative;

    display: flex;

    align-items: center;
    justify-content: center;

    background:
        #f6f8f9;

    border:
        1px solid
        var(--galactix-border);
}


.brand-page .protection-box {
    width: 65%;
    height: 45%;

    display: flex;

    align-items: center;
    justify-content: center;

    border:
        1px dashed
        var(--galactix-blue);
}


.brand-page .protection-measure {
    position: absolute;

    color:
        var(--galactix-blue);

    font-size: 10px;

    font-weight: 700;
}


.brand-page .protection-measure.top {
    top: 20%;
}


.brand-page .protection-measure.bottom {
    bottom: 20%;
}


.brand-page .protection-measure.left {
    left: 12%;
    top: 50%;
}


.brand-page .protection-measure.right {
    right: 12%;
    top: 50%;
}


/* =========================================================
   BACKGROUNDS
========================================================= */

.brand-page .backgrounds-section {
    background:
        var(--galactix-bg);
}


.brand-page .background-grid {
    display: grid;

    grid-template-columns:
        repeat(3, 1fr);
}


.brand-page .background-grid article {
    min-height: 350px;

    position: relative;

    display: flex;

    align-items: center;
    justify-content: center;
}


.brand-page .background-grid article > span {
    position: absolute;

    left: 25px;
    top: 25px;

    font-size: 8px;

    letter-spacing: 1.5px;
}


.brand-page .bg-white {
    background: white;
}


.brand-page .bg-black {
    color: white;

    background:
        var(--galactix-black);
}


.brand-page .bg-blue {
    color: white;

    background:
        var(--galactix-blue);
}


.brand-page .negative strong,
.brand-page .monochrome strong {
    color: white;
}


.brand-page .negative i {
    color:
        var(--galactix-black);

    background: white;
}


.brand-page .monochrome i {
    color:
        var(--galactix-blue);

    background: white;
}


/* =========================================================
   INCORRECT
========================================================= */

.brand-page .incorrect-section {
    background: white;
}


.brand-page .incorrect-grid {
    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    gap: 1px;

    background:
        var(--galactix-border);
}


.brand-page .incorrect-grid article {
    min-height: 300px;

    position: relative;

    display: flex;

    flex-direction: column;

    align-items: center;
    justify-content: center;

    padding: 25px;

    background:
        #f8f9fa;
}


.brand-page .incorrect-x {
    position: absolute;

    right: 20px;
    top: 15px;

    color:
        var(--galactix-danger);

    font-size: 25px;
}


.brand-page .incorrect-demo {
    display: flex;

    align-items: center;

    gap: 5px;
}


.brand-page .incorrect-demo i {
    width: 35px;
    height: 35px;

    display: flex;

    align-items: center;
    justify-content: center;

    color: white;

    background:
        var(--galactix-blue);

    font-style: normal;
}


.brand-page .incorrect-demo strong {
    font-family:
        "Poppins" !important;

    font-size: 20px;
}


.brand-page .stretched {
    transform:
        scaleX(1.4);
}


.brand-page .wrong-color i {
    background:
        #ed2d8d;
}


.brand-page .wrong-color strong {
    color:
        #ed2d8d;
}


.brand-page .rotated {
    transform:
        rotate(-15deg);
}


.brand-page .wrong-font strong {
    font-family:
        Georgia,
        serif;
}


.brand-page .incorrect-grid p {
    margin-top: 45px;

    color:
        var(--galactix-muted);

    font-size: 9px;

    text-align: center;
}


/* =========================================================
   DOWNLOADS
========================================================= */

.brand-page .brand-downloads {
    position: relative;
    overflow: hidden;

    padding:
        130px 0 70px;

    color: white;

    background:
        linear-gradient(
            135deg,
            #050d15,
            #071c2c
        );
}


.brand-page .brand-download-glow {
    width: 600px;
    height: 600px;

    position: absolute;

    right: -300px;
    top: -200px;

    border-radius: 50%;

    background:
        var(--galactix-blue);

    filter:
        blur(220px);

    opacity: .13;
}


.brand-page .downloads-heading {
    max-width: 700px;

    position: relative;

    z-index: 2;
}


.brand-page .downloads-heading p {
    max-width: 500px;

    color: #8294a2;

    font-size: 13px;

    line-height: 1.8;
}


.brand-page .download-grid {
    position: relative;
    z-index: 2;

    display: grid;

    grid-template-columns:
        repeat(3, 1fr);

    gap: 1px;

    margin-top: 70px;

    background:
        rgba(255,255,255,.1);
}


.brand-page .download-card {
    min-height: 180px;

    display: flex;

    align-items: flex-end;
    justify-content: space-between;

    padding: 30px;

    color: white;

    background:
        #0a1b29;

    transition: .25s ease;
}


.brand-page .download-card:hover {
    background:
        #0d2639;
}


.brand-page .download-card span {
    color:
        var(--galactix-blue);

    font-size: 7px;

    letter-spacing: 1.4px;
}


.brand-page .download-card h3 {
    margin:
        8px 0 3px;

    font-family:
        "Poppins" !important;

    font-size: 18px;

    font-weight: 500;
}


.brand-page .download-card p {
    margin: 0;

    color: #617383;

    font-size: 8px;
}


.brand-page .download-card > strong {
    color:
        var(--galactix-blue);

    font-size: 22px;
}


.brand-page .download-footer {
    position: relative;
    z-index: 2;

    display: flex;

    justify-content: space-between;

    gap: 50px;

    margin-top: 80px;

    padding-top: 35px;

    border-top:
        1px solid
        rgba(255,255,255,.08);
}


.brand-page .download-footer span {
    display: block;

    margin-bottom: 7px;

    color:
        var(--galactix-blue);

    font-size: 8px;
}


.brand-page .download-footer strong {
    color: #647685;

    font-size: 7px;

    letter-spacing: 1.3px;
}


.brand-page .download-footer p {
    max-width: 450px;

    margin: 0;

    color: #566877;

    font-size: 9px;

    line-height: 1.7;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1050px) {

    .brand-page .brand-hero-content {
        grid-template-columns: 1fr;

        padding:
            140px 0
            90px;
    }

    .brand-page .brand-symbol-stage {
        display: none;
    }

    .brand-page .brand-section-header,
    .brand-page .protection-layout {
        grid-template-columns: 1fr;

        gap: 50px;
    }

    .brand-page .concept-grid {
        grid-template-columns: 1fr 1fr;
    }

    .brand-page .logo-showcase {
        grid-template-columns: 1fr;
    }

    .brand-page .font-showcase {
        grid-template-columns:
            1fr 1fr;
    }

    .brand-page .font-alphabet {
        grid-column:
            1 / -1;
    }

    .brand-page .incorrect-grid {
        grid-template-columns:
            1fr 1fr;
    }

}


@media (max-width: 720px) {

    .brand-page .brand-container {
        width:
            min(
                calc(100% - 32px),
                var(--brand-container)
            );
    }

    .brand-page .brand-section {
        padding:
            80px 0;
    }

    .brand-page .brand-hero {
        min-height: auto;
    }

    .brand-page .brand-hero h1 {
        font-size: 48px;

        letter-spacing: -2.5px;
    }

    .brand-page .brand-hero-footer {
        grid-template-columns:
            1fr 1fr;
    }

    .brand-page .concept-grid,
    .brand-page .logo-versions,
    .brand-page .color-grid,
    .brand-page .color-guidance,
    .brand-page .text-fonts,
    .brand-page .background-grid,
    .brand-page .incorrect-grid,
    .brand-page .download-grid {
        grid-template-columns: 1fr;
    }

    .brand-page .font-showcase {
        grid-template-columns: 1fr;
    }

    .brand-page .font-alphabet {
        grid-column: auto;
    }

    .brand-page .logo-placeholder strong {
        font-size: 35px;
    }

    .brand-page .logo-placeholder-symbol {
        width: 55px;
        height: 55px;
    }

    .brand-page .protection-demo {
        min-height: 350px;
    }

    .brand-page .download-footer {
        flex-direction: column;
    }

}


@media (max-width: 480px) {

    .brand-page .brand-hero h1 {
        font-size: 41px;
    }

    .brand-page .brand-hero-footer {
        grid-template-columns: 1fr;
    }

    .brand-page .brand-actions {
        flex-direction: column;
    }

    .brand-page .brand-btn {
        width: 100%;
    }

}


/* =========================================================
   PROTECAO E PRIVACIDADE DE DADOS
========================================================= */

.privacy-page {
    --gx-blue: #00a0e3;
    --gx-black: #060913;
    --gx-dark: #060913;
    --gx-dark-2: #0b0f19;
    --gx-dark-3: #0f172a;
    --gx-white: #ffffff;
    --gx-bg: #f8fafc;
    --gx-text: #0f172a;
    --gx-muted: #64748b;
    --gx-border: #e2e8f0;
    --privacy-container: 1180px;

    display: block;
    overflow: hidden;
    margin: 0;
    font-family: "Inter", sans-serif;
    color: var(--gx-text);
    background: var(--gx-white);
    line-height: 1.6;
}
.privacy-page * {
    box-sizing: border-box;
}
.privacy-page a {
    text-decoration: none;
}
.privacy-page .privacy-container {
    width:
        min(
            calc(100% - 48px),
            var(--privacy-container)
        );

    margin: 0 auto;
}


/* =========================================================
   HERO
========================================================= */

.privacy-page .privacy-hero {
    min-height: 800px;

    position: relative;

    overflow: hidden;

    color: white;

    background:
        radial-gradient(
            circle at 75% 35%,
            rgba(28,159,218,.18),
            transparent 31%
        ),
        linear-gradient(
            135deg,
            #020b14,
            #04182a 58%,
            #06233b
        );
}


.privacy-page .privacy-grid-bg {
    position: absolute;

    inset: 0;

    opacity: .11;

    background-image:
        linear-gradient(
            rgba(255,255,255,.08) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255,255,255,.08) 1px,
            transparent 1px
        );

    background-size:
        72px 72px;

    mask-image:
        linear-gradient(
            to bottom,
            black,
            transparent
        );
}


.privacy-page .privacy-glow {
    position: absolute;

    border-radius: 50%;

    filter: blur(190px);
}


.privacy-page .privacy-glow-one {
    width: 500px;
    height: 500px;

    right: -180px;
    top: -170px;

    background:
        var(--gx-blue);

    opacity: .15;
}


.privacy-page .privacy-glow-two {
    width: 400px;
    height: 400px;

    left: 30%;
    bottom: -300px;

    background:
        var(--gx-blue);

    opacity: .08;
}


.privacy-page .privacy-hero-layout {
    min-height: 670px;

    position: relative;
    z-index: 2;

    display: grid;

    grid-template-columns:
        1.1fr .9fr;

    align-items: center;

    gap: 80px;

    padding-top:0px;
}


.privacy-page .privacy-eyebrow,
.privacy-page .privacy-label {
    display: inline-flex;

    align-items: center;

    gap: 10px;

    color:
        var(--gx-blue);

    font-size: 10px;
    font-weight: 700;

    letter-spacing: 2.5px;
}


.privacy-page .privacy-eyebrow i {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background:
        var(--gx-blue);

    box-shadow:
        0 0 12px
        var(--gx-blue);
}


.privacy-page .privacy-hero h1 {
    max-width: 780px;

    margin:
        26px 0 0;

    font-family:
        "Poppins",
        sans-serif !important;

    font-size:
        clamp(
            50px,
            5.6vw,
            78px
        );

    font-weight: 500;

    letter-spacing: -4px;

    line-height: 1;
}


.privacy-page .privacy-hero h1 span,
.privacy-page .privacy-section h2 span,
.privacy-page .privacy-contact h2 span {
    color:
        var(--gx-blue);
}


.privacy-page .privacy-hero-content > p {
    max-width: 640px;

    margin:
        30px 0 0;

    color: #9bafc0;

    font-size: 16px;

    line-height: 1.8;
}


.privacy-page .privacy-hero-actions {
    display: flex;

    flex-wrap: wrap;

    gap: 12px;

    margin-top: 38px;
}


.privacy-page .privacy-btn {
    min-height: 54px;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 30px;

    padding:
        0 25px;

    border-radius: 4px;

    font-size: 11px;

    font-weight: 600;

    transition: .25s ease;
}


.privacy-page .privacy-btn-primary {
    color: #00151f;

    background:
        var(--gx-blue);
}


.privacy-page .privacy-btn-primary:hover {
    transform:
        translateY(-2px);

    box-shadow:
        0 15px 45px
        rgba(28,159,218,.2);
}


.privacy-page .privacy-btn-outline {
    color: white;

    border:
        1px solid
        rgba(255,255,255,.16);

    background:
        rgba(255,255,255,.025);
}


.privacy-page .privacy-btn-outline:hover {
    background:
        rgba(255,255,255,.07);
}


/* =========================================================
   HERO DATA VISUAL
========================================================= */

.privacy-page .privacy-data-visual {
    width: 430px;
    height: 430px;

    position: relative;

    margin: auto;

    display: flex;

    align-items: center;
    justify-content: center;
}


.privacy-page .data-orbit {
    position: absolute;

    border-radius: 50%;

    border:
        1px solid
        rgba(28,159,218,.17);
}


.privacy-page .orbit-01 {
    width: 420px;
    height: 420px;
}


.privacy-page .orbit-02 {
    width: 310px;
    height: 310px;

    border-style: dashed;
}


.privacy-page .orbit-03 {
    width: 205px;
    height: 205px;

    border-color:
        rgba(255,255,255,.12);
}


.privacy-page .data-core {
    width: 135px;
    height: 135px;

    position: relative;
    z-index: 3;

    display: flex;

    align-items: center;
    justify-content: center;

    transform:
        rotate(45deg);

    border:
        1px solid
        rgba(28,159,218,.45);

    background:
        #061a2d;

    box-shadow:
        0 0 70px
        rgba(28,159,218,.14);
}


.privacy-page .data-core div {
    text-align: center;

    transform:
        rotate(-45deg);
}


.privacy-page .data-core strong {
    display: block;

    color:
        var(--gx-blue);

    font-family:
        "Poppins" !important;

    font-size: 40px;
}


.privacy-page .data-core span {
    color: #667f93;

    font-size: 7px;

    letter-spacing: 2px;
}


.privacy-page .data-node {
    position: absolute;

    z-index: 4;

    padding:
        8px 11px;

    border:
        1px solid
        rgba(255,255,255,.1);

    color: #8095a7;

    background:
        #06192b;

    font-size: 7px;

    letter-spacing: 1.3px;
}


.privacy-page .data-node span {
    margin-right: 6px;

    color:
        var(--gx-blue);
}


.privacy-page .node-person {
    top: 22px;
}


.privacy-page .node-data {
    right: 0;
    top: 190px;
}


.privacy-page .node-security {
    bottom: 30px;
}


.privacy-page .node-privacy {
    left: 0;
    top: 190px;
}


.privacy-page .data-pulse {
    width: 7px;
    height: 7px;

    position: absolute;

    border-radius: 50%;

    background:
        var(--gx-blue);

    box-shadow:
        0 0 15px
        var(--gx-blue);
}


.privacy-page .pulse-01 {
    left: 70px;
    top: 90px;
}


.privacy-page .pulse-02 {
    right: 80px;
    bottom: 90px;
}


.privacy-page .pulse-03 {
    right: 100px;
    top: 85px;
}


/* =========================================================
   HERO FOOTER
========================================================= */

.privacy-page .privacy-hero-footer {
    position: relative;
    z-index: 3;

    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    border-top:
        1px solid
        rgba(255,255,255,.08);
}


.privacy-page .privacy-hero-footer div {
    padding:
        25px 0;
}


.privacy-page .privacy-hero-footer span {
    display: block;

    margin-bottom: 7px;

    color:
        var(--gx-blue);

    font-size: 7px;
}


.privacy-page .privacy-hero-footer strong {
    display: block;

    color: #b7c4cf;

    font-size: 8px;

    letter-spacing: 1.5px;
}


.privacy-page .privacy-hero-footer small {
    display: block;

    margin-top: 5px;

    color: #50677a;

    font-size: 8px;
}


/* =========================================================
   NAV
========================================================= */

.privacy-page .privacy-navigation {
    position: sticky;

    top: 0;

    z-index: 30;

    border-bottom:
        1px solid
        var(--gx-border);

    background:
        rgba(255,255,255,.94);

    backdrop-filter:
        blur(15px);
}


.privacy-page .privacy-navigation-inner {
    min-height: 64px;

    display: flex;

    align-items: center;

    gap: 29px;

    overflow-x: auto;
}


.privacy-page .privacy-navigation a {
    flex: none;

    color:
        var(--gx-muted);

    font-size: 9px;

    font-weight: 600;

    transition: .2s ease;
}


.privacy-page .privacy-navigation a:hover {
    color:
        var(--gx-blue);
}


/* =========================================================
   GENERIC
========================================================= */

.privacy-page .privacy-section {
    padding:
        40px 0;
}


.privacy-page .privacy-section h2,
.privacy-page .privacy-contact h2 {
    margin:
        18px 0 0;

    font-family:
        "Poppins" !important;

    font-size:
        clamp(
            38px,
            4.2vw,
            58px
        );

    font-weight: 500;

    letter-spacing: -2.8px;

    line-height: 1.05;
}


.privacy-page .privacy-section-header {
    display: grid;

    grid-template-columns:
        1fr 420px;

    align-items: end;

    gap: 80px;

    margin-bottom: 65px;
}


.privacy-page .privacy-section-header > p {
    margin: 0;

    color:
        var(--gx-muted);

    font-size: 13px;

    line-height: 1.8;
}


/* =========================================================
   COMMITMENT
========================================================= */

.privacy-page .commitment-section {
    background:
        white;
}


.privacy-page .commitment-layout {
    display: grid;

    grid-template-columns:
        .9fr 1.1fr;

    gap: 130px;
}


.privacy-page .commitment-content {
    padding-top: 35px;
}


.privacy-page .commitment-content > p {
    color:
        var(--gx-muted);

    font-size: 13px;

    line-height: 1.9;
}


.privacy-page .commitment-content .commitment-lead {
    color:
        var(--gx-text);

    font-family:
        "Poppins" !important;

    font-size: 22px;

    line-height: 1.5;
}


.privacy-page .commitment-principles {
    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 1px;

    margin-top: 45px;

    border:
        1px solid
        var(--gx-border);

    background:
        var(--gx-border);
}


.privacy-page .commitment-principles div {
    padding: 25px;

    background:
        white;
}


.privacy-page .commitment-principles span {
    display: block;

    margin-bottom: 25px;

    color:
        var(--gx-blue);

    font-size: 8px;
}


.privacy-page .commitment-principles strong {
    font-family:
        "Poppins" !important;

    font-size: 13px;

    font-weight: 500;
}


/* =========================================================
   LGPD
========================================================= */

.privacy-page .lgpd-section {
    color: white;

    background:
        var(--gx-black);
}


.privacy-page .lgpd-layout {
    display: grid;

    grid-template-columns:
        .8fr 1.2fr;

    align-items: center;

    gap: 100px;
}


.privacy-page .lgpd-number {
    min-height: 400px;

    display: flex;

    flex-direction: column;

    align-items: center;
    justify-content: center;

    border:
        1px solid
        rgba(255,255,255,.1);

    background:
        linear-gradient(
            145deg,
            rgba(28,159,218,.08),
            transparent
        );
}


.privacy-page .lgpd-number span {
    color:
        var(--gx-blue);

    font-size: 13px;

    letter-spacing: 4px;
}


.privacy-page .lgpd-number strong {
    margin:
        10px 0;

    font-family:
        "Poppins" !important;

    font-size:
        clamp(55px, 8vw, 95px);

    font-weight: 400;

    letter-spacing: -5px;
}


.privacy-page .lgpd-number small {
    color: #676765;

    font-size: 8px;

    letter-spacing: 1.5px;
}


.privacy-page .lgpd-content p {
    max-width: 650px;

    color: #8c8c89;

    font-size: 13px;

    line-height: 1.9;
}


.privacy-page .privacy-text-link {
    display: inline-flex;

    gap: 35px;

    margin-top: 20px;

    color:
        var(--gx-blue);

    font-size: 10px;

    font-weight: 600;
}


/* =========================================================
   ROLES
========================================================= */

.privacy-page .roles-section {
    background:
        var(--gx-bg);
}


.privacy-page .roles-grid {
    display: grid;

    grid-template-columns:
        repeat(3, 1fr);

    gap: 1px;

    border:
        1px solid
        var(--gx-border);

    background:
        var(--gx-border);
}


.privacy-page .role-card {
    min-height: 520px;

    padding: 35px;

    display: flex;

    flex-direction: column;

    background:
        white;
}


.privacy-page .role-featured {
    color: white;

    background:
        #071a2a;
}


.privacy-page .role-top {
    display: flex;

    align-items: center;
    justify-content: space-between;
}


.privacy-page .role-top span {
    color:
        var(--gx-blue);

    font-size: 8px;
}


.privacy-page .role-top strong {
    color: #8d99a3;

    font-size: 7px;

    letter-spacing: 1.5px;
}


.privacy-page .role-icon {
    height: 135px;

    display: flex;

    align-items: center;

    color:
        var(--gx-blue);

    font-size: 50px;
}


.privacy-page .role-card h3 {
    margin: 0;

    font-family:
        "Poppins" !important;

    font-size: 24px;

    font-weight: 500;

    line-height: 1.3;
}


.privacy-page .role-card > p {
    color:
        var(--gx-muted);

    font-size: 11px;

    line-height: 1.8;
}


.privacy-page .role-featured > p {
    color: #8194a3;
}


.privacy-page .role-example {
    margin-top: auto;

    padding-top: 25px;

    border-top:
        1px solid
        var(--gx-border);
}


.privacy-page .role-featured .role-example {
    border-color:
        rgba(255,255,255,.1);
}


.privacy-page .role-example span {
    color:
        var(--gx-blue);

    font-size: 7px;

    letter-spacing: 1.2px;
}


.privacy-page .role-example p {
    color: #7b8994;

    font-size: 9px;

    line-height: 1.7;
}


.privacy-page .roles-note {
    max-width: 800px;

    margin:
        25px auto 0;

    color:
        var(--gx-muted);

    font-size: 9px;

    text-align: center;

    line-height: 1.7;
}


/* =========================================================
   DATA USE
========================================================= */

.privacy-page .data-section {
    background:
        white;
}


.privacy-page .data-use-grid {
    display: grid;

    grid-template-columns:
        repeat(3, 1fr);

    gap: 1px;

    border:
        1px solid
        var(--gx-border);

    background:
        var(--gx-border);
}


.privacy-page .data-use-grid article {
    min-height: 270px;

    padding: 30px;

    background:
        white;
}


.privacy-page .data-use-grid article > span {
    color:
        var(--gx-blue);

    font-size: 8px;
}


.privacy-page .data-use-icon {
    margin-top: 45px;

    color:
        var(--gx-blue);

    font-size: 27px;
}


.privacy-page .data-use-grid h3 {
    margin:
        20px 0 0;

    font-family:
        "Poppins" !important;

    font-size: 17px;

    font-weight: 500;
}


.privacy-page .data-use-grid p {
    color:
        var(--gx-muted);

    font-size: 10px;

    line-height: 1.7;
}


/* =========================================================
   PROTECTION
========================================================= */

.privacy-page .protection-section {
    color: white;

    background:
        #041322;
}


.privacy-page .protection-layout {
    display: grid;

    grid-template-columns:
        .8fr 1.2fr;

    gap: 100px;

    align-items: center;
}


.privacy-page .protection-copy p {
    color: #758a9b;

    font-size: 12px;

    line-height: 1.8;
}


.privacy-page .protection-cycle {
    display: grid;

    grid-template-columns:
        repeat(3, 1fr);

    gap: 1px;

    background:
        rgba(255,255,255,.08);
}


.privacy-page .protection-cycle article {
    min-height: 170px;

    padding: 25px;

    background:
        #071a2c;
}


.privacy-page .protection-cycle span {
    color:
        var(--gx-blue);

    font-size: 7px;
}


.privacy-page .protection-cycle article div {
    width: 7px;
    height: 7px;

    margin:
        35px 0 22px;

    border-radius: 50%;

    background:
        var(--gx-blue);

    box-shadow:
        0 0 12px
        var(--gx-blue);
}


.privacy-page .protection-cycle strong {
    font-family:
        "Poppins" !important;

    font-size: 12px;

    font-weight: 500;
}


/* =========================================================
   RIGHTS
========================================================= */

.privacy-page .rights-section {
    background:
        var(--gx-bg);
}


.privacy-page .rights-heading {
    max-width: 700px;

    margin-bottom: 60px;
}


.privacy-page .rights-heading p {
    max-width: 580px;

    color:
        var(--gx-muted);

    font-size: 12px;

    line-height: 1.8;
}


.privacy-page .rights-grid {
    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    gap: 1px;

    border:
        1px solid
        var(--gx-border);

    background:
        var(--gx-border);
}


.privacy-page .rights-grid article {
    min-height: 260px;

    padding: 28px;

    background:
        white;
}


.privacy-page .rights-grid article > span {
    color:
        var(--gx-blue);

    font-size: 8px;
}


.privacy-page .rights-grid h3 {
    margin:
        55px 0 0;

    font-family:
        "Poppins" !important;

    font-size: 15px;

    font-weight: 500;
}


.privacy-page .rights-grid p {
    color:
        var(--gx-muted);

    font-size: 9px;

    line-height: 1.7;
}


.privacy-page .rights-grid .rights-cta {
    color: white;

    background:
        var(--gx-blue);
}


.privacy-page .rights-cta > span {
    color: white !important;

    font-size: 22px !important;
}


.privacy-page .rights-cta h3 {
    color: white;
}


.privacy-page .rights-cta p {
    color:
        rgba(255,255,255,.75);
}


.privacy-page .rights-cta a {
    display: flex;

    justify-content: space-between;

    margin-top: 25px;

    color: white;

    font-size: 9px;

    font-weight: 600;
}


/* =========================================================
   PRODUCTS
========================================================= */

.privacy-page .products-section {
    color: white;

    background:
        #061522;
}


.privacy-page .products-section .privacy-section-header > p {
    color: #768b9a;
}


.privacy-page .products-map {
    display: grid;

    grid-template-columns:
        repeat(3, 1fr);

    gap: 1px;

    background:
        rgba(255,255,255,.08);
}


.privacy-page .products-map article {
    min-height: 180px;

    padding: 30px;

    display: flex;

    flex-direction: column;

    justify-content: flex-end;

    background:
        #081c2c;

    transition:
        .25s ease;
}


.privacy-page .products-map article:hover {
    background:
        #0a253a;
}


.privacy-page .products-map span {
    margin-bottom: auto;

    color:
        var(--gx-blue);

    font-size: 8px;
}


.privacy-page .products-map strong {
    font-family:
        "Poppins" !important;

    font-size: 16px;

    font-weight: 500;
}


.privacy-page .products-map small {
    margin-top: 5px;

    color: #62788a;

    font-size: 7px;

    letter-spacing: 1px;
}


.privacy-page .products-map .product-newton {
    background:
        linear-gradient(
            145deg,
            #0a263b,
            #0c314b
        );
}


.privacy-page .product-notice {
    display: grid;

    grid-template-columns:
        150px 1fr;

    gap: 30px;

    margin-top: 25px;

    padding: 25px;

    border:
        1px solid
        rgba(255,255,255,.08);
}


.privacy-page .product-notice span {
    color:
        var(--gx-blue);

    font-size: 8px;

    letter-spacing: 1.5px;
}


.privacy-page .product-notice p {
    max-width: 800px;

    margin: 0;

    color: #718697;

    font-size: 9px;

    line-height: 1.7;
}


/* =========================================================
   AI
========================================================= */

.privacy-page .ai-section {
    position: relative;

    overflow: hidden;

    background:
        white;
}


.privacy-page .privacy-ai-grid {
    position: absolute;

    right: -100px;
    top: -100px;

    width: 650px;
    height: 650px;

    opacity: .08;

    background-image:
        linear-gradient(
            var(--gx-blue) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            var(--gx-blue) 1px,
            transparent 1px
        );

    background-size:
        50px 50px;

    transform:
        rotate(20deg);
}


.privacy-page .ai-layout {
    position: relative;

    display: grid;

    grid-template-columns:
        .85fr 1.15fr;

    gap: 120px;
}


.privacy-page .ai-copy p {
    max-width: 500px;

    color:
        var(--gx-muted);

    font-size: 12px;

    line-height: 1.9;
}


.privacy-page .ai-principles {
    border-top:
        1px solid
        var(--gx-border);
}


.privacy-page .ai-principles article {
    display: grid;

    grid-template-columns:
        60px 1fr;

    gap: 20px;

    padding:
        25px 0;

    border-bottom:
        1px solid
        var(--gx-border);
}


.privacy-page .ai-principles article > span {
    color:
        var(--gx-blue);

    font-size: 8px;
}


.privacy-page .ai-principles strong {
    font-family:
        "Poppins" !important;

    font-size: 15px;

    font-weight: 500;
}


.privacy-page .ai-principles p {
    margin:
        7px 0 0;

    color:
        var(--gx-muted);

    font-size: 10px;

    line-height: 1.6;
}


/* =========================================================
   CHANNELS
========================================================= */

.privacy-page .channels-section {
    background:
        var(--gx-bg);
}


.privacy-page .channel-intro {
    max-width: 800px;

    margin-bottom: 60px;
}


.privacy-page .channel-grid {
    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 1px;

    background:
        var(--gx-border);
}


.privacy-page .channel-grid article {
    min-height: 400px;

    padding: 45px;

    display: flex;

    flex-direction: column;

    background:
        white;
}


.privacy-page .channel-security {
    color: white;

    background:
        var(--gx-black) !important;
}


.privacy-page .channel-tag {
    color:
        var(--gx-blue);

    font-size: 8px;

    letter-spacing: 1.5px;
}


.privacy-page .channel-grid h3 {
    margin:
        70px 0 0;

    font-family:
        "Poppins" !important;

    font-size: 27px;

    font-weight: 500;

    line-height: 1.3;
}


.privacy-page .channel-grid p {
    max-width: 480px;

    color:
        var(--gx-muted);

    font-size: 11px;

    line-height: 1.8;
}


.privacy-page .channel-security p {
    color: #888886;
}


.privacy-page .channel-grid a {
    display: flex;

    justify-content: space-between;

    margin-top: auto;

    padding-top: 25px;

    border-top:
        1px solid
        var(--gx-border);

    color:
        var(--gx-blue);

    font-size: 9px;

    font-weight: 600;
}


.privacy-page .channel-security a {
    border-color:
        rgba(255,255,255,.1);
}


/* =========================================================
   DOCUMENTS
========================================================= */

.privacy-page .documents-section {
    background:
        white;
}


.privacy-page .documents-list {
    border-top:
        1px solid
        var(--gx-border);
}


.privacy-page .document-item {
    min-height: 105px;

    display: grid;

    grid-template-columns:
        80px 1fr 40px;

    align-items: center;

    border-bottom:
        1px solid
        var(--gx-border);

    color:
        var(--gx-text);

    transition:
        .2s ease;
}


.privacy-page .document-item:hover {
    padding:
        0 15px;

    background:
        var(--gx-bg);
}


.privacy-page .document-item > span {
    color:
        var(--gx-blue);

    font-size: 8px;
}


.privacy-page .document-item strong {
    display: block;

    font-family:
        "Poppins" !important;

    font-size: 15px;

    font-weight: 500;
}


.privacy-page .document-item small {
    display: block;

    margin-top: 5px;

    color:
        var(--gx-muted);

    font-size: 7px;

    letter-spacing: 1px;
}


.privacy-page .document-item b {
    color:
        var(--gx-blue);

    font-weight: 400;
}


/* =========================================================
   FAQ
========================================================= */

.privacy-page .faq-section {
    background:
        var(--gx-bg);
}


.privacy-page .faq-layout {
    display: grid;

    grid-template-columns:
        .7fr 1.3fr;

    gap: 120px;
}


.privacy-page .faq-list {
    border-top:
        1px solid
        var(--gx-border);
}


.privacy-page .faq-list details {
    border-bottom:
        1px solid
        var(--gx-border);
}


.privacy-page .faq-list summary {
    min-height: 80px;

    display: flex;

    align-items: center;
    justify-content: space-between;

    cursor: pointer;

    list-style: none;

    font-family:
        "Poppins" !important;

    font-size: 13px;

    font-weight: 500;
}


.privacy-page .faq-list summary::-webkit-details-marker {
    display: none;
}


.privacy-page .faq-list summary span {
    color:
        var(--gx-blue);

    font-size: 20px;

    font-weight: 300;
}


.privacy-page .faq-list details[open] summary span {
    transform:
        rotate(45deg);
}


.privacy-page .faq-list details p {
    max-width: 700px;

    margin:
        -5px 0 30px;

    color:
        var(--gx-muted);

    font-size: 11px;

    line-height: 1.8;
}


/* =========================================================
   CONTACT
========================================================= */

.privacy-page .privacy-contact {
    position: relative;

    overflow: hidden;

    padding:
        130px 0;

    color: white;

    background:
        linear-gradient(
            135deg,
            #020b13,
            #061c30
        );
}


.privacy-page .privacy-contact-glow {
    width: 550px;
    height: 550px;

    position: absolute;

    left: -250px;
    bottom: -250px;

    border-radius: 50%;

    background:
        var(--gx-blue);

    filter:
        blur(200px);

    opacity: .12;
}


.privacy-page .contact-layout {
    position: relative;
    z-index: 2;

    display: grid;

    grid-template-columns:
        .8fr 1.2fr;

    gap: 100px;
}


.privacy-page .contact-copy > p {
    max-width: 480px;

    color: #8296a7;

    font-size: 13px;

    line-height: 1.8;
}


.privacy-page .contact-warning {
    max-width: 470px;

    margin-top: 50px;

    padding:
        25px;

    border:
        1px solid
        rgba(255,255,255,.1);

    background:
        rgba(255,255,255,.025);
}


.privacy-page .contact-warning span {
    color:
        var(--gx-blue);

    font-size: 8px;

    letter-spacing: 1.4px;
}


.privacy-page .contact-warning p {
    color: #738899;

    font-size: 10px;

    line-height: 1.7;
}


.privacy-page .contact-warning a {
    color:
        var(--gx-blue);

    font-size: 9px;

    font-weight: 600;
}


.privacy-page .privacy-request {
    padding: 45px;

    border:
        1px solid
        rgba(255,255,255,.1);

    background:
        rgba(255,255,255,.025);
}


.privacy-page .request-label {
    color:
        var(--gx-blue);

    font-size: 8px;

    letter-spacing: 1.5px;
}


.privacy-page .privacy-request h3 {
    margin:
        12px 0 35px;

    font-family:
        "Poppins" !important;

    font-size: 25px;

    font-weight: 500;
}


.privacy-page .form-group {
    margin-bottom: 18px;
}


.privacy-page .form-group label {
    display: block;

    margin-bottom: 8px;

    color: #91a2b0;

    font-size: 9px;
}


.privacy-page .form-group input,
.privacy-page .form-group select,
.privacy-page .form-group textarea {
    width: 100%;

    padding:
        15px;

    border:
        1px solid
        rgba(255,255,255,.12);

    outline: none;

    color: white;

    font-family:
        "Inter";

    background:
        rgba(255,255,255,.035);

    transition:
        .2s ease;
}


.privacy-page .form-group input,
.privacy-page .form-group select {
    height: 50px;
}


.privacy-page .form-group textarea {
    resize: vertical;
}


.privacy-page .form-group input:focus,
.privacy-page .form-group select:focus,
.privacy-page .form-group textarea:focus {
    border-color:
        var(--gx-blue);

    background:
        rgba(255,255,255,.055);
}


.privacy-page .form-group input::placeholder,
.privacy-page .form-group textarea::placeholder {
    color: #51677a;
}


.privacy-page .form-group select option {
    color:
        var(--gx-text);

    background: white;
}


.privacy-page .privacy-consent {
    display: flex;

    align-items: flex-start;

    gap: 10px;

    color: #667b8d;

    font-size: 9px;

    line-height: 1.6;
}


.privacy-page .privacy-consent input {
    margin-top: 2px;

    accent-color:
        var(--gx-blue);
}


.privacy-page .privacy-submit {
    width: 100%;
    height: 55px;

    margin-top: 25px;

    display: flex;

    align-items: center;
    justify-content: space-between;

    padding:
        0 20px;

    border: 0;

    cursor: pointer;

    color: #00131d;

    background:
        var(--gx-blue);

    font-family:
        "Inter";

    font-size: 10px;

    font-weight: 700;

    transition:
        .25s ease;
}


.privacy-page .privacy-submit:hover {
    transform:
        translateY(-2px);

    box-shadow:
        0 15px 40px
        rgba(28,159,218,.18);
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1050px) {

    .privacy-page .privacy-hero-layout {
        grid-template-columns: 1fr;

        padding:
            140px 0
            90px;
    }

    .privacy-page .privacy-data-visual {
        display: none;
    }

    .privacy-page .privacy-section-header,
    .privacy-page .commitment-layout,
    .privacy-page .lgpd-layout,
    .privacy-page .protection-layout,
    .privacy-page .ai-layout,
    .privacy-page .faq-layout,
    .privacy-page .contact-layout {
        grid-template-columns: 1fr;

        gap: 60px;
    }

    .privacy-page .rights-grid {
        grid-template-columns:
            repeat(2, 1fr);
    }

}


@media (max-width: 820px) {

    .privacy-page .roles-grid,
    .privacy-page .data-use-grid,
    .privacy-page .products-map {
        grid-template-columns:
            1fr 1fr;
    }

    .privacy-page .privacy-hero-footer {
        grid-template-columns:
            1fr 1fr;
    }

    .privacy-page .protection-cycle {
        grid-template-columns:
            1fr 1fr;
    }

}


@media (max-width: 650px) {

    .privacy-page .privacy-container {
        width:
            min(
                calc(100% - 32px),
                var(--privacy-container)
            );
    }

    .privacy-page .privacy-section,
    .privacy-page .privacy-contact {
        padding:
            80px 0;
    }

    .privacy-page .privacy-hero {
        min-height: auto;
    }

    .privacy-page .privacy-hero h1 {
        font-size: 45px;

        letter-spacing: -2.5px;
    }

    .privacy-page .privacy-hero-actions {
        flex-direction: column;
    }

    .privacy-page .privacy-btn {
        width: 100%;
    }

    .privacy-page .privacy-hero-footer,
    .privacy-page .roles-grid,
    .privacy-page .data-use-grid,
    .privacy-page .rights-grid,
    .privacy-page .products-map,
    .privacy-page .channel-grid,
    .privacy-page .protection-cycle {
        grid-template-columns: 1fr;
    }

    .privacy-page .commitment-principles {
        grid-template-columns: 1fr;
    }

    .privacy-page .product-notice {
        grid-template-columns: 1fr;
    }

    .privacy-page .privacy-request {
        padding: 25px;
    }

    .privacy-page .document-item {
        grid-template-columns:
            45px 1fr 20px;
    }

}


@media (max-width: 430px) {

    .privacy-page .privacy-hero h1 {
        font-size: 39px;
    }

}

/* ══════════════════════════════════════════════════════════════
   ERROR 404 — padrão visual do b2c.html
   (reaproveita .gx-b2c, .b2c-btn, .b2c-btn-primary, .b2c-btn-outline)
══════════════════════════════════════════════════════════════ */
.gx-b2c.error-404 {
    min-height: 560px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 100px 24px;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.gx-b2c.error-404 .error-404__content {
    max-width: 760px;
    margin: 0 auto;
    text-align: center;
}
.gx-b2c.error-404 .error-404__code {
    display: block;
    margin-bottom: 10px;
    font-size: clamp(90px, 6vw, 160px);
    font-weight: 800;
    line-height: .9;
    letter-spacing: -4px;
    background: linear-gradient(135deg, #38bdf8 0%, #00a0e3 50%, #802be2 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #00a0e3;
}
/* Foguete orbitando o 404 */
.gx-b2c.error-404 .error-404__orbit {
    position: relative;
    display: inline-block;
    padding: 0 12px;
    margin: clamp(16px, 3vw, 32px) 0 clamp(16px, 3vw, 32px);
}
.gx-b2c.error-404 .error-404__orbit::before {
    content: "";
    position: absolute;
    top: -22%;
    left: -12%;
    width: 124%;
    height: 144%;
    border: 1px dashed rgba(56, 189, 248, 0.35);
    border-radius: 50%;
    pointer-events: none;
}
.gx-b2c.error-404 .error-404__code {
    position: relative;
    z-index: 1;
}
.gx-b2c.error-404 .error-404__rocket {
    position: absolute;
    top: -22%;
    left: -12%;
    width: 124%;
    height: 144%;
    z-index: 2;
    pointer-events: none;
}
.gx-b2c.error-404 .error-404__ship {
    position: absolute;
    top: 0;
    left: 0;
    width: 56px;
    height: 28px;
    offset-path: ellipse(50% 50% at 50% 50%);
    offset-rotate: auto;
    offset-anchor: center;
    animation: error404-orbit-path 7s linear infinite;
}
.gx-b2c.error-404 .error-404__ship svg {
    display: block;
    width: 100%;
    height: 100%;
    filter: drop-shadow(0 0 10px rgba(56, 189, 248, 0.6));
}
.gx-b2c.error-404 .error-404__flame {
    fill: #f59e0b;
    transform-origin: 14px 16px;
    animation: error404-flame .18s ease-in-out infinite alternate;
}
@keyframes error404-orbit-path {
    from { offset-distance: 0%; }
    to   { offset-distance: 100%; }
}
@keyframes error404-flame {
    from { transform: scaleX(.7); opacity: .8; }
    to   { transform: scaleX(1.15); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
    .gx-b2c.error-404 .error-404__ship,
    .gx-b2c.error-404 .error-404__flame {
        animation: none;
        offset-distance: 12%;
    }
}

.gx-b2c.error-404 h1 {
    margin: 25px 0 18px;
    font-size: clamp(32px, 4vw, 46px);
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1px;
    color: #ffffff;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}
.gx-b2c.error-404 p {
    max-width: 610px;
    margin: 0 auto;
    font-size: 18px;
    line-height: 1.7;
    color: #cbd5e1;
}
.gx-b2c.error-404 .error-404__actions {
    display: flex;
    justify-content: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 35px;
}
.gx-b2c.error-404 .error-404__actions .b2c-btn {
    justify-content: center;
}

@media (max-width: 600px) {
    .gx-b2c.error-404 {
        min-height: 480px;
        padding: 60px 20px;
    }
    .gx-b2c.error-404 p {
        font-size: 16px;
    }
    .gx-b2c.error-404 .error-404__ship {
        width: 40px;
        height: 20px;
    }
    .gx-b2c.error-404 .error-404__actions {
        flex-direction: column;
    }
    .gx-b2c.error-404 .error-404__actions .b2c-btn {
        width: 100%;
    }
}

/* ══════════════════════════════════════════════════════════════
   GALACTIX NOTÍCIAS — padrão visual do b2c.html
   (reaproveita .gx-b2c, .b2c-container, .b2c-eyebrow,
    .b2c-eyebrow-light, .b2c-btn, .b2c-btn-primary)
══════════════════════════════════════════════════════════════ */
.gx-noticias h1,
.gx-noticias h2,
.gx-noticias h3,
.gx-noticias p {
    margin: 0;
}
.gx-noticias img {
    display: block;
    max-width: 100%;
}
.gx-noticias a {
    color: inherit;
    text-decoration: none;
}
.gx-b2c.gx-noticias .b2c-eyebrow {
    margin-bottom: 0;
}

/* ---------- Hero ---------- */
.gx-noticias .news-hero {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.gx-noticias .news-hero .b2c-container {
    position: relative;
    min-height: 500px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 60px;
    padding-bottom: 80px;
}
.gx-noticias .hero-content {
    position: relative;
    z-index: 2;
    width: 62%;
    max-width: 720px;
}
.gx-noticias .hero-content h1 {
    margin-top: 22px;
    font-size: clamp(38px, 4vw, 52px);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -1px;
    color: #ffffff;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}
.gx-noticias .hero-content h1 span {
    color: #00a0e3;
}
.gx-noticias .hero-content p {
    max-width: 580px;
    margin-top: 22px;
    font-size: 18px;
    line-height: 1.7;
    color: #cbd5e1;
}

/* Símbolo do hero */
.gx-noticias .hero-symbol {
    position: relative;
    flex-shrink: 0;
    width: 380px;
    height: 380px;
}
.gx-noticias .hero-g {
    position: absolute;
    inset: 50% auto auto 50%;
    transform: translate(-50%, -50%);
    width: 150px;
    height: 150px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #38bdf8 0%, #00a0e3 55%, #802be2 100%);
    color: #ffffff;
    clip-path: polygon(25% 6%, 75% 6%, 100% 50%, 75% 94%, 25% 94%, 0 50%);
    font-size: 75px;
    font-weight: 800;
    filter: drop-shadow(0 0 30px rgba(0, 160, 227, 0.45));
    z-index: 3;
}
/* Órbitas simulando galáxias espirais (disco inclinado + braços girando) */
.gx-noticias .orbit {
    position: absolute;
    top: 50%;
    left: 50%;
    border-radius: 50%;
    overflow: hidden;
    transform: translate(-50%, -50%) rotate(-20deg);
    -webkit-mask-image: radial-gradient(closest-side, #000 62%, transparent 100%);
    mask-image: radial-gradient(closest-side, #000 62%, transparent 100%);
}
/* braços espirais */
.gx-noticias .orbit::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 160%;
    aspect-ratio: 1;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    filter: blur(3px);
    animation: gx-galaxy-spin 26s linear infinite;
}
/* poeira de estrelas */
.gx-noticias .orbit::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 140%;
    aspect-ratio: 1;
    transform: translate(-50%, -50%);
    background:
        radial-gradient(1.5px 1.5px at 20% 30%, #ffffff 50%, transparent 100%),
        radial-gradient(1px 1px at 35% 70%, #ffffff 50%, transparent 100%),
        radial-gradient(1.5px 1.5px at 62% 22%, #e0f2fe 50%, transparent 100%),
        radial-gradient(1px 1px at 78% 58%, #ffffff 50%, transparent 100%),
        radial-gradient(1px 1px at 45% 45%, #ffffff 50%, transparent 100%),
        radial-gradient(1.5px 1.5px at 70% 80%, #c4b5fd 50%, transparent 100%),
        radial-gradient(1px 1px at 28% 55%, #ffffff 50%, transparent 100%),
        radial-gradient(1px 1px at 55% 35%, #bae6fd 50%, transparent 100%),
        radial-gradient(1px 1px at 85% 40%, #ffffff 50%, transparent 100%),
        radial-gradient(1.5px 1.5px at 40% 85%, #ffffff 50%, transparent 100%),
        radial-gradient(1px 1px at 15% 60%, #e0f2fe 50%, transparent 100%),
        radial-gradient(1px 1px at 60% 62%, #ffffff 50%, transparent 100%);
    opacity: .85;
    animation: gx-galaxy-spin 40s linear infinite;
}
.gx-noticias .orbit-one {
    width: 330px;
    height: 180px;
    z-index: 1;
    background: radial-gradient(closest-side, rgba(224, 242, 254, 0.7) 0%, rgba(56, 189, 248, 0.3) 40%, transparent 80%);
}
.gx-noticias .orbit-one::before {
    background:
        conic-gradient(
            from 0deg,
            transparent 0deg,
            rgba(186, 230, 253, 0.95) 22deg,
            rgba(56, 189, 248, 0.6) 55deg,
            transparent 110deg,
            transparent 180deg,
            rgba(186, 230, 253, 0.95) 202deg,
            rgba(0, 160, 227, 0.6) 235deg,
            transparent 290deg,
            transparent 360deg
        );
    animation-duration: 18s;
}
.gx-noticias .orbit-two {
    width: 460px;
    height: 270px;
    transform: translate(-50%, -50%) rotate(25deg);
    background: radial-gradient(closest-side, rgba(196, 181, 253, 0.45) 0%, rgba(128, 43, 226, 0.3) 35%, rgba(20, 60, 130, 0.25) 60%, transparent 85%);
}
.gx-noticias .orbit-two::before {
    background:
        conic-gradient(
            from 90deg,
            transparent 0deg,
            rgba(167, 139, 250, 0.9) 20deg,
            rgba(56, 189, 248, 0.5) 60deg,
            transparent 110deg,
            transparent 180deg,
            rgba(167, 139, 250, 0.9) 200deg,
            rgba(56, 189, 248, 0.5) 240deg,
            transparent 290deg,
            transparent 360deg
        );
    animation-direction: reverse;
}
.gx-noticias .orbit-two::after {
    animation-duration: 60s;
    animation-direction: reverse;
}
@keyframes gx-galaxy-spin {
    from { transform: translate(-50%, -50%) rotate(0deg); }
    to   { transform: translate(-50%, -50%) rotate(360deg); }
}
@media (prefers-reduced-motion: reduce) {
    .gx-noticias .orbit::before,
    .gx-noticias .orbit::after {
        animation: none;
    }
}
.gx-noticias .planet {
    position: absolute;
    z-index: 3;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background: #38bdf8;
    box-shadow: 0 0 14px rgba(56, 189, 248, 0.8);
}
.gx-noticias .planet-one {
    top: 104px;
    right: 48px;
}
.gx-noticias .planet-two {
    bottom: 92px;
    left: 62px;
    background: #802be2;
    box-shadow: 0 0 14px rgba(128, 43, 226, 0.8);
}

/* ---------- Títulos de seção ---------- */
.gx-noticias .section-heading {
    display: flex;
    align-items: flex-end;
    gap: 40px;
    margin-bottom: 48px;
}
.gx-noticias .section-heading h2,
.gx-noticias .news-title-row h2 {
    margin-top: 16px;
    font-size: 38px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -1px;
    color: #0f172a;
}
.gx-noticias .heading-line {
    flex: 1;
    height: 1px;
    margin-bottom: 14px;
    background: #e2e8f0;
}

/* ---------- Notícia em destaque ---------- */
.gx-noticias .featured-section {
    padding: 100px 0;
    background: #ffffff;
}
.gx-noticias .featured-news {
    display: grid;
    grid-template-columns: 1.35fr 1fr;
    min-height: 480px;
    background:
        radial-gradient(circle at 100% 0%, rgba(128, 43, 226, 0.22) 0%, transparent 55%),
        #060913;
    border: 1px solid rgba(56, 189, 248, 0.15);
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 25px 60px rgba(6, 9, 19, 0.18);
}
.gx-noticias .featured-image {
    position: relative;
    min-height: 480px;
    overflow: hidden;
    background: #0b0f19;
}
.gx-noticias .featured-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .7s ease;
}
.gx-noticias .featured-news:hover .featured-image img {
    transform: scale(1.035);
}
.gx-noticias .image-category {
    position: absolute;
    left: 24px;
    top: 24px;
    padding: 8px 16px;
    background: #00a0e3;
    color: #ffffff;
    border-radius: 100px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
}
.gx-noticias .featured-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 56px;
}
.gx-noticias .news-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #94a3b8;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 1.2px;
}
.gx-noticias .meta-dot {
    width: 4px;
    height: 4px;
    background: #38bdf8;
    border-radius: 50%;
}
.gx-noticias .featured-content h2 {
    margin: 22px 0;
    font-size: clamp(28px, 2.6vw, 38px);
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -0.5px;
    color: #ffffff;
}
.gx-noticias .featured-content h2 a {
    transition: color .2s ease;
}
.gx-noticias .featured-content h2 a:hover {
    color: #38bdf8;
}
.gx-noticias .featured-content p {
    font-size: 17px;
    line-height: 1.7;
    color: #94a3b8;
}
.gx-noticias .read-more {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    width: fit-content;
    margin-top: 32px;
    color: #ffffff;
    font-weight: 700;
}
.gx-noticias .read-more span {
    color: #38bdf8;
    font-size: 24px;
    transition: transform .2s ease;
}
.gx-noticias .read-more:hover span {
    transform: translateX(7px);
}
/* ---------- Listagem ---------- */
.gx-noticias .news-section {
    padding: 0px 0 120px;
    background: #f8fafc;
}
.gx-noticias .news-title-row {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 40px;
}
.gx-noticias .news-search {
    width: 310px;
    height: 52px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 18px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    color: #94a3b8;
    transition: border-color .2s ease, box-shadow .2s ease;
}
.gx-noticias .news-search:focus-within {
    border-color: #00a0e3;
    box-shadow: 0 0 0 4px rgba(0, 160, 227, 0.12);
}
.gx-noticias .news-search svg {
    flex-shrink: 0;
}
.gx-noticias .news-search input {
    width: 100%;
    border: 0;
    outline: 0;
    background: transparent;
    font-size: 15px;
    color: #0f172a;
}
.gx-noticias .categories {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 48px;
}
.gx-noticias .category {
    padding: 10px 18px;
    border: 1px solid #e2e8f0;
    border-radius: 100px;
    background: #ffffff;
    color: #475569;
    font-size: 13px;
    font-weight: 600;
    transition: all .2s ease;
}
.gx-noticias .category:hover,
.gx-noticias .category.active {
    border-color: #00a0e3;
    background: #00a0e3;
    color: #ffffff;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.25);
}

/* Grid de cards */
.gx-noticias .news-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}
.gx-noticias .news-card {
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    overflow: hidden;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.gx-noticias .news-card[hidden] {
    display: none;
}
.gx-noticias .news-card:not([hidden]) {
    animation: gx-news-in .35s ease backwards;
}
@keyframes gx-news-in {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
}
.gx-noticias .category:focus-visible {
    outline: 2px solid #38bdf8;
    outline-offset: 2px;
}
.gx-noticias .news-card:hover {
    transform: translateY(-6px);
    border-color: rgba(0, 160, 227, 0.35);
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.08);
}
.gx-noticias .card-image {
    display: block;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: #0b0f19;
}
.gx-noticias .card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .5s ease;
}
.gx-noticias .news-card:hover .card-image img {
    transform: scale(1.04);
}
.gx-noticias .card-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 28px;
}
.gx-noticias .card-category {
    color: #00a0e3;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.4px;
}
.gx-noticias .card-content h3 {
    margin: 14px 0;
    font-size: 21px;
    font-weight: 700;
    line-height: 1.35;
    color: #0f172a;
}
.gx-noticias .card-content h3 a {
    transition: color .2s ease;
}
.gx-noticias .card-content h3 a:hover {
    color: #00a0e3;
}
.gx-noticias .card-content p {
    margin-bottom: 26px;
    font-size: 15px;
    line-height: 1.7;
    color: #64748b;
}
.gx-noticias .card-footer {
    margin-top: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 20px;
    border-top: 1px solid #e2e8f0;
}
.gx-noticias .card-footer time {
    color: #94a3b8;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .8px;
}
.gx-noticias .card-footer a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #e0f2fe;
    color: #00a0e3;
    font-size: 20px;
    transition: all .2s ease;
}
.gx-noticias .news-card:hover .card-footer a {
    background: #00a0e3;
    color: #ffffff;
}

.gx-noticias .news-empty {
    padding: 48px 20px;
    border: 1px dashed #e2e8f0;
    border-radius: 16px;
    background: #ffffff;
    text-align: center;
    font-size: 16px;
    color: #64748b;
}
.gx-noticias .news-empty[hidden] {
    display: none;
}

/* Paginação */
.gx-noticias .pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-top: 64px;
}
.gx-noticias .pagination a,
.gx-noticias .pagination button {
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #ffffff;
    color: #0f172a;
    font-size: 14px;
    font-weight: 600;
    transition: all .2s ease;
}
.gx-noticias .pagination span {
    color: #94a3b8;
}
.gx-noticias .pagination a:hover,
.gx-noticias .pagination a.current {
    border-color: #00a0e3;
    background: #00a0e3;
    color: #ffffff;
}
.gx-noticias .pagination button:disabled {
    opacity: .4;
    cursor: not-allowed;
}

/* ---------- CTA ---------- */
.gx-noticias .news-cta {
    position: relative;
    overflow: hidden;
    padding: 100px 0;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
    color: #ffffff;
}
.gx-noticias .news-cta .b2c-container {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 60px;
}
.gx-noticias .cta-content h2 {
    margin: 20px 0 14px;
    font-size: clamp(30px, 3vw, 40px);
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1px;
    color: #ffffff;
}
.gx-noticias .cta-content p {
    font-size: 18px;
    line-height: 1.7;
    color: #94a3b8;
}
.gx-noticias .cta-button {
    flex-shrink: 0;
    gap: 14px;
}
.gx-noticias .cta-button span {
    font-size: 22px;
    transition: transform .2s ease;
}
.gx-noticias .cta-button:hover span {
    transform: translateX(5px);
}
.gx-noticias .cta-decoration {
    position: absolute;
    width: 550px;
    height: 550px;
    right: -160px;
    top: -250px;
    border: 1px solid rgba(56, 189, 248, 0.18);
    border-radius: 50%;
}
.gx-noticias .cta-decoration::after {
    content: "";
    position: absolute;
    width: 350px;
    height: 350px;
    left: 70px;
    bottom: -120px;
    border: 1px solid rgba(128, 43, 226, 0.25);
    border-radius: 50%;
}

/* ---------- Responsivo ---------- */
@media (max-width: 1100px) {
    .gx-noticias .hero-symbol {
        width: 320px;
        height: 320px;
    }
    .gx-noticias .featured-content {
        padding: 44px;
    }
}
@media (max-width: 1024px) {
    .gx-noticias .news-hero .b2c-container {
        min-height: 450px;
    }
    .gx-noticias .hero-content {
        width: 80%;
    }
    .gx-noticias .hero-symbol {
        position: absolute;
        right: -110px;
        opacity: .35;
    }
    .gx-noticias .featured-news {
        grid-template-columns: 1fr;
    }
    .gx-noticias .featured-image {
        min-height: 380px;
    }
    .gx-noticias .news-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 720px) {
    .gx-noticias .news-hero .b2c-container {
        min-height: 440px;
        padding-top: 50px;
        padding-bottom: 60px;
    }
    .gx-noticias .hero-content {
        width: 100%;
    }
    .gx-noticias .hero-content h1 {
        font-size: 36px;
    }
    .gx-noticias .hero-content p {
        font-size: 16px;
    }
    .gx-noticias .hero-symbol {
        opacity: .12;
    }
    .gx-noticias .featured-section,
    .gx-noticias .news-section,
    .gx-noticias .news-cta {
        padding: 70px 0;
    }
    .gx-noticias .section-heading {
        margin-bottom: 30px;
    }
    .gx-noticias .heading-line {
        display: none;
    }
    .gx-noticias .section-heading h2,
    .gx-noticias .news-title-row h2 {
        font-size: 30px;
    }
    .gx-noticias .featured-news {
        border-radius: 14px;
    }
    .gx-noticias .featured-image {
        min-height: 260px;
    }
    .gx-noticias .featured-content {
        padding: 30px 24px 35px;
    }
    .gx-noticias .featured-content h2 {
        font-size: 26px;
    }
    .gx-noticias .featured-content p {
        font-size: 15px;
    }
    .gx-noticias .news-title-row {
        display: block;
    }
    .gx-noticias .news-search {
        width: 100%;
        margin-top: 25px;
    }
    .gx-noticias .categories {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 8px;
        scrollbar-width: none;
    }
    .gx-noticias .categories::-webkit-scrollbar {
        display: none;
    }
    .gx-noticias .category {
        flex-shrink: 0;
    }
    .gx-noticias .news-grid {
        grid-template-columns: 1fr;
        gap: 22px;
    }
    .gx-noticias .news-cta .b2c-container {
        display: block;
    }
    .gx-noticias .cta-content h2 br {
        display: none;
    }
    .gx-noticias .cta-button {
        margin-top: 30px;
    }
}
@media (max-width: 430px) {
    .gx-noticias .hero-content h1 {
        font-size: 32px;
    }
    .gx-noticias .featured-content h2 {
        font-size: 24px;
    }
    .gx-noticias .news-meta {
        flex-wrap: wrap;
    }
    .gx-noticias .card-content {
        padding: 22px;
    }
    .gx-noticias .pagination a:nth-of-type(3),
    .gx-noticias .pagination span {
        display: none;
    }
}

/* ══════════════════════════════════════════════════════════════
   GALACTIX NOTÍCIA (artigo) — padrão visual do b2c.html
   (reaproveita .gx-b2c, .b2c-container, .b2c-eyebrow,
    .b2c-eyebrow-light, .b2c-btn, .b2c-btn-primary)
══════════════════════════════════════════════════════════════ */
.gx-b2c.gx-news-article {
    overflow: clip; /* mantém o corte do .gx-b2c sem quebrar o position: sticky do compartilhar */
    color: #0f172a;
    line-height: 1.7;
}
.gx-news-article h1,
.gx-news-article h2,
.gx-news-article h3,
.gx-news-article p,
.gx-news-article blockquote {
    margin: 0;
}
.gx-news-article a {
    color: inherit;
    text-decoration: none;
}
.gx-news-article img {
    display: block;
    max-width: 100%;
}
.gx-b2c.gx-news-article .b2c-eyebrow {
    margin-bottom: 0;
}

/* ---------- Breadcrumb ---------- */
.gx-news-article .breadcrumb-wrapper {
    background: #060913;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.gx-news-article .breadcrumb {
    min-height: 52px;
    display: flex;
    align-items: center;
    gap: 11px;
    color: #94a3b8;
    font-size: 13px;
}
.gx-news-article .breadcrumb a {
    transition: color .2s ease;
}
.gx-news-article .breadcrumb a:hover {
    color: #38bdf8;
}
.gx-news-article .breadcrumb > span:last-child {
    color: #cbd5e1;
}

/* ---------- Cabeçalho do artigo (neutraliza a regra global de header fixo) ---------- */
.gx-news-article header.article-header {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: auto !important;
    z-index: auto !important;
    display: block !important;
    border-bottom: 0 !important;
    padding: 80px 0 170px;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.gx-news-article .article-header-content {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}
.gx-news-article .article-header h1 {
    max-width: 980px;
    margin-top: 24px;
    font-size: clamp(34px, 4.2vw, 52px);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -1px;
    color: #ffffff;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}
.gx-news-article .article-lead {
    max-width: 820px;
    margin-top: 24px;
    font-size: 19px;
    line-height: 1.7;
    color: #cbd5e1;
}
.gx-news-article .article-meta {
    margin-top: 30px;
    display: flex;
    align-items: center;
    gap: 12px;
    color: #94a3b8;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.2px;
}
.gx-news-article .meta-dot {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #38bdf8;
}

/* ---------- Imagem principal (sobe sobre o fundo escuro) ---------- */
.gx-news-article .article-hero {
    position: relative;
    z-index: 2;
    margin-top: -110px;
}
.gx-news-article .article-hero img {
    width: 100%;
    aspect-ratio: 16 / 7;
    object-fit: cover;
    border-radius: 20px;
    background: #0b0f19;
    border: 1px solid rgba(56, 189, 248, 0.15);
    box-shadow: 0 25px 60px rgba(6, 9, 19, 0.25);
}

/* ---------- Layout de leitura ---------- */
.gx-news-article .article-layout {
    display: grid;
    grid-template-columns: 90px minmax(0, 800px);
    justify-content: center;
    gap: 50px;
    padding-top: 75px;
    padding-bottom: 110px;
}

/* Compartilhar */
.gx-news-article .share {
    position: sticky;
    top: 130px;
    align-self: start;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}
.gx-news-article .share > span {
    margin-bottom: 8px;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.5px;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
}
.gx-news-article .share a,
.gx-news-article .share button {
    width: 40px;
    height: 40px;
    border: 1px solid #e2e8f0;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    color: #0f172a;
    font-weight: 700;
    cursor: pointer;
    transition: all .2s ease;
}
.gx-news-article .share a:hover,
.gx-news-article .share button:hover {
    background: #00a0e3;
    border-color: #00a0e3;
    color: #ffffff;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
}

/* Conteúdo */
.gx-news-article .article-content {
    font-size: 17px;
    color: #475569;
}
.gx-news-article .article-content > p {
    margin-bottom: 25px;
}
.gx-news-article .article-intro {
    font-size: 20px;
    line-height: 1.75;
    color: #334155;
}
.gx-news-article .article-content h2 {
    margin-top: 64px;
    margin-bottom: 22px;
    font-size: 30px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -0.5px;
    color: #0f172a;
}
.gx-news-article .article-content strong {
    font-weight: 700;
    color: #94a3b8;
}

/* Fluxo da operação */
.gx-news-article .operation-flow {
    margin: 42px 0;
    padding: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
    border: 1px solid rgba(56, 189, 248, 0.3);
    border-radius: 16px;
    background: #f0f9ff;
}
.gx-news-article .operation-flow span {
    padding: 8px 14px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 100px;
    font-size: 13px;
    font-weight: 600;
    color: #0f172a;
}
.gx-news-article .operation-flow strong {
    color: #00a0e3;
}

/* Citação (cartão escuro no padrão b2c) */
.gx-news-article blockquote {
    position: relative;
    margin: 60px 0;
    padding: 44px 46px 40px;
    border-left: 4px solid #00a0e3;
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(128, 43, 226, 0.25) 0%, transparent 55%),
        #060913;
    overflow: hidden;
}
.gx-news-article blockquote::before {
    content: "“";
    position: absolute;
    top: 10px;
    right: 28px;
    color: rgba(56, 189, 248, 0.2);
    font-family: Georgia, serif;
    font-size: 110px;
    line-height: 1;
}
.gx-news-article blockquote p {
    position: relative;
    font-size: 21px;
    font-weight: 500;
    line-height: 1.6;
    color: #ffffff;
}
/* neutraliza a regra global de footer (fundo preto/float) */
.gx-news-article blockquote footer {
    float: none;
    width: auto;
    background: transparent;
    padding: 26px 0 0;
    font-size: 14px;
    line-height: 1.5;
}
.gx-news-article blockquote footer {
    display: flex !important; /* a regra global de footer força display:block no mobile */
    align-items: center;
    gap: 16px;
}
.gx-news-article .quote-avatar {
    flex-shrink: 0;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #00a0e3;
    box-shadow: 0 0 0 4px rgba(0, 160, 227, 0.15);
    background: #0b0f19;
}
.gx-news-article .article-content blockquote footer strong {
    display: block;
    color: #38bdf8;
}
.gx-news-article blockquote footer span {
    display: block;
    color: #94a3b8;
}

/* Módulos */
.gx-news-article .modules {
    margin: 35px 0 42px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}
.gx-news-article .module {
    min-height: 130px;
    padding: 22px;
    display: flex;
    gap: 16px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.gx-news-article .module:hover {
    border-color: rgba(0, 160, 227, 0.35);
    transform: translateY(-4px);
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.08);
}
.gx-news-article .module > span {
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #e0f2fe;
    color: #00a0e3;
    font-size: 12px;
    font-weight: 800;
}
.gx-news-article .module strong {
    display: block;
    margin-bottom: 5px;
    font-size: 16px;
    font-weight: 700;
    color: #0f172a;
}
.gx-news-article .module p {
    font-size: 14px;
    line-height: 1.55;
    color: #64748b;
}

/* Sobre */
.gx-news-article .about-section {
    margin-top: 80px;
    padding-top: 45px;
    border-top: 1px solid #e2e8f0;
}
.gx-news-article .about {
    padding: 32px 0;
    border-bottom: 1px solid #e2e8f0;
}
.gx-news-article .about h3 {
    margin: 14px 0 12px;
    font-size: 24px;
    font-weight: 800;
    color: #0f172a;
}
.gx-news-article .about p {
    margin-bottom: 10px;
    font-size: 15px;
    color: #64748b;
}
.gx-news-article .about a {
    display: inline-block;
    margin-top: 10px;
    color: #00a0e3;
    font-size: 14px;
    font-weight: 700;
    transition: color .2s ease;
}
.gx-news-article .about a:hover {
    color: #008cc6;
}

/* ---------- CTA final ---------- */
.gx-news-article .article-cta {
    overflow: hidden;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
    color: #ffffff;
}
.gx-news-article .article-cta-inner {
    min-height: 380px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 60px;
}
.gx-news-article .article-cta h2 {
    margin: 20px 0 16px;
    font-size: clamp(30px, 3vw, 40px);
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1px;
    color: #ffffff;
}
.gx-news-article .article-cta p {
    font-size: 18px;
    color: #94a3b8;
}
.gx-news-article .article-cta .b2c-btn {
    flex-shrink: 0;
    justify-content: space-between;
    min-width: 230px;
    gap: 14px;
}
.gx-news-article .article-cta .b2c-btn strong {
    font-size: 20px;
    transition: transform .2s ease;
}
.gx-news-article .article-cta .b2c-btn:hover strong {
    transform: translateX(5px);
}

/* ---------- Responsivo ---------- */
@media (max-width: 1050px) {
    .gx-news-article .article-layout {
        grid-template-columns: 64px minmax(0, 800px);
        gap: 30px;
    }
}
@media (max-width: 760px) {
    .gx-news-article .breadcrumb {
        overflow: hidden;
        white-space: nowrap;
    }
    .gx-news-article header.article-header {
        padding: 55px 0 120px;
    }
    .gx-news-article .article-header h1 {
        font-size: 32px;
    }
    .gx-news-article .article-lead {
        font-size: 17px;
    }
    .gx-news-article .article-hero {
        margin-top: -80px;
    }
    .gx-news-article .article-hero img {
        aspect-ratio: 16 / 9;
        border-radius: 14px;
    }
    .gx-news-article .article-layout {
        display: block;
        padding-top: 45px;
        padding-bottom: 70px;
    }
    .gx-news-article .share {
        position: static;
        margin-bottom: 40px;
        flex-direction: row;
        justify-content: flex-start;
    }
    .gx-news-article .share > span {
        writing-mode: initial;
        transform: none;
        margin: 0 8px 0 0;
    }
    .gx-news-article .article-content {
        font-size: 16px;
    }
    .gx-news-article .article-intro {
        font-size: 18px;
    }
    .gx-news-article .article-content h2 {
        margin-top: 50px;
        font-size: 25px;
    }
    .gx-news-article blockquote {
        margin: 45px 0;
        padding: 34px 24px;
    }
    .gx-news-article blockquote p {
        font-size: 18px;
    }
    .gx-news-article .modules {
        grid-template-columns: 1fr;
    }
    .gx-news-article .operation-flow {
        justify-content: flex-start;
    }
    .gx-news-article .article-cta-inner {
        min-height: 420px;
        padding-top: 60px;
        padding-bottom: 60px;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        gap: 30px;
    }
    .gx-news-article .article-cta h2 br {
        display: none;
    }
    .gx-news-article .article-cta .b2c-btn {
        width: 100%;
    }
}

/* ══════════════════════════════════════════════════════════════
   GALACTIX NOTÍCIA — NEWTON (padrão visual do b2c.html)
   Base do artigo reaproveitada de .gx-news-article; aqui só os
   blocos exclusivos da matéria do Newton.
══════════════════════════════════════════════════════════════ */

/* Aplicações */
.gx-news-newton .article-content .ai-applications {
    margin: 38px 0 55px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}
.gx-news-newton .article-content .ai-application {
    min-height: 180px;
    padding: 24px;
    display: flex;
    gap: 16px;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #ffffff;
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.gx-news-newton .article-content .ai-application:hover {
    transform: translateY(-4px);
    border-color: rgba(0, 160, 227, 0.35);
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.08);
}
.gx-news-newton .article-content .ai-number {
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #e0f2fe;
    color: #00a0e3;
    font-size: 12px;
    font-weight: 800;
}
.gx-news-newton .article-content .ai-label {
    display: block;
    margin-bottom: 6px;
    color: #00a0e3;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.4px;
}
.gx-news-newton .article-content .ai-application h3 {
    margin-bottom: 8px;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.3;
    color: #0f172a;
}
.gx-news-newton .article-content .ai-application p {
    font-size: 14px;
    line-height: 1.65;
    color: #64748b;
}

/* Fluxo Evento → Operação */
.gx-news-newton .article-content .newton-flow {
    margin: 40px 0 60px;
    padding: 26px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px;
    border: 1px solid rgba(56, 189, 248, 0.3);
    border-radius: 16px;
    background: #f0f9ff;
}
.gx-news-newton .article-content .flow-item {
    min-width: 84px;
    padding: 10px 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
}
.gx-news-newton .article-content .flow-item span {
    margin-bottom: 2px;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1px;
}
.gx-news-newton .article-content .flow-item strong {
    font-size: 13px;
    font-weight: 700;
    color: #0f172a;
}
.gx-news-newton .article-content .flow-arrow {
    margin: 0 2px;
    color: #00a0e3;
    font-size: 16px;
}
.gx-news-newton .article-content .flow-newton {
    border-color: #00a0e3;
    background: #00a0e3;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
}
.gx-news-newton .article-content .flow-newton span {
    color: rgba(255, 255, 255, 0.7);
}
.gx-news-newton .article-content .flow-newton strong {
    color: #ffffff;
}

/* Arquitetura (cartão escuro b2c) */
.gx-news-newton .article-content .newton-architecture {
    position: relative;
    overflow: hidden;
    margin: 55px 0 70px;
    padding: 42px;
    border: 1px solid rgba(56, 189, 248, 0.15);
    border-radius: 20px;
    background:
        radial-gradient(ellipse at 50% 0%, rgba(20, 60, 130, 0.45) 0%, transparent 55%),
        radial-gradient(circle at 100% 100%, rgba(128, 43, 226, 0.22) 0%, transparent 50%),
        #060913;
    color: #ffffff;
}
.gx-news-newton .article-content .newton-architecture::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: .15;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.08) 1px, transparent 1px);
    background-size: 32px 32px;
    pointer-events: none;
}
.gx-news-newton .article-content .architecture-header,
.gx-news-newton .article-content .architecture-newton,
.gx-news-newton .article-content .architecture-line,
.gx-news-newton .article-content .architecture-agents,
.gx-news-newton .article-content .architecture-platform {
    position: relative;
    z-index: 1;
}
.gx-news-newton .article-content .architecture-header {
    margin-bottom: 35px;
}
.gx-news-newton .article-content .architecture-header > span {
    color: #38bdf8;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.5px;
}
.gx-news-newton .article-content .architecture-header h3 {
    max-width: 470px;
    margin-top: 8px;
    font-size: 24px;
    font-weight: 800;
    line-height: 1.3;
    color: #ffffff;
}
.gx-news-newton .article-content .architecture-newton {
    width: 200px;
    margin: 0 auto;
    padding: 18px;
    display: flex;
    flex-direction: column;
    align-items: center;
    border: 1px solid rgba(56, 189, 248, 0.6);
    border-radius: 12px;
    background: rgba(0, 160, 227, 0.12);
    box-shadow: 0 0 30px rgba(0, 160, 227, 0.25);
    color: #38bdf8;
    font-size: 20px;
    font-weight: 800;
    letter-spacing: 1px;
}
.gx-news-newton .article-content .architecture-newton small {
    margin-top: 2px;
    color: #94a3b8;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0;
}
.gx-news-newton .article-content .architecture-line {
    width: 1px;
    height: 28px;
    margin: 0 auto;
    background: linear-gradient(#38bdf8, #802be2);
}
.gx-news-newton .article-content .architecture-agents {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}
.gx-news-newton .article-content .architecture-agents > div {
    padding: 16px 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.04);
}
.gx-news-newton .article-content .architecture-agents span {
    margin-bottom: 3px;
    color: #94a3b8;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1px;
}
.gx-news-newton .article-content .architecture-agents strong {
    font-size: 13px;
    font-weight: 700;
    color: #ffffff;
}
.gx-news-newton .article-content .architecture-platform {
    margin-top: 12px;
    padding: 20px;
    border: 1px solid rgba(128, 43, 226, 0.35);
    border-radius: 12px;
    background: rgba(128, 43, 226, 0.08);
    text-align: center;
}
.gx-news-newton .article-content .architecture-platform > span {
    display: block;
    margin-bottom: 7px;
    color: #38bdf8;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.5px;
}
.gx-news-newton .article-content .architecture-platform div {
    color: #cbd5e1;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .5px;
}

/* Processamento de dados */
.gx-news-newton .article-content .data-processing {
    margin: 60px 0;
    padding: 36px;
    display: grid;
    grid-template-columns: 56px 1fr;
    gap: 24px;
    border: 1px solid rgba(56, 189, 248, 0.3);
    border-radius: 16px;
    background: #f0f9ff;
}
.gx-news-newton .article-content .data-processing-icon {
    width: 54px;
    height: 54px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: linear-gradient(135deg, #38bdf8 0%, #00a0e3 55%, #802be2 100%);
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
    color: #ffffff;
    font-size: 26px;
}
.gx-news-newton .article-content .data-processing > div:last-child > span {
    color: #00a0e3;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.4px;
}
.gx-news-newton .article-content .data-processing h3 {
    margin: 6px 0 12px;
    font-size: 21px;
    font-weight: 800;
    line-height: 1.35;
    color: #0f172a;
}
.gx-news-newton .article-content .data-processing p {
    margin-top: 9px;
    font-size: 15px;
    color: #475569;
}

/* Frase final (cartão escuro b2c) */
.gx-news-newton .article-content .article-statement {
    margin: 70px 0;
    padding: 45px;
    border-left: 4px solid #00a0e3;
    border-radius: 16px;
    background:
        radial-gradient(circle at 90% 20%, rgba(128, 43, 226, 0.28) 0%, transparent 45%),
        radial-gradient(ellipse at 10% 100%, rgba(0, 150, 255, 0.18) 0%, transparent 55%),
        #060913;
    color: #ffffff;
}
.gx-news-newton .article-content .article-statement > span {
    color: #38bdf8;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.5px;
}
.gx-news-newton .article-content .article-statement p {
    max-width: 590px;
    margin: 14px 0 10px;
    font-size: 18px;
    line-height: 1.6;
    color: #94a3b8;
}
.gx-news-newton .article-content .article-statement strong {
    display: block;
    max-width: 620px;
    font-size: 24px;
    font-weight: 800;
    line-height: 1.4;
    color: #ffffff;
}

/* Botão copiar link — estado copiado */
.gx-news-newton .share .copy-link.copied {
    border-color: #00a0e3;
    background: #00a0e3;
    color: #ffffff;
}

@media (max-width: 760px) {
    .gx-news-newton .article-content .ai-applications {
        grid-template-columns: 1fr;
    }
    .gx-news-newton .article-content .newton-flow {
        padding: 22px;
        flex-direction: column;
        align-items: stretch;
    }
    .gx-news-newton .article-content .flow-item {
        min-width: 0;
        padding: 12px;
    }
    .gx-news-newton .article-content .flow-arrow {
        margin: 2px 0;
        text-align: center;
        transform: rotate(90deg);
    }
    .gx-news-newton .article-content .newton-architecture {
        padding: 32px 20px;
    }
    .gx-news-newton .article-content .architecture-agents {
        grid-template-columns: 1fr 1fr;
    }
    .gx-news-newton .article-content .data-processing {
        grid-template-columns: 1fr;
        padding: 28px;
    }
    .gx-news-newton .article-content .article-statement {
        padding: 34px 24px;
    }
    .gx-news-newton .article-content .article-statement strong {
        font-size: 20px;
    }
}

/* ══════════════════════════════════════════════════════════════
   GALACTIX NOTÍCIA — ECOSSISTEMA (padrão visual do b2c.html)
   (reaproveita .gx-b2c, .b2c-container, .b2c-eyebrow,
    .b2c-eyebrow-light)
══════════════════════════════════════════════════════════════ */
.gx-b2c.gx-news-eco {
    color: #0f172a;
}
.gx-news-eco h1,
.gx-news-eco h2,
.gx-news-eco h3,
.gx-news-eco p,
.gx-news-eco blockquote {
    margin: 0;
}
.gx-news-eco a {
    color: inherit;
    text-decoration: none;
}
.gx-b2c.gx-news-eco .b2c-eyebrow {
    margin-bottom: 0;
}

/* ---------- Capa (fundo escuro do hero b2c) ---------- */
.gx-news-eco .article-heading {
    padding: 50px 0 170px;
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.gx-news-eco .article-breadcrumb {
    margin-bottom: 40px;
    display: flex;
    align-items: center;
    gap: 10px;
    color: #94a3b8;
    font-size: 13px;
}
.gx-news-eco .article-breadcrumb a {
    transition: color .2s ease;
}
.gx-news-eco .article-breadcrumb a:hover {
    color: #38bdf8;
}
.gx-news-eco .article-breadcrumb > span:last-child {
    color: #cbd5e1;
}
.gx-news-eco .article-heading h1 {
    max-width: 980px;
    margin: 24px 0 22px;
    font-size: clamp(34px, 4.2vw, 52px);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -1px;
    color: #ffffff;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}
.gx-news-eco .article-subtitle {
    max-width: 760px;
    font-size: 19px;
    line-height: 1.7;
    color: #cbd5e1;
}
.gx-news-eco .article-meta {
    margin-top: 30px;
    display: flex;
    align-items: center;
    gap: 12px;
    color: #94a3b8;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.2px;
}
.gx-news-eco .meta-dot {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #38bdf8;
}

/* ---------- Imagem principal (sobe sobre o fundo escuro) ---------- */
.gx-news-eco .article-hero {
    position: relative;
    z-index: 2;
    margin-top: -110px;
}
.gx-news-eco .article-hero img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 7;
    object-fit: cover;
    border-radius: 20px;
    background: #0b0f19;
    border: 1px solid rgba(56, 189, 248, 0.15);
    box-shadow: 0 25px 60px rgba(6, 9, 19, 0.25);
}

/* ---------- Corpo ---------- */
.gx-news-eco .article-body {
    max-width: 840px;
    padding-top: 75px;
    padding-bottom: 110px;
}
.gx-news-eco .article-content p {
    margin: 0 0 22px;
    font-size: 17px;
    line-height: 1.8;
    color: #475569;
}
.gx-news-eco .article-content strong {
    font-weight: 700;
    color: #0f172a;
}
.gx-news-eco .article-content .article-intro {
    font-size: 20px;
    line-height: 1.75;
    color: #334155;
}
.gx-news-eco .article-section {
    margin-top: 75px;
}
.gx-news-eco .article-section h2 {
    margin: 16px 0 22px;
    font-size: 30px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -0.5px;
    color: #0f172a;
}

/* ---------- Citação (cartão escuro b2c) ---------- */
.gx-news-eco .article-quote {
    position: relative;
    margin: 55px 0 70px;
    padding: 44px 46px 40px;
    border-left: 4px solid #00a0e3;
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(128, 43, 226, 0.25) 0%, transparent 55%),
        #060913;
    overflow: hidden;
}
.gx-news-eco .article-quote::before {
    content: "“";
    position: absolute;
    top: 10px;
    right: 28px;
    color: rgba(56, 189, 248, 0.2);
    font-family: Georgia, serif;
    font-size: 110px;
    line-height: 1;
}
.gx-news-eco .article-content .article-quote p {
    position: relative;
    margin-bottom: 0;
    font-size: 21px;
    font-weight: 500;
    line-height: 1.6;
    color: #ffffff;
}
/* neutraliza a regra global de footer (fundo preto/float/display) */
.gx-news-eco .article-quote footer {
    float: none;
    width: auto;
    background: transparent;
    padding: 26px 0 0;
    display: flex !important;
    align-items: center;
    gap: 16px;
    font-size: 14px;
    line-height: 1.5;
}
.gx-news-eco .article-quote footer > div {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.gx-news-eco .quote-avatar {
    flex-shrink: 0;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #00a0e3;
    box-shadow: 0 0 0 4px rgba(0, 160, 227, 0.15);
    background: #0b0f19;
}
.gx-news-eco .article-content .article-quote footer strong {
    color: #38bdf8;
}
.gx-news-eco .article-quote footer span {
    color: #94a3b8;
}

/* ---------- Grade de produtos ---------- */
.gx-news-eco .product-grid {
    margin: 35px 0 40px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}
.gx-news-eco .product-grid-three {
    grid-template-columns: repeat(3, 1fr);
}
.gx-news-eco .product-card {
    min-height: 190px;
    padding: 26px;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #ffffff;
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.gx-news-eco .product-card:hover {
    transform: translateY(-4px);
    border-color: rgba(0, 160, 227, 0.35);
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.08);
}
.gx-news-eco .product-card-wide {
    grid-column: 1 / -1;
    min-height: 150px;
}
.gx-news-eco .product-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: #e0f2fe;
    color: #00a0e3;
    font-size: 12px;
    font-weight: 800;
}
.gx-news-eco .product-card h3 {
    margin: 14px 0 8px;
    font-size: 18px;
    font-weight: 700;
    color: #0f172a;
}
.gx-news-eco .article-content .product-card p {
    margin: 0;
    font-size: 14px;
    line-height: 1.65;
    color: #64748b;
}

/* ---------- Painel de integração (cartão escuro) ---------- */
.gx-news-eco .integration-panel {
    position: relative;
    overflow: hidden;
    margin: 40px 0;
    padding: 42px;
    border: 1px solid rgba(56, 189, 248, 0.15);
    border-radius: 20px;
    background:
        radial-gradient(ellipse at 50% 0%, rgba(20, 60, 130, 0.45) 0%, transparent 55%),
        radial-gradient(circle at 100% 100%, rgba(128, 43, 226, 0.22) 0%, transparent 50%),
        #060913;
    color: #ffffff;
}
.gx-news-eco .integration-core {
    width: 200px;
    margin: 0 auto;
    padding: 18px;
    display: flex;
    flex-direction: column;
    align-items: center;
    border: 1px solid rgba(56, 189, 248, 0.6);
    border-radius: 12px;
    background: rgba(0, 160, 227, 0.12);
    box-shadow: 0 0 30px rgba(0, 160, 227, 0.25);
}
.gx-news-eco .integration-core span {
    color: #94a3b8;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.5px;
}
.gx-news-eco .article-content .integration-core strong {
    margin-top: 3px;
    color: #38bdf8;
    font-size: 22px;
    font-weight: 800;
}
.gx-news-eco .integration-line {
    width: 1px;
    height: 30px;
    margin: 0 auto;
    background: linear-gradient(#38bdf8, #802be2);
}
.gx-news-eco .integration-systems {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 10px;
}
.gx-news-eco .integration-systems div {
    padding: 14px 6px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.04);
    color: #cbd5e1;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
}

/* ---------- Newton ---------- */
.gx-news-eco .newton-card {
    margin: 35px 0 20px;
    padding: 34px;
    display: grid;
    grid-template-columns: 72px 1fr;
    gap: 24px;
    align-items: center;
    border: 1px solid rgba(56, 189, 248, 0.3);
    border-radius: 16px;
    background: #f0f9ff;
}
.gx-news-eco .newton-mark {
    width: 68px;
    height: 68px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: linear-gradient(135deg, #38bdf8 0%, #00a0e3 55%, #802be2 100%);
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
    color: #ffffff;
    font-size: 26px;
    font-weight: 800;
}
.gx-news-eco .newton-card > div:last-child > span {
    color: #00a0e3;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.4px;
}
.gx-news-eco .newton-card h3 {
    margin: 4px 0 8px;
    font-size: 24px;
    font-weight: 800;
    color: #0f172a;
}
.gx-news-eco .article-content .newton-card p {
    margin: 0;
    font-size: 15px;
    line-height: 1.7;
}

/* ---------- Jornada ---------- */
.gx-news-eco .journey-flow {
    margin: 40px 0;
    padding: 26px 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px;
    border: 1px solid rgba(56, 189, 248, 0.3);
    border-radius: 16px;
    background: #f0f9ff;
}
.gx-news-eco .journey-item {
    min-width: 80px;
    padding: 10px 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
}
.gx-news-eco .journey-item span {
    margin-bottom: 2px;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1px;
}
.gx-news-eco .article-content .journey-item strong {
    font-size: 12px;
    font-weight: 700;
    color: #0f172a;
}
.gx-news-eco .journey-arrow {
    margin: 0 2px;
    color: #00a0e3;
    font-size: 15px;
}
.gx-news-eco .journey-item-highlight {
    border-color: #00a0e3;
    background: #00a0e3;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
}
.gx-news-eco .journey-item-highlight span {
    color: rgba(255, 255, 255, 0.7);
}
.gx-news-eco .article-content .journey-item-highlight strong {
    color: #ffffff;
}
.gx-news-eco .article-content .journey-result {
    padding-left: 20px;
    border-left: 3px solid #00a0e3;
}

/* ---------- Crescimento (cartão escuro) ---------- */
.gx-news-eco .ecosystem-growth {
    margin-top: 40px;
    padding: 30px 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border: 1px solid rgba(56, 189, 248, 0.15);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(128, 43, 226, 0.25) 0%, transparent 55%),
        #060913;
    color: #ffffff;
}
.gx-news-eco .ecosystem-growth > div {
    display: flex;
    flex-direction: column;
    max-width: 130px;
}
.gx-news-eco .ecosystem-growth > div > span {
    margin-bottom: 10px;
    color: #38bdf8;
    font-size: 12px;
    font-weight: 800;
}
.gx-news-eco .ecosystem-growth small {
    margin-bottom: 4px;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1px;
}
.gx-news-eco .article-content .ecosystem-growth strong {
    color: #ffffff;
    font-size: 14px;
    line-height: 1.4;
}
.gx-news-eco .ecosystem-growth > span {
    color: #00a0e3;
}

/* ---------- Fechamento (cartão escuro) ---------- */
.gx-news-eco .article-statement {
    margin-top: 80px;
    padding: 48px;
    border-left: 4px solid #00a0e3;
    border-radius: 16px;
    background:
        radial-gradient(circle at 90% 20%, rgba(128, 43, 226, 0.28) 0%, transparent 45%),
        radial-gradient(ellipse at 10% 100%, rgba(0, 150, 255, 0.18) 0%, transparent 55%),
        #060913;
    color: #ffffff;
}
.gx-news-eco .article-statement h2 {
    max-width: 560px;
    margin: 18px 0 16px;
    font-size: 30px;
    font-weight: 800;
    line-height: 1.3;
    color: #ffffff;
}
.gx-news-eco .article-content .article-statement p {
    max-width: 620px;
    margin-bottom: 20px;
    font-size: 16px;
    color: #94a3b8;
}
.gx-news-eco .article-content .article-statement > strong {
    display: block;
    max-width: 600px;
    font-size: 20px;
    font-weight: 800;
    line-height: 1.5;
    color: #ffffff;
}

/* ---------- Sobre ---------- */
.gx-news-eco .about-galactix {
    margin-top: 80px;
    padding-top: 45px;
    border-top: 1px solid #e2e8f0;
}
.gx-news-eco .about-galactix h2 {
    margin: 14px 0 18px;
    font-size: 28px;
    font-weight: 800;
    color: #0f172a;
}
.gx-news-eco .brand-signature {
    margin-top: 35px;
    padding-top: 25px;
    display: flex;
    flex-direction: column;
    gap: 5px;
    border-top: 1px solid #e2e8f0;
}
.gx-news-eco .article-content .brand-signature strong {
    font-size: 16px;
    font-weight: 800;
    color: #00a0e3;
}
.gx-news-eco .brand-signature span {
    color: #64748b;
    font-size: 14px;
}

/* ---------- Responsivo ---------- */
@media (max-width: 800px) {
    .gx-news-eco .article-heading {
        padding: 40px 0 120px;
    }
    .gx-news-eco .article-breadcrumb {
        margin-bottom: 28px;
    }
    .gx-news-eco .article-heading h1 {
        font-size: 32px;
    }
    .gx-news-eco .article-subtitle {
        font-size: 17px;
    }
    .gx-news-eco .article-hero {
        margin-top: -80px;
    }
    .gx-news-eco .article-hero img {
        aspect-ratio: 16 / 9;
        border-radius: 14px;
    }
    .gx-news-eco .article-body {
        padding-top: 55px;
        padding-bottom: 70px;
    }
    .gx-news-eco .article-content .article-intro {
        font-size: 18px;
    }
    .gx-news-eco .article-section {
        margin-top: 60px;
    }
    .gx-news-eco .article-section h2 {
        font-size: 25px;
    }
    .gx-news-eco .article-quote {
        margin: 45px 0 55px;
        padding: 34px 24px;
    }
    .gx-news-eco .article-content .article-quote p {
        font-size: 18px;
    }
    .gx-news-eco .product-grid,
    .gx-news-eco .product-grid-three {
        grid-template-columns: 1fr;
    }
    .gx-news-eco .product-card-wide {
        grid-column: auto;
    }
    .gx-news-eco .integration-panel {
        padding: 32px 20px;
    }
    .gx-news-eco .integration-systems {
        grid-template-columns: 1fr 1fr;
    }
    .gx-news-eco .integration-systems div:last-child {
        grid-column: 1 / -1;
    }
    .gx-news-eco .newton-card {
        grid-template-columns: 1fr;
        padding: 28px;
    }
    .gx-news-eco .journey-flow {
        padding: 22px;
        flex-direction: column;
        align-items: stretch;
    }
    .gx-news-eco .journey-item {
        min-width: 0;
        padding: 12px;
    }
    .gx-news-eco .journey-arrow {
        margin: 2px 0;
        text-align: center;
        transform: rotate(90deg);
    }
    .gx-news-eco .ecosystem-growth {
        padding: 28px;
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }
    .gx-news-eco .ecosystem-growth > div {
        max-width: none;
        padding: 10px 0;
    }
    .gx-news-eco .ecosystem-growth > span {
        transform: rotate(90deg);
        align-self: center;
    }
    .gx-news-eco .article-statement {
        padding: 38px 24px;
    }
    .gx-news-eco .article-statement h2 {
        font-size: 25px;
    }
}

/* ══════════════════════════════════════════════════════════════
   GALACTIX NOTÍCIA — INTEGRAÇÃO DE SISTEMAS (padrão visual do b2c.html)
   Base (capa, imagem, corpo, citação, fechamento, assinatura)
   reaproveitada de .gx-news-eco; aqui só os blocos exclusivos.
══════════════════════════════════════════════════════════════ */

/* Silos x conectado */
.gx-news-integration .silo-comparison {
    margin: 40px 0 50px;
    display: grid;
    grid-template-columns: 1fr 45px 1fr;
    align-items: stretch;
}
.gx-news-integration .silo-side {
    padding: 28px;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #f8fafc;
}
.gx-news-integration .comparison-label {
    display: block;
    margin-bottom: 18px;
    color: #64748b;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.4px;
}
.gx-news-integration .silo-systems {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 18px;
}
.gx-news-integration .silo-systems span {
    padding: 7px 12px;
    border: 1px solid #e2e8f0;
    border-radius: 100px;
    background: #ffffff;
    color: #475569;
    font-size: 12px;
    font-weight: 700;
}
.gx-news-integration .article-content .silo-side p {
    margin: 0;
    font-size: 14px;
    line-height: 1.6;
}
.gx-news-integration .comparison-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #00a0e3;
    font-size: 22px;
}
.gx-news-integration .silo-connected {
    border-color: rgba(56, 189, 248, 0.35);
    background: #f0f9ff;
}
.gx-news-integration .connected-core {
    width: 160px;
    margin-bottom: 18px;
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    border-radius: 12px;
    background: linear-gradient(135deg, #38bdf8 0%, #00a0e3 55%, #802be2 100%);
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
    color: #ffffff;
}
.gx-news-integration .connected-core small {
    margin-bottom: 2px;
    color: rgba(255, 255, 255, 0.75);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1px;
}
.gx-news-integration .article-content .connected-core strong {
    color: #ffffff;
    font-size: 18px;
    font-weight: 800;
}

/* Fluxo da operação */
.gx-news-integration .operation-flow {
    margin: 38px 0 45px;
    padding: 24px 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px;
    border: 1px solid rgba(56, 189, 248, 0.3);
    border-radius: 16px;
    background: #f0f9ff;
}
.gx-news-integration .flow-step {
    min-width: 82px;
    padding: 10px 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
}
.gx-news-integration .flow-step > span {
    margin-bottom: 3px;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 800;
}
.gx-news-integration .flow-step small {
    margin-bottom: 2px;
    color: #64748b;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .8px;
}
.gx-news-integration .article-content .flow-step strong {
    font-size: 12px;
    font-weight: 700;
    color: #0f172a;
}
.gx-news-integration .flow-arrow {
    margin: 0 2px;
    color: #00a0e3;
    font-size: 15px;
}
.gx-news-integration .flow-highlight {
    border-color: #00a0e3;
    background: #00a0e3;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
}
.gx-news-integration .flow-highlight > span,
.gx-news-integration .flow-highlight small {
    color: #000;
}
.gx-news-integration .article-content .flow-highlight strong {
    color: #ffffff;
}

/* Números */
.gx-news-integration .integration-numbers {
    margin: 38px 0 10px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}
.gx-news-integration .integration-number-card {
    padding: 30px;
    display: flex;
    flex-direction: column;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #ffffff;
}
.gx-news-integration .number-systems {
    color: #00a0e3;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.4px;
}
.gx-news-integration .article-content .integration-number-card strong {
    margin-top: 8px;
    font-size: 64px;
    font-weight: 800;
    letter-spacing: -3px;
    line-height: 1;
    background: linear-gradient(135deg, #38bdf8 0%, #00a0e3 50%, #802be2 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #00a0e3;
}
.gx-news-integration .number-description {
    margin-top: 10px;
    color: #64748b;
    font-size: 13px;
}
.gx-news-integration .article-content .number-note {
    margin-bottom: 45px;
    color: #94a3b8;
    font-size: 12px;
}

/* Integração central (cartão escuro b2c) */
.gx-news-integration .central-integration {
    overflow: hidden;
    margin: 45px 0;
    padding: 42px;
    border: 1px solid rgba(56, 189, 248, 0.15);
    border-radius: 20px;
    background:
        radial-gradient(circle at 50% 45%, rgba(0, 160, 227, 0.22) 0%, transparent 35%),
        radial-gradient(circle at 100% 100%, rgba(128, 43, 226, 0.22) 0%, transparent 50%),
        #060913;
    color: #ffffff;
}
.gx-news-integration .central-title {
    margin-bottom: 40px;
    text-align: center;
}
.gx-news-integration .central-title > span {
    color: #38bdf8;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.5px;
}
.gx-news-integration .central-title h3 {
    max-width: 480px;
    margin: 8px auto 0;
    color: #ffffff;
    font-size: 24px;
    font-weight: 800;
    line-height: 1.35;
}
.gx-news-integration .integration-hub {
    position: relative;
    width: 420px;
    height: 300px;
    margin: 0 auto 30px;
}
.gx-news-integration .integration-hub::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 280px;
    height: 200px;
    transform: translate(-50%, -50%);
    border: 1px dashed rgba(56, 189, 248, 0.3);
    border-radius: 50%;
}
/* neutraliza o .hub-core global (roxo, pílula, pulsante) */
.gx-news-integration .integration-hub .hub-core {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 150px;
    height: 76px;
    transform: translate(-50%, -50%);
    flex-direction: column;
    padding: 0 !important;
    gap: 0 !important;
    border: 1px solid rgba(56, 189, 248, 0.8);
    border-radius: 12px !important;
    background: linear-gradient(135deg, #38bdf8 0%, #00a0e3 55%, #802be2 100%) !important;
    box-shadow: 0 0 40px rgba(0, 160, 227, 0.35);
    animation: none !important;
}
.gx-news-integration .hub-core small {
    color: rgba(255, 255, 255, 0.8);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1px;
}
.gx-news-integration .article-content .hub-core strong {
    color: #ffffff;
    font-size: 18px;
    font-weight: 800;
}
.gx-news-integration .hub-system {
    position: absolute;
    min-width: 92px;
    padding: 11px 12px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.05);
    color: #cbd5e1;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
}
.gx-news-integration .hub-system::after {
    content: "";
    position: absolute;
    background: rgba(56, 189, 248, 0.5);
}
.gx-news-integration .hub-system-1 {
    top: 0;
    left: 50%;
    transform: translateX(-50%);
}
.gx-news-integration .hub-system-1::after {
    top: 100%;
    left: 50%;
    width: 1px;
    height: 72px;
}
.gx-news-integration .hub-system-2 {
    top: 80px;
    left: 0;
}
.gx-news-integration .hub-system-2::after {
    top: 50%;
    left: 100%;
    width: 105px;
    height: 1px;
}
.gx-news-integration .hub-system-3 {
    top: 80px;
    right: 0;
}
.gx-news-integration .hub-system-3::after {
    top: 50%;
    right: 100%;
    width: 105px;
    height: 1px;
}
.gx-news-integration .hub-system-4 {
    bottom: 0;
    left: 55px;
}
.gx-news-integration .hub-system-4::after {
    bottom: 100%;
    left: 50%;
    width: 1px;
    height: 62px;
}
.gx-news-integration .hub-system-5 {
    right: 55px;
    bottom: 0;
}
.gx-news-integration .hub-system-5::after {
    right: 50%;
    bottom: 100%;
    width: 1px;
    height: 62px;
}
.gx-news-integration .hub-stats {
    display: flex;
    justify-content: center;
    gap: 55px;
    padding-top: 25px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.gx-news-integration .hub-stats > div {
    display: flex;
    align-items: center;
    gap: 10px;
}
.gx-news-integration .article-content .hub-stats strong {
    color: #38bdf8;
    font-size: 32px;
    font-weight: 800;
}
.gx-news-integration .hub-stats span {
    color: #94a3b8;
    font-size: 12px;
    line-height: 1.4;
}

/* Eventos */
.gx-news-integration .event-grid {
    margin: 35px 0 40px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}
.gx-news-integration .event-card {
    padding: 24px;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #ffffff;
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.gx-news-integration .event-card:hover {
    transform: translateY(-4px);
    border-color: rgba(0, 160, 227, 0.35);
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.08);
}
.gx-news-integration .event-card > span {
    color: #00a0e3;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.4px;
}
.gx-news-integration .article-content .event-card > strong {
    display: block;
    margin: 8px 0;
    font-size: 17px;
    font-weight: 700;
    color: #0f172a;
}
.gx-news-integration .article-content .event-card p {
    margin: 0;
    font-size: 14px;
    line-height: 1.6;
    color: #64748b;
}

/* Fluxo de inteligência (cartão escuro) */
.gx-news-integration .intelligence-flow {
    margin: 40px 0;
    padding: 26px 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px;
    border: 1px solid rgba(56, 189, 248, 0.15);
    border-radius: 16px;
    background:
        radial-gradient(circle at 100% 0%, rgba(128, 43, 226, 0.25) 0%, transparent 55%),
        #060913;
}
.gx-news-integration .intelligence-flow > div {
    min-width: 88px;
    padding: 10px 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.04);
}
.gx-news-integration .intelligence-flow > div > span {
    margin-bottom: 3px;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 800;
}
.gx-news-integration .article-content .intelligence-flow > div > strong {
    color: #ffffff;
    font-size: 12px;
}
.gx-news-integration .intelligence-flow > span {
    margin: 0 2px;
    color: #00a0e3;
    font-size: 15px;
}
.gx-news-integration .intelligence-flow .intelligence-integrator,
.gx-news-integration .intelligence-flow .intelligence-newton {
    border-color: rgba(56, 189, 248, 0.6);
    background: rgba(0, 160, 227, 0.15);
    box-shadow: 0 0 20px rgba(0, 160, 227, 0.2);
}
.gx-news-integration .article-content .intelligence-flow .intelligence-integrator strong,
.gx-news-integration .article-content .intelligence-flow .intelligence-newton strong {
    color: #38bdf8;
}
.gx-news-integration .article-content .highlight-paragraph {
    padding: 18px 0 18px 24px;
    border-left: 3px solid #00a0e3;
    font-size: 18px;
    color: #0f172a;
}

/* Sobre (Integrador / Galactix) */
.gx-news-integration .about-section {
    margin-top: 80px;
    padding-top: 45px;
    border-top: 1px solid #e2e8f0;
}
.gx-news-integration .about-item + .about-item {
    margin-top: 35px;
    padding-top: 35px;
    border-top: 1px solid #e2e8f0;
}
.gx-news-integration .about-item h2 {
    margin: 14px 0 16px;
    font-size: 26px;
    font-weight: 800;
    color: #0f172a;
}

@media (max-width: 800px) {
    .gx-news-integration .silo-comparison {
        grid-template-columns: 1fr;
        gap: 10px;
    }
    .gx-news-integration .comparison-arrow {
        transform: rotate(90deg);
    }
    .gx-news-integration .operation-flow,
    .gx-news-integration .intelligence-flow {
        padding: 22px;
        flex-direction: column;
        align-items: stretch;
    }
    .gx-news-integration .flow-step,
    .gx-news-integration .intelligence-flow > div {
        min-width: 0;
        padding: 12px;
    }
    .gx-news-integration .flow-arrow,
    .gx-news-integration .intelligence-flow > span {
        margin: 2px 0;
        text-align: center;
        transform: rotate(90deg);
    }
    .gx-news-integration .integration-numbers,
    .gx-news-integration .event-grid {
        grid-template-columns: 1fr;
    }
    .gx-news-integration .central-integration {
        padding: 34px 18px;
    }
    .gx-news-integration .integration-hub {
        width: 100%;
        max-width: 350px;
    }
    .gx-news-integration .hub-system-2::after,
    .gx-news-integration .hub-system-3::after {
        width: 75px;
    }
    .gx-news-integration .hub-stats {
        gap: 30px;
    }
}

/* ══════════════════════════════════════════════════════════════
   GALACTIX NOTÍCIA — TRANSFORMAÇÃO DIGITAL (padrão visual do b2c.html)
   Base (capa, imagem, corpo, citação, fechamento, sobre, assinatura)
   reaproveitada de .gx-news-eco; aqui só os blocos exclusivos.
══════════════════════════════════════════════════════════════ */

/* Eficiência */
.gx-news-transformation .efficiency-grid {
    margin: 38px 0 20px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}
.gx-news-transformation .efficiency-card {
    padding: 24px 22px;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #ffffff;
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.gx-news-transformation .efficiency-card:hover {
    transform: translateY(-4px);
    border-color: rgba(0, 160, 227, 0.35);
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.08);
}
.gx-news-transformation .efficiency-card > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: #e0f2fe;
    color: #00a0e3;
    font-size: 12px;
    font-weight: 800;
}
.gx-news-transformation .article-content .efficiency-card > strong {
    display: block;
    margin: 14px 0 8px;
    font-size: 16px;
    font-weight: 700;
}
.gx-news-transformation .article-content .efficiency-card p {
    margin: 0;
    font-size: 14px;
    line-height: 1.6;
    color: #64748b;
}

/* Case Jafra */
.gx-news-transformation .case-panel {
    margin: 40px 0;
    overflow: hidden;
    border: 1px solid #e2e8f0;
    border-radius: 20px;
    background: #ffffff;
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.06);
}
.gx-news-transformation .case-panel-header {
    padding: 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    background:
        radial-gradient(circle at 90% 10%, rgba(128, 43, 226, 0.3) 0%, transparent 40%),
        radial-gradient(ellipse at 10% 100%, rgba(0, 150, 255, 0.18) 0%, transparent 55%),
        #060913;
}
.gx-news-transformation .case-panel-header span {
    color: #38bdf8;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.5px;
}
.gx-news-transformation .case-panel-header h3 {
    margin: 6px 0 0;
    color: #ffffff;
    font-size: 26px;
    font-weight: 800;
}
.gx-news-transformation .case-panel-header .case-tag {
    flex-shrink: 0;
    padding: 7px 14px;
    border: 1px solid rgba(56, 189, 248, 0.4);
    border-radius: 100px;
    background: rgba(56, 189, 248, 0.1);
    color: #38bdf8;
    font-size: 11px;
}
.gx-news-transformation .article-content .case-intro {
    margin: 0;
    padding: 28px 30px 10px;
    font-size: 16px;
    font-weight: 600;
    color: #0f172a;
}
.gx-news-transformation .case-products {
    padding: 15px 30px 30px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}
.gx-news-transformation .case-product {
    min-height: 140px;
    padding: 20px;
    display: grid;
    grid-template-columns: 36px 1fr;
    gap: 14px;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #f8fafc;
}
.gx-news-transformation .case-product-number {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: #e0f2fe;
    color: #00a0e3;
    font-size: 12px;
    font-weight: 800;
}
.gx-news-transformation .article-content .case-product strong {
    display: block;
    margin-bottom: 6px;
    font-size: 15px;
    font-weight: 700;
}
.gx-news-transformation .article-content .case-product p {
    margin: 0;
    font-size: 13px;
    line-height: 1.55;
    color: #64748b;
}
.gx-news-transformation .case-product-highlight {
    grid-column: 1 / -1;
    min-height: auto;
    border-color: rgba(56, 189, 248, 0.35);
    background: #f0f9ff;
}
.gx-news-transformation .case-flow {
    padding: 24px 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px;
    border-top: 1px solid #e2e8f0;
    background: #f0f9ff;
}
.gx-news-transformation .case-flow > div {
    min-width: 100px;
    padding: 10px 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
}
.gx-news-transformation .case-flow > div span {
    margin-bottom: 2px;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 800;
}
.gx-news-transformation .article-content .case-flow > div strong {
    font-size: 12px;
    color: #0f172a;
}
.gx-news-transformation .case-arrow {
    margin: 0 2px;
    color: #00a0e3;
}
.gx-news-transformation .case-flow .case-flow-highlight {
    border-color: #00a0e3;
    background: #00a0e3;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
}
.gx-news-transformation .case-flow .case-flow-highlight span {
    color: rgba(255, 255, 255, 0.75);
}
.gx-news-transformation .article-content .case-flow .case-flow-highlight strong {
    color: #ffffff;
}

/* Maturidade (cartão escuro) */
.gx-news-transformation .maturity-flow {
    margin-top: 40px;
    padding: 30px 22px;
    display: flex;
    align-items: stretch;
    gap: 6px;
    border: 1px solid rgba(56, 189, 248, 0.15);
    border-radius: 20px;
    background:
        radial-gradient(circle at 100% 0%, rgba(128, 43, 226, 0.25) 0%, transparent 55%),
        #060913;
}
.gx-news-transformation .maturity-step {
    flex: 1;
    padding: 16px;
    display: flex;
    flex-direction: column;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.03);
}
.gx-news-transformation .maturity-step > span {
    margin-bottom: 14px;
    color: #38bdf8;
    font-size: 12px;
    font-weight: 800;
}
.gx-news-transformation .maturity-step small {
    color: #94a3b8;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.2px;
}
.gx-news-transformation .article-content .maturity-step strong {
    margin: 4px 0 8px;
    color: #ffffff;
    font-size: 16px;
    font-weight: 800;
}
.gx-news-transformation .article-content .maturity-step p {
    margin: 0;
    color: #94a3b8;
    font-size: 13px;
    line-height: 1.5;
}
.gx-news-transformation .maturity-arrow {
    align-self: center;
    color: #00a0e3;
}
.gx-news-transformation .maturity-highlight {
    border-color: #00a0e3;
    background: linear-gradient(135deg, #00a0e3 0%, #802be2 100%);
    box-shadow: 0 0 30px rgba(0, 160, 227, 0.3);
}
.gx-news-transformation .maturity-highlight > span,
.gx-news-transformation .maturity-highlight small,
.gx-news-transformation .article-content .maturity-highlight p {
    color: rgba(255, 255, 255, 0.8);
}
.gx-news-transformation .article-content .maturity-highlight strong {
    color: #ffffff;
}

/* Modelos de negócio */
.gx-news-transformation .business-model-grid {
    margin: 38px 0 40px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}
.gx-news-transformation .business-model-card {
    min-height: 200px;
    padding: 24px;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #ffffff;
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.gx-news-transformation .business-model-card:hover {
    transform: translateY(-4px);
    border-color: rgba(0, 160, 227, 0.35);
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.08);
}
.gx-news-transformation .business-model-card > span {
    color: #00a0e3;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.4px;
}
.gx-news-transformation .business-model-card h3 {
    margin: 12px 0 10px;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.35;
    color: #0f172a;
}
.gx-news-transformation .article-content .business-model-card p {
    margin: 0;
    font-size: 14px;
    line-height: 1.6;
    color: #64748b;
}

/* Case COTRAIBI */
.gx-news-transformation .cotraibi-case {
    padding: 40px;
    border: 1px solid rgba(56, 189, 248, 0.3);
    border-radius: 20px;
    background: #f0f9ff;
}
.gx-news-transformation .cotraibi-case-top {
    margin-bottom: 26px;
    display: flex;
    justify-content: space-between;
    gap: 25px;
}
.gx-news-transformation .cotraibi-case-top > div:first-child > span {
    color: #00a0e3;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.5px;
}
.gx-news-transformation .cotraibi-case h3 {
    max-width: 470px;
    margin: 8px 0 0;
    font-size: 23px;
    font-weight: 800;
    line-height: 1.35;
    color: #0f172a;
}
.gx-news-transformation .cotraibi-program {
    height: fit-content;
    padding: 7px 14px;
    border: 1px solid rgba(56, 189, 248, 0.4);
    border-radius: 100px;
    background: #ffffff;
    color: #0284c7;
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}
.gx-news-transformation .article-content .cotraibi-case p {
    font-size: 15px;
}
.gx-news-transformation .network-flow {
    margin: 30px 0;
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #ffffff;
}
.gx-news-transformation .network-flow > div {
    min-width: 92px;
    padding: 10px 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #f8fafc;
}
.gx-news-transformation .network-flow small {
    margin-bottom: 2px;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 800;
}
.gx-news-transformation .article-content .network-flow strong {
    font-size: 12px;
    color: #0f172a;
}
.gx-news-transformation .network-flow > span {
    margin: 0 2px;
    color: #00a0e3;
}
.gx-news-transformation .network-flow .network-core {
    border-color: #00a0e3;
    background: #00a0e3;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
}
.gx-news-transformation .network-flow .network-core small {
    color: rgba(255, 255, 255, 0.75);
}
.gx-news-transformation .article-content .network-flow .network-core strong {
    color: #ffffff;
}
.gx-news-transformation .article-content .cotraibi-result {
    margin-bottom: 0;
    padding-left: 20px;
    border-left: 3px solid #00a0e3;
}

/* Pergunta estratégica */
.gx-news-transformation .strategy-question {
    margin: 40px 0;
    display: grid;
    grid-template-columns: 1fr 45px 1fr;
    align-items: stretch;
}
.gx-news-transformation .old-question,
.gx-news-transformation .new-question {
    padding: 28px;
    border-radius: 16px;
}
.gx-news-transformation .old-question {
    border: 1px solid #e2e8f0;
    background: #f8fafc;
}
.gx-news-transformation .new-question {
    border: 1px solid rgba(56, 189, 248, 0.15);
    background:
        radial-gradient(circle at 100% 0%, rgba(128, 43, 226, 0.25) 0%, transparent 55%),
        #060913;
}
.gx-news-transformation .old-question span,
.gx-news-transformation .new-question span {
    color: #64748b;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.4px;
}
.gx-news-transformation .new-question span {
    color: #38bdf8;
}
.gx-news-transformation .article-content .old-question p,
.gx-news-transformation .article-content .new-question p {
    margin: 10px 0 0;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.45;
    color: #0f172a;
}
.gx-news-transformation .article-content .new-question p {
    color: #ffffff;
}
.gx-news-transformation .question-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #00a0e3;
    font-size: 20px;
}

@media (max-width: 800px) {
    .gx-news-transformation .efficiency-grid,
    .gx-news-transformation .case-products,
    .gx-news-transformation .business-model-grid {
        grid-template-columns: 1fr;
    }
    .gx-news-transformation .case-panel-header {
        align-items: flex-start;
        flex-direction: column;
        gap: 15px;
    }
    .gx-news-transformation .case-product-highlight {
        grid-column: auto;
    }
    .gx-news-transformation .case-flow,
    .gx-news-transformation .network-flow {
        padding: 22px;
        flex-direction: column;
        align-items: stretch;
    }
    .gx-news-transformation .case-flow > div,
    .gx-news-transformation .network-flow > div {
        min-width: 0;
        padding: 11px;
    }
    .gx-news-transformation .case-arrow,
    .gx-news-transformation .network-flow > span {
        margin: 2px 0;
        text-align: center;
        transform: rotate(90deg);
    }
    .gx-news-transformation .maturity-flow {
        flex-direction: column;
    }
    .gx-news-transformation .maturity-arrow {
        transform: rotate(90deg);
    }
    .gx-news-transformation .cotraibi-case {
        padding: 30px 20px;
    }
    .gx-news-transformation .cotraibi-case-top {
        flex-direction: column;
    }
    .gx-news-transformation .cotraibi-program {
        align-self: flex-start;
    }
    .gx-news-transformation .strategy-question {
        grid-template-columns: 1fr;
        gap: 10px;
    }
    .gx-news-transformation .question-arrow {
        transform: rotate(90deg);
    }
}

/* ══════════════════════════════════════════════════════════════
   GALACTIX NOTÍCIA — COMPETITIVIDADE 2026 (padrão visual do b2c.html)
   Breadcrumb reaproveitado de .gx-news-article; capa, imagem, corpo,
   fechamento e assinatura de .gx-news-eco; aqui só os blocos exclusivos.
══════════════════════════════════════════════════════════════ */

/* Capa logo abaixo do breadcrumb escuro */
.gx-news-competitiveness .article-heading {
    padding-top: 60px;
}

/* Números do evento */
.gx-news-competitiveness .event-numbers {
    margin: 45px 0 65px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    overflow: hidden;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #ffffff;
}
.gx-news-competitiveness .event-number {
    min-height: 150px;
    padding: 28px 25px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.gx-news-competitiveness .event-number + .event-number {
    border-left: 1px solid #e2e8f0;
}
.gx-news-competitiveness .article-content .event-number strong {
    margin-bottom: 8px;
    font-size: 42px;
    font-weight: 800;
    letter-spacing: -2px;
    line-height: 1;
    background: linear-gradient(135deg, #38bdf8 0%, #00a0e3 50%, #802be2 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #00a0e3;
}
.gx-news-competitiveness .event-number span {
    color: #64748b;
    font-size: 13px;
    line-height: 1.5;
}

/* Pesquisa (cartão escuro) */
.gx-news-competitiveness .research-panel {
    overflow: hidden;
    margin: 40px 0;
    border: 1px solid rgba(56, 189, 248, 0.15);
    border-radius: 20px;
    background:
        radial-gradient(circle at 100% 0%, rgba(128, 43, 226, 0.25) 0%, transparent 50%),
        radial-gradient(ellipse at 0% 100%, rgba(0, 150, 255, 0.15) 0%, transparent 55%),
        #060913;
}
.gx-news-competitiveness .research-header {
    padding: 34px 38px 28px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.gx-news-competitiveness .research-header > span {
    color: #38bdf8;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.5px;
}
.gx-news-competitiveness .research-header h3 {
    max-width: 550px;
    margin: 8px 0 10px;
    color: #ffffff;
    font-size: 23px;
    font-weight: 800;
    line-height: 1.35;
}
.gx-news-competitiveness .article-content .research-header p {
    margin: 0;
    color: #94a3b8;
    font-size: 13px;
}
.gx-news-competitiveness .research-results {
    display: grid;
    grid-template-columns: 1fr 1fr;
}
.gx-news-competitiveness .research-result {
    padding: 34px 38px;
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 20px;
}
.gx-news-competitiveness .research-result + .research-result {
    border-left: 1px solid rgba(255, 255, 255, 0.1);
}
.gx-news-competitiveness .article-content .research-result > strong {
    color: #38bdf8;
    font-size: 44px;
    font-weight: 800;
    letter-spacing: -2px;
}
.gx-news-competitiveness .research-result span {
    color: #ffffff;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.2px;
}
.gx-news-competitiveness .article-content .research-result p {
    margin: 6px 0 0;
    color: #94a3b8;
    font-size: 13px;
    line-height: 1.55;
}

/* Identidade */
.gx-news-competitiveness .identity-grid {
    margin: 38px 0 42px;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    overflow: hidden;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
}
.gx-news-competitiveness .identity-item {
    min-height: 105px;
    padding: 20px 14px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: #f8fafc;
    transition: background .2s ease;
}
.gx-news-competitiveness .identity-item:hover {
    background: #f0f9ff;
}
.gx-news-competitiveness .identity-item + .identity-item {
    border-left: 1px solid #e2e8f0;
}
.gx-news-competitiveness .identity-item span {
    margin-bottom: 8px;
    color: #00a0e3;
    font-size: 11px;
    font-weight: 800;
}
.gx-news-competitiveness .article-content .identity-item strong {
    font-size: 14px;
    font-weight: 700;
}
.gx-news-competitiveness .article-content .highlight-paragraph {
    margin-top: 35px;
    padding: 18px 0 18px 24px;
    border-left: 3px solid #00a0e3;
    font-size: 18px;
    line-height: 1.7;
    color: #0f172a;
}

/* Tecnologia */
.gx-news-competitiveness .technology-grid {
    margin: 38px 0 40px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}
.gx-news-competitiveness .technology-card {
    min-height: 210px;
    padding: 26px 24px;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #ffffff;
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.gx-news-competitiveness .technology-card:hover {
    transform: translateY(-4px);
    border-color: rgba(0, 160, 227, 0.35);
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.08);
}
.gx-news-competitiveness .technology-card > span {
    color: #00a0e3;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.4px;
}
.gx-news-competitiveness .technology-card h3 {
    margin: 12px 0;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.4;
    color: #0f172a;
}
.gx-news-competitiveness .article-content .technology-card p {
    margin: 0;
    font-size: 14px;
    line-height: 1.65;
    color: #64748b;
}
.gx-news-competitiveness .technology-statement {
    margin: 45px 0;
    padding: 40px;
    border-left: 4px solid #00a0e3;
    border-radius: 16px;
    background:
        radial-gradient(circle at 90% 20%, rgba(128, 43, 226, 0.28) 0%, transparent 45%),
        #060913;
}
.gx-news-competitiveness .technology-statement span {
    display: block;
    margin-bottom: 12px;
    color: #38bdf8;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.5px;
}
.gx-news-competitiveness .article-content .technology-statement strong {
    display: block;
    max-width: 650px;
    color: #ffffff;
    font-size: 23px;
    font-weight: 700;
    line-height: 1.5;
}

/* Fluxo de cooperação */
.gx-news-competitiveness .cooperation-flow {
    margin: 40px 0;
    padding: 26px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px;
    border: 1px solid rgba(56, 189, 248, 0.3);
    border-radius: 16px;
    background: #f0f9ff;
}
.gx-news-competitiveness .cooperation-flow > div {
    min-width: 130px;
    padding: 12px 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
}
.gx-news-competitiveness .cooperation-flow > div span {
    margin-bottom: 4px;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 800;
}
.gx-news-competitiveness .article-content .cooperation-flow > div strong {
    font-size: 13px;
    color: #0f172a;
}
.gx-news-competitiveness .flow-arrow {
    margin: 0 2px;
    color: #00a0e3;
}
.gx-news-competitiveness .cooperation-flow .flow-highlight {
    border-color: #00a0e3;
    background: #00a0e3;
    box-shadow: 0 4px 15px rgba(0, 160, 227, 0.3);
}
.gx-news-competitiveness .cooperation-flow .flow-highlight span {
    color: rgba(255, 255, 255, 0.75);
}
.gx-news-competitiveness .article-content .cooperation-flow .flow-highlight strong {
    color: #ffffff;
}

/* Comunidade Cultura Coop */
.gx-news-competitiveness .culture-community {
    margin: 40px 0;
    padding: 36px;
    display: grid;
    grid-template-columns: 1.3fr .7fr;
    gap: 25px;
    border: 1px solid rgba(56, 189, 248, 0.3);
    border-radius: 20px;
    background: #f0f9ff;
}
.gx-news-competitiveness .culture-community-heading > span {
    color: #00a0e3;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.5px;
}
.gx-news-competitiveness .culture-community-heading h3 {
    margin: 8px 0 0;
    font-size: 21px;
    font-weight: 800;
    line-height: 1.4;
    color: #0f172a;
}
.gx-news-competitiveness .culture-community-number {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
}
.gx-news-competitiveness .article-content .culture-community-number strong {
    font-size: 56px;
    font-weight: 800;
    letter-spacing: -3px;
    line-height: 1;
    background: linear-gradient(135deg, #38bdf8 0%, #00a0e3 50%, #802be2 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #00a0e3;
}
.gx-news-competitiveness .culture-community-number span {
    color: #64748b;
    font-size: 12px;
    line-height: 1.5;
}
.gx-news-competitiveness .article-content .culture-community > p {
    grid-column: 1 / -1;
    margin: 0;
    padding-top: 20px;
    border-top: 1px solid rgba(56, 189, 248, 0.25);
    font-size: 15px;
}

/* Sobre */
.gx-news-competitiveness .about-section {
    margin-top: 80px;
    padding-top: 45px;
    border-top: 1px solid #e2e8f0;
}
.gx-news-competitiveness .about-item + .about-item {
    margin-top: 45px;
    padding-top: 45px;
    border-top: 1px solid #e2e8f0;
}
.gx-news-competitiveness .about-item h2 {
    margin: 14px 0 16px;
    font-size: 26px;
    font-weight: 800;
    color: #0f172a;
}
.gx-news-competitiveness .external-link {
    margin-top: 4px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #00a0e3;
    font-size: 14px;
    font-weight: 700;
    transition: color .2s ease;
}
.gx-news-competitiveness .external-link:hover {
    color: #008cc6;
}
.gx-news-competitiveness .external-link span {
    transition: transform .2s ease;
}
.gx-news-competitiveness .external-link:hover span {
    transform: translate(2px, -2px);
}

@media (max-width: 800px) {
    .gx-news-competitiveness .event-numbers,
    .gx-news-competitiveness .research-results,
    .gx-news-competitiveness .identity-grid,
    .gx-news-competitiveness .technology-grid,
    .gx-news-competitiveness .culture-community {
        grid-template-columns: 1fr;
    }
    .gx-news-competitiveness .event-number,
    .gx-news-competitiveness .identity-item,
    .gx-news-competitiveness .technology-card {
        min-height: auto;
    }
    .gx-news-competitiveness .event-number + .event-number,
    .gx-news-competitiveness .identity-item + .identity-item {
        border-left: 0;
        border-top: 1px solid #e2e8f0;
    }
    .gx-news-competitiveness .research-result + .research-result {
        border-left: 0;
        border-top: 1px solid rgba(255, 255, 255, 0.1);
    }
    .gx-news-competitiveness .technology-statement {
        padding: 34px 24px;
    }
    .gx-news-competitiveness .article-content .technology-statement strong {
        font-size: 20px;
    }
    .gx-news-competitiveness .cooperation-flow {
        padding: 22px;
        flex-direction: column;
        align-items: stretch;
    }
    .gx-news-competitiveness .cooperation-flow > div {
        min-width: 0;
    }
    .gx-news-competitiveness .flow-arrow {
        margin: 2px 0;
        text-align: center;
        transform: rotate(90deg);
    }
    .gx-news-competitiveness .culture-community {
        padding: 30px 24px;
    }
    .gx-news-competitiveness .culture-community-number {
        justify-content: flex-start;
    }
    .gx-news-competitiveness .article-content .culture-community > p {
        grid-column: auto;
    }
}

/* ══════════════════════════════════════════════════════════════
   EMPRESA — padrão visual do b2c.html
   (reaproveita .gx-b2c, .b2c-container, .b2c-eyebrow,
    .b2c-eyebrow-light, .b2c-btn, .b2c-btn-primary)
══════════════════════════════════════════════════════════════ */
.company-page {
    --blue: #00a0e3;
    --blue-dark: #008cc6;
    --black: #0f172a;
    --gray-900: #1e293b;
    --gray-700: #475569;
    --gray-500: #94a3b8;
    --gray-300: #e2e8f0;
    --gray-200: #e2e8f0;
    --gray-100: #f8fafc;
    --white: #FFFFFF;
    color: var(--black);
    background: var(--white);
    overflow: hidden;
}
.company-page *,
.company-page *::before,
.company-page *::after {
    box-sizing: border-box;
}
.company-page h1,
.company-page h2,
.company-page h3,
.company-page p,
.company-page blockquote {
    margin-top: 0;
}
.company-page img {
    max-width: 100%;
}
.company-page .company-section {
    padding: 120px 0;
}
.company-page .section-heading {
    max-width: 730px;
    margin-bottom: 70px;
}
.company-page .section-heading-center {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}
.company-page .section-heading h2 {
    margin-bottom: 20px;
    font-size: clamp(36px, 4vw, 54px);
    font-weight: 700;
    line-height: 1.08;
    letter-spacing: -.045em;
}
.company-page .section-heading p {
    margin-bottom: 0;
    color: var(--gray-700);
    font-size: 17px;
    line-height: 1.8;
}
.company-page .company-hero {
    position: relative;
    min-height: 680px;
    display: flex;
    align-items: center;
    padding: 105px 0;
    color: #fff;
    background: radial-gradient( circle at 83% 15%, rgba(255,255,255,.17), transparent 28% ), var(--blue);
}
.company-page .company-hero::before {
    content: "";
    position: absolute;
    width: 700px;
    height: 700px;
    right: -400px;
    bottom: -470px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 50%;
}
.company-page .company-hero-grid {
    display: grid;
    grid-template-columns: 1.05fr .95fr;
    gap: 90px;
    align-items: center;
}
.company-page .company-hero-content {
    position: relative;
    z-index: 3;
}
.company-page .company-hero h1 {
    max-width: 700px;
    margin-bottom: 30px;
    font-size: clamp(50px, 5.5vw, 78px);
    font-weight: 700;
    line-height: 1.01;
    letter-spacing: -.06em;
}
.company-page .company-hero h1 span {
    display: block;
    color: var(--black);
}
.company-page .company-hero-content > p {
    max-width: 640px;
    margin-bottom: 42px;
    color: rgba(255,255,255,.91);
    font-size: 18px;
    line-height: 1.8;
}
.company-page .hero-flow {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 11px;
}
.company-page .hero-flow span {
    font-size: 11px;
    font-weight: 700;
}
.company-page .hero-flow i {
    color: rgba(255,255,255,.43);
    font-style: normal;
}
.company-page .company-hero-visual {
    position: relative;
    min-height: 480px;
}
.company-page .hero-photo {
    position: absolute;
    z-index: 3;
    top: 0;
    right: 0;
    width: 90%;
    height: 450px;
    overflow: hidden;
    border-radius: 90px 12px 90px 12px;
    box-shadow: 0 30px 70px rgba(0,0,0,.17);
}
.company-page .hero-photo img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}
.company-page .hero-circle {
    position: absolute;
    border: 1px solid rgba(255,255,255,.28);
    border-radius: 50%;
}
.company-page .hero-circle-one {
    width: 440px;
    height: 440px;
    right: -100px;
    top: 85px;
}
.company-page .hero-circle-two {
    width: 300px;
    height: 300px;
    left: -25px;
    bottom: -15px;
}
.company-page .hero-point {
    position: absolute;
    z-index: 5;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 0 8px rgba(255,255,255,.13);
}
.company-page .hero-point-one {
    top: 55px;
    right: 35px;
}
.company-page .hero-point-two {
    left: 15px;
    bottom: 75px;
}
.company-page .company-founders {
    background: #fff;
}
.company-page .founders-intro {
    display: grid;
    grid-template-columns: 1.05fr .95fr;
    gap: 110px;
    align-items: end;
    margin-bottom: 70px;
}
.company-page .founders-intro h2 {
    max-width: 650px;
    margin-bottom: 0;
    font-size: clamp(37px, 4.2vw, 58px);
    line-height: 1.08;
    letter-spacing: -.05em;
}
.company-page .founders-intro h2 span {
    color: var(--blue);
}
.company-page .founders-intro-text p {
    color: var(--gray-700);
    font-size: 15px;
    line-height: 1.8;
}
.company-page .founders-intro-text p:last-child {
    margin-bottom: 0;
}
.company-page .founders-layout {
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    gap: 65px;
    align-items: stretch;
}
.company-page .founders-photo {
    position: relative;
    min-height: 570px;
    overflow: hidden;
    border-radius: 12px 90px 12px 12px;
    background: var(--gray-100);
}
.company-page .founders-photo > img {
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
    object-fit: cover;
}
.company-page .founders-photo::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient( 180deg, transparent 45%, rgba(0,0,0,.6) 100% );
}
.company-page .founders-photo-tag {
    position: absolute;
    z-index: 3;
    left: 38px;
    right: 38px;
    bottom: 38px;
    color: #fff;
}
.company-page .founders-photo-tag span {
    display: block;
    margin-bottom: 10px;
    color: var(--blue);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .17em;
}
.company-page .founders-photo-tag strong {
    display: block;
    max-width: 480px;
    font-size: 24px;
    line-height: 1.35;
}
.company-page .founders-list {
    display: flex;
    flex-direction: column;
    border-top: 1px solid var(--gray-300);
}
.company-page .founder-card {
    position: relative;
    flex: 1;
    display: grid;
    grid-template-columns: 55px 1fr 45px;
    gap: 20px;
    align-items: center;
    min-height: 190px;
    padding: 35px 0;
    border-bottom: 1px solid var(--gray-300);
}
.company-page .founder-number {
    color: var(--blue);
    font-size: 12px;
    font-weight: 700;
}
.company-page .founder-info > span {
    display: block;
    margin-bottom: 8px;
    color: var(--gray-500);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .15em;
}
.company-page .founder-info h3 {
    margin-bottom: 5px;
    font-size: 24px;
    letter-spacing: -.025em;
}
.company-page .founder-info p {
    margin: 0;
    color: var(--gray-700);
    font-size: 13px;
}
.company-page .founder-link {
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--gray-300);
    border-radius: 50%;
    color: var(--black);
    font-size: 18px;
    text-decoration: none;
    transition: background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}
.company-page .founder-link:hover {
    transform: translateY(-2px);
    border-color: var(--blue);
    color: #fff;
    background: var(--blue);
}
.company-page .founders-statement {
    display: grid;
    grid-template-columns: 230px 1fr;
    gap: 80px;
    margin-top: 70px;
    padding-top: 50px;
    border-top: 1px solid var(--gray-300);
}
.company-page .founders-statement > span {
    color: var(--blue);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .15em;
}
.company-page .founders-statement p {
    max-width: 850px;
    margin: 0;
    font-size: clamp(23px, 2.6vw, 34px);
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: -.025em;
}
.company-page .founders-statement strong {
    color: var(--blue);
}
.company-page .company-ecosystem {
    background: var(--gray-100);
}
.company-page .ecosystem {
    display: grid;
    grid-template-columns: 1fr 340px 1fr;
    gap: 42px;
    align-items: center;
}
.company-page .ecosystem-side {
    display: flex;
    flex-direction: column;
    gap: 22px;
}
.company-page .ecosystem-card {
    min-height: 165px;
    display: flex;
    gap: 20px;
    padding: 28px;
    border: 1px solid var(--gray-200);
    border-radius: 18px;
    background: #fff;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.company-page .ecosystem-card:hover {
    transform: translateY(-5px);
    border-color: rgba(0, 160, 227,.5);
    box-shadow: 0 20px 50px rgba(29,29,27,.08);
}
.company-page .ecosystem-index {
    color: var(--blue);
    font-size: 12px;
    font-weight: 700;
}
.company-page .ecosystem-card small {
    display: block;
    margin-bottom: 5px;
    color: var(--gray-500);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .15em;
}
.company-page .ecosystem-card h3 {
    margin-bottom: 10px;
    font-size: 20px;
}
.company-page .ecosystem-card p {
    margin-bottom: 0;
    color: var(--gray-700);
    font-size: 13px;
    line-height: 1.7;
}
.company-page .ecosystem-center {
    position: relative;
    height: 340px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.company-page .ecosystem-orbit {
    position: absolute;
    border: 1px solid rgba(0, 160, 227,.18);
    border-radius: 50%;
}
.company-page .ecosystem-orbit-one {
    width: 330px;
    height: 330px;
}
.company-page .ecosystem-orbit-two {
    width: 260px;
    height: 260px;
}
.company-page .ecosystem-core {
    position: relative;
    z-index: 3;
    width: 205px;
    height: 205px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #fff;
    background: var(--blue);
    box-shadow: 0 25px 60px rgba(0, 160, 227,.28);
}
.company-page .ecosystem-core img {
    width: 70px;
    height: 50px;
    margin-bottom: 12px;
}
.company-page .ecosystem-core strong {
    font-size: 22px;
}
.company-page .ecosystem-core span {
    margin-top: 4px;
    color: rgba(255,255,255,.76);
    font-size: 10px;
}
.company-page .company-evolution {
    background: #fff;
}
.company-page .evolution-grid {
    display: grid;
    grid-template-columns: .95fr 1.05fr;
    gap: 100px;
    align-items: center;
}
.company-page .evolution-visual {
    position: relative;
}
.company-page .evolution-image {
    min-height: 520px;
    overflow: hidden;
    border-radius: 12px 70px 12px 70px;
    background: var(--gray-100);
    box-shadow: 0 30px 70px rgba(29,29,27,.11);
}
.company-page .evolution-image img {
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
    object-fit: cover;
}
.company-page .evolution-badge {
    position: absolute;
    right: -45px;
    bottom: -45px;
    width: 240px;
    padding: 26px;
    border-radius: 16px;
    color: #fff;
    background: var(--blue);
    box-shadow: 0 20px 45px rgba(0, 160, 227,.25);
}
.company-page .evolution-badge small,
.company-page .evolution-badge span {
    display: block;
}
.company-page .evolution-badge small {
    margin-bottom: 5px;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .14em;
}
.company-page .evolution-badge strong {
    display: block;
    margin-bottom: 12px;
    font-size: 23px;
}
.company-page .evolution-badge span {
    color: rgba(255,255,255,.78);
    font-size: 11px;
    line-height: 1.6;
}
.company-page .evolution-content h2,
.company-page .intelligence-content h2,
.company-page .ascensus-content h2 {
    margin-bottom: 25px;
    font-size: clamp(37px, 4vw, 55px);
    line-height: 1.08;
    letter-spacing: -.045em;
}
.company-page .evolution-content h2 span,
.company-page .ascensus-content h2 span {
    color: var(--blue);
}
.company-page .evolution-content > p {
    margin-bottom: 38px;
    color: var(--gray-700);
    font-size: 16px;
    line-height: 1.8;
}
.company-page .evolution-steps {
    border-top: 1px solid var(--gray-300);
}
.company-page .evolution-steps article {
    display: grid;
    grid-template-columns: 55px 1fr;
    gap: 20px;
    padding: 22px 0;
    border-bottom: 1px solid var(--gray-300);
}
.company-page .evolution-steps article > span {
    color: var(--blue);
    font-size: 12px;
    font-weight: 700;
}
.company-page .evolution-steps h3 {
    margin-bottom: 5px;
    font-size: 17px;
}
.company-page .evolution-steps p {
    margin: 0;
    color: var(--gray-700);
    font-size: 13px;
}
.company-page .evolution-message {
    margin-top: 35px;
    padding-left: 22px;
    border-left: 3px solid var(--blue);
    font-size: 18px;
}
.company-page .evolution-message strong {
    display: block;
}
.company-page .company-intelligence {
    position: relative;
    padding: 125px 0;
    color: #fff;
    background: radial-gradient( circle at 80% 40%, rgba(0, 160, 227,.14), transparent 32% ), var(--black);
}
.company-page .intelligence-grid {
    display: grid;
    grid-template-columns: .78fr 1.22fr;
    gap: 90px;
    align-items: center;
}
.company-page .intelligence-content h2 span {
    display: block;
    color: var(--blue);
}
.company-page .intelligence-content p {
    color: #B9C0C7;
    font-size: 15px;
    line-height: 1.8;
}
.company-page .intelligence-flow {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.company-page .intelligence-node {
    width: 105px;
    height: 105px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 12px;
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 50%;
    background: rgba(255,255,255,.03);
    text-align: center;
}
.company-page .intelligence-node small {
    margin-bottom: 5px;
    color: var(--blue);
    font-size: 8px;
}
.company-page .intelligence-node strong {
    font-size: 11px;
}
.company-page .intelligence-node-active {
    border-color: var(--blue);
    background: var(--blue);
    box-shadow: 0 0 45px rgba(0, 160, 227,.28);
}
.company-page .intelligence-node-active small {
    color: rgba(255,255,255,.7);
}
.company-page .intelligence-flow i {
    color: #60656A;
    font-style: normal;
}
.company-page .intelligence-statement {
    max-width: 1000px;
    margin-top: 100px;
    padding-top: 45px;
    border-top: 1px solid rgba(255,255,255,.12);
}
.company-page .intelligence-statement > span {
    display: block;
    margin-bottom: 20px;
    color: var(--blue);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .16em;
}
.company-page .intelligence-statement p {
    margin: 0;
    font-size: clamp(27px, 3.5vw, 46px);
    line-height: 1.3;
    letter-spacing: -.035em;
}
.company-page .intelligence-statement strong {
    display: block;
    color: var(--blue);
}
.company-page .company-ascensus {
    background: #fff;
}
.company-page .ascensus-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 100px;
    align-items: center;
}
.company-page .ascensus-brand {
    display: flex;
    align-items: center;
    gap: 25px;
    margin-bottom: 30px;
}
.company-page .ascensus-brand > span {
    color: var(--blue);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .15em;
}
.company-page .ascensus-brand img {
    width: auto;
    max-width: 120px;
    max-height: 42px;
}
.company-page .ascensus-content > p {
    color: var(--gray-700);
    font-size: 15px;
    line-height: 1.8;
}
.company-page .ascensus-highlight {
    margin-top: 35px;
    padding-left: 20px;
    border-left: 3px solid var(--blue);
    font-size: 17px;
    font-weight: 600;
}
.company-page .ascensus-visual {
    position: relative;
    padding-bottom: 55px;
}
.company-page .ascensus-photo {
    height: 500px;
    overflow: hidden;
    border-radius: 12px 80px 12px 80px;
}
.company-page .ascensus-photo img {
    width: 90%;
    height: 90%;
    display: block;
    object-fit: cover;
}
.company-page .ascensus-stats {
    position: absolute;
    right: 42px;
    bottom: 0;
    width: calc(100% - 60px);
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    padding: 24px;
    border-radius: 16px;
    color: #fff;
    background: var(--black);
    box-shadow: 0 20px 50px rgba(0,0,0,.18);
}
.company-page .ascensus-stats div {
    padding: 0 15px;
    border-right: 1px solid rgba(255,255,255,.12);
}
.company-page .ascensus-stats div:last-child {
    border-right: 0;
}
.company-page .ascensus-stats strong,
.company-page .ascensus-stats span {
    display: block;
}
.company-page .ascensus-stats strong {
    margin-bottom: 5px;
    color: var(--blue);
    font-size: 16px;
}
.company-page .ascensus-stats span {
    color: #AEB5BB;
    font-size: 9px;
}
.company-page .company-numbers {
    padding: 100px 0;
    color: #fff;
    background: var(--blue);
}
.company-page .numbers-heading {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 50px;
    align-items: end;
    padding-bottom: 45px;
    border-bottom: 1px solid rgba(255,255,255,.2);
}
.company-page .numbers-heading > span {
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .16em;
}
.company-page .numbers-heading h2 {
    max-width: 650px;
    margin: 0;
    font-size: clamp(31px, 3.5vw, 47px);
    line-height: 1.15;
    letter-spacing: -.04em;
}
.company-page .numbers-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    padding-top: 55px;
}
.company-page .number-item {
    min-height: 140px;
    padding: 0 35px;
    border-right: 1px solid rgba(255,255,255,.2);
}
.company-page .number-item:first-child {
    padding-left: 0;
}
.company-page .number-item:last-child {
    border-right: 0;
}
.company-page .number-item strong,
.company-page .number-item span {
    display: block;
}
.company-page .number-item strong {
    margin-bottom: 10px;
    font-size: clamp(40px, 5vw, 65px);
    line-height: 1;
}
.company-page .number-item span {
    max-width: 165px;
    color: rgba(255,255,255,.8);
    font-size: 12px;
    line-height: 1.5;
}
.company-page .company-clients {
    background: #fff;
}
.company-page .clients-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-top: 1px solid var(--gray-200);
    border-left: 1px solid var(--gray-200);
}
.company-page .client-card {
    min-height: 240px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 35px;
    border-right: 1px solid var(--gray-200);
    border-bottom: 1px solid var(--gray-200);
    transition: background .2s ease, transform .2s ease;
}
.company-page .client-card:hover {
    background: var(--gray-100);
}
.company-page .client-logo {
    flex: 1;
    display: flex;
    align-items: center;
}
.company-page .client-logo img {
    max-width: 145px;
    max-height: 65px;
}
.company-page .client-card > small {
    margin-bottom: 6px;
    color: var(--gray-500);
    font-size: 8px;
    font-weight: 700;
    letter-spacing: .12em;
}
.company-page .client-card > strong {
    font-size: 13px;
}
.company-page .company-purpose {
    padding: 135px 0;
    background: var(--gray-100);
    text-align: center;
}
.company-page .purpose-words {
    max-width: 1050px;
    margin: 10px auto 35px;
}
.company-page .purpose-words span {
    font-size: clamp(42px, 6vw, 82px);
    font-weight: 700;
    line-height: 1.08;
    letter-spacing: -.055em;
}
.company-page .purpose-words span:nth-child(even) {
    color: var(--blue);
}
.company-page .purpose-words span:not(:last-child)::after {
    content: " ";
}
.company-page .company-purpose p {
    margin: 0;
    color: var(--gray-700);
    font-size: 18px;
}
.company-page .company-cta {
    padding: 110px 0;
    color: #fff;
    background: var(--black);
}
.company-page .cta-grid {
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    gap: 120px;
    align-items: center;
}
.company-page .cta-grid > div:first-child > span {
    display: block;
    margin-bottom: 20px;
    color: var(--blue);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .16em;
}
.company-page .company-cta h2 {
    margin: 0;
    font-size: clamp(42px, 5vw, 67px);
    line-height: 1.05;
    letter-spacing: -.05em;
}
.company-page .company-cta h2 strong {
    display: block;
    color: var(--blue);
}
.company-page .company-cta p {
    margin-bottom: 30px;
    color: #B8BEC4;
    font-size: 15px;
    line-height: 1.8;
}
.company-page .company-button span {
    font-size: 19px;
}
@media (max-width: 1050px) {
    .company-page .company-hero-grid,
    .company-page .founders-intro,
    .company-page .evolution-grid,
    .company-page .intelligence-grid,
    .company-page .ascensus-grid,
    .company-page .cta-grid {
        gap: 55px;
    }
    .company-page .ecosystem {
        grid-template-columns: 1fr 240px 1fr;
        gap: 25px;
    }
    .company-page .ecosystem-center {
        height: 260px;
    }
    .company-page .ecosystem-orbit-one {
        width: 250px;
        height: 250px;
    }
    .company-page .ecosystem-orbit-two {
        width: 205px;
        height: 205px;
    }
    .company-page .ecosystem-core {
        width: 165px;
        height: 165px;
    }
    .company-page .intelligence-flow {
        flex-wrap: wrap;
        justify-content: center;
        gap: 15px;
    }
    .company-page .intelligence-flow i {
        display: none;
    }
}
@media (max-width: 800px) {
    .company-page .company-section {
        padding: 80px 0;
    }
    .company-page .company-hero {
        min-height: auto;
        padding: 80px 0 55px;
    }
    .company-page .company-hero-grid {
        grid-template-columns: 1fr;
    }
    .company-page .company-hero h1 {
        font-size: 46px;
    }
    .company-page .company-hero-visual {
        min-height: 390px;
    }
    .company-page .hero-photo {
        width: 100%;
        height: 360px;
        border-radius: 55px 10px 55px 10px;
    }
    .company-page .founders-intro {
        grid-template-columns: 1fr;
        gap: 30px;
        margin-bottom: 50px;
    }
    .company-page .founders-layout {
        grid-template-columns: 1fr;
        gap: 45px;
    }
    .company-page .founders-photo {
        min-height: 500px;
    }
    .company-page .founder-card {
        min-height: 150px;
    }
    .company-page .founders-statement {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .company-page .ecosystem {
        display: flex;
        flex-direction: column;
    }
    .company-page .ecosystem-side {
        width: 100%;
    }
    .company-page .ecosystem-center {
        order: -1;
        width: 100%;
        height: 280px;
    }
    .company-page .evolution-grid {
        grid-template-columns: 1fr;
    }
    .company-page .evolution-visual {
        margin-bottom: 35px;
    }
    .company-page .evolution-image {
        min-height: 420px;
    }
    .company-page .evolution-badge {
        right: 15px;
        bottom: -35px;
    }
    .company-page .company-intelligence {
        padding: 85px 0;
    }
    .company-page .intelligence-grid {
        grid-template-columns: 1fr;
    }
    .company-page .intelligence-statement {
        margin-top: 70px;
    }
    .company-page .ascensus-grid {
        grid-template-columns: 1fr;
    }
    .company-page .ascensus-photo {
        height: 420px;
    }
    .company-page .ascensus-stats {
        position: relative;
        right: auto;
        bottom: auto;
        width: calc(100% - 20px);
        margin: -35px auto 0;
    }
    .company-page .numbers-heading {
        grid-template-columns: 1fr;
    }
    .company-page .numbers-grid {
        grid-template-columns: 1fr 1fr;
    }
    .company-page .number-item {
        padding: 30px;
        border-bottom: 1px solid rgba(255,255,255,.2);
    }
    .company-page .number-item:first-child {
        padding-left: 30px;
    }
    .company-page .clients-grid {
        grid-template-columns: 1fr 1fr;
    }
    .company-page .cta-grid {
        grid-template-columns: 1fr;
        gap: 45px;
    }
}
@media (max-width: 520px) {
    .company-page .company-hero h1 {
        font-size: 39px;
    }
    .company-page .company-hero-content > p {
        font-size: 16px;
    }
    .company-page .hero-flow {
        display: none;
    }
    .company-page .section-heading {
        margin-bottom: 45px;
    }
    .company-page .founders-intro h2 {
        font-size: 35px;
    }
    .company-page .founders-photo {
        min-height: 430px;
        border-radius: 10px 50px 10px 10px;
    }
    .company-page .founders-photo-tag {
        left: 25px;
        right: 25px;
        bottom: 25px;
    }
    .company-page .founders-photo-tag strong {
        font-size: 19px;
    }
    .company-page .founder-card {
        grid-template-columns: 35px 1fr 42px;
    }
    .company-page .founder-info h3 {
        font-size: 19px;
    }
    .company-page .evolution-content h2,
    .company-page .intelligence-content h2,
    .company-page .ascensus-content h2 {
        font-size: 34px;
    }
    .company-page .intelligence-node {
        width: 92px;
        height: 92px;
    }
    .company-page .ascensus-brand {
        align-items: flex-start;
        flex-direction: column;
        gap: 15px;
    }
    .company-page .ascensus-stats {
        grid-template-columns: 1fr;
        gap: 18px;
    }
    .company-page .ascensus-stats div {
        padding: 0 0 15px;
        border-right: 0;
        border-bottom: 1px solid rgba(255,255,255,.12);
    }
    .company-page .ascensus-stats div:last-child {
        padding-bottom: 0;
        border-bottom: 0;
    }
    .company-page .numbers-grid {
        grid-template-columns: 1fr;
    }
    .company-page .number-item {
        min-height: auto;
        padding: 30px 0 !important;
        border-right: 0;
    }
    .company-page .clients-grid {
        grid-template-columns: 1fr;
    }
    .company-page .client-card {
        min-height: 200px;
    }
    .company-page .purpose-words span {
        display: block;
        font-size: 47px;
    }
    .company-page .company-cta h2 {
        font-size: 40px;
    }
}

/* ---------- Empresa: ajustes do padrão b2c ---------- */
/* fundo escuro do hero b2c no lugar do azul chapado */
.company-page .company-hero {
    background:
        radial-gradient(ellipse at 50% 20%, rgba(20, 60, 130, 0.35) 0%, transparent 60%),
        radial-gradient(circle at 85% 45%, rgba(128, 43, 226, 0.2) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 85%, rgba(0, 150, 255, 0.15) 0%, transparent 60%),
        #060913;
}
.company-page .company-hero::before,
.company-page .hero-circle {
    border-color: rgba(56, 189, 248, 0.2);
}
.company-page .company-hero h1 {
    font-weight: 800;
    letter-spacing: -2px;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}
.company-page .company-hero h1 span {
    color: #00a0e3;
}
.company-page .company-hero-content > p {
    color: #cbd5e1;
}
.company-page .hero-flow span {
    color: #e2e8f0;
}
.company-page .hero-flow i {
    color: #38bdf8;
}
.company-page .hero-point {
    background: #38bdf8;
    box-shadow: 0 0 0 8px rgba(56, 189, 248, 0.15), 0 0 20px rgba(56, 189, 248, 0.6);
}
.company-page .hero-point-two {
    background: #802be2;
    box-shadow: 0 0 0 8px rgba(128, 43, 226, 0.15), 0 0 20px rgba(128, 43, 226, 0.6);
}

/* seções escuras no tom b2c */
.company-page .company-intelligence,
.company-page .company-cta {
    background:
        radial-gradient(circle at 80% 40%, rgba(0, 160, 227, 0.16) 0%, transparent 35%),
        radial-gradient(circle at 10% 90%, rgba(128, 43, 226, 0.18) 0%, transparent 45%),
        #060913;
}
.company-page .ascensus-stats {
    background: #060913;
    border: 1px solid rgba(56, 189, 248, 0.15);
}
.company-page .intelligence-content p,
.company-page .company-cta p {
    color: #94a3b8;
}
.company-page .intelligence-node small {
    color: #38bdf8;
}
.company-page .intelligence-node-active small {
    color: rgba(255, 255, 255, 0.75);
}
.company-page .intelligence-flow i {
    color: #00a0e3;
}
.company-page .intelligence-content h2 span,
.company-page .intelligence-statement strong,
.company-page .company-cta h2 strong,
.company-page .ascensus-stats strong {
    color: #38bdf8;
}

/* números: azul b2c com brilho roxo */
.company-page .company-numbers {
    background:
        radial-gradient(circle at 90% 10%, rgba(128, 43, 226, 0.35) 0%, transparent 45%),
        #00a0e3;
}

/* títulos no peso do b2c */
.company-page .section-heading h2,
.company-page .founders-intro h2,
.company-page .evolution-content h2,
.company-page .intelligence-content h2,
.company-page .ascensus-content h2,
.company-page .numbers-heading h2,
.company-page .company-cta h2,
.company-page .purpose-words span {
    font-weight: 800;
    letter-spacing: -1.5px;
}

/* núcleo do ecossistema em degradê b2c */
.company-page .ecosystem-core {
    background: linear-gradient(135deg, #38bdf8 0%, #00a0e3 55%, #802be2 100%);
    box-shadow: 0 25px 60px rgba(0, 160, 227, 0.3);
}
.company-page .ecosystem-card {
    border-color: #e2e8f0;
    border-radius: 16px;
}
.company-page .ecosystem-card:hover {
    border-color: rgba(0, 160, 227, 0.35);
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.08);
}

/* etiquetas b2c-eyebrow e botão b2c-btn reaproveitados */
.gx-b2c.company-page .b2c-eyebrow {
    margin-bottom: 20px;
}
.company-page .company-button {
    gap: 14px;
}

/* neutraliza a regra global de header (position: fixed !important) */
.company-page header.section-heading,
.company-page header.numbers-heading {
    position: static !important;
    top: auto !important;
    left: auto !important;
    width: auto !important;
    z-index: auto !important;
    flex-direction: initial !important;
    border-bottom: 0 !important;
}
.company-page header.section-heading {
    display: block !important;
}
.company-page header.numbers-heading {
    display: grid !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2) !important;
}
@media (max-width: 800px) {
    .company-page header.numbers-heading {
        grid-template-columns: 1fr;
    }
}
