/* ======================================================= */
/* CORTEX V5 â€” UNIFIED STYLESHEET                          */
/* Extracted from monolith for maintainability              */
/* ======================================================= */

        :root {
            /* â”€â”€ BACKGROUND â”€â”€ */
            --bg-deep: #040811;
            --bg-surface: rgba(10,15,28,0.50);
            --bg-elevated: rgba(10,15,28,0.65);

            /* â”€â”€ ACCENT COLORS (3 only â€” teal, cyan, amber) â”€â”€ */
            --neon-teal: #00f2fe;
            --teal-dim: #14b8a6;
            --teal-muted: rgba(20,184,166,0.6);
            --amber: #f59e0b;
            --green: #10b981;
            --cyan: #06b6d4;
            /* Legacy aliases â€” kept for backward compat, mapped to teal variants */
            --purple: #8b5cf6;
            --pink: #ec4899;

            /* â”€â”€ NEUTRAL GRAYS (5-step scale) â”€â”€ */
            --gray-50: #f8fafc;
            --gray-200: #e2e8f0;
            --gray-400: rgba(255,255,255,0.82);
            --gray-500: rgba(255,255,255,0.68);
            --gray-600: rgba(255,255,255,0.52);

            /* â”€â”€ TYPOGRAPHY â”€â”€ */
            --font-display: 'Space Grotesk', sans-serif;
            --font-mono: 'JetBrains Mono', monospace;

            /* â”€â”€ TYPE SCALE (7-step) â”€â”€ */
            --text-xs: 0.8125rem;   /* 13px â€” minimum per brand rules */
            --text-sm: 0.875rem;    /* 14px */
            --text-base: 0.9375rem; /* 15px */
            --text-lg: 1.125rem;    /* 18px */
            --text-xl: 1.35rem;     /* ~21.6px */
            --text-2xl: clamp(1.5rem, 3vw, 2rem);    /* 24â€“32px */
            --text-3xl: clamp(2rem, 5vw, 3.5rem);    /* 32â€“56px */

            /* â”€â”€ LINE HEIGHT â”€â”€ */
            --leading-tight: 1.15;
            --leading-normal: 1.55;
            --leading-relaxed: 1.65;

            /* â”€â”€ SPACING (8px base) â”€â”€ */
            --space-1: 8px;
            --space-2: 16px;
            --space-3: 24px;
            --space-4: 32px;
            --space-5: 40px;
            --space-6: 48px;
            --space-8: 64px;
            --space-10: 80px;
            --space-12: 96px;
            --space-16: 128px;

            /* â”€â”€ BORDER RADIUS â”€â”€ */
            --radius-sm: 4px;
            --radius-md: 8px;
            --radius-lg: 12px;
            --radius-xl: 16px;
            --radius-pill: 999px;
            --radius-round: 50%;

            /* â”€â”€ BORDERS â”€â”€ */
            --border-subtle: 1px solid rgba(0,242,254,0.08);
            --border-default: 1px solid rgba(20,184,166,0.20);
            --border-strong: 1px solid rgba(20,184,166,0.40);
        }

        /* â”€â”€ REDUCED MOTION â”€â”€ */
        @media (prefers-reduced-motion: reduce) {
            *, *::before, *::after {
                animation-duration: 0.01ms !important;
                animation-iteration-count: 1 !important;
                transition-duration: 0.01ms !important;
            }
        }

        *, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
        html { scroll-behavior: smooth; }
        body {
            font-family: var(--font-display);
            background: var(--bg-deep);
            color: var(--gray-200);
            overflow-x: hidden;
            font-size: var(--text-base);
            line-height: var(--leading-normal);
        }

        /* ===== DEEP SPACE BACKGROUND ===== */
        #starfield-canvas {
            position: fixed; inset: 0; z-index: 0; pointer-events: none;
        }
        .nebula {
            position: fixed; border-radius: 50%; filter: blur(180px);
            pointer-events: none; z-index: 0;
        }
        .nebula-1 { width:900px; height:900px; background: radial-gradient(circle, rgba(0,242,254,0.10), rgba(0,242,254,0.03) 50%, transparent 70%); top:-350px; right:-250px; }
        .nebula-2 { width:750px; height:750px; background: radial-gradient(circle, rgba(139,92,246,0.09), transparent 70%); bottom:10%; left:-300px; }
        .nebula-3 { width:600px; height:600px; background: radial-gradient(circle, rgba(16,185,129,0.07), transparent 70%); top:40%; right:-180px; }
        .nebula-4 { width:500px; height:500px; background: radial-gradient(circle, rgba(236,72,153,0.06), transparent 70%); top:65%; left:10%; }

        /* Subtle grid overlay */
        body::before {
            content:''; position:fixed; inset:0; z-index:0; pointer-events:none;
            background-image:
                linear-gradient(rgba(0,242,254,0.015) 1px, transparent 1px),
                linear-gradient(90deg, rgba(0,242,254,0.015) 1px, transparent 1px);
            background-size: 80px 80px;
        }

        /* ===== GLASSMORPHISM SYSTEM ===== */
        .glass {
            background: var(--bg-surface);
            border: var(--border-subtle);
            backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px);
            border-radius: var(--radius-xl);
        }
        .glass-strong {
            background: var(--bg-elevated);
            border: 1px solid rgba(0,242,254,0.12);
            backdrop-filter: blur(32px); -webkit-backdrop-filter: blur(32px);
            border-radius: var(--radius-xl);
        }
        .glass-card {
            background: var(--bg-surface);
            backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px);
            border: var(--border-default);
            border-radius: var(--radius-xl);
            box-shadow: 0 0 15px rgba(20,184,166,0.15);
            transition: all 0.4s cubic-bezier(0.25,0.46,0.45,0.94);
        }
        .glass-card:hover {
            border-color: rgba(20,184,166,0.80);
            box-shadow: 0 8px 40px rgba(20,184,166,0.25), 0 0 60px rgba(0,242,254,0.08);
            transform: translateY(-2px);
        }

        /* ===== WORKFORCE: 4-COLUMN DASHBOARD GRID ===== */
        #workforce {
            max-width:100%; padding:100px 24px 80px; position:relative; overflow:hidden;
        }
        #workforce .section-title { margin-bottom:12px; }
        #workforce .section-sub { margin-bottom:40px; }

        /* Particle canvas behind cards */
        #workforce-particles-canvas {
            position:absolute; inset:0; width:100%; height:100%;
            pointer-events:none; z-index:0; opacity:0.35;
        }

        .workforce-grid {
            display:grid; grid-template-columns:repeat(4, 1fr);
            gap:20px; max-width:1400px; margin:0 auto;
            position:relative; z-index:2;
        }

        /* ===== AG-UNIT CARD â€” BASE ===== */
        .ag-unit-card {
            background:#0B0E14;
            border:1px solid rgba(255,255,255,0.05);
            border-radius:var(--radius-xl);
            padding:var(--space-3) 22px var(--space-3);
            position:relative; overflow:hidden;
            /* Scroll entrance: hidden by default */
            opacity:0; transform:translateY(40px);
            transition:
                opacity 0.6s ease-out,
                transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275),
                box-shadow 0.35s ease,
                border-color 0.35s ease;
        }
        .ag-unit-card.is-visible {
            opacity:1; transform:translateY(0);
        }

        /* Staggered entrance delays */
        .ag-unit-card:nth-child(1) { transition-delay:0.1s; }
        .ag-unit-card:nth-child(2) { transition-delay:0.25s; }
        .ag-unit-card:nth-child(3) { transition-delay:0.4s; }
        .ag-unit-card:nth-child(4) { transition-delay:0.55s; }

        /* Hover: lift + border highlight */
        .ag-unit-card:hover {
            transform:translateY(-4px) !important;
            border-color:rgba(255,255,255,0.15);
        }

        /* Card-specific hover glows */
        .card-columnini:hover {
            box-shadow:0 12px 40px -10px rgba(0,255,204,0.30), 0 0 60px rgba(0,255,204,0.08);
        }
        .card-scoop:hover {
            box-shadow:0 12px 40px -10px rgba(255,184,0,0.30), 0 0 60px rgba(255,184,0,0.08);
        }
        .card-pressley:hover {
            box-shadow:0 12px 40px -10px rgba(186,85,211,0.30), 0 0 60px rgba(186,85,211,0.08);
        }
        .card-subscout:hover {
            box-shadow:0 12px 40px -10px rgba(65,105,225,0.30), 0 0 60px rgba(65,105,225,0.08);
        }

        /* Light sweep pseudo-element */
        .ag-unit-card::before {
            content:''; position:absolute; top:0; left:-100%;
            width:50%; height:100%;
            background:linear-gradient(to right, transparent, rgba(255,255,255,0.03), transparent);
            transform:skewX(-20deg);
            transition:left 0.7s ease;
            z-index:10; pointer-events:none;
        }
        .ag-unit-card:hover::before { left:200%; }

        /* Internal grid lines that pulse on hover */
        .ag-unit-card::after {
            content:''; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:0;
            background-image:
                linear-gradient(rgba(255,255,255,0.012) 1px, transparent 1px),
                linear-gradient(90deg, rgba(255,255,255,0.012) 1px, transparent 1px);
            background-size:28px 28px;
            transition:opacity 0.5s ease;
        }
        .ag-unit-card:hover::after { opacity:1; animation:gridPan 8s linear infinite; }
        @keyframes gridPan { to { background-position:28px 28px; } }

        /* Card inner content z-index above pseudo-elements */
        .ag-unit-card > * { position:relative; z-index:1; }

        /* ===== CARD HEADER ===== */
        .ag-card-id {
            font-family:var(--font-mono); font-size:var(--text-xs); font-weight:700;
            letter-spacing:2px; color:var(--gray-500);
            margin-bottom:var(--space-1);
        }
        .ag-card-name {
            font-family:var(--font-display); font-size:var(--text-xl); font-weight:800;
            color:#fff; margin-bottom:4px; line-height:var(--leading-tight);
        }
        .ag-card-role {
            font-family:var(--font-mono); font-size:var(--text-xs); font-weight:700;
            letter-spacing:1.5px; text-transform:uppercase;
            margin-bottom:var(--space-2);
        }
        /* Role colors per card */
        .card-columnini .ag-card-role { color:rgba(0,255,204,0.8); }
        .card-scoop .ag-card-role { color:rgba(255,184,0,0.8); }
        .card-pressley .ag-card-role { color:rgba(186,85,211,0.8); }
        .card-subscout .ag-card-role { color:rgba(65,105,225,0.8); }

        /* ===== CARD BODY ===== */
        .ag-card-desc {
            font-size:var(--text-sm); color:rgba(255,255,255,0.88); line-height:var(--leading-relaxed);
            font-weight:500;
            margin-bottom:var(--space-2);
            display:-webkit-box; -webkit-line-clamp:3; line-clamp:3; -webkit-box-orient:vertical;
            overflow:hidden;
        }

        /* Metric pills */
        .ag-metric-row {
            display:flex; gap:var(--space-1); flex-wrap:wrap; margin-bottom:var(--space-2);
        }
        .ag-metric-pill {
            display:inline-flex; align-items:center; gap:5px;
            padding:5px 10px; border-radius:var(--radius-md); font-size:var(--text-xs); font-weight:600;
            font-family:var(--font-mono); white-space:nowrap;
        }
        .card-columnini .ag-metric-pill {
            background:rgba(0,255,204,0.06); border:1px solid rgba(0,255,204,0.20); color:rgba(0,255,204,0.9);
        }
        .card-scoop .ag-metric-pill {
            background:rgba(255,184,0,0.06); border:1px solid rgba(255,184,0,0.20); color:rgba(255,184,0,0.9);
        }
        .card-pressley .ag-metric-pill {
            background:rgba(186,85,211,0.06); border:1px solid rgba(186,85,211,0.20); color:rgba(186,85,211,0.9);
        }
        .card-subscout .ag-metric-pill {
            background:rgba(65,105,225,0.06); border:1px solid rgba(65,105,225,0.20); color:rgba(65,105,225,0.9);
        }

        /* Skill tags */
        .ag-skill-tags { display:flex; flex-wrap:wrap; gap:6px; }
        .ag-skill-tag {
            font-family:var(--font-mono); font-size:var(--text-xs); font-weight:600;
            padding:3px 8px; border-radius:var(--radius-sm); letter-spacing:0.5px;
            text-transform:uppercase; white-space:nowrap;
        }
        .card-columnini .ag-skill-tag {
            color:rgba(0,255,204,0.7); border:1px solid rgba(0,255,204,0.25); background:rgba(0,255,204,0.04);
        }
        .card-scoop .ag-skill-tag {
            color:rgba(255,184,0,0.7); border:1px solid rgba(255,184,0,0.25); background:rgba(255,184,0,0.04);
        }
        .card-pressley .ag-skill-tag {
            color:rgba(186,85,211,0.7); border:1px solid rgba(186,85,211,0.25); background:rgba(186,85,211,0.04);
        }
        .card-subscout .ag-skill-tag {
            color:rgba(65,105,225,0.7); border:1px solid rgba(65,105,225,0.25); background:rgba(65,105,225,0.04);
        }

        /* ===== ACCENT TOP BAR ===== */
        .ag-unit-card .ag-accent-bar {
            position:absolute; top:0; left:0; right:0; height:2px;
            opacity:0; transition:opacity 0.35s ease;
        }
        .ag-unit-card:hover .ag-accent-bar { opacity:1; }
        .card-columnini .ag-accent-bar { background:linear-gradient(90deg, transparent, rgba(0,255,204,0.6) 50%, transparent); }
        .card-scoop .ag-accent-bar { background:linear-gradient(90deg, transparent, rgba(255,184,0,0.6) 50%, transparent); }
        .card-pressley .ag-accent-bar { background:linear-gradient(90deg, transparent, rgba(186,85,211,0.6) 50%, transparent); }
        .card-subscout .ag-accent-bar { background:linear-gradient(90deg, transparent, rgba(65,105,225,0.6) 50%, transparent); }

        /* ===== RESPONSIVE ===== */
        @media(max-width:1100px) {
            .workforce-grid { grid-template-columns:repeat(2, 1fr); gap:16px; }
            .ag-unit-card { padding:24px 18px 20px; }
        }
        @media(max-width:640px) {
            .workforce-grid { grid-template-columns:1fr; max-width:420px; }
            #workforce { padding:80px 16px 60px; }
        }

        /* ===== TYPOGRAPHY ===== */
        .sys-label {
            font-family: var(--font-mono); font-size: var(--text-xs);
            letter-spacing: 3px; text-transform: uppercase;
            color: var(--teal-muted);
        }
        .section-label {
            text-transform: uppercase; letter-spacing: 0.3em;
            font-size: var(--text-sm); font-weight: 700; color: var(--neon-teal);
            text-align: center; margin-bottom: var(--space-2);
            font-family: var(--font-mono);
        }
        .section-title {
            font-size: var(--text-2xl);
            font-weight: 800; text-align: center; color: #fff;
            margin-bottom: var(--space-2); line-height: var(--leading-tight);
            letter-spacing: 3px; text-transform: uppercase;
            filter: drop-shadow(0 0 30px rgba(0,242,254,0.2));
        }
        .section-sub {
            text-align: center; color: rgba(255,255,255,0.88);
            font-size: var(--text-base); font-weight: 500; max-width: 640px; margin: 0 auto var(--space-6);
        }
        /* Tighter header-to-terminal gap for Pulse operations section */
        #operations .section-label {
            font-size: var(--text-lg); font-weight: 800; letter-spacing: 0.4em;
            color: #00f2fe;
            text-shadow: 0 0 12px rgba(0,242,254,0.6), 0 0 30px rgba(0,242,254,0.25);
        }
        #operations .section-title {
            font-size: clamp(1.8rem, 4vw, 3rem); font-weight: 900;
            letter-spacing: 4px;
            background: linear-gradient(135deg, #fff 0%, #00f2fe 50%, #2dd4bf 100%);
            -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
            filter: drop-shadow(0 0 40px rgba(0,242,254,0.35));
        }
        #operations .section-sub {
            font-size: var(--text-lg); font-weight: 600;
            color: rgba(255,255,255,0.85);
            margin-bottom: var(--space-3);
        }

        /* ===== NAV ===== */
        nav {
            position: fixed; top:0; left:0; right:0; z-index:1000;
            display: flex; align-items: center; justify-content: space-between;
            padding: var(--space-2) var(--space-5);
            background: rgba(4,8,17,0.88);
            backdrop-filter: blur(20px);
            border-bottom: 1px solid rgba(255,255,255,0.06);
        }
        .logo { display:flex; align-items:center; gap:var(--space-1); cursor:pointer; }
        .logo img { width:32px; height:32px; border-radius:var(--radius-md); object-fit:contain; filter: drop-shadow(0 0 10px rgba(20,184,166,0.5)); }
        .logo span { font-weight:800; font-size:var(--text-xl); color:#fff; letter-spacing:1px; text-shadow: 0 0 12px rgba(20,184,166,0.4), 0 0 24px rgba(0,242,254,0.15); }
        .nav-links { display:flex; gap:var(--space-3); }
        .nav-links a { color:rgba(255,255,255,0.85); text-decoration:none; font-weight:600; font-size:var(--text-sm); transition: color 0.3s; }
        .nav-links a:hover { color: var(--neon-teal); }
        .nav-btns { display:flex; gap:var(--space-1); }
        .btn-pilot {
            padding:9px 22px; border-radius:var(--radius-md); font-weight:700; font-size:var(--text-sm);
            text-decoration:none; border:2px solid var(--teal-dim);
            color: var(--neon-teal); transition: all 0.3s;
        }
        .btn-pilot:hover { background:rgba(0,242,255,0.1); box-shadow: 0 0 20px rgba(0,242,255,0.2); }
        .btn-support {
            padding:9px 22px; border-radius:var(--radius-md); font-weight:700; font-size:var(--text-sm);
            text-decoration:none; border:2px solid rgba(255,255,255,0.15);
            color:var(--gray-400); transition: all 0.3s;
        }
        .btn-support:hover { border-color:rgba(255,255,255,0.3); color:#fff; }

        /* ===== SECTIONS ===== */
        section { position:relative; z-index:1; padding:var(--space-16) var(--space-5) var(--space-12); max-width:1300px; margin:0 auto; }

        /* ===== HERO ===== */
        #hero {
            text-align:center; padding-top:64px; padding-bottom:0;
            display:flex; flex-direction:column; align-items:center;
            height:100vh; justify-content:center;
            overflow:hidden; position:relative;
            max-width:100%; margin:0 auto;
            gap: 4px;
        }
        .hero-tagline {
            color: var(--neon-teal); font-size:var(--text-lg); font-weight:800;
            letter-spacing:5px; text-transform:uppercase; margin-bottom:var(--space-2);
            text-shadow: 0 0 20px rgba(0,242,254,0.6), 0 0 40px rgba(0,242,254,0.3);
            background: linear-gradient(90deg, var(--neon-teal), #fff, var(--neon-teal));
            background-size:200% 100%;
            -webkit-background-clip:text; -webkit-text-fill-color:transparent;
            background-clip:text; animation: shimmer 3s ease-in-out infinite;
        }
        @keyframes shimmer { 0%,100%{background-position:0% 50%} 50%{background-position:100% 50%} }

        #hero h1 {
            font-size: var(--text-3xl); font-weight:800;
            letter-spacing:3px; text-transform:uppercase; margin-bottom:4px;
            line-height:var(--leading-tight);
        }
        #hero h1 span {
            background: linear-gradient(135deg, #fff 0%, rgba(255,255,255,0.8) 40%, var(--neon-teal) 100%);
            -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
        }
        #hero .hero-sub {
            font-size:var(--text-base); color:rgba(255,255,255,0.88); font-weight:500; margin-bottom:2px; max-width:600px; line-height:var(--leading-normal);
        }

        /* 3D Brain Container */
        #hero-3d-wrap {
            position:relative; width:300px; height:300px; max-width:80vw;
            margin:0 auto 0;
        }
        #hero-3d-canvas { width:100%; height:100%; outline:none; touch-action:none; }
        #hero-3d-wrap::after {
            content:''; position:absolute; inset:-60px; border-radius:50%;
            background: radial-gradient(circle, rgba(0,242,254,0.15), rgba(139,92,246,0.06) 40%, transparent 70%);
            animation: brainGlow 4s ease-in-out infinite; pointer-events:none; z-index:-1;
        }
        @keyframes brainGlow { 0%,100%{opacity:0.5} 50%{opacity:1} }

        .hero-cta-row { display:flex; gap:var(--space-2); justify-content:center; flex-wrap:wrap; margin-top:var(--space-1); }
        .btn-launch {
            display:inline-block; padding:14px 32px; border-radius:var(--radius-lg);
            font-weight:800; font-size:var(--text-sm); text-decoration:none; color:#fff;
            letter-spacing:1.5px; text-transform:uppercase;
            font-family:var(--font-mono);
            background:rgba(13,75,73,0.25); backdrop-filter:blur(12px);
            border:var(--border-strong);
            box-shadow: 0 0 15px rgba(20,184,166,0.3), inset 0 0 20px rgba(0,242,254,0.04);
            transition: all 0.35s ease; cursor:pointer; position:relative; overflow:hidden;
        }
        .btn-launch::before {
            content:''; position:absolute; top:0; left:-100%; width:60%; height:100%;
            background:linear-gradient(90deg, transparent, rgba(0,242,254,0.15), transparent);
            transform:skewX(-25deg); pointer-events:none;
        }
        .btn-launch:hover {
            background:rgba(13,75,73,0.45); border-color:rgba(20,184,166,0.7);
            box-shadow: 0 0 25px rgba(20,184,166,0.6), 0 0 60px rgba(0,242,254,0.15);
            transform:translateY(-2px); color:var(--neon-teal);
            text-shadow:0 0 12px rgba(0,242,254,0.5);
        }
        .btn-launch:hover::before { animation: btnSweep 0.6s ease-out forwards; }
        @keyframes btnSweep { to { left: 150%; } }

        /* ===== HERO HUD PANELS (Color-Coded) ===== */
        .hero-hud-layout {
            position: relative; width: 100%; max-width: 1200px;
            display: flex; align-items: center; justify-content: center;
            gap: 48px; margin: 0 auto; flex: 1;
            min-height: 0;
            padding-bottom: 80px;
        }
        .hud-column {
            display: flex; flex-direction: column; gap: 14px;
            width: 260px; flex-shrink: 0;
        }
        .hud-panel {
            position: relative;
            backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
            border-radius: var(--radius-lg);
            padding: 14px var(--space-2);
            text-align: left;
            transition: all 0.4s cubic-bezier(0.25,0.46,0.45,0.94);
            opacity: 0; transform: translateY(30px);
            cursor: pointer;
        }
        .hud-panel:hover {
            transform: translateY(-2px) !important;
        }
        .hud-panel-title {
            font-family: var(--font-mono); font-size: var(--text-sm);
            font-weight: 800; letter-spacing: 2.5px; text-transform: uppercase;
            margin-bottom: 6px;
            color: #ffffff;
        }
        .hud-panel-icon {
            width: 28px; height: 28px; margin-bottom: 4px;
            filter: drop-shadow(0 0 8px currentColor);
        }
        .hud-panel-metric {
            font-size: var(--text-xl); font-weight: 800;
            font-variant-numeric: tabular-nums;
            font-family: var(--font-mono);
            min-width: 8ch; display: inline-block;
            color: #fff;
            text-shadow: 0 0 6px currentColor, 0 0 2px currentColor;
        }
        .hud-panel-label {
            font-family: var(--font-mono); font-size: var(--text-xs);
            letter-spacing: 1px; text-transform: uppercase;
            color: #00f2fe; margin-top: 6px;
            text-shadow: 0 0 5px rgba(0,242,254,0.35);
            font-weight: 700;
        }

        /* Panel: Revenue Generating â€” Emerald */
        .hud-revenue {
            background: rgba(16,185,129,0.06);
            border: 1px solid rgba(16,185,129,0.25);
            box-shadow: 0 0 20px rgba(16,185,129,0.08);
        }
        .hud-revenue:hover {
            border-color: rgba(16,185,129,0.6);
            box-shadow: 0 0 35px rgba(16,185,129,0.2), 0 8px 30px rgba(16,185,129,0.12);
        }
        .hud-revenue .hud-panel-title { color: #ffffff; }
        .hud-revenue .hud-panel-metric { color: #34d399; }
        .hud-revenue .hud-panel-icon { color: #10B981; }

        /* Panel: Cost Savings â€” Amber */
        .hud-cost {
            background: rgba(245,158,11,0.06);
            border: 1px solid rgba(245,158,11,0.25);
            box-shadow: 0 0 20px rgba(245,158,11,0.08);
        }
        .hud-cost:hover {
            border-color: rgba(245,158,11,0.6);
            box-shadow: 0 0 35px rgba(245,158,11,0.2), 0 8px 30px rgba(245,158,11,0.12);
        }
        .hud-cost .hud-panel-title { color: #ffffff; }
        .hud-cost .hud-panel-metric { color: #fbbf24; }
        .hud-cost .hud-panel-icon { color: #F59E0B; }

        /* Panel: Efficiency Gains â€” Cyan */
        .hud-efficiency {
            background: rgba(6,182,212,0.06);
            border: 1px solid rgba(6,182,212,0.25);
            box-shadow: 0 0 20px rgba(6,182,212,0.08);
        }
        .hud-efficiency:hover {
            border-color: rgba(6,182,212,0.6);
            box-shadow: 0 0 35px rgba(6,182,212,0.2), 0 8px 30px rgba(6,182,212,0.12);
        }
        .hud-efficiency .hud-panel-title { color: #ffffff; }
        .hud-efficiency .hud-panel-metric { color: #22d3ee; }
        .hud-efficiency .hud-panel-icon { color: #06B6D4; }

        /* Panel: Process Optimization â€” Violet */
        .hud-process {
            background: rgba(139,92,246,0.06);
            border: 1px solid rgba(139,92,246,0.25);
            box-shadow: 0 0 20px rgba(139,92,246,0.08);
        }
        .hud-process:hover {
            border-color: rgba(139,92,246,0.6);
            box-shadow: 0 0 35px rgba(139,92,246,0.2), 0 8px 30px rgba(139,92,246,0.12);
        }
        .hud-process .hud-panel-title { color: #ffffff; }
        .hud-process .hud-panel-metric { color: #a78bfa; }
        .hud-process .hud-panel-icon { color: #8B5CF6; }

        /* ===== PEDESTAL RINGS ===== */
        .hero-pedestal {
            position: absolute; bottom: -30px; left: 50%; transform: translateX(-50%);
            width: 340px; height: 80px; pointer-events: none; z-index: 0;
        }
        .pedestal-ring {
            position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);
            border-radius: 50%; border: 1.5px solid rgba(0,242,254,0.25);
            box-shadow: 0 0 15px rgba(0,242,254,0.08);
            animation: pedestalPulse 4s ease-in-out infinite;
        }
        .pedestal-ring:nth-child(1) { width: 180px; height: 40px; opacity: 0.7; }
        .pedestal-ring:nth-child(2) { width: 240px; height: 50px; opacity: 0.45; animation-delay: 0.5s; }
        .pedestal-ring:nth-child(3) { width: 300px; height: 60px; opacity: 0.25; animation-delay: 1s; }
        .pedestal-ring:nth-child(4) { width: 340px; height: 70px; opacity: 0.12; animation-delay: 1.5s; }
        @keyframes pedestalPulse {
            0%,100% { opacity: var(--ring-opacity,0.3); transform: translate(-50%,-50%) scaleY(1); }
            50% { opacity: calc(var(--ring-opacity,0.3) * 1.5); transform: translate(-50%,-50%) scaleY(1.1); }
        }

        /* ===== STATUS TERMINAL ===== */
        .hero-status-terminal {
            position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%);
            width: 90%; max-width: 700px;
            background: rgba(4,8,17,0.85);
            backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
            border: var(--border-default);
            border-radius: var(--radius-lg);
            padding: 10px 20px;
            font-family: var(--font-mono); font-size: var(--text-xs);
            color: rgba(0,242,254,0.75);
            letter-spacing: 1px;
            z-index: 999;
            box-shadow: 0 0 25px rgba(0,242,254,0.06);
            display: flex; align-items: center; gap: 10px;
        }
        .terminal-dot {
            width: 8px; height: 8px; border-radius: 50%;
            background: #00f2fe;
            box-shadow: 0 0 8px rgba(0,242,254,0.6);
            animation: terminalBlink 2s ease-in-out infinite;
        }
        @keyframes terminalBlink { 0%,100%{opacity:1} 50%{opacity:0.3} }
        .terminal-text { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
        .terminal-cursor {
            display: inline-block; width: 8px; height: 16px;
            background: rgba(0,242,254,0.7);
            animation: cursorBlink 0.8s step-end infinite;
            margin-left: 2px; vertical-align: middle;
        }
        @keyframes cursorBlink { 50% { opacity: 0; } }

        /* ===== NEWSPAPER PULSE UNDERLINE ===== */
        .newspaper-pulse {
            position: relative;
            font-weight: 700;
            color: rgba(255,255,255,0.85);
        }
        .newspaper-pulse::after {
            content:''; position:absolute; bottom:-2px; left:0; right:0;
            height:2px; background:var(--neon-teal);
            box-shadow:0 0 8px rgba(0,242,254,0.5);
            animation:npPulse 2s ease-in-out infinite;
        }
        @keyframes npPulse { 0%,100%{opacity:0.3;transform:scaleX(0.8)} 50%{opacity:1;transform:scaleX(1)} }

        /* ===== CRT SCANLINE BOOT EFFECT ===== */
        .hero-crt-active {
            animation: crtFlicker 0.15s ease-in-out 3;
        }
        @keyframes crtFlicker {
            0%{opacity:0} 30%{opacity:1} 60%{opacity:0.3} 100%{opacity:1}
        }
        .hero-status-terminal::before {
            content:''; position:absolute; inset:0; pointer-events:none;
            background:repeating-linear-gradient(0deg, transparent 0px, transparent 2px, rgba(0,242,254,0.03) 2px, rgba(0,242,254,0.03) 4px);
            border-radius:10px; z-index:1;
        }

        /* ===== HERO SVG DATA STREAMS ===== */
        .hero-data-stream-svg {
            position:absolute; inset:0; width:100%; height:100%;
            pointer-events:none; z-index:5; overflow:visible;
        }
        .hero-stream-path {
            fill:none; stroke-width:1.5;
            stroke-dasharray:12 8; opacity:0;
        }
        .hero-stream-path.active { opacity:0.5; }
        .hero-stream-path.flare {
            stroke-width:3; opacity:0.9;
            filter:drop-shadow(0 0 6px currentColor);
        }

        /* ===== UI-106: HOLOGRAPHIC PORTRAITS ===== */
        .holo-portrait {
            position: absolute; top: 16px; right: 16px;
            width: 60px; height: 70px; z-index: 3;
            opacity: 0.7;
        }
        .holo-head {
            position: relative; width: 100%; height: 100%;
        }
        .holo-head .skull {
            position: absolute; top: 0; left: 50%; transform: translateX(-50%);
            width: 36px; height: 40px;
            border: 1.5px solid var(--accent, #14b8a6);
            border-radius: 50% 50% 45% 45%;
            box-shadow: 0 0 8px rgba(var(--accent-rgb, 20,184,166), 0.5), inset 0 0 6px rgba(var(--accent-rgb, 20,184,166), 0.15);
        }
        .holo-head .jaw {
            position: absolute; top: 32px; left: 50%; transform: translateX(-50%);
            width: 26px; height: 18px;
            border: 1.5px solid var(--accent, #14b8a6);
            border-top: none;
            border-radius: 0 0 50% 50%;
            opacity: 0.6;
            box-shadow: 0 0 6px rgba(var(--accent-rgb, 20,184,166), 0.4);
        }
        .holo-head .eye {
            position: absolute; top: 16px; width: 8px; height: 4px;
            border: 1px solid var(--accent, #14b8a6);
            border-radius: 50%;
            box-shadow: 0 0 6px rgba(var(--accent-rgb, 20,184,166), 0.8);
            animation: eyePulse 3s ease-in-out infinite;
        }
        .holo-head .eye-l { left: 14px; }
        .holo-head .eye-r { right: 14px; animation-delay: 0.5s; }
        @keyframes eyePulse { 0%,100%{opacity:0.5;box-shadow:0 0 4px rgba(var(--accent-rgb,20,184,166),0.4)} 50%{opacity:1;box-shadow:0 0 10px rgba(var(--accent-rgb,20,184,166),0.9)} }
        .holo-head .neck {
            position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);
            width: 14px; height: 16px;
            border-left: 1.5px solid var(--accent, #14b8a6);
            border-right: 1.5px solid var(--accent, #14b8a6);
            opacity: 0.4;
        }
        .holo-head .cross-h {
            position: absolute; top: 12px; left: 4px; right: 4px;
            height: 1px; background: var(--accent, #14b8a6); opacity: 0.25;
        }
        .holo-head .cross-v {
            position: absolute; top: 4px; bottom: 18px; left: 50%; transform: translateX(-50%);
            width: 1px; background: var(--accent, #14b8a6); opacity: 0.25;
        }
        .holo-scanline {
            position: absolute; left: 0; right: 0; height: 2px;
            background: linear-gradient(90deg, transparent, rgba(var(--accent-rgb, 20,184,166), 0.6) 30%, rgba(var(--accent-rgb, 20,184,166), 0.8) 50%, rgba(var(--accent-rgb, 20,184,166), 0.6) 70%, transparent);
            box-shadow: 0 0 8px rgba(var(--accent-rgb, 20,184,166), 0.4);
            animation: holoScan 3s ease-in-out infinite;
            pointer-events: none;
        }
        @keyframes holoScan {
            0% { top: -2px; opacity: 0; }
            10% { opacity: 1; }
            90% { opacity: 1; }
            100% { top: calc(100% + 2px); opacity: 0; }
        }

        /* ===== DATA-401: PARTICLE FUNNEL COUNTER ===== */
        .funnel-counter-wrap {
            position: relative; max-width: 1000px; margin: 0 auto;
        }
        .funnel-dollar {
            position: absolute; top: 16px; right: 30%;
            font-family: var(--font-mono); font-size: clamp(1.1rem, 2vw, 1.5rem);
            font-weight: 800; color: var(--neon-teal);
            text-shadow: 0 0 15px rgba(0,242,254,0.5);
            z-index: 5; pointer-events: none;
            font-variant-numeric: tabular-nums;
        }

        /* ===== PERSONNEL FILE CARDS ===== */
        .personnel-grid {
            display:grid; grid-template-columns:repeat(2,1fr);
            gap:28px; max-width:1200px; margin:0 auto;
        }
        @media(max-width:800px) { .personnel-grid { grid-template-columns:1fr; max-width:520px; } }

        .personnel-card {
            position:relative; overflow:hidden; padding:0;
            opacity:0; transform:translateY(50px);
        }
        .personnel-card .card-header {
            padding:20px 24px 16px; position:relative; z-index:2;
            border-bottom:1px solid rgba(255,255,255,0.05);
        }
        .personnel-card .card-body { padding:20px 24px 24px; position:relative; z-index:2; }
        .personnel-card .card-id {
            font-family:var(--font-mono); font-size:13px; font-weight:600;
            letter-spacing:2px; text-transform:uppercase; margin-bottom:4px;
        }
        .personnel-card h3 {
            font-size:1.4rem; font-weight:800; color:#fff; margin-bottom:4px;
        }
        .personnel-card .role-tag {
            font-family:var(--font-mono); font-size:13px; font-weight:700;
            letter-spacing:1.5px; text-transform:uppercase; margin-bottom:12px;
            display:inline-block;
        }
        .personnel-card .desc {
            font-size:14px; color:rgba(255,255,255,0.88); font-weight:500; line-height:1.6; margin-bottom:16px;
        }
        .personnel-card .metric-row {
            display:flex; gap:12px; flex-wrap:wrap;
        }
        .metric-pill {
            display:inline-flex; align-items:center; gap:6px;
            padding:6px 14px; border-radius:10px;
            font-family:var(--font-mono); font-size:13px; font-weight:700;
        }
        /* Scanline overlay on personnel cards */
        .personnel-card::before {
            content:''; position:absolute; inset:0; z-index:1; pointer-events:none;
            background:repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(0,242,254,0.012) 2px, rgba(0,242,254,0.012) 4px);
            opacity:0.6;
        }

        /* Columnini - teal */
        .card-columnini { --accent: #14b8a6; --accent-rgb: 20,184,166; }
        .card-columnini .card-id { color: rgba(20,184,166,0.7); }
        .card-columnini h3 { color: #2dd4bf; text-shadow: 0 0 12px rgba(20,184,166,0.4); }
        .card-columnini .role-tag { color: #14b8a6; }
        .card-columnini .metric-pill { background:rgba(20,184,166,0.1); border:1px solid rgba(20,184,166,0.25); color:#2dd4bf; }

        /* Scoop - amber */
        .card-scoop { --accent: #f59e0b; --accent-rgb: 245,158,11; }
        .card-scoop .card-id { color: rgba(245,158,11,0.7); }
        .card-scoop h3 { color: #fbbf24; text-shadow: 0 0 12px rgba(245,158,11,0.4); }
        .card-scoop .role-tag { color: #f59e0b; }
        .card-scoop .metric-pill { background:rgba(245,158,11,0.1); border:1px solid rgba(245,158,11,0.25); color:#fbbf24; }

        /* Riley - cyan/dark ghost */
        .card-riley { --accent: #06b6d4; --accent-rgb: 6,182,212; }
        .card-riley.glass-card { background: rgba(0,0,0,0.60); }
        .card-riley .card-id { color: rgba(6,182,212,0.7); }
        .card-riley h3 { color: #22d3ee; text-shadow: 0 0 12px rgba(6,182,212,0.4); }
        .card-riley .role-tag { color: #06b6d4; }
        .card-riley .metric-pill { background:rgba(6,182,212,0.1); border:1px solid rgba(6,182,212,0.25); color:#22d3ee; }

        /* Pulse - electric magenta */
        .card-pulse { --accent: #ec4899; --accent-rgb: 236,72,153; }
        .card-pulse .card-id { color: rgba(236,72,153,0.7); }
        .card-pulse h3 { color: #f472b6; text-shadow: 0 0 12px rgba(236,72,153,0.4); }
        .card-pulse .role-tag { color: #ec4899; }
        .card-pulse .metric-pill { background:rgba(236,72,153,0.1); border:1px solid rgba(236,72,153,0.25); color:#f472b6; }

        /* ===== CORTEX AGENT CARDS: GLASSMORPHISM & NEON HUD ===== */
        .cortex-agent-card {
            position: relative;
            background: rgba(12, 16, 28, 0.4);
            backdrop-filter: blur(16px);
            -webkit-backdrop-filter: blur(16px);
            border: 1px solid rgba(0, 243, 255, 0.15);
            border-radius: 16px;
            padding: 0;
            overflow: hidden;
            transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
            box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.5);
            z-index: 1;
            transform-style: preserve-3d;
        }
        .cortex-agent-card::after {
            content: "";
            position: absolute;
            top: 0; left: 0; right: 0; bottom: 0;
            border-radius: 16px;
            background: linear-gradient(135deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0) 100%);
            z-index: -1;
            pointer-events: none;
        }
        .cortex-agent-card:hover {
            transform: translateY(-8px) scale(1.02);
            border: 1px solid rgba(0, 243, 255, 0.6);
            box-shadow:
                0 15px 45px rgba(0, 0, 0, 0.6),
                0 0 25px rgba(0, 243, 255, 0.2),
                inset 0 0 15px rgba(176, 38, 255, 0.1);
        }
        /* Agent-specific hover accents */
        .cortex-agent-card[data-agent="scoop"]:hover {
            border-color: rgba(255, 184, 0, 0.6);
            box-shadow: 0 15px 45px rgba(0,0,0,0.6), 0 0 25px rgba(255, 184, 0, 0.2);
        }
        .cortex-agent-card[data-agent="redeye"]:hover {
            border-color: rgba(176, 38, 255, 0.6);
            box-shadow: 0 15px 45px rgba(0,0,0,0.6), 0 0 25px rgba(176, 38, 255, 0.2);
        }
        .cortex-agent-card[data-agent="columnini"]:hover {
            border-color: rgba(0, 255, 136, 0.6);
            box-shadow: 0 15px 45px rgba(0,0,0,0.6), 0 0 25px rgba(0, 255, 136, 0.2);
        }
        .cortex-agent-card[data-agent="pulse"]:hover {
            border-color: rgba(236, 72, 153, 0.6);
            box-shadow: 0 15px 45px rgba(0,0,0,0.6), 0 0 25px rgba(236, 72, 153, 0.2);
        }
        /* Skills list styling */
        .agent-skills {
            display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px;
        }
        .agent-skills .skill-tag {
            font-family: var(--font-mono); font-size: 11px; font-weight: 600;
            letter-spacing: 0.5px; text-transform: uppercase;
            padding: 4px 10px; border-radius: 6px;
            background: rgba(var(--accent-rgb), 0.08);
            border: 1px solid rgba(var(--accent-rgb), 0.2);
            color: var(--accent);
            transition: all 0.3s;
        }
        .cortex-agent-card:hover .skill-tag {
            background: rgba(var(--accent-rgb), 0.15);
            border-color: rgba(var(--accent-rgb), 0.4);
        }

        /* Data stream animation (Scoop card) */
        .data-rain {
            position:absolute; inset:0; z-index:0; overflow:hidden; opacity:0.15; pointer-events:none;
        }
        .data-rain span {
            position:absolute; font-family:var(--font-mono); font-size:13px;
            color: var(--amber); opacity:0.6; animation: dataFall linear infinite;
            white-space:nowrap;
        }
        @keyframes dataFall {
            0% { transform:translateY(-100%); opacity:0; }
            10% { opacity:0.6; }
            90% { opacity:0.6; }
            100% { transform:translateY(400px); opacity:0; }
        }

        /* Radar sweep (Riley card) */
        .radar-sweep {
            position:absolute; top:50%; left:50%; width:200px; height:200px;
            transform:translate(-50%,-50%); z-index:0; pointer-events:none; opacity:0.12;
        }
        .radar-sweep::after {
            content:''; position:absolute; inset:0; border-radius:50%;
            border:1px solid rgba(6,182,212,0.3);
        }
        .radar-line {
            position:absolute; top:50%; left:50%; width:50%; height:2px;
            background:linear-gradient(90deg, rgba(6,182,212,0.8), transparent);
            transform-origin:left center;
            animation: radarSpin 3s linear infinite;
        }
        @keyframes radarSpin { to { transform:rotate(360deg); } }

        /* Geometric grid animation (Pulse card) */
        .geo-grid {
            position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none; opacity:0.12;
        }
        .geo-grid-inner {
            position:absolute; inset:-20px;
            background-image:
                linear-gradient(rgba(236,72,153,0.4) 1px, transparent 1px),
                linear-gradient(90deg, rgba(236,72,153,0.4) 1px, transparent 1px);
            background-size:24px 24px;
            animation: geoShift 8s linear infinite;
        }
        @keyframes geoShift {
            0% { transform:translate(0,0); }
            100% { transform:translate(24px,24px); }
        }
        /* QA Scanline sweep â€” base */
        .qa-scanline {
            position:absolute; left:0; right:0; height:3px; z-index:1;
            background:linear-gradient(90deg, transparent, rgba(236,72,153,0.7) 30%, rgba(236,72,153,0.9) 50%, rgba(236,72,153,0.7) 70%, transparent);
            box-shadow:0 0 12px rgba(236,72,153,0.5), 0 0 30px rgba(236,72,153,0.2);
            animation: qaSweep 4s ease-in-out infinite;
            pointer-events:none;
        }
        /* Scanline color variants per card */
        .card-columnini .qa-scanline {
            background:linear-gradient(90deg, transparent, rgba(20,184,166,0.7) 30%, rgba(20,184,166,0.9) 50%, rgba(20,184,166,0.7) 70%, transparent);
            box-shadow:0 0 12px rgba(20,184,166,0.5), 0 0 30px rgba(20,184,166,0.2);
            animation-delay: 0s;
        }
        .card-scoop .qa-scanline {
            background:linear-gradient(90deg, transparent, rgba(245,158,11,0.7) 30%, rgba(245,158,11,0.9) 50%, rgba(245,158,11,0.7) 70%, transparent);
            box-shadow:0 0 12px rgba(245,158,11,0.5), 0 0 30px rgba(245,158,11,0.2);
            animation-delay: 1s;
        }
        .card-riley .qa-scanline {
            background:linear-gradient(90deg, transparent, rgba(6,182,212,0.7) 30%, rgba(6,182,212,0.9) 50%, rgba(6,182,212,0.7) 70%, transparent);
            box-shadow:0 0 12px rgba(6,182,212,0.5), 0 0 30px rgba(6,182,212,0.2);
            animation-delay: 2s;
        }
        .card-pulse .qa-scanline {
            animation-delay: 3s;
        }
        @keyframes qaSweep {
            0% { top:-3px; opacity:0; }
            10% { opacity:1; }
            90% { opacity:1; }
            100% { top:calc(100% + 3px); opacity:0; }
        }

        /* ===== ANIM-901: LIVE PAGINATION TERMINAL ===== */
        .pagination-terminal {
            max-width:960px; margin:0 auto; border-radius:16px; overflow:hidden;
            border:1px solid rgba(236,72,153,0.25);
            background:rgba(5,11,20,0.70);
            backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px);
            box-shadow:0 0 60px rgba(236,72,153,0.08), 0 0 120px rgba(0,0,0,0.4);
            position:relative;
        }
        .pagination-terminal-header {
            display:flex; align-items:center; gap:12px;
            padding:14px 20px;
            background:rgba(236,72,153,0.06);
            border-bottom:1px solid rgba(236,72,153,0.15);
        }
        .pagination-terminal-header .term-dots {
            display:flex; gap:6px;
        }
        .pagination-terminal-header .term-dots span {
            width:10px; height:10px; border-radius:50%;
        }
        .pagination-terminal-header .term-title {
            font-family:var(--font-mono); font-size:13px; font-weight:700;
            letter-spacing:2px; text-transform:uppercase;
            color:rgba(236,72,153,0.8);
        }
        .pagination-terminal-body {
            padding:14px 18px; position:relative; min-height:400px;
        }
        /* Chaos grid â€” sparse layout with gaps */
        .pagination-grid {
            display:grid;
            grid-template-columns:repeat(6, 1fr);
            grid-auto-rows:42px;
            gap:4px;
            position:relative;
        }
        /* Optimized grid â€” dense packing */
        .pagination-grid.optimized {
            grid-template-columns:repeat(6, 1fr);
            grid-auto-rows:38px;
            gap:3px;
        }
        .ad-block {
            border-radius:5px; display:flex; align-items:center; justify-content:center;
            font-family:var(--font-mono); font-size:12px; font-weight:700;
            letter-spacing:0.5px; position:relative; z-index:2;
            box-shadow:inset 0 0 20px rgba(255,255,255,0.03);
            flex-direction:column; gap:0px; padding:2px 8px;
            text-align:center; line-height:1.15;
        }
        .ad-block .ad-type-label {
            font-size:9px; font-weight:600; letter-spacing:1.5px; text-transform:uppercase;
            opacity:0.6; margin-bottom:1px;
        }
        /* -- Ad Type: Display (Bold, vibrant) -- */
        .ad-type-display { background:rgba(239,68,68,0.18); border:1.5px solid rgba(239,68,68,0.45); color:rgba(239,68,68,0.9); }
        .ad-type-display.size-half { grid-column:span 3; }
        .ad-type-display.size-quarter { grid-column:span 2; }
        .ad-type-display.size-full { grid-column:span 6; grid-row:span 2; font-size:15px; }
        .ad-type-display.size-sixth { grid-column:span 1; }
        /* -- Ad Type: Legal Notice (Purple, formal) -- */
        .ad-type-legal { background:rgba(139,92,246,0.12); border:1.5px solid rgba(139,92,246,0.35); color:rgba(139,92,246,0.85); font-size:11px; }
        .ad-type-legal.size-third { grid-column:span 2; }
        .ad-type-legal.size-quarter { grid-column:span 2; }
        .ad-type-legal.size-half { grid-column:span 3; }
        /* -- Ad Type: Classified (Amber, compact) -- */
        .ad-type-classified { background:rgba(245,158,11,0.12); border:1.5px solid rgba(245,158,11,0.35); color:rgba(245,158,11,0.85); font-size:11px; }
        .ad-type-classified.size-single { grid-column:span 1; }
        .ad-type-classified.size-double { grid-column:span 2; }
        /* -- Ad Type: House Ad (Pink, internal) -- */
        .ad-type-house { background:rgba(236,72,153,0.10); border:1.5px solid rgba(236,72,153,0.30); color:rgba(236,72,153,0.75); }
        .ad-type-house.size-third { grid-column:span 2; }
        .ad-type-house.size-strip { grid-column:span 6; font-size:11px; }
        /* -- Ad Type: Insert / Preprint (Cyan) -- */
        .ad-type-insert { background:rgba(6,182,212,0.12); border:1.5px solid rgba(6,182,212,0.35); color:rgba(6,182,212,0.85); }
        .ad-type-insert.size-quarter { grid-column:span 2; }
        .ad-type-insert.size-half { grid-column:span 3; }
        /* -- Ad Type: Strip / Banner (Green, horizontal) -- */
        .ad-type-strip { background:rgba(16,185,129,0.12); border:1.5px solid rgba(16,185,129,0.35); color:rgba(16,185,129,0.85); grid-column:span 6; font-size:11px; }
        /* -- Newspaper Section Headers -- */
        .section-bar {
            grid-column:span 6; border-radius:3px;
            display:flex; align-items:center; gap:6px;
            padding:2px 10px; height:24px;
            font-family:var(--font-mono); font-size:10px; font-weight:800;
            letter-spacing:3px; text-transform:uppercase;
            border-bottom:2px solid; z-index:3;
        }
        .section-bar::before { content:'â–Ž'; font-size:14px; }
        .section-bar-news { background:rgba(59,130,246,0.08); border-color:rgba(59,130,246,0.40); color:rgba(59,130,246,0.85); }
        .section-bar-sports { background:rgba(16,185,129,0.08); border-color:rgba(16,185,129,0.40); color:rgba(16,185,129,0.85); }
        .section-bar-classifieds { background:rgba(245,158,11,0.08); border-color:rgba(245,158,11,0.40); color:rgba(245,158,11,0.85); }
        .section-bar-legals { background:rgba(139,92,246,0.08); border-color:rgba(139,92,246,0.40); color:rgba(139,92,246,0.85); }
        .section-bar-lifestyle { background:rgba(236,72,153,0.08); border-color:rgba(236,72,153,0.40); color:rgba(236,72,153,0.85); }
        /* -- Dead space gaps -- */
        .ad-gap {
            border-radius:4px; display:flex; align-items:center; justify-content:center;
            font-family:var(--font-mono); font-size:9px; font-weight:500;
            color:rgba(239,68,68,0.65); letter-spacing:1px;
            background:rgba(239,68,68,0.03);
            border:1px dashed rgba(239,68,68,0.18);
            position:relative; z-index:1;
        }
        .ad-gap.gap-wide { grid-column:span 2; }
        .ad-gap.gap-full { grid-column:span 3; }
        .ad-gap.gap-strip { grid-column:span 6; }
        /* -- New revenue ads (injected on optimization) -- */
        .ad-block.new-revenue {
            background:rgba(0,242,254,0.12); border:1.5px solid rgba(0,242,254,0.45);
            color:rgba(0,242,254,0.95); font-weight:800;
            box-shadow:0 0 20px rgba(0,242,254,0.15), inset 0 0 15px rgba(0,242,254,0.05);
            animation:newRevGlow 2s ease-in-out infinite;
        }
        @keyframes newRevGlow {
            0%,100%{box-shadow:0 0 20px rgba(0,242,254,0.12)} 50%{box-shadow:0 0 35px rgba(0,242,254,0.30)}
        }
        /* -- Page indicator -- */
        .page-indicator {
            grid-column:span 6; display:flex; align-items:center; justify-content:center;
            font-family:var(--font-mono); font-size:9px; font-weight:600;
            letter-spacing:2px; text-transform:uppercase;
            color:rgba(255,255,255,0.72); height:20px;
            border-top:1px dashed rgba(255,255,255,0.06);
            border-bottom:1px dashed rgba(255,255,255,0.06);
        }
        /* QA Laser Scanline */
        .qa-laser {
            position:absolute; left:0; right:0; height:3px; z-index:10;
            background:linear-gradient(90deg, transparent 5%, rgba(236,72,153,0.9) 30%, #ec4899 50%, rgba(236,72,153,0.9) 70%, transparent 95%);
            box-shadow:0 0 15px rgba(236,72,153,0.6), 0 0 40px rgba(236,72,153,0.3), 0 -4px 12px rgba(236,72,153,0.2), 0 4px 12px rgba(236,72,153,0.2);
            pointer-events:none; opacity:0; top:-3px;
        }
        /* Pagination Counter Bar */
        .pagination-counter {
            display:flex; justify-content:space-between; align-items:center;
            padding:14px 20px;
            border-top:1px solid rgba(255,255,255,0.06);
            font-family:var(--font-mono); font-size:13px; font-weight:700;
        }
        .pagination-counter .fill-rate { color:rgba(239,68,68,0.9); letter-spacing:1px; font-size:13px; font-weight:700; }
        .pagination-counter .fill-rate.optimized { color:var(--neon-teal); text-shadow:0 0 12px rgba(0,242,254,0.5); }
        .pagination-counter .page-count { color:rgba(255,255,255,0.78); letter-spacing:1px; font-size:11px; font-weight:600; }
        .pagination-counter .page-count.optimized { color:rgba(255,255,255,0.90); }
        .pagination-counter .revenue-status { color:rgba(255,255,255,0.82); letter-spacing:1px; font-size:13px; font-weight:600; }
        .pagination-counter .revenue-status.optimized { color:var(--neon-teal); text-shadow:0 0 12px rgba(0,242,254,0.5); }
        /* Screen darken overlay */
        .pagination-darken {
            position:absolute; inset:0; background:rgba(0,0,0,0); z-index:5;
            pointer-events:none; border-radius:16px;
        }

        /* ===== CRM SECTION ===== */
        .crm-compare {
            display:grid; grid-template-columns:1fr 1fr;
            gap:32px; max-width:1100px; margin:0 auto;
        }
        @media(max-width:800px) { .crm-compare { grid-template-columns:1fr; } }
        .crm-panel { padding:28px; position:relative; overflow:hidden; }
        .crm-panel h4 {
            font-family:var(--font-mono); font-size:14px; font-weight:700;
            letter-spacing:2px; text-transform:uppercase; margin-bottom:20px;
        }
        .crm-stat-row {
            display:flex; justify-content:space-between; align-items:center;
            padding:10px 0; border-bottom:1px solid rgba(255,255,255,0.04);
        }
        .crm-stat-label { font-size:14px; color:rgba(255,255,255,0.88); font-weight:500; }
        .crm-stat-val { font-family:var(--font-mono); font-size:14px; font-weight:700; }

        /* ===== REVENUE RETRIEVAL ===== */
        #revenue-canvas { width:100%; height:300px; border-radius:16px; }
        .revenue-counter {
            text-align:center; margin-top:16px;
            font-family:var(--font-mono); font-size:14px; color:rgba(255,255,255,0.85); font-weight:600;
        }
        .revenue-counter .big-num {
            font-size:clamp(2rem,5vw,3.5rem); font-weight:800;
            color:var(--neon-teal); display:block;
            text-shadow:0 0 20px rgba(0,242,254,0.4);
            font-variant-numeric:tabular-nums;
        }

        /* ===== HERO DATA PARTICLES OVERLAY ===== */
        #hero-particles-canvas {
            position:absolute; inset:0; width:100%; height:100%;
            pointer-events:none; z-index:2;
        }

        /* ===== CRM TERMINAL HUD ===== */
        .crm-terminal {
            background:rgba(5,11,20,0.60);
            backdrop-filter:blur(32px); -webkit-backdrop-filter:blur(32px);
            border:1px solid rgba(20,184,166,0.40);
            border-radius:16px; overflow:hidden;
            box-shadow:0 0 40px rgba(0,242,254,0.06);
        }
        .crm-terminal-header {
            padding:12px 20px;
            background:rgba(0,242,254,0.04);
            border-bottom:1px solid rgba(255,255,255,0.06);
            display:flex; justify-content:space-between; align-items:center;
        }
        .crm-terminal-header h4 {
            font-family:var(--font-mono); font-size:13px; font-weight:700;
            letter-spacing:2px; text-transform:uppercase; color:var(--neon-teal);
        }
        .crm-terminal-header .status-dot {
            width:8px; height:8px; border-radius:50%; background:#10b981;
            box-shadow:0 0 8px rgba(16,185,129,0.5);
            animation: dotPulse 2s infinite;
        }
        @keyframes dotPulse { 0%,100%{opacity:1} 50%{opacity:0.4} }
        .crm-data-rows { padding:8px 0; }
        .crm-data-row {
            display:grid; grid-template-columns:120px 1fr 100px 90px;
            gap:8px; padding:10px 20px; align-items:center;
            border-bottom:1px solid rgba(255,255,255,0.03);
            transition:background 0.2s;
            cursor:pointer; font-variant-numeric:tabular-nums;
        }
        .crm-data-row:hover { background:rgba(20,184,166,0.10); }
        .crm-data-row .sub-id {
            font-family:var(--font-mono); font-size:13px; font-weight:600;
            color:rgba(0,242,254,0.90); letter-spacing:1px;
        }
        .crm-data-row .sub-name {
            font-size:14px; color:rgba(255,255,255,0.85); font-weight:600;
        }
        .crm-data-row .sub-revenue {
            font-family:var(--font-mono); font-size:13px; font-weight:700;
            color:var(--green); text-align:right;
        }
        .crm-data-row .sub-status {
            font-family:var(--font-mono); font-size:13px; font-weight:600;
            text-align:right;
        }
        .crm-data-row .sub-status.active { color:var(--green); }
        .crm-data-row .sub-status.overdue { color:#ef4444; }
        .crm-data-row .sub-status.pending { color:var(--amber); }
        @media(max-width:700px) {
            .crm-data-row { grid-template-columns:80px 1fr 80px; }
            .crm-data-row .sub-status { display:none; }
        }

        /* ===== 3D NEWSPAPER HOLOGRAM ===== */
        #holo-wrap {
            position:relative; width:500px; height:400px; max-width:90vw; margin:0 auto;
        }
        #holo-canvas { width:100%; height:100%; outline:none; touch-action:none; }

        /* ===== FOOTER ===== */
        footer {
            position:relative; z-index:1; padding:60px 40px 40px;
            max-width:1300px; margin:0 auto;
            border-top:1px solid rgba(255,255,255,0.06);
        }
        .footer-grid {
            display:grid; grid-template-columns:1fr auto 1fr;
            gap:40px; align-items:center; margin-bottom:32px;
        }
        @media(max-width:768px) { .footer-grid { grid-template-columns:1fr; text-align:center; } }
        .footer-links { display:flex; gap:20px; flex-wrap:wrap; }
        .footer-links a {
            color:rgba(255,255,255,0.82); text-decoration:none;
            font-size:14px; font-weight:600; transition:color 0.3s;
        }
        .footer-links a:hover { color:var(--neon-teal); }
        .footer-social { display:flex; gap:12px; justify-content:flex-end; }
        .footer-social a {
            width:36px; height:36px; border-radius:50%;
            border:1px solid rgba(255,255,255,0.20);
            display:flex; align-items:center; justify-content:center;
            color:rgba(255,255,255,0.82); font-size:16px;
            text-decoration:none; transition:all 0.3s;
        }
        .footer-social a:hover { border-color:var(--neon-teal); color:var(--neon-teal); }

        /* ===== UTILITY ===== */
        .count-up { font-variant-numeric: tabular-nums; }
        @media(max-width:768px) {
            section { padding:100px 20px 60px; }
            nav { padding:10px 20px; }
            .ad-layout-demo { grid-template-columns:1fr; }
            .transform-arrow { transform:rotate(90deg); }
            .transform-journey { flex-direction:column; gap:20px; }
            .tj-stage { min-width:unset; width:100%; }
            .tj-stream-wrap { min-height:200px; }
        }

        /* ===== TRANSFORMATION JOURNEY ===== */
        .transform-journey {
            display:flex; gap:0; align-items:stretch;
            max-width:1200px; margin:0 auto;
            background:rgba(5,11,20,0.55);
            backdrop-filter:blur(32px); -webkit-backdrop-filter:blur(32px);
            border:1px solid rgba(20,184,166,0.20);
            border-radius:20px; overflow:hidden;
            box-shadow:0 0 60px rgba(0,0,0,0.3), 0 0 40px rgba(0,242,254,0.04);
            position:relative;
        }
        .tj-stage { display:flex; flex-direction:column; justify-content:center; padding:28px; position:relative; }
        /* LEFT â€” LEGACY */
        .tj-legacy {
            min-width:260px; max-width:280px;
            border-right:1px dashed rgba(239,68,68,0.25);
            background:rgba(239,68,68,0.03);
        }
        .legacy-machine-icon {
            width:80px; height:80px; margin:0 auto 16px; position:relative;
        }
        .legacy-gear {
            position:absolute; border:2px solid rgba(239,68,68,0.45); border-radius:50%;
            animation:legacyGearSpin 8s linear infinite;
        }
        .legacy-gear-1 { width:50px; height:50px; top:0; left:15px; }
        .legacy-gear-2 { width:35px; height:35px; top:30px; left:0; animation-direction:reverse; animation-duration:6s; }
        .legacy-gear-3 { width:25px; height:25px; top:40px; right:5px; animation-duration:4s; }
        @keyframes legacyGearSpin { to { transform:rotate(360deg); } }
        .legacy-label {
            font-family:var(--font-mono); font-size:14px; font-weight:700;
            letter-spacing:2px; text-transform:uppercase;
            color:rgba(239,68,68,0.8); text-align:center; margin-bottom:16px;
        }
        .legacy-fragments {
            position:absolute; inset:0; overflow:hidden; pointer-events:none;
        }
        .legacy-frag {
            position:absolute; font-family:var(--font-mono); font-size:13px;
            font-weight:600; color:rgba(239,68,68,0.82);
            animation:glitchFloat 4s ease-in-out infinite;
            white-space:nowrap;
        }
        @keyframes glitchFloat {
            0%,100% { transform:translate(0,0) skewX(0deg); opacity:0.3; }
            25% { transform:translate(3px,-8px) skewX(-3deg); opacity:0.8; }
            50% { transform:translate(-4px,5px) skewX(2deg); opacity:0.4; }
            75% { transform:translate(6px,-3px) skewX(-1deg); opacity:0.7; }
        }
        .legacy-stat {
            display:flex; justify-content:space-between; align-items:center;
            padding:6px 0; border-bottom:1px solid rgba(239,68,68,0.08);
            font-size:13px;
        }
        .legacy-stat-label { color:rgba(255,255,255,0.78); font-weight:500; }
        .legacy-stat-val {
            font-family:var(--font-mono); font-weight:700;
            color:rgba(239,68,68,0.8); font-size:13px;
        }
        /* CENTER â€” DATA MIGRATION BRIDGE */
        .tj-bridge {
            flex:1; min-width:280px; position:relative;
            display:flex; flex-direction:column; justify-content:center;
            align-items:center; padding:20px 16px;
        }
        .bridge-pipe {
            position:relative; width:100%; height:48px;
            background:rgba(10,20,40,0.55);
            backdrop-filter:blur(28px); -webkit-backdrop-filter:blur(28px);
            border:1px solid rgba(0,242,254,0.20);
            border-radius:24px; overflow:hidden;
            box-shadow:0 0 30px rgba(0,242,254,0.06), inset 0 0 20px rgba(0,242,254,0.04);
        }
        .bridge-pipe::before {
            content:''; position:absolute; inset:0;
            background:linear-gradient(90deg, rgba(239,68,68,0.06), rgba(0,242,254,0.08) 50%, rgba(0,242,254,0.12));
            pointer-events:none;
        }
        .bridge-pipe::after {
            content:''; position:absolute; top:50%; left:0; right:0; height:1px;
            background:linear-gradient(90deg, transparent, rgba(0,242,254,0.15) 20%, rgba(0,242,254,0.15) 80%, transparent);
            transform:translateY(-0.5px); pointer-events:none;
        }
        .bridge-beam {
            position:absolute; top:8px; bottom:8px; width:80px;
            border-radius:16px;
            background:linear-gradient(90deg, transparent, rgba(0,242,254,0.35) 30%, rgba(0,242,254,0.6) 50%, rgba(0,242,254,0.35) 70%, transparent);
            box-shadow:0 0 20px rgba(0,242,254,0.4), 0 0 40px rgba(0,242,254,0.15);
            left:-80px; opacity:0;
        }
        /* AI WORKFORCE TERMINALS */
        .ai-terminal {
            position:absolute; z-index:5; width:220px;
            background:rgba(5,11,20,0.75);
            backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
            border-radius:10px; overflow:hidden;
            box-shadow:0 4px 30px rgba(0,0,0,0.4);
        }
        .terminal-columnini {
            top:0; left:10%; border:1px solid rgba(20,184,166,0.40);
            transform:translateY(-8px);
        }
        .terminal-scoop {
            bottom:0; right:10%; border:1px solid rgba(245,158,11,0.40);
            transform:translateY(8px);
        }
        .terminal-header {
            padding:8px 12px; display:flex; flex-direction:column; gap:2px;
        }
        .terminal-columnini .terminal-header {
            background:rgba(20,184,166,0.08);
            border-bottom:1px solid rgba(20,184,166,0.20);
        }
        .terminal-scoop .terminal-header {
            background:rgba(245,158,11,0.08);
            border-bottom:1px solid rgba(245,158,11,0.20);
        }
        .terminal-status {
            font-family:var(--font-mono); font-size:11px; font-weight:700;
            letter-spacing:1.5px; text-transform:uppercase;
        }
        .terminal-columnini .terminal-status { color:rgba(0,242,254,0.9); }
        .terminal-scoop .terminal-status { color:rgba(245,158,11,0.9); }
        .terminal-operative {
            font-family:var(--font-mono); font-size:10px; font-weight:700;
            letter-spacing:1px; color:rgba(255,255,255,0.85);
        }
        .terminal-log {
            height:52px; overflow:hidden; padding:6px 12px;
            font-family:var(--font-mono); font-size:10px; line-height:1.6;
            color:rgba(255,255,255,0.75);
            mask-image:linear-gradient(180deg, transparent 0%, black 20%, black 70%, transparent 100%);
            -webkit-mask-image:linear-gradient(180deg, transparent 0%, black 20%, black 70%, transparent 100%);
        }
        .terminal-log .log-line {
            white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
            opacity:0.7; animation:logFadeIn 0.3s ease-out;
        }
        @keyframes logFadeIn { from { opacity:0; transform:translateY(6px); } to { opacity:0.7; transform:translateY(0); } }
        .terminal-scoop.pulse-found {
            box-shadow:0 0 25px rgba(245,158,11,0.35), 0 4px 30px rgba(0,0,0,0.4);
            border-color:rgba(245,158,11,0.70);
        }
        /* REVENUE TRACKER INSIDE HUB */
        .revenue-tracker-hub {
            padding:12px 20px;
            background:rgba(0,242,254,0.04);
            border-top:1px solid rgba(0,242,254,0.15);
            display:flex; justify-content:space-between; align-items:center;
        }
        .revenue-tracker-hub .revenue-label {
            font-family:var(--font-mono); font-size:11px; font-weight:700;
            letter-spacing:2px; text-transform:uppercase;
            color:rgba(0,242,254,0.85);
        }
        .revenue-tracker-hub .revenue-amount {
            font-family:var(--font-mono); font-size:clamp(1.1rem,2vw,1.5rem);
            font-weight:800; color:var(--neon-teal);
            text-shadow:0 0 15px rgba(0,242,254,0.5);
            font-variant-numeric:tabular-nums;
            transition:text-shadow 0.3s, transform 0.3s;
        }
        .revenue-tracker-hub .revenue-amount.pulse-glow {
            text-shadow:0 0 25px rgba(0,242,254,0.9), 0 0 50px rgba(0,242,254,0.5), 0 0 80px rgba(0,242,254,0.3);
            transform:scale(1.08);
        }
        @media(max-width:800px) {
            .ai-terminal { position:relative; width:100%; left:0 !important; right:0 !important;
                top:auto !important; bottom:auto !important; transform:none !important; margin-top:8px; }
            .tj-bridge { min-height:auto; padding:12px; }
            .bridge-pipe { height:32px; }
        }
        /* RIGHT â€” CORTEX HUB */
        .tj-hub {
            min-width:380px; max-width:440px; padding:0;
        }
        .tj-hub-table {
            width:100%; height:100%;
            background:rgba(5,11,20,0.60);
            border-left:1px solid rgba(20,184,166,0.30);
        }
        .tj-hub-header {
            padding:12px 20px;
            background:rgba(0,242,254,0.04);
            border-bottom:1px solid rgba(255,255,255,0.06);
            display:flex; justify-content:space-between; align-items:center;
        }
        .tj-hub-header h4 {
            font-family:var(--font-mono); font-size:13px; font-weight:700;
            letter-spacing:2px; text-transform:uppercase; color:var(--neon-teal); margin:0;
        }
        .tj-hub-row {
            display:grid; grid-template-columns:80px 1fr 80px 80px;
            gap:6px; padding:8px 20px; align-items:center;
            border-bottom:1px solid rgba(255,255,255,0.03);
            font-variant-numeric:tabular-nums; position:relative;
        }
        .tj-hub-row:hover { background:rgba(20,184,166,0.08); }
        .tj-hub-row .sub-id {
            font-family:var(--font-mono); font-size:13px; font-weight:600;
            color:rgba(0,242,254,0.90); letter-spacing:1px;
        }
        .tj-hub-row .sub-name {
            font-size:13px; color:rgba(255,255,255,0.85); font-weight:600;
        }
        .tj-hub-row .sub-revenue {
            font-family:var(--font-mono); font-size:13px; font-weight:700;
            color:var(--green); text-align:right;
        }
        .tj-hub-row .sub-status {
            font-family:var(--font-mono); font-size:13px; font-weight:600; text-align:right;
        }
        .tj-hub-row .sub-status.active { color:var(--green); }
        .tj-hub-row .sub-status.overdue { color:#ef4444; }
        .tj-hub-row .sub-status.pending { color:var(--amber); }
        .tj-hub-footer {
            padding:10px 20px; border-top:1px solid rgba(255,255,255,0.06);
            display:flex; justify-content:space-between; align-items:center;
        }
        .verified-stamp {
            position:absolute; right:8px; top:50%; transform:translateY(-50%);
            font-family:var(--font-mono); font-size:9px; font-weight:800;
            letter-spacing:1px; color:var(--neon-teal);
            border:1.5px solid rgba(0,242,254,0.5); border-radius:4px;
            padding:2px 6px; background:rgba(0,242,254,0.06);
            box-shadow:0 0 8px rgba(0,242,254,0.3);
            opacity:0; transform:translateY(-50%) scale(0);
        }
        .verified-stamp.show {
            animation:stampPop 0.4s cubic-bezier(0.34,1.56,0.64,1) forwards;
        }
        @keyframes stampPop {
            to { opacity:1; transform:translateY(-50%) scale(1); }
        }
        /* (tj-powered removed â€” workforce now visible on bridge) */

        /* ===== FLASHLIGHT CURSOR ===== */
        #cursor-glow {
            position:fixed; width:600px; height:600px; border-radius:50%;
            background:radial-gradient(circle, rgba(0,242,254,0.07) 0%, rgba(0,242,254,0.02) 30%, transparent 70%);
            pointer-events:none; z-index:998; transform:translate(-50%,-50%);
            transition:opacity 0.4s; opacity:0;
        }
        body:hover #cursor-glow { opacity:1; }

        /* ===== PINNED BRAIN ===== */
        #hero-3d-wrap.pinned {
            position:fixed !important; left:4vw !important; top:50% !important;
            z-index:50; transform:translateY(-50%) scale(0.5) !important;
            opacity:0.85; transition:all 0.8s cubic-bezier(0.25,0.46,0.45,0.94); margin:0 !important;
        }
        #hero-3d-wrap.pinned-exit { opacity:0 !important; transition:opacity 0.5s !important; }
        .personnel-grid.brain-active {
            padding-left:22vw; transition:padding-left 0.8s cubic-bezier(0.25,0.46,0.45,0.94);
        }
        @media(max-width:1024px) {
            #hero-3d-wrap.pinned { display:none !important; }
            .personnel-grid.brain-active { padding-left:0; }
        }

        /* ===== NEURAL SKILL MATRIX ===== */
        #skill-matrix-overlay {
            position:fixed; inset:0; z-index:10000;
            background:rgba(4,8,17,0.96); backdrop-filter:blur(40px); -webkit-backdrop-filter:blur(40px);
            display:flex; flex-direction:column; align-items:center; justify-content:center;
            opacity:0; pointer-events:none;
        }
        #skill-matrix-overlay.active { opacity:1; pointer-events:all; }
        .matrix-title {
            font-family:var(--font-mono); font-size:16px; font-weight:700;
            letter-spacing:3px; text-transform:uppercase; margin-bottom:8px;
            text-shadow:0 0 20px currentColor;
        }
        .matrix-subtitle {
            font-family:var(--font-mono); font-size:13px; color:rgba(255,255,255,0.85);
            letter-spacing:2px; margin-bottom:24px;
        }
        .matrix-avatar-wrap {
            position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:10002;
        }
        .matrix-video-wrap {
            -webkit-mask-image:radial-gradient(circle, black 55%, transparent 100%);
            mask-image:radial-gradient(circle, black 55%, transparent 100%);
        }
        .matrix-video-wrap video {
            border:none !important; box-shadow:none !important;
        }
        .matrix-avatar { position:relative; width:100px; height:120px; }
        .matrix-avatar .holo-head { transform:scale(2); transform-origin:top center; }
        .skill-nodes-container {
            position:relative; width:700px; height:600px; max-width:90vw; max-height:65vh;
            z-index:10002;
        }
        .skill-node {
            position:absolute; background:rgba(10,15,28,0.70);
            backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px);
            border:1px solid rgba(20,184,166,0.40); border-radius:12px;
            padding:14px 18px; min-width:180px; cursor:pointer;
            transition:all 0.4s cubic-bezier(0.25,0.46,0.45,0.94);
            opacity:0; transform:scale(0);
        }
        .skill-node:hover {
            border-color:rgba(0,242,254,0.7);
            box-shadow:0 0 30px rgba(0,242,254,0.15), 0 0 60px rgba(0,242,254,0.05);
            transform:scale(1.08) !important; z-index:10003;
        }
        .skill-node .skill-name {
            font-family:var(--font-mono); font-size:13px; font-weight:700;
            letter-spacing:1.5px; text-transform:uppercase; margin-bottom:6px;
        }
        .skill-node .skill-terminal {
            font-family:var(--font-mono); font-size:11px; line-height:1.5;
            color:rgba(255,255,255,0.88); max-height:0; overflow:hidden;
            transition:max-height 0.4s ease, opacity 0.3s; opacity:0;
        }
        .skill-node:hover .skill-terminal { max-height:80px; opacity:1; }
        .skill-tether {
            position:absolute; height:1px; opacity:0.25;
            transform-origin:left center; pointer-events:none;
        }
        .matrix-esc {
            position:fixed; bottom:32px; left:50%; transform:translateX(-50%);
            z-index:10001; font-family:var(--font-mono);
            font-size:14px; letter-spacing:3px; color:rgba(0,242,254,0.90);
            text-transform:uppercase; animation:escBlink 2s ease-in-out infinite;
            cursor:pointer; background:rgba(0,0,0,0.5); padding:10px 24px;
            border-radius:999px; border:1px solid rgba(0,242,254,0.4);
            transition:all 0.3s; pointer-events:all;
        }
        .matrix-esc:hover {
            background:rgba(0,242,254,0.15); border-color:rgba(0,242,254,0.7);
            color:#00f2fe;
        }
        @keyframes escBlink { 0%,100%{opacity:0.3} 50%{opacity:0.9} }

        /* ===== CRM TERMINAL EXPANDED ===== */
        .crm-terminal { cursor:pointer; transition:all 0.4s ease; position:relative; }
        .crm-terminal.expanded {
            position:fixed !important; inset:0 !important; z-index:9999 !important;
            border-radius:0 !important; max-width:none !important; width:100vw !important;
            border:none !important; overflow-y:auto; cursor:default;
        }
        .crm-exit-btn {
            display:none; position:absolute; top:12px; right:20px;
            font-family:var(--font-mono); font-size:13px; font-weight:700;
            letter-spacing:2px; color:rgba(239,68,68,0.8); text-transform:uppercase;
            background:rgba(239,68,68,0.08); border:1px solid rgba(239,68,68,0.3);
            padding:8px 16px; border-radius:6px; cursor:pointer; transition:all 0.3s; z-index:10;
        }
        .crm-exit-btn:hover { background:rgba(239,68,68,0.15); border-color:rgba(239,68,68,0.6); color:#ef4444; }
        .crm-terminal.expanded .crm-exit-btn { display:block; }
        .crm-bg-stream {
            display:none; position:absolute; inset:0; z-index:0; overflow:hidden;
            opacity:0.04; font-family:var(--font-mono); font-size:12px;
            color:var(--neon-teal); white-space:pre; line-height:1.8;
            pointer-events:none; padding:60px 20px;
        }
        .crm-terminal.expanded .crm-bg-stream { display:block; }
        .crm-terminal.expanded .crm-terminal-header,
        .crm-terminal.expanded .crm-data-rows,
        .crm-terminal.expanded > div:last-child { position:relative; z-index:1; }

        /* ===== RILEY GLITCH ===== */
        @keyframes rileyGlitch {
            0%,92%{transform:translateX(-50%);filter:none}
            93%{transform:translateX(calc(-50% + 3px));filter:hue-rotate(90deg) brightness(1.5)}
            94%{transform:translateX(calc(-50% - 2px));filter:none}
            95%{transform:translateX(calc(-50% + 1px));filter:hue-rotate(180deg)}
            96%{transform:translateX(calc(-50% - 3px));filter:brightness(1.8)}
            97%,100%{transform:translateX(-50%);filter:none}
        }
        .card-riley .holo-head .skull { animation:rileyGlitch 5s ease-in-out infinite; }

        /* ===== COLUMNINI EDITORIAL FLOW ===== */
        @keyframes editorialFlow {
            0% { transform:translateY(100%); opacity:0; }
            10% { opacity:0.4; }
            90% { opacity:0.4; }
            100% { transform:translateY(-100%); opacity:0; }
        }
        .editorial-flow {
            position:absolute; inset:0; overflow:hidden;
            pointer-events:none; z-index:1;
        }
        .editorial-flow::before {
            content:'Â§1 HEADLINE Â· Â§2 SUBHED Â· Â§3 BODY Â· Â§4 CUTLINE Â· Â§5 JUMP';
            position:absolute; left:12px; width:2px;
            font-family:var(--font-mono); font-size:9px; letter-spacing:2px;
            color:rgba(20,184,166,0.50); writing-mode:vertical-lr;
            text-orientation:mixed; white-space:nowrap;
            animation:editorialFlow 8s linear infinite;
        }

        /* ===== PULSE RADIAL EXPANSION ===== */
        @keyframes pulseRadialExpand {
            0%{transform:translate(-50%,-50%) scale(0.3);opacity:0.6}
            100%{transform:translate(-50%,-50%) scale(3);opacity:0}
        }
        .card-pulse .geo-grid::after {
            content:''; position:absolute; top:50%; left:50%;
            width:80px; height:80px; border:1px solid rgba(236,72,153,0.35);
            border-radius:50%; animation:pulseRadialExpand 3s ease-out infinite;
        }
        .card-pulse .geo-grid::before {
            content:''; position:absolute; top:50%; left:50%;
            width:80px; height:80px; border:1px solid rgba(236,72,153,0.2);
            border-radius:50%; animation:pulseRadialExpand 3s ease-out infinite 1.5s;
        }

        /* ===== PULSE PHYSICS CHAMBER ===== */
        #pulse-chamber-wrap {
            position:relative; width:100%; max-width:1100px; margin:0 auto;
            height:500px; border-radius:12px; overflow:hidden;
            border:1px solid rgba(236,72,153,0.15);
            background:rgba(10,15,28,0.5);
        }
        #pulse-chamber-canvas {
            width:100%; height:100%; display:block;
            background:transparent;
        }
        .chamber-status {
            position:absolute; bottom:16px; left:20px; right:20px;
            display:flex; justify-content:space-between; align-items:center;
            font-family:var(--font-mono); font-size:13px; color:rgba(236,72,153,0.85);
            pointer-events:none; z-index:2;
        }
        .chamber-status .scan-label { letter-spacing:2px; text-transform:uppercase; }
        .chamber-status .scan-pct { color:rgba(0,242,254,0.90); }

        /* Personnel card click hint */
        .personnel-card { cursor:pointer; }
        .personnel-card .click-hint {
            position:absolute; bottom:8px; right:12px;
            font-family:var(--font-mono); font-size:10px; letter-spacing:1px;
            color:rgba(255,255,255,0.65); text-transform:uppercase;
            opacity:0; transition:opacity 0.3s;
        }
        .personnel-card:hover .click-hint { opacity:1; }

        /* ===== VIDEO HOLOGRAM AVATARS ===== */
        .holo-video-wrap {
            position:absolute; top:8px; right:8px; width:90px; height:100px;
            z-index:3; overflow:hidden; border-radius:10px;
            border:1px solid rgba(var(--accent-rgb,20,184,166),0.30);
            box-shadow:0 0 12px rgba(var(--accent-rgb,20,184,166),0.20);
        }
        .holo-video-wrap video {
            width:100%; height:100%; object-fit:cover;
            mix-blend-mode:screen; filter:brightness(1.1) saturate(1.2);
            transition:filter 0.3s;
        }
        .personnel-card:hover .holo-video-wrap video {
            filter:brightness(1.4) saturate(1.4) contrast(1.1);
        }
        .holo-video-wrap::after {
            content:''; position:absolute; inset:0;
            background:linear-gradient(180deg, transparent 60%, rgba(var(--accent-rgb,20,184,166),0.15));
            pointer-events:none;
        }
        /* Skill matrix video avatar */
        .matrix-video-wrap {
            width:160px; height:180px; border-radius:16px; overflow:hidden;
            border:2px solid rgba(var(--accent-rgb,20,184,166),0.50);
            box-shadow:0 0 40px rgba(var(--accent-rgb,20,184,166),0.30);
        }
        .matrix-video-wrap video {
            width:100%; height:100%; object-fit:cover;
            mix-blend-mode:screen; filter:brightness(1.2) saturate(1.3);
        }

        /* ===== CORTEX-UI-104: DIGITAL WORKFORCE NEURAL HUD ===== */
        .neural-hud-container {
            position:relative; width:100%; max-width:900px; margin:0 auto;
            aspect-ratio:1/1; max-height:700px;
        }
        .neural-hud-core-wrap {
            position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
            width:280px; height:280px; z-index:2;
        }
        #cortex-core-canvas {
            width:100%; height:100%; outline:none; touch-action:none;
            border-radius:50%;
        }
        .neural-hud-core-wrap::after {
            content:''; position:absolute; inset:-40px; border-radius:50%;
            background:radial-gradient(circle, rgba(0,242,254,0.12), rgba(20,184,166,0.04) 50%, transparent 70%);
            animation:neuralCoreGlow 3s ease-in-out infinite; pointer-events:none;
        }
        @keyframes neuralCoreGlow { 0%,100%{opacity:0.4;transform:scale(1)} 50%{opacity:1;transform:scale(1.05)} }
        .neural-hud-core-label {
            position:absolute; bottom:-32px; left:50%; transform:translateX(-50%);
            font-family:var(--font-mono); font-size:11px; font-weight:700;
            letter-spacing:3px; text-transform:uppercase;
            color:rgba(0,242,254,0.80); white-space:nowrap;
        }
        /* SVG Data Flow Layer */
        .hud-svg-layer {
            position:absolute; inset:0; z-index:1; pointer-events:none;
        }
        .hud-svg-layer svg { width:100%; height:100%; overflow:visible; }
        .svg-connection-path {
            fill:none; stroke:rgba(20,184,166,0.15); stroke-width:1.5;
            filter:url(#hud-path-glow);
        }
        .svg-connection-path.active {
            stroke:rgba(20,184,166,0.45); stroke-width:2;
        }
        /* Glassmorphic Node Panels */
        .node-glass {
            position:absolute; z-index:10;
            display:flex; align-items:center; justify-content:center; gap:10px;
            padding:14px 24px; min-width:140px;
            background:rgba(20,184,166,0.06);
            backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
            border:1px solid rgba(20,184,166,0.25);
            border-radius:12px;
            box-shadow:0 0 15px rgba(20,184,166,0.12);
            cursor:pointer; transition:all 0.35s cubic-bezier(0.25,0.46,0.45,0.94);
        }
        .node-glass:hover {
            border-color:rgba(20,184,166,0.85);
            box-shadow:0 0 30px rgba(20,184,166,0.5), 0 0 60px rgba(0,242,254,0.12);
            transform:translate(-50%,-50%) scale(1.08) !important;
            background:rgba(20,184,166,0.12);
        }
        .node-glass .node-icon {
            font-size:18px; filter:drop-shadow(0 0 6px rgba(0,242,254,0.6));
        }
        .node-glass .node-label {
            font-family:var(--font-mono); font-size:13px; font-weight:700;
            letter-spacing:3px; text-transform:uppercase;
            color:rgba(45,212,191,0.9);
            text-shadow:0 0 8px rgba(20,184,166,0.6);
        }
        .node-glass:hover .node-label {
            color:#5eead4; text-shadow:0 0 12px rgba(0,242,254,0.8);
        }
        .node-glass .node-dot {
            width:8px; height:8px; border-radius:50%;
            background:#2dd4bf;
            box-shadow:0 0 8px rgba(20,184,166,0.8);
            transition:transform 0.3s;
        }
        .node-glass:hover .node-dot {
            transform:scale(1.5);
            box-shadow:0 0 14px rgba(0,242,254,1);
        }
        /* Node positions (absolute, centered via transform) */
        .node-top    { top:6%; left:50%; transform:translate(-50%,-50%); }
        .node-right  { top:50%; right:4%; left:auto; transform:translate(50%,-50%); }
        .node-bottom { bottom:6%; top:auto; left:50%; transform:translate(-50%,50%); }
        .node-left   { top:50%; left:4%; transform:translate(-50%,-50%); }
        .node-right:hover  { transform:translate(50%,-50%) scale(1.08) !important; }
        .node-bottom:hover { transform:translate(-50%,50%) scale(1.08) !important; }
        /* Pulse ring on node connection point */
        @keyframes nodePulseRing {
            0%{transform:scale(1);opacity:0.6} 100%{transform:scale(2.5);opacity:0}
        }
        .node-glass::before {
            content:''; position:absolute; width:10px; height:10px;
            border-radius:50%; border:1px solid rgba(20,184,166,0.5);
            animation:nodePulseRing 2s ease-out infinite;
            pointer-events:none;
        }
        .node-top::before    { bottom:-12px; left:50%; transform:translateX(-50%); }
        .node-right::before  { left:-12px; top:50%; transform:translateY(-50%); }
        .node-bottom::before { top:-12px; left:50%; transform:translateX(-50%); }
        .node-left::before   { right:-12px; top:50%; transform:translateY(-50%); }
        /* Mobile responsive */
        @media(max-width:768px) {
            .neural-hud-container { aspect-ratio:auto; height:600px; max-height:none; }
            .neural-hud-core-wrap { width:180px; height:180px; }
            .node-glass { min-width:110px; padding:10px 16px; }
            .node-glass .node-label { font-size:11px; letter-spacing:2px; }
            .node-top    { top:2%; }
            .node-bottom { bottom:2%; }
            .node-left   { left:2%; }
            .node-right  { right:2%; }
        }

        /* ===== CORTEX-UI-106: DATA PURIFIER HUD (ENHANCED) ===== */
        #data-purifier {
            position:relative; overflow:hidden;
            display:flex; flex-direction:column; justify-content:center;
            min-height:100vh; box-sizing:border-box; padding:10px 24px 6px;
        }
        #purifier-bg-canvas {
            position:absolute; inset:0; width:100%; height:100%;
            pointer-events:none; z-index:0; opacity:0.25;
        }
        .purifier-container {
            position:relative;
            max-width:1400px; margin:0 auto;
            background:rgba(6,12,24,0.6);
            backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px);
            border:1px solid rgba(0,242,254,0.15);
            border-radius:20px;
            padding:3px;
            box-shadow:0 0 80px rgba(0,242,254,0.06), 0 0 160px rgba(0,242,254,0.02);
        }
        /* Animated gradient border */
        .purifier-container::after {
            content:''; position:absolute; inset:-1px; border-radius:24px;
            background:linear-gradient(90deg,
                rgba(239,68,68,0.5), rgba(245,158,11,0.3) 25%,
                rgba(0,242,254,0.5) 50%, rgba(139,92,246,0.3) 75%,
                rgba(239,68,68,0.5));
            background-size:300% 100%;
            animation:purifierBorderFlow 6s linear infinite;
            z-index:-1; pointer-events:none;
            mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
            -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
            mask-composite:exclude; -webkit-mask-composite:xor;
            padding:1px;
        }
        @keyframes purifierBorderFlow {
            0%{background-position:0% 50%} 100%{background-position:300% 50%}
        }
        .purifier-grid {
            display:grid; grid-template-columns:1fr 1.2fr 1fr; gap:0;
            min-height:320px;
            align-items:stretch; position:relative; z-index:1;
        }
        @media(max-width:1024px){
            .purifier-grid { grid-template-columns:1fr; gap:32px; }
        }

        /* --- LEFT: LEGACY BLOAT --- */
        .legacy-panel {
            position:relative; padding:10px 12px;
            background:rgba(127,29,29,0.12);
            border:1px solid rgba(239,68,68,0.30);
            border-radius:16px 0 0 16px;
            overflow:hidden;
        }
        @media(max-width:1024px){ .legacy-panel { border-radius:20px; } }
        .legacy-panel::before {
            content:''; position:absolute; inset:0;
            background:repeating-linear-gradient(0deg,
                transparent, transparent 2px,
                rgba(239,68,68,0.03) 2px, rgba(239,68,68,0.03) 4px);
            pointer-events:none; animation:legacyScanline 8s linear infinite;
        }
        .legacy-panel::after {
            content:''; position:absolute; inset:0;
            background:rgba(127,29,29,0.02);
            pointer-events:none; z-index:1;
            animation:crtFlicker 0.15s infinite;
        }
        @keyframes legacyScanline { from{transform:translateY(0)} to{transform:translateY(100%)} }
        @keyframes crtFlicker {
            0%{opacity:.05} 10%{opacity:.02} 20%{opacity:.06}
            30%{opacity:.01} 40%{opacity:.04} 50%{opacity:.07}
            60%{opacity:.02} 70%{opacity:.05} 80%{opacity:.03}
            90%{opacity:.06} 100%{opacity:.04}
        }
        .legacy-header {
            font-family:var(--font-mono); font-size:13px; font-weight:700; letter-spacing:3px;
            text-transform:uppercase; color:rgba(239,68,68,0.90);
            margin-bottom:8px; display:flex; align-items:center; gap:8px;
            text-shadow:0 0 8px rgba(239,68,68,0.3);
        }
        .legacy-header .dot-red {
            width:10px; height:10px; border-radius:50%;
            background:#ef4444; box-shadow:0 0 8px rgba(239,68,68,0.6);
            animation:legacyDotFlicker 1.5s ease-in-out infinite;
        }
        @keyframes legacyDotFlicker {
            0%,100%{opacity:1;transform:scale(1)} 30%{opacity:0.3;transform:scale(0.8)} 70%{opacity:0.9}
        }

        /* Enhanced Stat Cards */
        .legacy-stat-card {
            position:relative; font-family:var(--font-mono);
            padding:6px 10px; margin-bottom:4px;
            border-radius:8px;
            background:rgba(127,29,29,0.15);
            border:1px solid rgba(239,68,68,0.18);
            overflow:hidden; transition:all 0.3s; z-index:2;
        }
        .legacy-stat-card:hover {
            border-color:rgba(239,68,68,0.50);
            box-shadow:0 0 20px rgba(239,68,68,0.12);
        }
        .stat-border-glow {
            position:absolute; inset:0; border-radius:10px;
            background:conic-gradient(from 0deg, rgba(239,68,68,0.4), transparent 40%, rgba(245,158,11,0.3) 60%, transparent);
            opacity:0; transition:opacity 0.4s; pointer-events:none;
            animation:statBorderSpin 4s linear infinite;
        }
        .legacy-stat-card:hover .stat-border-glow { opacity:0.6; }
        @keyframes statBorderSpin {
            from { filter:hue-rotate(0deg); } to { filter:hue-rotate(360deg); }
        }
        .stat-label {
            display:block; font-size:10px; color:rgba(239,68,68,0.82);
            letter-spacing:2px; text-transform:uppercase; margin-bottom:2px;
        }
        .stat-value {
            font-size:18px; font-weight:800; color:rgba(239,68,68,0.95);
            text-shadow:0 0 6px rgba(239,68,68,0.3);
        }
        .stat-bar {
            margin-top:4px; height:2px; border-radius:2px;
            background:rgba(239,68,68,0.08); overflow:hidden;
        }
        .stat-bar-fill {
            height:100%; border-radius:2px;
            animation:statBarPulse 2s ease-in-out infinite;
        }
        @keyframes statBarPulse { 0%,100%{opacity:.7} 50%{opacity:1} }
        .stat-indicator { font-size:10px; margin-top:3px; letter-spacing:1px; }
        .stat-danger { color:rgba(245,158,11,0.8); }

        .legacy-data-blocks {
            display:flex; flex-wrap:wrap; gap:4px; margin-top:8px;
        }
        .legacy-data-block {
            width:38px; height:22px; border-radius:4px;
            background:rgba(127,29,29,0.30);
            border:1px solid rgba(239,68,68,0.18);
            animation:blockStutter 3s ease-in-out infinite;
        }
        .legacy-data-block:nth-child(odd) { animation-delay:.5s; }
        .legacy-data-block:nth-child(3n) { animation-delay:1.2s; }
        @keyframes blockStutter {
            0%,100%{transform:translateX(0);opacity:.5}
            15%{transform:translateX(-3px);opacity:.3}
            30%{transform:translateX(2px);opacity:.7}
            50%{transform:translateX(0);opacity:.4}
        }
        #btn-initiate-extraction {
            margin-top:6px; width:100%; padding:8px 0;
            font-family:var(--font-mono); font-size:13px; font-weight:700;
            letter-spacing:3px; text-transform:uppercase;
            color:#ef4444; background:transparent;
            border:2px solid rgba(239,68,68,0.50);
            border-radius:10px; cursor:pointer;
            position:relative; overflow:hidden;
            transition:all 0.3s; z-index:2;
            box-shadow:0 0 20px rgba(239,68,68,0.12);
            animation:btnPulseRed 2s ease-in-out infinite;
        }
        @keyframes btnPulseRed {
            0%,100%{border-color:rgba(239,68,68,.40);box-shadow:0 0 15px rgba(239,68,68,.10)}
            50%{border-color:rgba(239,68,68,.80);box-shadow:0 0 30px rgba(239,68,68,.30)}
        }
        #btn-initiate-extraction:hover {
            border-color:rgba(239,68,68,.90); color:#fca5a5;
            box-shadow:0 0 35px rgba(239,68,68,.35);
            text-shadow:0 0 10px rgba(239,68,68,.6);
            animation:none;
        }
        #btn-initiate-extraction.activated {
            animation:none; border-color:rgba(0,229,255,.60);
            color:#00E5FF; box-shadow:0 0 25px rgba(0,229,255,.25);
            text-shadow:0 0 8px rgba(0,229,255,.5);
        }

        /* --- CENTER: NEURAL FORGE --- */
        .neural-forge {
            position:relative; display:flex; flex-direction:column;
            align-items:center; justify-content:center;
            padding:10px 12px;
            background:rgba(10,15,28,0.70);
            border-top:1px solid rgba(20,184,166,0.10);
            border-bottom:1px solid rgba(20,184,166,0.10);
        }
        .forge-canvas-wrap {
            width:100%; height:200px; position:relative;
            margin-bottom:10px; border-radius:12px; overflow:hidden;
            border:1px solid rgba(20,184,166,0.15);
            background:rgba(0,0,0,0.4);
            box-shadow:inset 0 0 30px rgba(0,0,0,0.5), 0 0 20px rgba(20,184,166,0.05);
            transition:border-color 0.5s, box-shadow 0.5s;
        }
        .forge-canvas-wrap.active {
            border-color:rgba(20,184,166,0.40);
            box-shadow:inset 0 0 40px rgba(20,184,166,0.08), 0 0 40px rgba(20,184,166,0.12);
        }
        #forge-canvas { width:100%; height:100%; display:block; }
        .extraction-beam-track {
            position:relative; width:100%; height:8px;
            background:rgba(255,255,255,0.05);
            border-radius:4px; overflow:hidden;
            margin-bottom:12px;
            border:1px solid rgba(20,184,166,0.15);
            box-shadow:inset 0 0 8px rgba(0,0,0,0.3);
        }
        .extraction-beam-glow {
            position:absolute; top:0; left:0;
            width:0; height:100%;
            background:linear-gradient(90deg,
                rgba(239,68,68,0.8), rgba(245,158,11,0.8) 30%,
                rgba(255,255,255,1) 50%, rgba(45,212,191,0.9) 70%,
                rgba(0,242,254,0.8));
            border-radius:4px;
            box-shadow:0 0 0 rgba(20,184,166,0);
            transition:box-shadow 0.3s;
        }
        .extraction-beam-glow.active {
            box-shadow:0 0 30px 5px rgba(20,184,166,0.8), 0 0 60px 10px rgba(0,242,254,0.3);
        }
        .beam-particles { position:absolute; inset:0; overflow:hidden; pointer-events:none; }
        .beam-particle {
            position:absolute; width:4px; height:4px;
            border-radius:50%; top:50%; transform:translateY(-50%); opacity:0;
        }
        .beam-particle.red { background:#ef4444; box-shadow:0 0 6px rgba(239,68,68,0.8); }
        .beam-particle.teal { background:#2dd4bf; box-shadow:0 0 6px rgba(45,212,191,0.8); }
        .parsing-badge {
            display:inline-flex; align-items:center; gap:6px;
            padding:4px 12px; border-radius:6px;
            font-family:var(--font-mono); font-size:11px;
            letter-spacing:2px; text-transform:uppercase;
            color:rgba(45,212,191,0.85);
            background:rgba(20,184,166,0.06);
            border:1px solid rgba(20,184,166,0.15);
            margin-bottom:10px; transition:all 0.3s;
        }
        .parsing-badge .pulse-dot {
            width:6px; height:6px; border-radius:50%;
            background:#2dd4bf; box-shadow:0 0 6px rgba(45,212,191,0.8);
            animation:parsePulse 1.5s ease-in-out infinite;
        }
        @keyframes parsePulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.4;transform:scale(.7)} }
        .columnini-terminal {
            width:100%; max-width:420px;
            background:rgba(10,15,28,0.85);
            backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px);
            border:1px solid rgba(20,184,166,0.30);
            border-radius:10px; overflow:hidden;
            box-shadow:0 0 25px rgba(20,184,166,0.10);
        }
        .columnini-terminal-header {
            display:flex; align-items:center; gap:6px;
            padding:6px 12px;
            background:rgba(20,184,166,0.06);
            border-bottom:1px solid rgba(20,184,166,0.12);
        }
        .columnini-terminal-header .term-dots span {
            display:inline-block; width:8px; height:8px;
            border-radius:50%; margin-right:4px;
        }
        .columnini-terminal-header .term-name {
            font-family:var(--font-mono); font-size:13px; font-weight:700;
            letter-spacing:2px; text-transform:uppercase;
            color:rgba(45,212,191,0.90);
            text-shadow:0 0 6px rgba(45,212,191,0.3);
        }
        .columnini-terminal-body {
            padding:8px 12px; min-height:50px;
            font-family:var(--font-mono); font-size:11px;
            color:rgba(45,212,191,0.85); line-height:1.6;
        }
        .columnini-terminal-output { white-space:pre-wrap; word-break:break-word; }
        .terminal-cursor {
            display:inline-block; width:8px; height:14px;
            background:rgba(45,212,191,0.70);
            animation:termBlink 0.8s step-end infinite;
            vertical-align:middle; margin-left:2px;
        }
        @keyframes termBlink { 0%,100%{opacity:1} 50%{opacity:0} }

        /* --- RIGHT: CORTEX HUB --- */
        .cortex-matrix-panel {
            position:relative; padding:10px 12px;
            background:rgba(15,23,42,0.70);
            backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px);
            border:1px solid rgba(20,184,166,0.25);
            border-radius:0 16px 16px 0;
            box-shadow:0 0 30px rgba(20,184,166,0.08);
        }
        @media(max-width:1024px){ .cortex-matrix-panel { border-radius:20px; } }
        .cortex-matrix-header {
            font-family:var(--font-mono); font-size:13px; font-weight:700; letter-spacing:3px;
            text-transform:uppercase; color:rgba(45,212,191,0.95);
            margin-bottom:10px; display:flex; align-items:center; gap:8px;
            text-shadow:0 0 8px rgba(45,212,191,0.3);
        }
        .cortex-matrix-header .dot-teal {
            width:10px; height:10px; border-radius:50%;
            background:#2dd4bf;
            box-shadow:0 0 12px rgba(45,212,191,1), 0 0 20px rgba(0,242,254,0.4);
        }
        .hub-publication-row {
            display:grid; grid-template-columns:1fr 80px 90px;
            align-items:center; gap:8px;
            padding:8px 12px; margin-bottom:5px;
            border-radius:8px; position:relative;
            background:rgba(8,11,18,0.40);
            backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
            border:1px solid rgba(0,229,255,0.08);
            transition:all 0.3s; cursor:default; overflow:hidden;
        }
        .hub-publication-row::before {
            content:''; position:absolute; left:0; top:0; bottom:0;
            width:3px; background:#00e5ff; opacity:0;
            transition:opacity 0.3s; border-radius:3px 0 0 3px;
        }
        .hub-publication-row:hover {
            background:rgba(8,11,18,0.60);
            border-color:rgba(0,229,255,0.25);
            box-shadow:0 0 15px rgba(0,229,255,0.08);
        }
        .hub-publication-row:hover::before { opacity:1; }
        .hub-pub-name {
            font-family:var(--font-mono); font-size:13px;
            color:rgba(226,232,240,0.95); font-weight:600;
            letter-spacing:.5px; transition:color 0.3s;
        }
        .hub-publication-row:hover .hub-pub-name { color:#fff; }
        .hub-pub-revenue {
            font-family:var(--font-mono); font-size:14px;
            color:rgba(148,163,184,0.90); font-weight:600; letter-spacing:1px; transition:color 0.3s;
            text-align:right;
        }
        .hub-publication-row:hover .hub-pub-revenue { color:rgba(0,229,255,0.8); }
        .hub-pub-status {
            display:flex; align-items:center; gap:6px;
            padding:3px 12px; border-radius:20px;
            border:1px solid rgba(0,229,255,0.20);
            background:rgba(0,229,255,0.05);
            font-family:var(--font-mono); font-size:11px;
            font-weight:700; letter-spacing:1.5px;
            text-transform:uppercase; color:rgba(0,229,255,0.8);
        }
        .status-active-dot {
            width:6px; height:6px; border-radius:50%;
            background:#00e5ff;
            box-shadow:0 0 8px rgba(0,229,255,0.8);
            animation:activeDotPulse 1.5s ease-in-out infinite;
        }
        @keyframes activeDotPulse {
            0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.5;transform:scale(.6)}
        }
        .cortex-matrix-footer {
            margin-top:12px; padding-top:10px;
            border-top:1px solid rgba(20,184,166,0.10);
            display:flex; justify-content:space-between; align-items:center;
        }
        .cortex-metric {
            font-family:var(--font-mono); font-size:11px;
            color:rgba(45,212,191,0.82);
        }
        .cortex-metric .metric-value {
            font-size:22px; font-weight:800;
            color:#2dd4bf; text-shadow:0 0 12px rgba(45,212,191,0.5);
            font-variant-numeric:tabular-nums; transition:all 0.3s;
        }
        .cortex-metric .metric-value.highlight {
            color:#00E5FF; text-shadow:0 0 18px rgba(0,229,255,0.8);
            transform:scale(1.05);
        }
        /* Floating data stream particles */
        .purifier-data-stream {
            position:absolute; inset:0; pointer-events:none; z-index:0; overflow:hidden;
        }
        .stream-particle {
            position:absolute; width:4px; height:4px; border-radius:50%;
            top:var(--y, 50%); left:-10px;
            background:linear-gradient(90deg, #ef4444, #f59e0b, #2dd4bf, #00f2fe);
            background-size:200% 100%;
            box-shadow:0 0 8px rgba(0,242,254,0.6);
            animation:streamFlow var(--dur, 3s) linear var(--delay, 0s) infinite;
        }
        @keyframes streamFlow {
            0% { left:-2%; opacity:0; background-position:0% 50%;
                 box-shadow:0 0 8px rgba(239,68,68,0.6); }
            10% { opacity:0.8; }
            50% { background-position:100% 50%;
                   box-shadow:0 0 12px rgba(245,158,11,0.8); }
            90% { opacity:0.8; }
            100% { left:102%; opacity:0; background-position:200% 50%;
                    box-shadow:0 0 8px rgba(0,242,254,0.6); }
        }
        /* ===== CORTEX-UI-105: NEURAL HANDOFF ===== */
        #neural-handoff {
            position:relative; overflow:hidden;
        }
        #neural-bg-canvas {
            position:absolute; inset:0; width:100%; height:100%;
            pointer-events:none; z-index:0; opacity:0.25;
        }
        .handoff-container {
            display:flex; align-items:stretch; gap:0;
            position:relative; z-index:2;
            max-width:1200px; margin:0 auto;
        }
        @media(max-width:900px) {
            .handoff-container { flex-direction:column; gap:40px; align-items:center; }
        }
        .phase-panel {
            position:relative; flex:1; max-width:380px; padding:28px;
            background:rgba(15,23,42,0.40);
            backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px);
            border:1px solid rgba(20,184,166,0.30);
            border-radius:20px;
            box-shadow:inset 0 0 20px rgba(20,184,166,0.10);
            transition:all 0.5s ease;
            overflow:hidden; z-index:10;
        }
        .phase-panel:hover {
            box-shadow:inset 0 0 30px rgba(20,184,166,0.20), 0 8px 40px rgba(20,184,166,0.12);
        }
        .phase-panel .glow-line {
            position:absolute; top:0; left:0; width:100%; height:1px;
            background:linear-gradient(90deg, transparent, rgba(45,212,191,0.6) 50%, transparent);
            opacity:0.5;
        }
        .phase-panel:hover .glow-line { opacity:1; }
        .phase-label {
            font-family:var(--font-mono); font-size:13px; font-weight:700;
            letter-spacing:3px; text-transform:uppercase;
            color:rgba(45,212,191,0.85); margin-bottom:12px;
            text-shadow:0 0 8px rgba(20,184,166,0.6);
        }
        .phase-title {
            font-size:1.25rem; font-weight:700; color:#fff; margin-bottom:6px;
        }
        .phase-desc {
            font-size:14px; color:rgba(255,255,255,0.85); font-weight:500; line-height:1.6; margin-bottom:20px;
        }
        /* Chat Bubbles */
        .chat-sim {
            display:flex; flex-direction:column; gap:10px;
        }
        .chat-bubble {
            padding:10px 14px; border-radius:12px;
            font-size:13px; line-height:1.5; max-width:90%;
            opacity:0; transform:translateY(8px);
        }
        .chat-bubble.user {
            align-self:flex-end;
            background:rgba(20,184,166,0.15); border:1px solid rgba(20,184,166,0.30);
            color:rgba(45,212,191,0.95); border-bottom-right-radius:4px;
        }
        .chat-bubble.cortex {
            align-self:flex-start;
            background:rgba(0,242,254,0.06); border:1px solid rgba(0,242,254,0.18);
            color:rgba(200,220,255,0.85); border-bottom-left-radius:4px;
        }
        .chat-bubble.cortex::before {
            content:'CORTEX â–¸ '; font-family:var(--font-mono); font-size:10px;
            letter-spacing:1px; color:rgba(0,242,254,0.80);
        }
        /* SVG Bridge */
        .handoff-bridge {
            flex:0 0 200px; position:relative; z-index:5;
            display:flex; align-items:center; justify-content:center;
        }
        @media(max-width:900px) {
            .handoff-bridge { flex:0 0 120px; width:100%; max-width:400px; transform:rotate(90deg); }
        }
        .handoff-bridge svg { width:100%; height:100%; overflow:visible; }
        .handoff-path {
            fill:none; stroke:rgba(45,212,191,0.25); stroke-width:1.5;
            filter:url(#handoff-glow);
        }
        .handoff-packet {
            fill:#2dd4bf;
            filter:drop-shadow(0 0 4px #2dd4bf) drop-shadow(0 0 8px rgba(0,242,254,0.4));
        }
        /* Isometric Grid */
        .iso-grid {
            perspective:800px; display:grid;
            grid-template-columns:repeat(3, 1fr); gap:8px;
        }
        .iso-block {
            padding:14px 10px; border-radius:8px; text-align:center;
            font-family:var(--font-mono); font-size:13px; font-weight:700;
            letter-spacing:1px;
            transform:rotateX(12deg) rotateY(-8deg);
            transition:all 0.4s ease;
        }
        .iso-block-spring {
            background:rgba(16,185,129,0.15); border:1.5px solid rgba(16,185,129,0.45);
            color:rgba(16,185,129,0.9); grid-column:span 2;
            opacity:0;
        }
        .iso-block-spring.snapped {
            opacity:1 !important;
        }
        .iso-block-spring.flash {
            box-shadow:0 0 30px rgba(16,185,129,0.6), 0 0 60px rgba(0,242,254,0.3);
        }
        .iso-block-legal {
            background:rgba(139,92,246,0.12); border:1.5px solid rgba(139,92,246,0.35);
            color:rgba(139,92,246,0.85);
        }
        .iso-block-classified {
            background:rgba(245,158,11,0.12); border:1.5px solid rgba(245,158,11,0.35);
            color:rgba(245,158,11,0.85); grid-column:span 2;
        }
        .iso-block-house {
            background:rgba(236,72,153,0.10); border:1.5px solid rgba(236,72,153,0.30);
            color:rgba(236,72,153,0.90);
        }
        .iso-slot {
            grid-column:span 2;
            border:1.5px dashed rgba(16,185,129,0.25);
            border-radius:8px; padding:14px 10px;
            text-align:center; font-family:var(--font-mono);
            font-size:11px; letter-spacing:1px; color:rgba(16,185,129,0.60);
            background:rgba(16,185,129,0.03);
            transform:rotateX(12deg) rotateY(-8deg);
        }
        /* SIM Button */
        .btn-sim {
            display:inline-flex; align-items:center; gap:8px;
            padding:12px 28px; border-radius:12px;
            font-family:var(--font-mono); font-size:14px; font-weight:800;
            letter-spacing:2px; text-transform:uppercase;
            color:#fff; cursor:pointer; border:none;
            background:rgba(20,184,166,0.15);
            border:2px solid rgba(20,184,166,0.50);
            box-shadow:0 0 20px rgba(20,184,166,0.20), inset 0 0 15px rgba(0,242,254,0.05);
            transition:all 0.35s ease; position:relative; overflow:hidden;
        }
        .btn-sim:hover {
            background:rgba(20,184,166,0.30); border-color:rgba(0,242,254,0.70);
            box-shadow:0 0 35px rgba(20,184,166,0.45), 0 0 80px rgba(0,242,254,0.15);
            transform:translateY(-2px);
            text-shadow:0 0 10px rgba(0,242,254,0.5);
        }
        .btn-sim::before {
            content:''; position:absolute; inset:0;
            background:linear-gradient(90deg, transparent, rgba(0,242,254,0.12), transparent);
            transform:translateX(-100%);
        }
        .btn-sim:hover::before { animation:btnSweep 0.6s ease-out forwards; }
        .btn-sim.surging {
            border-color:#fff;
            box-shadow:0 0 50px rgba(0,242,254,0.6), 0 0 100px rgba(20,184,166,0.4);
        }
        /* ===== PIPELINE STORYBOARD — CINEMATIC STYLES ===== */
        .flow-section-trigger {
            position: relative;
        }
        /* ===== HOW IT WORKS â€” PIPELINE ===== */
        .pipeline-track {
            display:flex; align-items:stretch; justify-content:center; gap:0;
            max-width:960px; margin:0 auto; position:relative;
        }
        .pipeline-step-card {
            flex:1; position:relative; z-index:1;
            background:rgba(15,23,42,0.40); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
            border:1px solid rgba(255,255,255,0.05); border-radius:20px;
            padding:32px 24px 28px; text-align:center; transition:all 0.4s ease; cursor:default;
        }
        .pipeline-step-card:hover { transform:translateY(-6px); background:rgba(15,23,42,0.55); }
        .pipeline-step-card[data-glow='cyan']:hover {
            box-shadow:0 0 30px rgba(0,242,254,0.15),0 0 60px rgba(0,242,254,0.06),inset 0 0 30px rgba(0,242,254,0.04);
            border-color:rgba(0,242,254,0.2);
        }
        .pipeline-step-card[data-glow='purple']:hover {
            box-shadow:0 0 30px rgba(139,92,246,0.15),0 0 60px rgba(139,92,246,0.06),inset 0 0 30px rgba(139,92,246,0.04);
            border-color:rgba(139,92,246,0.2);
        }
        .pipeline-step-card[data-glow='green']:hover {
            box-shadow:0 0 30px rgba(16,185,129,0.15),0 0 60px rgba(16,185,129,0.06),inset 0 0 30px rgba(16,185,129,0.04);
            border-color:rgba(16,185,129,0.2);
        }
        .pipeline-connector-line {
            width:60px; flex-shrink:0; position:relative; z-index:1; display:flex; align-items:center;
        }
        .pipeline-connector-line .connector-bar {
            width:100%; height:2px;
            background:linear-gradient(90deg,rgba(0,242,254,0.15),rgba(139,92,246,0.15));
            border-radius:1px; transform-origin:left center; position:relative; overflow:visible;
        }
        .pipeline-connector-line .connector-bar::after {
            content:''; position:absolute; top:50%; left:-6px; width:6px; height:6px;
            border-radius:50%; background:#00f2fe;
            box-shadow:0 0 8px rgba(0,242,254,0.9),0 0 20px rgba(0,242,254,0.5);
            transform:translateY(-50%); animation:dataFlowDot 2s ease-in-out infinite;
        }
        @keyframes dataFlowDot {
            0%{left:-6px;opacity:0} 10%{opacity:1} 90%{opacity:1} 100%{left:calc(100% + 6px);opacity:0}
        }
        .hud-icon-wrap {
            width:64px; height:64px; margin:0 auto 20px; position:relative;
            animation:hud-levitate 4s ease-in-out infinite;
        }
        .hud-icon-wrap svg {
            width:100%; height:100%;
            filter:drop-shadow(0 0 8px var(--icon-glow,rgba(0,242,254,0.4)));
        }
        @keyframes hud-levitate { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-8px)} }
        .pipeline-step-card .phase-label {
            font-family:var(--font-mono); font-size:13px; font-weight:700;
            letter-spacing:3px; text-transform:uppercase; margin-bottom:8px;
        }
        .pipeline-step-card h4 { font-size:1.15rem; font-weight:800; color:#fff; margin-bottom:10px; }
        .pipeline-step-card p { font-size:14px; color:rgba(255,255,255,0.88); font-weight:500; line-height:1.6; }
        @media(max-width:768px){
            .pipeline-track{flex-direction:column;gap:16px;}
            .pipeline-connector-line{width:2px;height:40px;margin:0 auto;}
            .pipeline-connector-line .connector-bar{width:2px;height:100%;transform-origin:center top;}
        }

        /* ===== CTA NEON GLOW ===== */
        @keyframes electricGlow {
            0%,100%{box-shadow:0 0 30px rgba(0,242,254,0.25),0 0 80px rgba(0,242,254,0.08),inset 0 0 15px rgba(0,242,254,0.1);border-color:rgba(0,242,254,0.35);}
            50%{box-shadow:0 0 60px rgba(0,242,254,0.5),0 0 120px rgba(0,242,254,0.15),inset 0 0 30px rgba(0,242,254,0.2);border-color:rgba(0,242,254,0.7);}
        }
        .neon-glow-panel { animation:electricGlow 4s infinite alternate ease-in-out; }
        @keyframes heartbeatPulse {
            0%{transform:scale(1);box-shadow:0 0 0 0 rgba(0,242,254,0.7),0 0 20px rgba(0,242,254,0.3);}
            70%{transform:scale(1.05);box-shadow:0 0 0 28px rgba(0,242,254,0),0 0 40px rgba(0,242,254,0.2);}
            100%{transform:scale(1);box-shadow:0 0 0 0 rgba(0,242,254,0),0 0 20px rgba(0,242,254,0.3);}
        }
        .btn-pulse { animation:heartbeatPulse 2.5s infinite cubic-bezier(0.4,0,0.2,1); }

        /* ===== FOUNDER DOSSIER ===== */
        .dossier-container {
            display:grid; grid-template-columns:340px 1fr; gap:32px;
            max-width:900px; margin:0 auto; padding:0 24px;
        }
        .dossier-visual { display:flex; flex-direction:column; align-items:center; gap:16px; }
        .dossier-portrait-wrap {
            position:relative; width:300px; border-radius:16px; overflow:hidden;
            border:1px solid rgba(0,242,254,0.2);
        }
        .dossier-portrait-wrap img { width:100%; display:block; transition:opacity 0.4s; }
        .dossier-portrait-wrap img.hidden { position:absolute; top:0; left:0; opacity:0; }
        .dossier-portrait-wrap img.active { opacity:1; }
        .dossier-field-btn {
            background:rgba(0,242,254,0.08); border:1px solid rgba(0,242,254,0.3);
            color:var(--neon-teal); padding:8px 20px; border-radius:24px;
            font-size:13px; font-weight:700; cursor:pointer; transition:all 0.3s;
            display:flex; align-items:center; gap:8px;
        }
        .dossier-field-btn:hover { background:rgba(0,242,254,0.15); }
        .dossier-data { display:flex; flex-direction:column; gap:16px; }
        .dossier-card {
            background:rgba(15,23,42,0.6); backdrop-filter:blur(16px);
            border:1px solid rgba(255,255,255,0.06); border-radius:12px; padding:24px;
        }
        .dossier-identity {
            font-family:var(--font-display); font-size:24px; font-weight:800;
            color:var(--neon-teal); margin-bottom:4px;
        }
        .dossier-role {
            font-family:var(--font-mono); font-size:14px; color:rgba(255,255,255,0.88);
            letter-spacing:2px; text-transform:uppercase;
        }
        .dossier-hud-line {
            display:flex; align-items:center; gap:16px; padding:8px 0;
            border-bottom:1px solid rgba(255,255,255,0.04);
        }
        .dossier-hud-label {
            font-family:var(--font-mono); font-size:13px; font-weight:700;
            color:rgba(255,255,255,0.88); letter-spacing:3px; text-transform:uppercase; min-width:80px;
        }
        .dossier-hud-val {
            font-family:var(--font-mono); font-size:14px; font-weight:600; color:rgba(255,255,255,0.85);
        }
        .dossier-gps-dot {
            width:8px; height:8px; background:#34d399; border-radius:50%;
            box-shadow:0 0 8px rgba(52,211,153,0.5); animation:gpsPulse 2s infinite;
        }
        @keyframes gpsPulse { 0%,100%{opacity:1} 50%{opacity:0.4} }
        .dossier-typewriter { border-right:2px solid var(--neon-teal); animation:dossierBlink 0.8s step-end infinite; }
        @keyframes dossierBlink { 50%{border-color:transparent} }
        .dossier-mission {
            font-family:var(--font-display); font-size:18px; font-weight:800;
            font-style:italic; color:var(--neon-teal); margin-bottom:8px;
        }
        .dossier-section-label {
            font-family:var(--font-mono); font-size:13px; font-weight:700;
            color:rgba(0,242,254,0.75); letter-spacing:4px; text-transform:uppercase;
        }
        @media(max-width:768px){
            .dossier-container{grid-template-columns:1fr;}
            .dossier-portrait-wrap{width:250px;}
        }
    </style>

/* ======================================================= */
/* CTA SECTION STYLES                                      */
/* ======================================================= */

        /* ===== CTA DUAL-COLUMN ===== */
        #cta-section {
            position:relative; padding:100px 24px; overflow:hidden;
        }
        /* Subtle HUD background grid */
        #cta-section::before {
            content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
            background-image:
                linear-gradient(rgba(0,229,255,0.03) 1px, transparent 1px),
                linear-gradient(90deg, rgba(0,229,255,0.03) 1px, transparent 1px);
            background-size:60px 60px;
        }
        /* Ambient radial glow */
        .cta-ambient-glow {
            position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
            width:1000px; height:600px; border-radius:50%;
            background:radial-gradient(ellipse, rgba(0,229,255,0.10), rgba(139,92,246,0.04) 40%, transparent 70%);
            filter:blur(90px); pointer-events:none; z-index:0;
        }
        /* Glassmorphism wrapper */
        .cta-glass-card {
            position:relative; z-index:10;
            max-width:1100px; margin:0 auto;
            background:rgba(13,17,23,0.40);
            backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
            border:1px solid rgba(0,229,255,0.10);
            border-radius:16px;
            padding:56px 48px;
            box-shadow:0 0 60px rgba(0,229,255,0.04), inset 0 0 40px rgba(0,229,255,0.02);
            overflow:hidden;
        }
        /* Top glow accent line */
        .cta-glass-card::before {
            content:''; position:absolute; top:0; left:0; width:100%; height:1px;
            background:linear-gradient(90deg, transparent, rgba(0,229,255,0.4) 50%, transparent);
        }
        /* Grid layout */
        .cta-dual-grid {
            display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center;
        }
        @media(max-width:768px){
            .cta-dual-grid { grid-template-columns:1fr; gap:40px; text-align:center; }
            .cta-glass-card { padding:40px 24px; }
            .cta-visual-col { order:-1; }
        }
        /* Left visual column */
        .cta-visual-col {
            display:flex; align-items:center; justify-content:center; position:relative;
        }
        .cta-brain-wrap {
            position:relative; width:320px; height:320px;
            display:flex; align-items:center; justify-content:center;
        }
        .cta-brain-wrap img {
            width:280px; height:280px; object-fit:contain;
            filter:drop-shadow(0 0 30px rgba(0,229,255,0.35)) drop-shadow(0 0 60px rgba(0,229,255,0.15));
            border-radius:16px;
        }
        /* Orbital ring behind brain */
        .cta-brain-orbit {
            position:absolute; inset:-20px; border-radius:50%;
            border:1px solid rgba(0,229,255,0.08);
            animation:ctaOrbitSpin 20s linear infinite;
        }
        .cta-brain-orbit::after {
            content:''; position:absolute; top:-3px; left:50%;
            width:6px; height:6px; border-radius:50%;
            background:#00E5FF;
            box-shadow:0 0 10px rgba(0,229,255,0.8), 0 0 20px rgba(0,229,255,0.4);
        }
        @keyframes ctaOrbitSpin { 0%{transform:rotate(0deg)} 100%{transform:rotate(360deg)} }

        /* Right copy column */
        .cta-copy-col { position:relative; }
        .cta-headline {
            font-family:var(--font-display); font-size:clamp(1.8rem, 3.5vw, 2.6rem);
            font-weight:800; color:#ffffff; line-height:1.15; margin-bottom:16px;
            letter-spacing:0.5px;
        }
        .cta-body {
            font-family:var(--font-display); font-size:16px; font-weight:500;
            color:rgba(203,213,225,0.95); line-height:1.7; margin-bottom:28px;
        }
        /* Checkmark list */
        .cta-check-list {
            list-style:none; padding:0; margin:0 0 28px 0;
            display:flex; flex-direction:column; gap:14px;
        }
        .cta-check-list li {
            display:flex; align-items:flex-start; gap:12px;
            font-family:var(--font-display); font-size:15px; font-weight:500;
            color:rgba(226,232,240,0.90); line-height:1.5;
        }
        .cta-check-icon {
            flex-shrink:0; width:22px; height:22px; margin-top:1px;
            display:flex; align-items:center; justify-content:center;
            border-radius:50%;
            background:rgba(0,229,255,0.10);
            border:1px solid rgba(0,229,255,0.25);
        }
        .cta-check-icon svg { width:12px; height:12px; }
        /* CTA Button */
        .cta-pilot-btn {
            display:inline-flex; align-items:center; gap:10px;
            padding:16px 40px; border-radius:8px;
            background:#00E5FF; color:#000; border:none;
            font-family:var(--font-display); font-size:16px; font-weight:800;
            letter-spacing:1.5px; text-transform:uppercase;
            text-decoration:none; cursor:pointer;
            box-shadow:0 0 20px rgba(0,229,255,0.25);
            transition:box-shadow 0.3s;
        }
        .cta-pilot-btn:hover {
            box-shadow:0 0 40px rgba(0,229,255,0.50), 0 0 80px rgba(0,229,255,0.20);
        }
        .cta-pilot-btn .arrow { font-size:18px; transition:transform 0.3s; }
        .cta-pilot-btn:hover .arrow { transform:translateX(4px); }
        /* Subtext */
        .cta-subtext {
            margin-top:20px;
            font-family:var(--font-mono); font-size:13px; font-weight:600;
            color:rgba(148,163,184,0.80); letter-spacing:1px;
        }

/* =========================================
   CORTEX V5 - "BRAIN BEHIND THE BYLINE" CTA
   ========================================= */

/* Cyberpunk Glassmorphism Wrapper (layered on .cta-glass-card) */
.cortex-glass-card {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
    align-items: center;
    background: rgba(13, 17, 23, 0.4);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(0, 229, 255, 0.15);
    border-radius: 16px;
    box-shadow: inset 0 0 20px rgba(0, 229, 255, 0.05),
                0 8px 32px rgba(0, 0, 0, 0.5);
}
@media (max-width: 768px) {
    .cortex-glass-card {
        grid-template-columns: 1fr;
        padding: 2rem;
        gap: 2rem;
    }
}

/* Primary Neon Cyan CTA Button */
.btn-cortex-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 14px 28px;
    background-color: #00E5FF;
    color: #050505;
    font-family: var(--font-display), sans-serif;
    font-weight: 700;
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    box-shadow: 0 0 10px rgba(0, 229, 255, 0.2);
}
.btn-cortex-primary:hover {
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 0 20px rgba(0, 229, 255, 0.6),
                0 0 40px rgba(0, 229, 255, 0.2);
    background-color: #1affff;
}
.btn-cortex-primary:active {
    transform: translateY(1px) scale(0.98);
    box-shadow: 0 0 10px rgba(0, 229, 255, 0.4);
}

/* ======================================================= */
/* V4 MIGRATED: TACTICAL OPERATIONS MAP                    */
/* ======================================================= */
.tactical-map {
    position:relative; width:100%; height:600px; max-width:1100px;
    margin:40px auto 0; border-radius:20px; overflow:hidden;
    border:1px solid rgba(0,242,254,0.12);
    background:rgba(2,5,10,0.92);
    backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
    box-shadow:0 0 60px rgba(0,0,0,0.6);
}
.tac-grid {
    position:absolute; inset:0;
    background-image:
        linear-gradient(to right, rgba(0,242,254,0.04) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(0,242,254,0.04) 1px, transparent 1px);
    background-size:40px 40px; pointer-events:none;
}
.tac-radar {
    position:absolute; top:50%; left:50%; width:160%; height:160%;
    transform:translate(-50%,-50%);
    background:conic-gradient(from 0deg, transparent 0%, rgba(20,184,166,0.08) 15%, transparent 30%);
    animation:radarSweep 6s linear infinite; pointer-events:none;
}
@keyframes radarSweep { to { transform:translate(-50%,-50%) rotate(360deg); } }
.tac-node {
    position:absolute; display:flex; flex-direction:column;
    align-items:center; gap:6px; cursor:default; z-index:5;
}
.tac-node-dot {
    width:16px; height:16px; border-radius:50%;
    background:var(--node-color,#14b8a6);
    box-shadow:0 0 20px var(--node-color,rgba(20,184,166,0.6)),
               0 0 40px color-mix(in srgb, var(--node-color,#14b8a6) 25%, transparent);
    position:relative;
}
.tac-node-dot::after {
    content:''; position:absolute; inset:-8px; border-radius:50%;
    border:1px solid var(--node-color,rgba(20,184,166,0.3));
    animation:nodeRing 2s ease-out infinite;
}
@keyframes nodeRing { 0%{transform:scale(1);opacity:0.6} 100%{transform:scale(2.2);opacity:0} }
.tac-node-label {
    font-family:var(--font-mono); font-size:10px; font-weight:700;
    letter-spacing:2px; text-transform:uppercase;
    color:rgba(255,255,255,0.72); text-shadow:0 0 8px rgba(0,0,0,0.8);
    white-space:nowrap;
}
.tac-node-status {
    font-family:var(--font-mono); font-size:9px; letter-spacing:1px;
    color:var(--node-color,#14b8a6);
    text-shadow:0 0 6px color-mix(in srgb, var(--node-color,#14b8a6) 40%, transparent);
}
.tac-node.straus .tac-node-dot {
    width:20px; height:20px; background:#f59e0b;
    box-shadow:0 0 24px rgba(245,158,11,0.7),0 0 50px rgba(245,158,11,0.3);
}
.tac-node.straus .tac-node-label { color:#fbbf24; font-size:11px; }
.tac-tooltip {
    position:absolute; bottom:calc(100% + 16px); left:50%; transform:translateX(-50%);
    padding:12px 16px; border-radius:10px;
    background:rgba(0,0,0,0.9); border:1px solid rgba(245,158,11,0.3);
    font-family:var(--font-mono); font-size:11px;
    color:rgba(255,255,255,0.85); white-space:nowrap;
    opacity:0; pointer-events:none; transition:opacity 0.3s; z-index:10;
}
.tac-tooltip strong { color:#fbbf24; display:block; margin-bottom:4px; font-size:12px; }
.tac-node.straus:hover .tac-tooltip { opacity:1; }
.tac-connections { position:absolute; inset:0; pointer-events:none; z-index:2; }
.tac-connections line {
    stroke:rgba(20,184,166,0.12); stroke-width:1; stroke-dasharray:6 4;
}
.tac-legend {
    position:absolute; bottom:16px; left:16px; display:flex; gap:16px;
    font-family:var(--font-mono); font-size:9px; letter-spacing:1.5px;
    text-transform:uppercase; color:rgba(255,255,255,0.75); z-index:5;
}
.tac-legend-item { display:flex; align-items:center; gap:6px; }
.tac-legend-dot { width:6px; height:6px; border-radius:50%; }
.tac-status-bar {
    position:absolute; top:16px; right:16px; display:flex; gap:20px;
    font-family:var(--font-mono); font-size:10px; letter-spacing:1px;
    color:rgba(255,255,255,0.78); z-index:5;
}
.tac-status-bar .tac-live { color:#34d399; animation:gpsPulse 1.5s infinite; }
@media(max-width:768px){
    .tactical-map { height:450px; }
    .tac-node-label { font-size:8px; }
    .tac-status-bar { top:8px; right:8px; gap:10px; font-size:8px; }
}

/* ======================================================= */
/* V4 MIGRATED: CRM COMPARISON SECTION                     */
/* ======================================================= */
.crm-comparison {
    position:relative; z-index:1; padding:80px 40px 60px; max-width:1280px; margin:0 auto;
}
.crm-grid {
    display:grid; grid-template-columns:1fr 1fr; gap:32px; margin-top:48px;
}
.crm-panel-v4 {
    border-radius:20px; padding:32px 28px; min-height:340px;
    position:relative; overflow:hidden;
    backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px);
}
.crm-panel-v4.legacy {
    background:rgba(10,15,30,0.40); border:1px solid rgba(239,68,68,0.15);
}
.crm-panel-v4.unified {
    background:rgba(10,15,30,0.50); border:1px solid rgba(0,242,254,0.2);
    box-shadow:0 0 30px rgba(0,128,128,0.08); transition:all 0.4s;
}
.crm-panel-v4.unified:hover {
    border-color:rgba(0,242,254,0.4); box-shadow:0 0 50px rgba(0,128,128,0.15);
}
.crm-panel-v4 .crm-label {
    font-family:var(--font-mono); font-size:13px; font-weight:700;
    letter-spacing:2px; text-transform:uppercase; margin-bottom:4px;
}
.crm-panel-v4 .crm-title {
    font-size:1.3rem; font-weight:800; color:#fff; margin-bottom:12px;
}
.crm-flow-area {
    position:relative; width:100%; height:200px; margin-top:16px;
}
.crm-flow-area svg { width:100%; height:100%; }
.crm-node {
    font-family:var(--font-mono); font-size:13px; font-weight:700;
}
@media(max-width:768px){
    .crm-grid { grid-template-columns:1fr; }
}

/* ======================================================= */
/* V4 MIGRATED: ROI CHART                                  */
/* ======================================================= */
.roi-chart-glass {
    position:relative; padding:20px; border-radius:20px;
    background:rgba(10,15,28,0.50);
    backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px);
    border:1px solid rgba(0,242,254,0.10);
    box-shadow:0 0 40px rgba(0,0,0,0.4);
    overflow:visible;
}
.roi-chart-glass::before {
    content:''; position:absolute; top:50%; left:50%;
    transform:translate(-50%,-50%); width:120%; height:140%;
    border-radius:50%;
    background:radial-gradient(ellipse, rgba(0,242,254,0.08), rgba(139,92,246,0.03) 50%, transparent 75%);
    filter:blur(60px); pointer-events:none; z-index:-1;
}
.roi-chart-glass .roi-floor-glow {
    position:absolute; bottom:0; left:0; width:100%; height:50%;
    background:linear-gradient(to top, rgba(0,242,254,0.15), transparent);
    pointer-events:none; opacity:0.6; border-radius:0 0 20px 20px;
}
.data-point-ring {
    transform-origin:center;
    animation:radarPulse 2.5s infinite cubic-bezier(0.215,0.61,0.355,1);
}
@keyframes radarPulse {
    0%{transform:scale(0.6);opacity:0.8}
    70%{transform:scale(1.4);opacity:0}
    100%{transform:scale(1.4);opacity:0}
}
#circulation-slider {
    -webkit-appearance:none; appearance:none;
}
#circulation-slider::-webkit-slider-thumb {
    -webkit-appearance:none; appearance:none; width:20px; height:20px;
    border-radius:50%; background:var(--neon-teal); cursor:pointer;
    box-shadow:0 0 12px rgba(0,242,254,0.6);
}

/* ======================================================= */
/* V4 MIGRATED: CORTEX DATA FEED TICKER                    */
/* ======================================================= */
#cortex-data-feed {
    position:fixed; bottom:0; left:0; width:100%; z-index:9999;
    background:linear-gradient(90deg, rgba(4,8,17,0.95), rgba(10,15,28,0.95));
    border-top:1px solid rgba(0,242,254,0.15);
    padding:6px 0; overflow:hidden;
    backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
}
.feed-track {
    display:flex; gap:60px; animation:feedScroll 30s linear infinite;
    white-space:nowrap;
}
.feed-item {
    font-family:var(--font-mono); font-size:11px; letter-spacing:1.5px;
    color:rgba(0,242,254,0.72); text-transform:uppercase; flex-shrink:0;
}
.feed-item .feed-dot {
    display:inline-block; width:6px; height:6px; border-radius:50%;
    background:#14b8a6; box-shadow:0 0 6px rgba(20,184,166,0.6);
    vertical-align:middle; margin-right:8px;
}
@keyframes feedScroll {
    from { transform:translateX(0); }
    to { transform:translateX(-50%); }
}

/* ======================================================= */
/* V4 MIGRATED: SECTION HUD BORDERS                       */
/* ======================================================= */
.section-hud-border {
    position:absolute; inset:0; pointer-events:none; z-index:0;
    overflow:hidden;
}
.section-hud-border svg { position:absolute; }
.section-hud-border .hud-corner { stroke:rgba(0,242,254,0.12); stroke-width:1; fill:none; }
.hud-scanline-overlay {
    position:absolute; inset:0; pointer-events:none;
    background:repeating-linear-gradient(
        0deg, transparent, transparent 2px,
        rgba(0,242,254,0.02) 2px, rgba(0,242,254,0.02) 4px
    );
    animation:hudScanline 8s linear infinite; z-index:1; opacity:0.4;
}
@keyframes hudScanline { from{transform:translateY(0)} to{transform:translateY(100%)} }

    </style>
