/* =========================================
   VARIÁVEIS DE TEMA E ANIMAÇÃO
   ========================================= */
:root {
    --elite-bg: #02060d;
    --elite-surface: rgba(255, 255, 255, 0.03);
    --elite-surface-strong: rgba(57, 214, 255, 0.08);
    --elite-border: rgba(255, 255, 255, 0.08);
    --elite-border-strong: rgba(61, 212, 255, 0.25);
    --elite-primary: #39d6ff;
    --elite-accent: #8a2be2;
    --elite-primary-glow: rgba(57, 214, 255, 0.5);
    --elite-text: #f5fbff;
    --elite-text-soft: rgba(245, 251, 255, 0.75);
    --elite-text-muted: rgba(245, 251, 255, 0.55);
    --elite-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.5), 0 0 20px rgba(57, 214, 255, 0.05);
    --elite-radius-xl: 32px;
    --elite-radius-lg: 24px;
    --elite-radius-md: 18px;
    --elite-max-width: 1200px;
    
    /* Tempos de transição ajustados para maior fluidez */
    --elite-transition: 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
}

/* =========================================
   RESET E TIPOGRAFIA
   ========================================= */
*, *::before, *::after { 
    box-sizing: border-box; 
    margin: 0;
    padding: 0;
}

html { 
    scroll-behavior: smooth; 
}

