@font-face {
            font-family: "Inter";
            font-style: normal;
            font-weight: 300 800;
            font-display: swap;
            src: url("../fonts/inter-site-variable.woff2") format("woff2");
        }

        @font-face {
            font-family: "Space Grotesk";
            font-style: normal;
            font-weight: 300 700;
            font-display: swap;
            src: url("../fonts/space-grotesk-site-variable.woff2") format("woff2");
        }

        @font-face {
            font-family: "Playfair Display";
            font-style: normal;
            font-weight: 400 600;
            font-display: swap;
            src: url("../fonts/playfair-display-site-variable.woff2") format("woff2");
        }

        @font-face {
            font-family: "Playfair Display";
            font-style: italic;
            font-weight: 400 500;
            font-display: swap;
            src: url("../fonts/playfair-display-italic-site-variable.woff2") format("woff2");
        }

/* =========================================
           SISTEMA DE CORES E ALTA PERFORMANCE
           ========================================= */
        :root {
            --ouro-champagne: #D4AF37;
            --ouro-escuro: #8A6D33;
            --bg-dark: #030303;
            --bg-light: #ffffff;
            --surface-color-dark: rgba(14, 14, 14, 0.95);
            --glass-border: rgba(255, 255, 255, 0.08);
        }

        * { margin: 0; padding: 0; box-sizing: border-box; }
        html { font-size: 16px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; background: var(--bg-dark); overflow-x: hidden; }

        html.apex-restoring-home {
            scroll-behavior: auto !important;
        }

        html.apex-restoring-home #preloader {
            display: none !important;
        }

        .skip-link {
            position: fixed;
            z-index: 1000000;
            top: max(12px, env(safe-area-inset-top));
            left: max(12px, env(safe-area-inset-left));
            padding: 12px 18px;
            border: 1px solid var(--ouro-champagne);
            border-radius: 999px;
            color: #030303;
            background: #fff8d6;
            font: 800 .78rem/1 "Space Grotesk", sans-serif;
            letter-spacing: .08em;
            text-decoration: none;
            transform: translateY(calc(-100% - 28px));
            transition: transform 180ms ease-out;
        }

        .skip-link:focus {
            outline: 2px solid #ffffff;
            outline-offset: 3px;
            transform: translateY(0);
        }

        main:focus {
            outline: none;
        }

        body {
            font-family: 'Inter', sans-serif; margin: 0; overflow-x: hidden;
            background-color: var(--bg-dark); color: #ffffff;
            --surface-color: var(--surface-color-dark);
            --border-color: var(--glass-border);
            --text-muted: #aaaaaa;
            /* O crossfade visual do tema é feito por camadas compostas, sem repintar o body inteiro. */
            transition: none;
        }
        @supports (overflow: clip) {
            html, body { overflow-x: clip; }
        }

        /* =========================================
           ESFERAS DE LUZ (LAG ZERO - RADIAL NATIVO)
           ========================================= */
        .ambient-orb {
            position: fixed; border-radius: 50%; z-index: -1; pointer-events: none; opacity: 0.9;
            will-change: transform; transform: translateZ(0); /* Aceleração de Hardware limpa */
            animation: floatOrb 25s infinite alternate ease-in-out;
        }
        .orb-1 { width: 50vw; height: 50vw; background: radial-gradient(circle, rgba(212, 175, 55, 0.12) 0%, transparent 60%); top: -10%; left: -10%; }
        .orb-2 { width: 40vw; height: 40vw; background: radial-gradient(circle, rgba(255, 255, 255, 0.05) 0%, transparent 60%); bottom: -10%; right: -10%; animation-delay: -12s; }
        .orb-3 { width: 40vw; height: 40vw; background: radial-gradient(circle, rgba(212, 175, 55, 0.08) 0%, transparent 60%); top: 30%; right: -10%; animation-delay: -5s; }

        html.apex-document-hidden .ambient-orb,
        html.apex-native-cursor-mode .ambient-orb {
            animation-play-state: paused;
            will-change: auto;
        }
        
        @keyframes floatOrb {
            0% { transform: translate(0, 0) scale(1); }
            100% { transform: translate(8vw, 8vh) scale(1.1); }
        }

        h1, h2, h3, h4, h5, .font-display { font-family: 'Space Grotesk', sans-serif; letter-spacing: -0.04em; line-height: 1.1; font-weight: 800; }
        .container { width: 100%; max-width: 1440px; margin: 0 auto; padding: 0 6vw; position: relative; z-index: 10; }
        .section-py { padding: 15vh 0; position: relative; overflow: visible; }
        .min-h-screen { min-height: 100vh; }

        /* =========================================
           CURSOR CUSTOMIZADO PREMIUM
           ========================================= */
        @media (pointer: fine) { html.apex-cursor-ready body, html.apex-cursor-ready a, html.apex-cursor-ready button, html.apex-cursor-ready .faq-header, html.apex-cursor-ready .footer-link { cursor: none !important; } }
        .cursor-dot, .cursor-ring {
            pointer-events: none; position: fixed; top: 0; left: 0; z-index: 99999999;
            translate: -100px -100px; will-change: translate;
        }
        .cursor-dot {
            --cursor-scale: 1; width: 8px; height: 8px; background: var(--ouro-champagne); border-radius: 50%;
            transform: translate(-50%, -50%) scale(var(--cursor-scale));
            transition: transform 0.2s, background 0.3s; box-shadow: 0 0 10px var(--ouro-champagne);
        }
        .cursor-ring { transform: translate(-50%, -50%); }
        .cursor-ring { width: 34px; height: 34px; border: 1px solid rgba(212, 175, 55, 0.5); border-radius: 50%; transition: width 0.3s, height 0.3s, background 0.3s, border-color 0.3s; }
        .cursor-ring.hovering { width: 70px; height: 70px; border-color: transparent; background: rgba(255, 255, 255, 0.1); }
        @media (pointer: coarse) { .cursor-dot, .cursor-ring { display: none !important; } }

        html.apex-native-cursor-mode,
        html.apex-native-cursor-mode body,
        html.apex-native-cursor-mode body * {
            cursor: auto !important;
        }

        html.apex-native-cursor-mode a,
        html.apex-native-cursor-mode button,
        html.apex-native-cursor-mode [role="button"],
        html.apex-native-cursor-mode .project-viewer__external,
        html.apex-native-cursor-mode .project-viewer__close,
        html.apex-native-cursor-mode .legal-dialog__close {
            cursor: pointer !important;
        }

        html.apex-native-cursor-mode .js-cursor-dot,
        html.apex-native-cursor-mode .js-cursor-ring {
            opacity: 0 !important;
            visibility: hidden !important;
            pointer-events: none !important;
        }

        /* =========================================
           DOURADO E PRATA CORRIGIDOS (MENOS ESTOURO)
           ========================================= */
        @keyframes platShine { 0% { background-position: 0% 50%; } 100% { background-position: 200% 50%; } }

        .premium-gold-text {
            background-image: linear-gradient(to right, #B58B2A 0%, #E2C770 20%, #D4AF37 40%, #E2C770 60%, #B58B2A 80%, #E2C770 100%);
            -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;
            animation: platShine 6s linear infinite; background-size: 200% auto;
            display: inline-block; padding-bottom: 0.15em; font-weight: 900;
            filter: none; text-shadow: 0 2px 8px rgba(212, 175, 55, 0.25);
            contain: paint;
        }
        .silver-text {
            background-image: linear-gradient(to right, #777777 0%, #D4D4D4 25%, #999999 50%, #D4D4D4 75%, #777777 100%);
            -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;
            animation: platShine 7s linear infinite; background-size: 200% auto; font-weight: 900;
            filter: none; text-shadow: 0 2px 8px rgba(255, 255, 255, 0.15);
            contain: paint;
        }
        .premium-gold-text.apex-shine-active,
        .silver-text.apex-shine-active { will-change: background-position; }

        .hero-title-size { font-size: clamp(2.5rem, 6.5vw, 7.5rem); }
        .mega-title-size { font-size: clamp(2.3rem, 5.5vw, 7rem); }
        .giant-title-size { font-size: clamp(2.1rem, 4.5vw, 5.5rem); }
        .cine-stage { width: 100%; position: relative; z-index: 10; display: flex; flex-direction: column; }

        /* A promoção para a GPU acontece apenas enquanto cada elemento está em movimento. */
        .js-anim-el { 
            visibility: hidden; 
        }
        .js-anim-el.motion-layer-ready { will-change: transform, opacity; }

        /* =========================================
           CARDS PREMIUM
           ========================================= */
        .lux-card {
            background: var(--surface-color); border: 1px solid var(--border-color); border-radius: 20px; padding: 40px;
            height: 100%; display: flex; flex-direction: column; position: relative;
            transition: box-shadow 0.4s ease, border-color 0.4s ease;
        }
        .lux-card::before {
            content: ''; position: absolute; inset: 0; border-radius: 20px; padding: 1px;
            background: linear-gradient(135deg, rgba(255,255,255,0.1), transparent);
            -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
            -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none;
        }
        @media (min-width: 1024px) {
            .lux-card:hover { box-shadow: 0 30px 60px rgba(0,0,0,0.9), inset 0 0 0 1px rgba(212, 175, 55, 0.5); z-index: 10; border-color: transparent;}
        }
        .num-index { font-family: 'Space Grotesk'; font-size: 2.2rem; color: var(--text-muted); display: inline-block; margin-bottom: 24px; font-weight: 800; }

        /* BOTÕES */
        .btn {
            display: inline-flex; align-items: center; justify-content: center; padding: 20px 48px; border-radius: 100px;
            font-weight: 800; font-size: 1.1rem; letter-spacing: 0.05em; text-decoration: none;
            border: none; z-index: 1; text-transform: uppercase;
            transition: background-color 0.4s ease, box-shadow 0.4s ease, color 0.4s ease, border-color 0.4s ease;
        }
        .btn-outline { background: transparent; border: 1px solid var(--border-color); color: #fff; }
        .btn-gold {
            background: linear-gradient(135deg, #E6C265, #A88647); color: #000 !important; font-weight: 900;
            box-shadow: 0 10px 30px rgba(212, 175, 55, 0.3);
        }
        .btn:hover {
            background: linear-gradient(to right, #D4AF37, #FFFCE0, #D4AF37) !important; background-size: 200% auto !important; animation: platShine 1.5s linear infinite !important;
            color: #000 !important; box-shadow: 0 15px 40px rgba(212, 175, 55, 0.6) !important; border-color: transparent !important;
        }

        .tag { display: inline-flex; align-items: center; padding: 10px 28px; border-radius: 100px; border: 1px solid var(--border-color); font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.2em; color: var(--text-muted); font-weight: 800; }
        .tag-gold { border-color: rgba(212, 175, 55, 0.4); color: var(--ouro-champagne); background: rgba(212, 175, 55, 0.05); box-shadow: 0 0 20px rgba(212, 175, 55, 0.15);}

        .grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 4vw; align-items: flex-start; }
        .grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3vw; }
        .grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2vw; }

        /* VÍDEOS DE FUNDO */
        .video-bg-full { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0.95; z-index: 0; pointer-events: none; background: #000; }
        .video-overlay { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
        .overlay-dark { background: radial-gradient(circle at center, rgba(3,3,3,0.15) 0%, rgba(3,3,3,0.8) 100%); }
        .overlay-linear { background: linear-gradient(to bottom, rgba(3,3,3,0.15), rgba(3,3,3,0.85)); }

        /* Recorta somente a mídia transformada; o conteúdo e seus sweeps continuam livres. */
        .cine-bg-stage {
            position: absolute; inset: 0; z-index: 0; overflow: hidden;
            pointer-events: none; isolation: isolate; contain: paint;
        }
        .js-tilt-shell { min-width: 0; height: 100%; transform-style: preserve-3d; }
        .js-tilt-shell > .js-tilt { width: 100%; height: 100%; }
        .drawer-container > .js-tilt-shell { height: auto; margin-bottom: 24px; }
        .drawer-container > .js-tilt-shell > .drawer-card { margin-bottom: 0; }
        .cine-bg-stage > .video-bg-full,
        .cine-bg-stage > .video-overlay { position: absolute; inset: 0; width: 100%; height: 100%; }
        .js-zoom-bg.motion-layer-ready { will-change: transform; }
        footer.js-footer { overflow: hidden; isolation: isolate; --cine-bg-offset: 10vh; }
        #hero {
            --cine-bg-offset: 100px;
            background-color: #000;
            background-image: url('../posters/hero-desktop-first-frame.jpg');
            background-position: center;
            background-size: cover;
        }
        #hero > .video-bg-full {
            opacity: 0;
            transition: opacity 180ms ease-out;
        }
        #hero > .video-bg-full.is-media-ready { opacity: 0.95; }
        @media (max-width: 768px) {
            #hero { background-image: url('../posters/hero-mobile-first-frame.jpg'); }
        }
        @media (prefers-reduced-motion: reduce) {
            #hero > .video-bg-full { transition: none; }
        }
        @supports (overflow: clip) {
            .cine-bg-stage, footer.js-footer { overflow: clip; }
        }

        /* No PC o fundo conserva o mesmo parallax dentro de uma superfície do tamanho
           da tela, em vez de criar texturas com a altura inteira de seções longas. */
        @media (min-width: 769px) {
            .js-cine-section > .cine-bg-stage {
                position: sticky; inset: auto; top: 0; width: 100%; height: 100vh;
                margin-top: calc(-1 * var(--cine-bg-offset, 15vh));
                margin-bottom: calc(-100vh + var(--cine-bg-offset, 15vh));
                contain: layout paint;
            }
        }
        @media (max-width: 768px) {
            .js-cine-section > .cine-bg-stage {
                position: sticky; inset: auto; top: 0; width: 100%; height: 100vh;
                margin-top: calc(-1 * var(--cine-bg-offset, 10vh));
                margin-bottom: calc(-100vh + var(--cine-bg-offset, 10vh));
                contain: layout paint;
            }
            @supports (height: 100svh) {
                .js-cine-section > .cine-bg-stage {
                    height: 100svh;
                    margin-bottom: calc(-100svh + var(--cine-bg-offset, 10vh));
                }
            }
        }
        
        .mobile-video { display: none; }
        @media (max-width: 768px) { .desktop-video { display: none; } .mobile-video { display: block; } }

        /* =========================================
           PRELOADER COM O "DIGITAL" GIGANTE
           ========================================= */
        #preloader { position: fixed; inset: 0; background: #030303; z-index: 999999; display: flex; align-items: center; justify-content: center; }
        #preloader video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0.4; pointer-events: none; }
        
        .preloader-center { display: flex; flex-direction: column; align-items: center; justify-content: center; position: relative; z-index: 2; }
        .pl-brand-wrap { display: flex; gap: 2px; overflow: hidden; padding-bottom: 5px; }
        .pl-letter-mask { overflow: hidden; display: inline-block; }
        .pl-letter { font-family: 'Space Grotesk'; font-size: clamp(4.5rem, 12vw, 8rem); font-weight: 900; line-height: 0.9; display: inline-block; transform: translateY(110%); color: #ffffff; margin: 0; padding: 0;}
        
        .pl-sub {
            font-family: 'Space Grotesk'; font-size: clamp(3rem, 6vw, 4.5rem);
            letter-spacing: 0.35em; font-weight: 800; text-align: center;
            margin-top: 10px; opacity: 0; z-index: 2; position: relative;
            margin-right: -0.35em;
        }

        /* =========================================
           CABEÇALHO COM ANIMAÇÃO DE TROCA DE COR
           ========================================= */
        #header {
            position: fixed; top: 0; width: 100%; height: 100px;
            background: transparent; border: none;
            z-index: 9999; display: flex; align-items: center; padding: 0 4vw;
            isolation: isolate;
        }
        #header::before {
            content: ''; position: absolute; inset: 0; z-index: 0;
            background: rgba(255, 255, 255, 0.95);
            border-bottom: 1px solid rgba(0, 0, 0, 0.05);
            opacity: 0; contain: paint; pointer-events: none;
            transform: translateZ(0);
            transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1);
        }
        .header-content { display: flex; justify-content: center; align-items: center; width: 100%; max-width: 1440px; position: relative; z-index: 1; margin: 0 auto; }
        .logo-container { display: flex; justify-content: center; position: relative; }
        .logo-text { 
            font-family: 'Space Grotesk', sans-serif; font-size: 2.2rem; font-weight: 900; 
            letter-spacing: 8px; position: relative; display: inline-grid;
        }
        .logo-text > span {
            grid-area: 1 / 1; transform: translateZ(0);
            transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1);
        }
        #header.is-theme-transitioning::before,
        #header.is-theme-transitioning .logo-text > span { will-change: opacity; }
        .logo-text-dark { color: #fff; opacity: 1; filter: drop-shadow(0 2px 10px rgba(0,0,0,0.8)); }
        .logo-text-light { color: #030303; opacity: 0; }
        
        .mobile-menu-btn {
            position: absolute; right: 0; display: flex; align-items: center; justify-content: center;
            background: rgba(0,0,0,0.5); border: 1px solid rgba(255,255,255,0.2);
            color: #fff; font-size: 1.8rem; width: 55px; height: 55px; border-radius: 50%; cursor: pointer;
            transition: background 0.4s, color 0.4s, border-color 0.4s;
        }
        .mobile-menu-btn:hover { background: var(--ouro-champagne); color: #000; border-color: transparent;}
        
        /* OVERLAY DO MENU MOBILE */
        .mobile-menu-overlay {
            position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background: rgba(5, 5, 5, 0.98);
            z-index: 100000; display: flex; flex-direction: column; justify-content: flex-start; align-items: center;
            opacity: 0; visibility: hidden; transition: opacity 0.5s ease, visibility 0.5s;
            overflow-y: auto; padding: 12vh 0;
        }
        .mobile-menu-overlay.active { opacity: 1; visibility: visible; }
        .mobile-menu-content { display: flex; flex-direction: column; gap: clamp(15px, 3vh, 35px); text-align: center; list-style: none; padding: 0; margin: 0; align-items: center; width: 100%; }
        .mobile-link { color: #fff; font-size: clamp(1.8rem, 4vw, 2.8rem); text-decoration: none; font-weight: 800; font-family: 'Space Grotesk'; text-transform: uppercase; transition: color 0.3s; display: block; text-align: center; }
        .mobile-link:hover { color: var(--ouro-champagne); letter-spacing: 2px; }
        
        .close-menu-btn {
            position: fixed; top: 25px; right: 4vw; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1);
            color: #fff; font-size: 2rem; width: 60px; height: 60px; border-radius: 50%; cursor: pointer; transition: background 0.4s, color 0.4s;
            display: flex; justify-content: center; align-items: center; z-index: 100001;
        }
        .close-menu-btn:hover { background: #fff; color: #000; }

        /* =========================================
           O TEMA CLARO DINÂMICO (ANIMAÇÕES)
           ========================================= */
        /* O estado claro fica restrito ao palco APEX e ao cabeçalho. O body
           permanece escuro para nenhum texto preto vazar para outras seções. */
        #header.is-apex-light { background: transparent; border-bottom: none; }
        #header.is-apex-light::before {
            opacity: 1;
        }
        #header.is-apex-light .logo-text-dark { opacity: 0; }
        #header.is-apex-light .logo-text-light { opacity: 1; }
        #header.is-apex-light .mobile-menu-btn {
            background: #ffffff;
            color: #030303;
            border-color: rgba(0,0,0,0.1);
        }

        /* Blindagem de contraste das áreas escuras. */
        #hero, #diagnostico, #flow, #servicos, #metricas,
        #processo, #demonstracoes, #faq, .js-footer { color: #ffffff; }
        .text-muted { color: var(--text-muted); }

        /* =========================================
           ESTRUTURA DE CONVERSÃO (VÍDEO CRESCENDO)
           ========================================= */
        .drawer-card {
            flex-direction: row; align-items: center; 
            padding: 0; margin-bottom: 24px; overflow: hidden;
        }
        .drawer-card-content { width: 55%; padding: 60px; display: flex; flex-direction: column; justify-content: center; z-index: 2; }

        .services-capability-strip,
        .apex-services-capability-strip {
            position: relative;
            margin-top: 48px;
            padding: 18px 28px;
            overflow: hidden;
            border: 1px solid rgba(212, 175, 55, 0.28);
            border-radius: 999px;
            background: linear-gradient(110deg, rgba(212,175,55,0.08), rgba(255,255,255,0.025), rgba(212,175,55,0.06));
            box-shadow: inset 0 0 28px rgba(212,175,55,0.035), 0 18px 45px rgba(0,0,0,0.22);
            color: #f1df9b;
            font-family: 'Space Grotesk', sans-serif;
            font-size: clamp(0.67rem, 0.82vw, 0.9rem);
            font-weight: 700;
            letter-spacing: 0.08em;
            line-height: 1.45;
            text-align: center;
            white-space: nowrap;
        }

        .services-capability-strip::before,
        .apex-services-capability-strip::before {
            content: '';
            position: absolute;
            inset: 0;
            pointer-events: none;
            background: linear-gradient(90deg, transparent, rgba(255,255,255,0.08), transparent);
            transform: translateX(-100%);
            transition: transform 1.1s cubic-bezier(0.22, 1, 0.36, 1);
        }

        .services-capability-strip.is-in-view::before,
        .apex-services-capability-strip.is-in-view::before { transform: translateX(100%); }
        
        .lux-card > .js-grow-square-outer { transform: scale(0.2) translateZ(0); clip-path: inset(0 round 50%); }
        .js-grow-square-outer.motion-layer-ready { will-change: transform, clip-path; }

        /* PROCESSO */
        .proc-line-wrap { position:absolute; left:0; top:0; width:4px; height:100%; background:rgba(255,255,255,0.05); border-radius: 4px; }
        .js-proc-line { position:absolute; left:0; top:0; width:4px; height:100%; transform: scaleY(0); transform-origin: 50% 0%; will-change: transform; background: linear-gradient(to bottom, #FFF8D6, #D4AF37, #A88647); box-shadow: 0 0 25px rgba(212, 175, 55, 1); border-radius: 4px; }
        .proc-dot { width: 20px; height: 20px; border-radius: 50%; background: #030303; position: absolute; left: -40px; top: 40px; border: 2px solid rgba(255,255,255,0.2); transition: transform 0.5s, background-color 0.5s, border-color 0.5s, box-shadow 0.5s; z-index: 2;}
        .proc-active .proc-dot { background: var(--ouro-champagne); border-color: #fff; box-shadow: 0 0 20px rgba(212, 175, 55, 1), 0 0 50px rgba(212, 175, 55, 0.8); transform: scale(1.4); }

        /* DASHBOARD */
        .flow-dashboard { background: var(--surface-color); border: 1px solid var(--border-color); border-radius: 20px; overflow: hidden; }
        .dash-header { display: grid; grid-template-columns: 2.5fr 1fr 1fr 1fr; gap: 2vw; padding: 40px; border-bottom: 1px solid var(--border-color); align-items: center; background: rgba(0,0,0,0.5); }
        .dash-table { width: 100%; border-collapse: collapse; text-align: left; min-width: 720px; }
        .dash-table th, .dash-table td { padding: 24px 32px; border-bottom: 1px solid var(--border-color); vertical-align: middle; background: rgba(0,0,0,0.2); }
        .dash-table th { font-size: 0.85rem; color: var(--text-muted); text-transform: uppercase; font-weight: 800; }
        .badge { display: inline-flex; padding: 8px 16px; border-radius: 100px; font-size: 0.85rem; border: 1px solid var(--border-color); font-weight: 700; }
        .badge.gold { color: #000; background: var(--ouro-champagne); border-color: var(--ouro-champagne); box-shadow: 0 0 15px rgba(212,175,55,0.4);}

        /* =========================================
           SEÇÃO APEX ENGAVETANDO (PINNED QUE TRAVA O SCROLL)
           ========================================= */
        #sobre-apex {
            background-color: transparent !important;
            position: relative; z-index: 20; overflow: clip; isolation: isolate;
        }

        /* Fundo limitado ao viewport: mantém a cena e evita uma camada de vídeo com milhares de px de altura. */
        .apex-bg-stage {
            position: sticky; top: 0; width: 100%; height: 100vh; margin-bottom: -100vh;
            z-index: 0; overflow: clip; contain: layout paint; pointer-events: none; background: #030303;
        }
        @supports (height: 100svh) {
            .apex-bg-stage { height: 100svh; margin-bottom: -100svh; }
        }
        #sobre-apex .apex-bg-stage .video-bg-full {
            position: absolute; inset: 0; width: 100%; height: 100%;
            opacity: 1 !important; filter: none; z-index: 0;
        }
        .apex-theme-layer {
            position: absolute; inset: 0; z-index: 1; pointer-events: none;
            background: rgba(255, 255, 255, 0.06); opacity: 0;
            contain: paint; transform: translateZ(0);
            transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1);
        }
        #sobre-apex.is-theme-transitioning .apex-theme-layer { will-change: opacity; }
        #sobre-apex.is-apex-light .apex-theme-layer {
            opacity: 1;
        }
        #sobre-apex .container, #sobre-apex .apex-stack-wrap { z-index: 2; }
        
        .apex-white-text-override p { color: #555 !important; }
        .apex-white-text-override h2, .apex-white-text-override h3 { color: #000 !important; }
        #sobre-apex .apex-intro .cine-stage > h2,
        #sobre-apex .apex-intro .cine-stage > h3,
        #sobre-apex .apex-intro > p { color: #fff !important; }
        #sobre-apex .apex-intro .tag {
            color: var(--ouro-champagne) !important;
            background: rgba(3, 3, 3, 0.42) !important;
        }
        #sobre-apex .apex-stack-card p { color: #f2f2f2 !important; }
        #sobre-apex .apex-final-card > p { color: #f2f2f2 !important; }

        .apex-stack-wrap {
            height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            position: relative;
            width: 100%;
            overflow: hidden;
            z-index: 2; 
        }
        @supports (height: 100svh) {
            .apex-stack-wrap { height: 100svh; }
        }

        .apex-cards-container {
            position: relative;
            width: 90vw;
            max-width: 900px;
            height: 65vh;
            contain: layout style;
        }

        .apex-stack-card {
            position: absolute;
            top: 0; left: 0; width: 100%; height: 100%;
            background: #080808; 
            border: 1px solid rgba(212, 175, 55, 0.3);
            box-shadow: 0 30px 60px rgba(0,0,0,0.2), inset 0 0 20px rgba(212, 175, 55, 0.05);
            border-radius: 30px;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            padding: 4vw 6vw;
            contain: layout paint style;
            isolation: isolate;
            transform-origin: center center;
            overflow: hidden; 
        }
        .apex-stack-card.motion-layer-ready { will-change: transform, opacity; }

        /* Demonstrações: a mídia 16:9 não pode impor os 1920 px intrínsecos ao grid. */
        #demonstracoes .grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
        #demonstracoes .lux-card { min-width: 0; }
        #demonstracoes .js-grow-square-outer {
            position: relative; display: block; width: 100%; min-width: 0;
            aspect-ratio: 16 / 9; flex: 0 0 auto;
            transform-origin: 50% 50%; contain: paint;
        }
        #demonstracoes .js-grow-square-outer > video {
            position: absolute; inset: 0; display: block; width: 100%; height: 100%;
            max-width: 100%; object-fit: cover;
        }

        .apex-stack-content {
            position: relative;
            z-index: 5;
            max-width: 700px;
            text-align: center;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .giant-letter-top {
            font-family: 'Space Grotesk', sans-serif;
            font-size: clamp(6rem, 15vw, 12rem);
            line-height: 0.8;
            font-weight: 900;
            margin-bottom: 0px;
        }

        .apex-stack-card h4 {
            font-size: clamp(2.5rem, 4vw, 4rem);
            margin-bottom: 24px;
            color: #fff;
            text-transform: uppercase;
        }

        .apex-stack-card p {
            font-size: clamp(1.15rem, 1.5vw, 1.35rem);
            line-height: 1.6;
            color: #aaaaaa;
            font-weight: 500;
            max-width: 600px;
        }

        @media (prefers-reduced-motion: reduce) {
            .apex-stack-wrap {
                height: auto;
                min-height: 0;
                padding: clamp(2rem, 6vw, 5rem) 0;
                overflow: visible;
            }

            .apex-cards-container {
                display: grid;
                width: min(90vw, 900px);
                height: auto;
                gap: 1.25rem;
            }

            .apex-stack-card {
                position: relative;
                min-height: min(65vh, 620px);
            }
        }

        /* FAQ */
        .faq-item { background: var(--surface-color); border: 1px solid var(--border-color); border-radius: 12px; margin-bottom: 16px; overflow: hidden; transition: border-color 0.4s ease, background-color 0.4s ease, box-shadow 0.4s ease; }
        .faq-header { width: 100%; padding: 24px 32px; border: 0; background: transparent; color: inherit; text-align: left; font-size: 1.3rem; display: flex; justify-content: space-between; align-items: center; cursor: pointer; font-family: 'Space Grotesk'; font-weight: 600; }
        .faq-icon { color: var(--ouro-champagne); font-size: 1.8rem; transition: transform 0.4s; }
        .faq-body { padding: 0 32px; max-height: 0; opacity: 0; transition: padding 0.5s ease, max-height 0.5s ease, opacity 0.5s ease; color: var(--text-muted); font-size: 1.1rem; line-height: 1.6; }
        .js-real-counter { display: inline-block; min-width: 2ch; font-variant-numeric: tabular-nums; contain: layout paint; }
        .faq-item.active { border-color: var(--ouro-champagne); box-shadow: 0 10px 40px rgba(212,175,55,0.15); background: rgba(212,175,55,0.02);}
        .faq-item.active .faq-body { padding: 0 32px 32px 32px; max-height: 500px; opacity: 1; }
        .faq-item.active .faq-icon { transform: rotate(45deg); }

        .footer-link { color: var(--text-muted); text-decoration: none; display: inline-block; padding: 6px 0; font-size: 1.05rem; font-weight: 500; transition: color 0.3s, transform 0.3s;}
        .footer-link:hover { color: var(--ouro-champagne); transform: translateX(8px); }
        
        /* ÍCONES SOCIAIS PREMIUM OTIMIZADOS */
        .social-icon-btn {
            position: relative;
            overflow: hidden;
            width: 80px; height: 80px; display: inline-flex; align-items: center; justify-content: center;
            border-radius: 23px; font-size: 2.5rem; text-decoration: none; cursor: pointer;
            background: linear-gradient(145deg, #19160d, #090805 72%);
            box-shadow:
                8px 8px 20px #010101,
                -8px -8px 20px #1a1a1a,
                0 0 26px rgba(212, 175, 55, 0.16),
                inset 0 0 20px rgba(212, 175, 55, 0.055);
            border: 1px solid rgba(212, 175, 55, 0.48);
            color: #e7ca70;
            transition: background 0.4s, color 0.4s, border-color 0.4s, box-shadow 0.4s;
            transform-style: preserve-3d;
        }
        .social-icon-btn::before {
            content: "";
            position: absolute;
            inset: -35%;
            z-index: 0;
            pointer-events: none;
            opacity: 0.42;
            background: radial-gradient(circle, rgba(255, 226, 128, 0.38) 0, rgba(212, 175, 55, 0.09) 34%, transparent 67%);
            transform: translate3d(-22%, 18%, 0) scale(0.82);
            animation: apex-social-gold-breathe 4.8s ease-in-out infinite alternate;
            animation-play-state: paused;
        }
        footer.apex-social-motion-active .social-icon-btn::before {
            animation-play-state: running;
        }
        .social-icon-btn i,
        .social-icon-btn svg {
            width: 1em;
            height: 1em;
            position: relative;
            z-index: 1;
            color: #e7ca70;
            transition: color 0.3s ease;
            transform: translateZ(15px);
        }
        .social-icon-btn:hover,
        .social-icon-btn:focus-visible {
            box-shadow:
                0 18px 48px rgba(212, 175, 55, 0.3),
                0 0 34px rgba(212, 175, 55, 0.22),
                inset 0 0 22px rgba(255, 233, 156, 0.12);
        }
        .social-icon-btn:focus-visible {
            outline: 2px solid #f0d681;
            outline-offset: 4px;
        }
        .social-icon-btn:hover::before,
        .social-icon-btn:focus-visible::before {
            opacity: 0.76;
        }

        @keyframes apex-social-gold-breathe {
            from { transform: translate3d(-22%, 18%, 0) scale(0.82); opacity: 0.3; }
            to { transform: translate3d(17%, -12%, 0) scale(1.08); opacity: 0.62; }
        }

        @media (prefers-reduced-motion: reduce) {
            .social-icon-btn::before { animation: none !important; }
        }

        html.apex-document-hidden .social-icon-btn::before,
        html.apex-native-cursor-mode .social-icon-btn::before {
            animation-play-state: paused;
        }

        .apex-inline-icon { width: 1em; height: 1em; display: block; fill: currentColor; }

        .apex-letter-mega { font-family: 'Space Grotesk', sans-serif; line-height: 0.8; margin: 0; font-size: clamp(6rem, 10vw, 8rem); color: #fff; text-shadow: 0 0 30px rgba(212, 175, 55, 0.5);}

        .desktop-break { display: block; }
        .btn-group { display: flex; gap: 24px; justify-content: center; flex-wrap: wrap; }
        .force-center { text-align: center !important; margin-left: auto !important; margin-right: auto !important; }
        .apex-hero-national {
            margin-top: 26px;
            color: rgba(255,255,255,0.64);
            font-family: 'Space Grotesk', sans-serif;
            font-size: clamp(0.68rem, 0.86vw, 0.8rem);
            font-weight: 700;
            line-height: 1.5;
            letter-spacing: 0.2em;
        }

        @media (max-width: 1024px) {
            .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
            #demonstracoes .grid-3 { grid-template-columns: minmax(0, 1fr); }
            .drawer-card { flex-direction: column; }
            .drawer-card-content { width: 100%; padding: 32px;}
            .dash-header { grid-template-columns: 1fr; gap: 4vw; text-align: center; }
            .apex-stack-card { padding: 40px; }
        }
        @media (max-width: 768px) {
            .section-py { padding: 10vh 0; overflow: visible; }
            .desktop-break { display: inline; }
            .btn-group { flex-direction: column; align-items: stretch; width: 100%; }
            .btn-group .btn { width: 100%; padding: 20px 24px; text-align: center; }
            .social-icon-btn { width: 62px; height: 62px; border-radius: 19px; font-size: 1.8rem; }
            .services-capability-strip,
            .apex-services-capability-strip { margin-top: 32px; padding: 18px 20px; border-radius: 22px; white-space: normal; }
        }

        .legal-dialog {
            width: min(94vw, 1040px);
            max-width: none;
            max-height: 92dvh;
            padding: 0;
            border: 1px solid rgba(212,175,55,.24);
            border-radius: 24px;
            background: #090909;
            color: #f7f5ef;
            overflow: hidden;
        }

        .legal-dialog::backdrop { background: rgba(0,0,0,.86); }

        .legal-dialog__shell {
            display: grid;
            grid-template-rows: auto minmax(0, 1fr);
            max-height: 92dvh;
        }

        .legal-dialog__bar {
            position: sticky;
            top: 0;
            z-index: 2;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 1.5rem;
            padding: 1.2rem clamp(1.25rem, 4vw, 3rem);
            border-bottom: 1px solid rgba(255,255,255,.1);
            background: #090909;
        }

        .legal-dialog__label {
            margin: 0 0 .35rem;
            color: #d4af37;
            font: 800 .68rem/1 "Space Grotesk", sans-serif;
            letter-spacing: .17em;
        }

        .legal-dialog__title {
            margin: 0;
            color: #fff;
            font: 650 clamp(1.25rem, 2.3vw, 1.9rem)/1.1 "Space Grotesk", sans-serif;
        }

        .legal-dialog__close {
            display: inline-grid;
            flex: 0 0 auto;
            width: 48px;
            height: 48px;
            place-items: center;
            padding: 0;
            border: 1px solid rgba(212,175,55,.45);
            border-radius: 50%;
            color: #fff;
            background: transparent;
            font-size: 1.5rem;
            cursor: pointer;
        }

        .legal-dialog__content {
            overflow: auto;
            overscroll-behavior: contain;
            padding: 0 clamp(1.25rem, 5vw, 4rem) 4rem;
            background:
                radial-gradient(circle at 12% 10%, rgba(212,175,55,.1), transparent 30rem),
                #050505;
        }

        .legal-dialog__content .legal-shell {
            width: min(100%, 900px);
            margin: 0 auto;
            padding: clamp(3rem, 7vw, 5rem) 0 2rem;
        }

        .legal-dialog__content .legal-kicker,
        .legal-dialog__content .legal-contact { color: #e2c770; }
        .legal-dialog__content h1,
        .legal-dialog__content h2 { font-family: "Space Grotesk", sans-serif; letter-spacing: -.04em; line-height: 1.08; }
        .legal-dialog__content h1 { margin: 1rem 0 1.5rem; color: #fff; font-size: clamp(2.5rem, 7vw, 5.5rem); }
        .legal-dialog__content h2 { margin: 3rem 0 1rem; color: #e2c770; font-size: clamp(1.4rem, 3vw, 2rem); }
        .legal-dialog__content p,
        .legal-dialog__content li { color: #aaa69d; line-height: 1.75; }
        .legal-dialog__content .legal-lead { color: #dedbd3; font-size: clamp(1.02rem, 2vw, 1.22rem); }
        .legal-dialog__content .legal-meta { display: inline-block; margin-top: 1rem; padding: .45rem .8rem; border: 1px solid rgba(255,255,255,.1); border-radius: 999px; color: #cac6bc; }
        .legal-dialog__content .legal-card { margin-top: 3rem; padding: clamp(1.4rem, 4vw, 3rem); border: 1px solid rgba(255,255,255,.1); border-radius: 22px; background: rgba(13,13,13,.92); }

        @media (max-width: 560px) {
            .legal-dialog { width: 100vw; height: 100dvh; max-height: none; border: 0; border-radius: 0; }
            .legal-dialog__shell { max-height: 100dvh; height: 100%; }
            .legal-dialog__bar { padding: 1rem; }
            .legal-dialog__label { display: none; }
            .legal-dialog__content { padding-inline: 1rem; }
        }

        /* VÍDEO INSTITUCIONAL — seção adicional, sem camadas sobre o player. */
        .apex-video-section {
            position: relative;
            padding: clamp(96px, 11vw, 176px) 0;
            border-top: 1px solid rgba(255, 255, 255, 0.08);
            background:
                radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.075), transparent 40%),
                #050505;
            color: #fff;
            overflow: hidden;
            isolation: isolate;
        }

        .apex-video-section::before {
            content: "";
            position: absolute;
            inset: 0;
            z-index: 0;
            pointer-events: none;
            background:
                linear-gradient(
                    115deg,
                    transparent 0%,
                    rgba(255, 255, 255, 0.025) 45%,
                    transparent 70%
                );
        }

        .apex-video-container {
            position: relative;
            z-index: 1;
        }

        .apex-video-header {
            width: min(100%, 1040px);
            margin: 0 auto clamp(40px, 5vw, 72px);
            text-align: center;
        }

        .apex-video-eyebrow {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            margin-bottom: 20px;
            color: rgba(255, 255, 255, 0.58);
            font-family: "Space Grotesk", sans-serif;
            font-size: 12px;
            font-weight: 700;
            letter-spacing: 0.16em;
            line-height: 1.4;
            text-transform: uppercase;
        }

        .apex-video-eyebrow::before {
            content: "";
            width: 34px;
            height: 1px;
            flex: 0 0 auto;
            pointer-events: none;
            background: rgba(255, 255, 255, 0.34);
        }

        .apex-video-title {
            margin: 0;
            color: #fff;
            font-family: "Space Grotesk", sans-serif;
            font-size: clamp(46px, 7.5vw, 110px);
            font-weight: 800;
            line-height: 0.93;
            letter-spacing: -0.045em;
            text-transform: uppercase;
            text-wrap: balance;
        }

        .apex-video-title-primary,
        .apex-video-title-secondary {
            display: block;
        }

        .apex-video-title-primary {
            color: #fff;
        }

        .apex-video-title-secondary {
            color: rgba(255, 255, 255, 0.42);
        }

        .apex-video-title-secondary.premium-gold-text {
            color: transparent;
            padding-bottom: 0;
        }

        .apex-video-description {
            width: min(100%, 760px);
            margin: 30px auto 0;
            color: rgba(255, 255, 255, 0.66);
            font-family: Inter, sans-serif;
            font-size: clamp(16px, 1.55vw, 20px);
            line-height: 1.7;
            text-wrap: balance;
        }

        .apex-video-frame {
            position: relative;
            width: min(100%, 1320px);
            aspect-ratio: 16 / 9;
            margin: 0 auto;
            overflow: hidden;
            border: 1px solid rgba(255, 255, 255, 0.13);
            border-radius: clamp(16px, 2vw, 30px);
            background: #000;
            box-shadow:
                0 40px 120px rgba(0, 0, 0, 0.62),
                0 0 0 1px rgba(255, 255, 255, 0.025);
            isolation: isolate;
            transform-origin: center;
        }

        .apex-youtube-player {
            position: absolute;
            inset: 0;
            z-index: 1;
            display: block;
            width: 100%;
            height: 100%;
            border: 0;
            background: #000;
            opacity: 1;
            visibility: visible;
            pointer-events: auto;
        }

        .apex-video-footer {
            width: min(100%, 1320px);
            margin: 24px auto 0;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 24px;
            font-family: "Space Grotesk", sans-serif;
        }

        .apex-video-pillars {
            margin: 0;
            color: rgba(255, 255, 255, 0.46);
            font-size: 12px;
            font-weight: 600;
            letter-spacing: 0.1em;
            line-height: 1.6;
            text-transform: uppercase;
        }

        .apex-video-fallback {
            display: inline-flex;
            min-height: 44px;
            align-items: center;
            color: rgba(255, 255, 255, 0.74);
            font-size: 12px;
            font-weight: 700;
            letter-spacing: 0.08em;
            line-height: 1.5;
            text-align: right;
            text-decoration: underline;
            text-underline-offset: 5px;
            text-transform: uppercase;
            transition: color 0.25s ease, opacity 0.25s ease;
        }

        .apex-video-fallback:hover,
        .apex-video-fallback:focus-visible {
            color: #fff;
        }

        @media (max-width: 768px) {
            .apex-video-section {
                padding: clamp(80px, 20vw, 120px) 0;
            }

            .apex-video-header {
                margin-bottom: 36px;
            }

            .apex-video-eyebrow {
                margin-bottom: 16px;
                font-size: 10px;
                letter-spacing: 0.13em;
            }

            .apex-video-eyebrow::before {
                width: 24px;
            }

            .apex-video-title {
                font-size: clamp(36px, 11.4vw, 64px);
                line-height: 0.96;
            }

            .apex-video-description {
                margin-top: 24px;
                font-size: 16px;
                line-height: 1.62;
            }

            .apex-video-frame {
                border-radius: 16px;
                box-shadow: 0 24px 72px rgba(0, 0, 0, 0.58);
            }

            .apex-video-footer {
                margin-top: 20px;
                align-items: flex-start;
                flex-direction: column;
                gap: 14px;
            }

            .apex-video-fallback {
                text-align: left;
            }
        }

        @media (max-width: 420px) {
            .apex-video-title {
                font-size: clamp(31px, 10.8vw, 44px);
                letter-spacing: -0.04em;
            }

            .apex-video-description {
                font-size: 15px;
            }

            .apex-video-pillars,
            .apex-video-fallback {
                font-size: 10px;
            }
        }

        /* =========================================
           MÉTODO APEX — RESTAURAÇÃO VISUAL NEUTRA
           Estrutura anterior preservada; somente a
           adaptação clara solicitada permanece.
           ========================================= */
        #sobre-apex {
            background: #ffffff !important;
            color: #111111;
        }

        #sobre-apex .apex-bg-stage {
            background: #ffffff;
        }

        #sobre-apex .apex-theme-layer {
            opacity: 0.14;
            background: rgba(255, 255, 255, 0.06);
            clip-path: none;
            transform: translateZ(0) scaleY(0.08);
            transform-origin: 50% 100%;
            transition:
                opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.9s cubic-bezier(0.22, 1, 0.36, 1);
        }

        #sobre-apex.is-theme-transitioning .apex-theme-layer {
            will-change: opacity, transform;
        }

        #sobre-apex.is-apex-light .apex-theme-layer {
            opacity: 1;
            transform: translateZ(0) scaleY(1);
        }

        #sobre-apex.is-apex-light .apex-intro .cine-stage > h2,
        #sobre-apex.is-apex-light .apex-intro .cine-stage > h3 {
            color: #ffffff !important;
            text-shadow:
                0 2px 18px rgba(0, 0, 0, 0.68),
                0 1px 3px rgba(0, 0, 0, 0.82);
        }

        #sobre-apex .apex-intro .cine-stage > h3 .premium-gold-text {
            color: #ffffff;
            background: none;
            background-image: none;
            -webkit-background-clip: border-box;
            background-clip: border-box;
            -webkit-text-fill-color: #ffffff;
            animation: none;
            text-shadow: inherit;
            contain: none;
        }

        #sobre-apex .apex-intro .cine-stage > h3 .premium-gold-text.apex-shine-active {
            will-change: auto;
        }

        #sobre-apex .apex-intro > p {
            color: #f1d277 !important;
            text-shadow:
                0 2px 14px rgba(0, 0, 0, 0.58),
                0 1px 2px rgba(0, 0, 0, 0.72);
        }

        #sobre-apex.is-apex-light .apex-intro .tag {
            color: #111111 !important;
            border-color: rgba(0, 0, 0, 0.14) !important;
            background: rgba(255, 255, 255, 0.84) !important;
            box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
        }

        #sobre-apex .apex-stack-card {
            background: rgba(255, 255, 255, 0.96);
            border: 1px solid rgba(0, 0, 0, 0.10);
            color: #111111;
            box-shadow: 0 24px 60px rgba(0, 0, 0, 0.10);
        }

        #sobre-apex .apex-stack-card h4 {
            color: #111111;
            text-shadow: none;
        }

        #sobre-apex .apex-stack-card p {
            color: #595959 !important;
        }

        #sobre-apex .apex-final-card {
            background: rgba(255, 255, 255, 0.96) !important;
            border: 1px solid rgba(0, 0, 0, 0.10) !important;
            color: #111111 !important;
            box-shadow: 0 24px 60px rgba(0, 0, 0, 0.10) !important;
        }

        #sobre-apex .apex-final-card h3.premium-gold-text {
            color: transparent !important;
        }

        #sobre-apex .apex-final-card > p {
            color: #595959 !important;
        }

        #sobre-apex .apex-final-card .btn {
            background: #111111 !important;
            background-image: none !important;
            border: 1px solid #111111 !important;
            color: #ffffff !important;
            box-shadow: none !important;
            animation: none !important;
        }

        #sobre-apex .apex-final-card .btn:hover,
        #sobre-apex .apex-final-card .btn:focus-visible {
            background: #242424 !important;
            background-image: none !important;
            border-color: #242424 !important;
            color: #ffffff !important;
            box-shadow: 0 10px 24px rgba(0, 0, 0, 0.16) !important;
            animation: none !important;
        }

        @media (min-width: 1024px) {
            #sobre-apex .apex-final-card:hover {
                border-color: rgba(0, 0, 0, 0.14) !important;
                box-shadow: 0 28px 68px rgba(0, 0, 0, 0.13) !important;
            }
        }