:root {
            --bg: #0b0e14;
            --card: #131720;
            --border: #1e2530;
            --text: #e8ecf1;
            --muted: #5e6d82;
            --accent: #ff6b35;
            --cyan: #00BFFF;
            --green: #10b981;
        }

        * { margin: 0; padding: 0; box-sizing: border-box; }
        
        body {
            background: var(--bg);
            color: var(--text);
            font-family: 'IBM Plex Sans', sans-serif;
            overflow-x: hidden;
        }

        /* Фоновые эффекты */
        .hero-glow {
            position: absolute;
            width: 600px;
            height: 600px;
            border-radius: 50%;
            background: radial-gradient(circle, rgba(255, 107, 53, 0.08) 0%, transparent 70%);
            top: -200px;
            left: 50%;
            transform: translateX(-50%);
            pointer-events: none;
            z-index: 0;
        }

        .grid-pattern {
            position: fixed;
            inset: 0;
            background-image: radial-gradient(rgba(255,107,53,0.03) 1px, transparent 1px);
            background-size: 48px 48px;
            pointer-events: none;
            z-index: 0;
        }

       /* По умолчанию элементы ВИДНЫ. Прячем их только если JS успешно загрузился. */
.reveal {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.7s ease, transform 0.7s ease;
}

/* Этот класс добавляется в body скриптом ПОСЛЕ загрузки страницы */
.body-loaded .reveal {
    opacity: 0;
    transform: translateY(30px);
}

.body-loaded .reveal.active {
    opacity: 1;
    transform: translateY(0);
}

        /* Карточки преимуществ */
        .feature-card {
            background: var(--card);
            border: 1px solid var(--border);
            border-radius: 16px;
            padding: 2rem;
            transition: all 0.3s ease;
            position: relative;
            overflow: hidden;
        }
        .feature-card::before {
            content: '';
            position: absolute;
            top: 0; left: 0; right: 0; height: 2px;
            background: linear-gradient(90deg, transparent, var(--accent), transparent);
            opacity: 0;
            transition: opacity 0.3s ease;
        }
        .feature-card:hover::before { opacity: 1; }
        .feature-card:hover { border-color: rgba(255,107,53,0.3); transform: translateY(-4px); }

        /* Пульсирующая иконка */
        @keyframes soft-pulse {
            0%, 100% { box-shadow: 0 0 0 0 rgba(255, 107, 53, 0.4); }
            50% { box-shadow: 0 0 0 10px rgba(255, 107, 53, 0); }
        }
        .icon-pulse { animation: soft-pulse 3s infinite; }

        /* Статистика */
        .stat-item {
            border-right: 1px solid var(--border);
            padding: 0 2rem;
        }
        .stat-item:last-child { border-right: none; }

        /* Мобильное меню */
        .mobile-menu {
            display: none;
            position: fixed;
            inset: 0;
            background: rgba(11,14,20,0.98);
            z-index: 100;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 2rem;
        }
        .mobile-menu.open { display: flex; }

        /* SVG Дашборд (Иллюстрация) */
        .dashboard-mockup {
            background: #0d0d0d;
            border: 1px solid var(--border);
            border-radius: 12px;
            padding: 1.5rem;
            box-shadow: 0 25px 60px rgba(0,0,0,0.5);
            position: relative;
            overflow: hidden;
            transform: perspective(1000px) rotateY(-5deg) rotateX(2deg);
            transition: transform 0.5s ease;
        }
        .dashboard-mockup:hover {
            transform: perspective(1000px) rotateY(0deg) rotateX(0deg);
        }
        .mock-bar { height: 6px; background: #1a1a1a; border-radius: 3px; overflow: hidden; }
        .mock-fill { height: 100%; border-radius: 3px; }

        @media (max-width: 768px) {
            .desktop-nav { display: none !important; }
            .mobile-menu-btn { display: flex !important; }
            .grid-2 { grid-template-columns: 1fr !important; }
            .stat-item { border-right: none; border-bottom: 1px solid var(--border); padding: 1rem 0; }
            .stat-item:last-child { border-bottom: none; }
            .dashboard-mockup { transform: none; }
        }