body {
    min-height: 100vh;
    background: radial-gradient(circle at top left, rgba(57, 214, 255, 0.06), transparent 40%), 
                radial-gradient(circle at bottom right, rgba(138, 43, 226, 0.04), transparent 40%), 
                var(--elite-bg);
    color: var(--elite-text); 
    font-family: "Inter", sans-serif;
    overflow-x: hidden; 
    -webkit-font-smoothing: antialiased; 
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* Previne que o body pule quando o menu for aberto no mobile */
html.no-scroll,
body.no-scroll {
    overflow: hidden !important;
    touch-action: none;
}

img, svg { 
    display: block; 
    max-width: 100%; 
}

a { 
    color: inherit; 
    text-decoration: none; 
}

button, input, textarea, select { 
    font: inherit; 
}

button { 
    border: 0; 
    background: transparent; 
    cursor: pointer; 
}

ul, ol { 
    list-style: none; 
}

:focus-visible { 
    outline: 2px solid var(--elite-primary); 
    outline-offset: 4px;
    border-radius: 4px;
}

button:focus-visible, a:focus-visible {
    border-radius: inherit;
}

.sr-only { 
    position: absolute; 
    width: 1px; 
    height: 1px; 
    padding: 0; 
    margin: -1px; 
    overflow: hidden; 
    clip-path: inset(50%); 
    white-space: nowrap; 
    border: 0; 
}

/* =========================================
   ESTRUTURA GERAL E HEADER
   ========================================= */
.elite-tech-site-shell { 
    position: relative; 
    min-height: 100vh; 
    overflow-x: hidden; 
}

.elite-tech-background-glow, 
.elite-tech-grid-overlay { 
    position: fixed; 
    inset: 0; 
    pointer-events: none; 
    z-index: 0; 
}

.elite-tech-background-glow {
    background: radial-gradient(circle at 15% 20%, rgba(57, 214, 255, 0.06), transparent 30%), 
                radial-gradient(circle at 80% 60%, rgba(138, 43, 226, 0.04), transparent 30%);
    filter: blur(50px);
}

.elite-tech-grid-overlay { 
    background-image: linear-gradient(rgba(255, 255, 255, 0.02) 1px, transparent 1px), 
                      linear-gradient(90deg, rgba(255, 255, 255, 0.02) 1px, transparent 1px); 
    background-size: 48px 48px; 
    opacity: 0.3; 
}

.elite-tech-header, 
main, 
.elite-tech-footer { 
    position: relative; 
    z-index: 1; 
}

.elite-tech-header { 
    position: sticky; 
    top: 0; 
    border-bottom: 1px solid var(--elite-border); 
    background: rgba(2, 6, 13, 0.85); 
    backdrop-filter: blur(20px); 
    -webkit-backdrop-filter: blur(20px); 
    z-index: 30; 
    width: 100%;
}

.elite-tech-header__container, 
.elite-tech-section__container, 
.elite-tech-footer__container, 
.elite-tech-hero__container { 
    width: min(100% - 40px, var(--elite-max-width)); 
    margin: 0 auto; 
}

.elite-tech-header__container { 
    display: flex; 
    align-items: center; 
    justify-content: space-between; 
    gap: 20px; 
    min-height: 80px; 
}

.elite-tech-brand { 
    display: inline-flex; 
    align-items: center; 
    gap: 16px; 
    min-width: 0; 
    transition: transform var(--elite-transition);
}

.elite-tech-brand:hover {
    transform: translateY(-1px);
}

.elite-tech-brand__symbol { 
    display: inline-flex; 
    align-items: center; 
    justify-content: center; 
    width: 48px; 
    height: 48px; 
    flex-shrink: 0; 
    border-radius: 50%; 
    border: 1px solid var(--elite-border-strong); 
    background: linear-gradient(180deg, rgba(57, 214, 255, 0.12), rgba(57, 214, 255, 0.02)); 
    box-shadow: 0 4px 12px rgba(57, 214, 255, 0.1); 
    overflow: hidden; 
}

.elite-tech-brand__logo-image { 
    display: block; 
    width: 100%; 
    height: 100%; 
    object-fit: cover; 
}

.elite-tech-brand__text-group { 
    display: flex; 
    flex-direction: column; 
    gap: 2px; 
    min-width: 0; 
}

.elite-tech-brand__title { 
    color: var(--elite-text); 
    font-size: 1.25rem; 
    font-weight: 800; 
    letter-spacing: 0.03em; 
    line-height: 1.1; 
}

.elite-tech-brand__subtitle { 
    color: var(--elite-primary); 
    font-size: 0.7rem; 
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    line-height: 1.4; 
}

/* =========================================
   NAVEGAÇÃO DESKTOP E BOTÕES
   ========================================= */
.elite-tech-navigation__list { 
    display: flex; 
    align-items: center; 
    gap: 8px; 
}

.elite-tech-navigation__link, 
.elite-tech-navigation__button { 
    display: inline-flex; 
    align-items: center; 
    gap: 8px; 
    transition: all var(--elite-transition); 
}

.elite-tech-navigation__link span, 
.elite-tech-navigation__button span,
.elite-tech-navigation__link i, 
.elite-tech-navigation__button i { 
    font-size: 1.2rem; 
}

.elite-tech-cta { 
    display: inline-flex; 
    transition: all var(--elite-transition); 
}

.elite-tech-navigation__link { 
    padding: 10px 16px; 
    border-radius: 12px; 
    color: var(--elite-text-soft); 
    font-weight: 500; 
    line-height: 1; 
}

.elite-tech-navigation__link:hover { 
    background: rgba(255, 255, 255, 0.05); 
    color: var(--elite-text); 
}

.elite-tech-navigation__link--active { 
    background: linear-gradient(90deg, var(--elite-primary), #60efff); 
    color: #001018; 
    font-weight: 700; 
    -webkit-background-clip: text; 
    background-clip: text;
    -webkit-text-fill-color: transparent; 
    background-color: transparent;
}

.elite-tech-navigation__button, 
.elite-tech-cta { 
    align-items: center; 
    justify-content: center; 
    min-height: 46px; 
    padding: 0 24px; 
    border-radius: 12px; 
    font-weight: 600; 
    line-height: 1; 
    text-align: center; 
    user-select: none;
}

.elite-tech-navigation__button--secondary, 
.elite-tech-cta--secondary { 
    border: 1px solid var(--elite-border); 
    background: rgba(255, 255, 255, 0.03); 
    color: var(--elite-text); 
}

.elite-tech-navigation__button--secondary:hover, 
.elite-tech-cta--secondary:hover { 
    border-color: var(--elite-border-strong); 
    background: rgba(255, 255, 255, 0.06); 
    transform: translateY(-2px); 
}

.elite-tech-navigation__button--primary, 
.elite-tech-cta--primary, 
.elite-tech-cta--light { 
    background: linear-gradient(135deg, var(--elite-primary), #1ab4e0); 
    color: #001018; 
    font-weight: 800;
    box-shadow: 0 4px 15px rgba(57, 214, 255, 0.2); 
    position: relative; 
    overflow: hidden;
}

.elite-tech-navigation__button--primary::after, 
.elite-tech-cta--primary::after,
.elite-tech-cta--light::after {
    content: ''; 
    position: absolute; 
    top: 0; 
    left: -100%; 
    width: 100%; 
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
    transition: left 0.6s var(--ease-out-expo);
}

.elite-tech-navigation__button--primary:hover::after, 
.elite-tech-cta--primary:hover::after,
.elite-tech-cta--light:hover::after { 
    left: 100%; 
}

.elite-tech-navigation__button--primary:hover, 
.elite-tech-cta--primary:hover,
.elite-tech-cta--light:hover { 
    box-shadow: 0 8px 25px rgba(57, 214, 255, 0.3); 
    transform: translateY(-3px); 
}

/* =========================================
   COMPONENTES E LISTAS
   ========================================= */
.elite-tech-section { 
    padding: 100px 0; 
}

.elite-tech-eyebrow { 
    display: inline-block; 
    margin-bottom: 16px; 
    color: var(--elite-primary); 
    text-transform: uppercase; 
    letter-spacing: 0.25em; 
    font-size: 0.75rem; 
    font-weight: 800; 
    line-height: 1.3; 
}

.elite-tech-eyebrow--light { 
    color: rgba(255, 255, 255, 0.9); 
}

.elite-tech-panel, 
.elite-tech-info-card, 
.elite-tech-hero-card { 
    border: 1px solid var(--elite-border); 
    background: var(--elite-surface); 
    backdrop-filter: blur(16px); 
    -webkit-backdrop-filter: blur(16px); 
    box-shadow: var(--elite-shadow); 
}

.elite-tech-panel, 
.elite-tech-hero-card { 
    border-radius: var(--elite-radius-xl); 
}

.elite-tech-info-card { 
    border-radius: var(--elite-radius-lg); 
    transition: all var(--elite-transition); 
}

.elite-tech-info-card:hover { 
    transform: translateY(-6px); 
    box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.6), inset 0 1px 1px rgba(255, 255, 255, 0.1); 
    border-color: var(--elite-border-strong); 
    background: rgba(255, 255, 255, 0.05);
}

.elite-tech-panel--highlight { 
    background: linear-gradient(135deg, rgba(57, 214, 255, 0.12), rgba(138, 43, 226, 0.06)); 
    border-color: var(--elite-border-strong); 
}

.elite-tech-feature-list, 
.elite-tech-hero__highlights { 
    display: flex; 
    flex-wrap: wrap; 
    gap: 12px; 
}

.elite-tech-feature-list li, 
.elite-tech-hero__highlights li { 
    padding: 12px 20px; 
    border: 1px solid var(--elite-border); 
    border-radius: 10px; 
    background: rgba(255, 255, 255, 0.02); 
    color: var(--elite-text-soft); 
    font-weight: 500; 
    line-height: 1.4; 
    transition: all var(--elite-transition); 
}

.elite-tech-feature-list li:hover, 
.elite-tech-hero__highlights li:hover { 
    border-color: var(--elite-border-strong); 
    background: rgba(57, 214, 255, 0.06); 
    color: #fff; 
    transform: translateY(-2px); 
}

.elite-contact-icon { 
    width: 24px; 
    height: 24px; 
    flex-shrink: 0; 
    object-fit: contain; 
}

.elite-tech-contact-list { 
    flex-direction: column; 
    margin: 24px 0; 
    gap: 16px; 
    display: flex;
}

.elite-tech-contact-list li { 
    display: flex; 
    align-items: center; 
    gap: 12px; 
    color: var(--elite-text-soft); 
    line-height: 1.5; 
}

.elite-tech-contact-list--light li { 
    color: rgba(255, 255, 255, 0.9); 
}

.elite-tech-footer { 
    padding: 80px 0 48px; 
    border-top: 1px solid var(--elite-border); 
    background: rgba(2, 6, 13, 0.8); 
}

.elite-tech-footer__container { 
    display: grid; 
    grid-template-columns: 1.5fr 1fr 1fr; 
    gap: 48px; 
}

.elite-tech-footer__brand h2,
.elite-tech-footer__brand p.elite-tech-footer__brand-name strong, 
.elite-tech-footer__column h2,
.elite-tech-footer__column h3 { 
    margin-bottom: 24px; 
    color: var(--elite-primary); 
    font-size: 1.1rem; 
    font-weight: 800; 
    letter-spacing: 0.1em; 
    text-transform: uppercase; 
}

.elite-tech-footer__brand p { 
    color: var(--elite-text-soft); 
    line-height: 1.8; 
    max-width: 320px;
}

.elite-tech-footer__column ul { 
    display: grid; 
    gap: 16px; 
}

.elite-tech-footer__column li { 
    display: flex; 
    align-items: center; 
    gap: 12px; 
    color: var(--elite-text-soft); 
    line-height: 1.5; 
}

.elite-tech-footer__column a { 
    color: var(--elite-text-soft); 
    transition: color var(--elite-transition); 
}

.elite-tech-footer__column a:hover { 
    color: var(--elite-primary); 
}

/* =========================================
   EFEITOS DE REVEAL
   ========================================= */
.elite-tech-card-icon { 
    font-size: 2.8rem; 
    background: linear-gradient(135deg, var(--elite-primary), var(--elite-accent)); 
    -webkit-background-clip: text; 
    background-clip: text;
    -webkit-text-fill-color: transparent; 
    margin-bottom: 24px; 
    display: inline-block; 
    filter: drop-shadow(0 4px 12px rgba(57, 214, 255, 0.2)); 
    transition: transform var(--elite-transition); 
}

.elite-tech-info-card:hover .elite-tech-card-icon { 
    transform: scale(1.08) translateY(-4px) rotate(-5deg); 
}

.elite-tech-reveal { 
    opacity: 0; 
    transform: translateY(30px); 
    filter: blur(8px); 
    transition: opacity 0.8s var(--ease-out-expo), transform 0.8s var(--ease-out-expo), filter 0.8s var(--ease-out-expo); 
    will-change: transform, opacity; 
}

.elite-tech-reveal--delay { transition-delay: 0.1s; }
.elite-tech-reveal--delay-2 { transition-delay: 0.2s; }

.elite-tech-reveal.is-visible { 
    opacity: 1; 
    transform: translateY(0); 
    filter: blur(0); 
}

/* =========================================
   MENU MOBILE E RESPONSIVIDADE
   ========================================= */
.elite-tech-overlay, 
.elite-tech-menu-toggle, 
.elite-tech-close-btn { 
    display: none; 
}

@media (max-width: 960px) {
    .elite-tech-overlay { 
        display: block; 
        position: fixed; 
        top: 0;
        left: 0;
        /* Correção de estabilidade: removido vw e vh crus, usando 100% como base com fallback seguro */
        width: 100%;
        height: 100%;
        height: 100dvh;
        background: rgba(0, 0, 0, 0.7); 
        backdrop-filter: blur(6px); 
        -webkit-backdrop-filter: blur(6px);
        opacity: 0; 
        visibility: hidden; 
        transition: opacity 0.4s var(--ease-in-out), visibility 0.4s; 
        z-index: 40; 
        will-change: opacity;
    }
    
    .elite-tech-overlay.is-active { 
        opacity: 1; 
        visibility: visible; 
    }
    
    .elite-tech-menu-toggle { 
        display: flex; 
        flex-direction: column; 
        gap: 6px; 
        padding: 10px; 
        z-index: 10; 
    }
    
    .elite-tech-menu-toggle .line { 
        display: block; 
        width: 32px; 
        height: 2px; 
        background-color: var(--elite-primary); /* Atualizado para Ciano do vídeo */
        border-radius: 10px; 
        transition: background-color 0.3s var(--ease-out-expo), transform 0.3s ease; 
    }
    
    .elite-tech-menu-toggle:hover .line {
        background-color: #60efff;
    }

    /* MENU LATERAL CORRIGIDO E ESTILIZADO IGUAL AO VÍDEO */
    .elite-tech-navigation {
        position: fixed; 
        top: 0;
        right: 0; 
        height: 100%;
        height: 100dvh; 
        transform: translateX(100%); 
        /* Correção de estabilidade: removido o 100vw que causava pulo na rolagem */
        width: min(100%, 320px); 
        padding: 80px 24px 32px; 
        
        background-color: #02060d; 
        background-image: none; 
        
        /* Borda ciano sólida igual a referência e sombra mais suave e dark */
        border-left: 2px solid var(--elite-primary); 
        box-shadow: -10px 0 40px rgba(0, 0, 0, 0.8);
        transition: transform 0.5s var(--ease-out-expo), visibility 0.5s; 
        z-index: 1000; 
        visibility: hidden;
        display: flex;
        flex-direction: column;
        will-change: transform;
    }
    
    .elite-tech-navigation.is-open { 
        transform: translateX(0); 
        visibility: visible; 
    }
    
    .elite-tech-close-btn { 
        display: block; 
        position: absolute; 
        top: 24px; 
        right: 24px; 
        width: 40px; 
        height: 40px; 
        transition: transform 0.4s var(--ease-in-out), opacity 0.4s var(--ease-in-out); 
        z-index: 1001; 
        background: transparent; /* Limpo e profissional como no vídeo */
        border-radius: 50%;
    }
    
    .elite-tech-close-btn.is-spinning {
        transform: rotate(180deg) scale(0.8); 
        opacity: 0; 
    }
    
    .elite-tech-close-btn::before, 
    .elite-tech-close-btn::after { 
        content: ''; 
        position: absolute; 
        top: 50%; 
        left: 50%; 
        width: 24px; /* Linha de fechamento maior e mais clara */
        height: 2px; 
        background-color: var(--elite-primary); /* X em Ciano */
    }
    
    .elite-tech-close-btn::before { transform: translate(-50%, -50%) rotate(45deg); }
    .elite-tech-close-btn::after { transform: translate(-50%, -50%) rotate(-45deg); }
    
    .elite-tech-navigation__list { 
        flex-direction: column; 
        align-items: stretch; 
        gap: 12px; 
        margin-top: 16px;
    }
    
    .elite-tech-navigation__button, 
    .elite-tech-navigation__link { 
        width: 100%; 
        justify-content: flex-start; 
        font-size: 1.05rem; 
        padding: 14px 20px; 
    }
    
    .elite-tech-footer__container { 
        grid-template-columns: 1fr; 
        gap: 48px;
    }
}

@media (max-width: 640px) {
    .elite-tech-header__container, 
    .elite-tech-section__container, 
    .elite-tech-footer__container, 
    .elite-tech-hero__container { 
        width: min(100% - 32px, var(--elite-max-width)); 
    }
    
    .elite-tech-header__container { 
        min-height: 72px; 
    }
    
    .elite-tech-brand__symbol { 
        width: 40px; 
        height: 40px; 
    }
    
    .elite-tech-brand__title { 
        font-size: 1.1rem; 
    }
    
    .elite-tech-section {
        padding: 80px 0;
    }
}