/* ============================================================
           DZAMO — "Void" theme (cosmic-minimal · violet pulse on black)
           Палитра Dala: void/bone/plum + amber/lichen акценты.
           Шрифты — только локальные (CSP font-src 'self'):
           Inter (тонкий дисплейный) + JetBrains Mono (тех. метки).
           ============================================================ */

        *:focus, *:focus-visible { outline: none !important; -webkit-tap-highlight-color: transparent; }
        button:focus, a:focus { box-shadow: none; }
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        :root {
            /* ===== ПАЛИТРА (фиолет) ===== */
            --accent: #8052ff;
            --accent-rgb: 128, 82, 255;
            --accent-2: #997bff;
            --accent-warm: #ffb829;
            --success: #34d6a8;
            --success-rgb: 52, 214, 168;
            --void: #000000;
            --panel: #0c0c12;
            --panel-2: #14141d;

            --bone: #ffffff;
            --ash: #c4c4c8;
            --smoke: #8b8b93;

            /* — производные от акцента (не трогать при смене темы) — */
            --plum: var(--accent);
            --plum-bright: var(--accent-2);
            --plum-soft: rgba(var(--accent-rgb), 0.14);
            --plum-line: rgba(var(--accent-rgb), 0.35);
            --amber: var(--accent-warm);
            --lichen: var(--success);

            --line: rgba(255, 255, 255, 0.10);
            --line-strong: rgba(255, 255, 255, 0.16);

            --radius: 0px;
            --radius-sm: 0px;
            --maxw: 1180px;

            --black: #000000;
            --white: #ffffff;
            --gray: #8b8b93;
            --gray-light: #c4c4c8;
            --green: var(--success);
        }

        html { scroll-behavior: smooth; }

        body {
            font-family: 'Inter', sans-serif;
            background: var(--void);
            color: var(--bone);
            -webkit-font-smoothing: antialiased;
            text-rendering: optimizeLegibility;
            overflow-x: hidden;
            position: relative;
        }


        /* ===== ФОН: ЧЕРТЁЖ ===== */
        body::before {
            content: "";
            position: fixed;
            inset: 0;
            z-index: 0;
            pointer-events: none;
            background:
                radial-gradient(1000px 640px at 82% -6%, rgba(var(--accent-rgb), 0.14), transparent 62%),
                radial-gradient(760px 620px at 50% 104%, rgba(var(--accent-rgb), 0.07), transparent 60%);
        }

        .bp-grid {
            position: fixed;
            inset: 0;
            z-index: 0;
            pointer-events: none;
            background-image:
                linear-gradient(to right, #fff 1px, transparent 1px),
                linear-gradient(to bottom, #fff 1px, transparent 1px);
            background-size: 76px 76px;
            background-position: center center;
        }
        .bp-grid {
            opacity: 0.030;
            -webkit-mask-image: radial-gradient(130% 78% at 80% 0%, #000 0%, rgba(0,0,0,0.45) 46%, transparent 76%);
            mask-image: radial-gradient(130% 78% at 80% 0%, #000 0%, rgba(0,0,0,0.45) 46%, transparent 76%);
        }

        /* — схема в герое: техническая аннотация, а не декор — */
        .bp-schema {
            position: fixed;
            top: 46%;
            right: -15vw;
            width: min(900px, 78vw);
            height: min(900px, 78vw);
            transform: translateY(-50%);
            z-index: 0;
            pointer-events: none;
            opacity: 1;
        }
        .bp-schema .rot {
            transform-origin: 300px 300px;
            animation: bp-rot 150s linear infinite;
        }
        .bp-schema .rot-r {
            transform-origin: 300px 300px;
            animation: bp-rot 96s linear infinite reverse;
        }
        @keyframes bp-rot { to { transform: rotate(360deg); } }
        @media (prefers-reduced-motion: reduce) {
            .bp-schema .rot, .bp-schema .rot-r { animation: none; }
        }
        @media (max-width: 1100px) { .bp-schema { display: none; } }

        /* — шина данных слева — */
        .bp-rail {
            position: fixed;
            left: clamp(16px, calc((100vw - 1180px) / 2 - 54px), 130px);
            top: 104px;
            bottom: 52px;
            width: 1px;
            z-index: 3;
            pointer-events: none;
            background: linear-gradient(180deg, rgba(255,255,255,0.16), rgba(255,255,255,0.05));
        }
        .bp-fill {
            position: absolute;
            left: 0; top: 0;
            width: 1px;
            height: 0;
            background: linear-gradient(180deg, rgba(var(--accent-rgb), 0.15), var(--plum));
        }
        .bp-head {
            position: absolute;
            left: -1px;
            top: 0;
            width: 3px;
            height: 16px;
            margin-top: -8px;
            background: var(--plum-bright);
            box-shadow: 0 0 14px 2px rgba(var(--accent-rgb), 0.75);
        }
        .bp-node {
            position: absolute;
            left: -2px;
            width: 5px;
            height: 1px;
            background: rgba(255,255,255,0.26);
            transition: width 0.45s cubic-bezier(0.16,1,0.3,1),
                        left 0.45s cubic-bezier(0.16,1,0.3,1),
                        background-color 0.45s ease, box-shadow 0.45s ease;
        }
        .bp-node.hot {
            left: -5px;
            width: 11px;
            background: var(--plum-bright);
            box-shadow: 0 0 10px rgba(var(--accent-rgb), 0.85);
        }
        .bp-node.ping { background: #fff; box-shadow: 0 0 12px rgba(255,255,255,0.7); }

        /* импульс: один проход раз в 9 секунд, остальное время шина спокойна */
        .bp-pulse {
            position: absolute;
            left: 0;
            top: 0;
            width: 1px;
            height: 132px;
            margin-top: -132px;
            background: linear-gradient(180deg, rgba(var(--accent-rgb), 0) 0%, rgba(var(--accent-rgb), 0.55) 62%, var(--plum-bright) 100%);
            opacity: 0;
        }
        @media (prefers-reduced-motion: no-preference) {
            .bp-pulse { animation: bp-flow 9s cubic-bezier(0.5, 0, 0.5, 1) infinite; }
        }
        @keyframes bp-flow {
            0%   { transform: translateY(0); opacity: 0; }
            4%   { opacity: 1; }
            36%  { opacity: 1; }
            40%  { transform: translateY(var(--railh, 700px)); opacity: 0; }
            100% { transform: translateY(var(--railh, 700px)); opacity: 0; }
        }

        .bp-label {
            position: fixed;
            left: clamp(16px, calc((100vw - 1180px) / 2 - 54px), 130px);
            margin-left: 14px;
            top: 0;
            z-index: 3;
            pointer-events: none;
            font-family: 'JetBrains Mono', monospace;
            font-size: 9.5px;
            letter-spacing: 0.2em;
            text-transform: uppercase;
            color: rgba(255,255,255,0.42);
            white-space: nowrap;
            opacity: 0;
            transform: translateY(-50%);
            transition: opacity 0.45s ease, top 0.45s cubic-bezier(0.16,1,0.3,1);
        }
        .bp-label.on { opacity: 1; }
        @media (max-width: 1399px) { .bp-label { display: none; } }
        @media (max-width: 640px)  { .bp-rail { left: 12px; top: 88px; } }

        .accent-circle { display: none; }


        ::selection { background: var(--plum); color: #fff; }

        /* контент над фоном */
        header, main, section, footer, .modal-overlay { position: relative; z-index: 1; }


        /* ===================== HEADER ===================== */
        header {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            padding: 20px 40px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            z-index: 100;
            background: rgba(0, 0, 0, 0.55);
            backdrop-filter: blur(14px);
            -webkit-backdrop-filter: blur(14px);
            border-bottom: 1px solid var(--line);
        }

        .logo {
            display: inline-flex;
            align-items: center;
            gap: 9px;
            font-size: 14px;
            font-weight: 600;
            color: var(--bone);
            text-decoration: none;
            text-transform: uppercase;
            letter-spacing: 3px;
        }

        .logo::before {
            content: "";
            width: 9px;
            height: 9px;
            border-radius: 50%;
            background: var(--plum);
            box-shadow: 0 0 14px 2px var(--plum);
        }

        nav {
            display: flex;
            gap: 30px;
            align-items: center;
        }

        nav a {
            font-size: 13px;
            font-weight: 400;
            color: var(--smoke);
            text-decoration: none;
            letter-spacing: 0.2px;
            transition: color 0.2s;
        }

        nav a:hover { color: var(--bone); }

        .nav-cta {
            padding: 11px 22px;
            border-radius: 0;
            background: var(--plum);
            color: #fff !important;
            font-size: 12px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.06em;
            transition: filter 0.2s, transform 0.2s;
        }
        .nav-cta:hover { filter: brightness(1.12); transform: translateY(-1px); }

        /* ===================== HERO ===================== */
        .hero {
            min-height: 100vh;
            max-width: var(--maxw);
            margin: 0 auto;
            padding: 168px 40px 64px;
            display: grid;
            grid-template-columns: 1fr 240px;
            grid-template-rows: 1fr auto;
            gap: 48px;
        }

        @keyframes blink { 0%,100%{opacity:1} 50%{opacity:.25} }

        .hero-title { align-self: center; }

        .hero-title h1 {
            font-size: clamp(46px, 8.4vw, 116px);
            font-weight: 200;
            line-height: 0.92;
            letter-spacing: -0.03em;
        }

        .hero-title h1 span {
            font-weight: 400;
            background: linear-gradient(120deg, var(--plum-bright), var(--plum) 55%, var(--amber));
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
        }

        .stats-column {
            display: flex;
            flex-direction: column;
            justify-content: center;
            gap: 30px;
            border-left: 1px solid var(--line);
            padding-left: 26px;
        }

        .stat-item { display: flex; flex-direction: column; }

        .stat-number {
            font-size: 40px;
            font-weight: 300;
            line-height: 1;
            letter-spacing: -0.02em;
            color: var(--bone);
        }

        .stat-label {
            font-family: 'JetBrains Mono', monospace;
            font-size: 10.5px;
            text-transform: uppercase;
            letter-spacing: 0.12em;
            margin-top: 9px;
            color: var(--smoke);
        }

        .bottom-bar {
            grid-column: 1 / -1;
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
            gap: 32px;
            padding-top: 36px;
            border-top: 1px solid var(--line);
        }

        .tagline {
            font-size: 16px;
            max-width: 520px;
            line-height: 1.65;
            color: var(--ash);
            font-weight: 300;
        }

        /* ===================== КНОПКА CTA ===================== */
        .cta-btn {
            display: inline-block;
            padding: 17px 40px;
            background: var(--plum);
            color: #fff;
            text-decoration: none;
            font-size: 13px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.06em;
            border-radius: 0;
            white-space: nowrap;
            transition: filter 0.2s, transform 0.2s, box-shadow 0.2s;
            box-shadow: 0 0 0 1px var(--plum-line), 0 14px 40px -14px rgba(var(--accent-rgb), 0.8);
        }

        .cta-btn:hover {
            filter: brightness(1.12);
            transform: translateY(-2px);
            box-shadow: 0 0 0 1px var(--plum-line), 0 22px 50px -16px rgba(var(--accent-rgb), 0.9);
        }

        /* ===================== СЕКЦИИ ===================== */
        .section {
            max-width: var(--maxw);
            margin: 0 auto;
            padding: 104px 40px;
            border-top: 1px solid var(--line);
        }

        /* «тёмная» секция теперь = лёгкая панель на пустоте */
        .section-dark {
            position: relative;
            border-radius: var(--radius);
            border: 1px solid var(--line);
            background: var(--panel);
            margin-top: 80px;
            margin-bottom: 80px;
            padding: 88px 56px;
        }

        .section-header {
            display: grid;
            grid-template-columns: 300px 1fr;
            gap: 64px;
            margin-bottom: 72px;
            align-items: start;
        }

        .section-label {
            font-family: 'JetBrains Mono', monospace;
            font-size: 12px;
            text-transform: uppercase;
            letter-spacing: 0.16em;
            color: var(--plum-bright);
            padding-top: 10px;
            display: inline-flex;
            align-items: center;
            gap: 10px;
        }
        .section-label::before {
            content: "";
            width: 22px; height: 1px;
            background: var(--plum-line);
        }
        .section-dark .section-label { color: var(--plum-bright); }

        .section-title {
            font-size: clamp(34px, 5.2vw, 64px);
            font-weight: 200;
            line-height: 1.02;
            letter-spacing: -0.025em;
            color: var(--bone);
        }

        .section-title span {
            font-weight: 400;
            background: linear-gradient(120deg, var(--plum-bright), var(--plum));
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
        }

        /* ===================== FEATURES ===================== */
        .features-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 16px;
        }


        .feature-card {
            background: var(--panel);
            border: 1px solid var(--line);
            border-radius: var(--radius);
            padding: 40px 32px;
            transition: border-color 0.25s, background 0.25s, transform 0.25s;
        }
        .feature-card:hover {
            border-color: var(--plum-line);
            background: var(--panel-2);
            transform: translateY(-4px);
        }

        .feature-number {
            font-family: 'JetBrains Mono', monospace;
            font-size: 44px;
            font-weight: 500;
            color: var(--plum);
            line-height: 1;
            margin-bottom: 26px;
            letter-spacing: -0.02em;
        }

        .feature-title {
            font-size: 21px;
            font-weight: 500;
            letter-spacing: -0.01em;
            margin-bottom: 14px;
            color: var(--bone);
        }

        .feature-text {
            font-size: 14.5px;
            line-height: 1.65;
            color: var(--ash);
            font-weight: 300;
        }

        .feature-examples {
            margin-top: 22px;
            display: flex;
            flex-direction: column;
            gap: 10px;
        }

        .example-msg {
            font-size: 13px;
            font-style: normal;
            color: var(--ash);
            line-height: 1.5;
            padding: 13px 15px;
            background: rgba(var(--accent-rgb), 0.07);
            border: 1px solid var(--plum-line);
            border-radius: 0;
        }

        /* ===================== STEPS ===================== */
        .steps-list { display: flex; flex-direction: column; }

        .step {
            display: grid;
            grid-template-columns: 110px 1fr 1fr;
            gap: 40px;
            padding: 44px 0;
            border-bottom: 1px solid var(--line);
        }
        .step:last-child { border-bottom: none; }

        .step-number {
            font-family: 'JetBrains Mono', monospace;
            font-size: 64px;
            font-weight: 300;
            line-height: 1;
            color: transparent;
            -webkit-text-stroke: 1px var(--plum-line);
        }

        .step-title {
            font-size: 23px;
            font-weight: 400;
            letter-spacing: -0.01em;
            align-self: center;
            color: var(--bone);
        }

        .step-text {
            font-size: 15px;
            line-height: 1.7;
            color: var(--ash);
            font-weight: 300;
            align-self: center;
        }

        /* ===================== PRICING ===================== */
        .pricing-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 16px;
        }

        .pricing-card {
            background: var(--panel);
            border: 1px solid var(--line);
            border-radius: var(--radius);
            padding: 44px 34px;
            display: flex;
            flex-direction: column;
        }

        .pricing-card.featured {
            background:
                radial-gradient(120% 80% at 50% 0%, rgba(var(--accent-rgb), 0.18), transparent 70%),
                var(--panel-2);
            border-color: var(--plum-line);
            box-shadow: 0 0 0 1px var(--plum-line), 0 30px 80px -40px rgba(var(--accent-rgb), 0.7);
        }

        .pricing-badge {
            font-family: 'JetBrains Mono', monospace;
            font-size: 11px;
            text-transform: uppercase;
            letter-spacing: 0.14em;
            color: var(--smoke);
            margin-bottom: 18px;
        }
        .pricing-card.featured .pricing-badge { color: var(--plum-bright); }

        .pricing-name {
            font-size: 24px;
            font-weight: 400;
            margin-bottom: 10px;
            color: var(--bone);
        }

        .pricing-price {
            font-size: 52px;
            font-weight: 200;
            letter-spacing: -0.03em;
            margin-bottom: 6px;
            color: var(--bone);
        }

        .pricing-from {
            font-size: 22px;
            font-weight: 300;
            letter-spacing: 0;
            color: var(--smoke);
            margin-right: 2px;
        }

        .pricing-period {
            font-family: 'JetBrains Mono', monospace;
            font-size: 12px;
            letter-spacing: 0.05em;
            color: var(--smoke);
            margin-bottom: 30px;
        }

        .pricing-features {
            list-style: none;
            margin-bottom: 30px;
            flex-grow: 1;
        }

        .pricing-features li {
            font-size: 14px;
            font-weight: 300;
            color: var(--ash);
            padding: 13px 0 13px 26px;
            position: relative;
            border-bottom: 1px solid var(--line);
        }
        .pricing-features li:last-child { border-bottom: none; }
        .pricing-features li::before {
            content: "";
            position: absolute;
            left: 0; top: 19px;
            width: 7px; height: 7px;
            border-radius: 50%;
            background: var(--plum);
        }

        .pricing-roi {
            font-size: 13px;
            line-height: 1.6;
            font-weight: 300;
            color: var(--ash);
            padding: 18px;
            background: rgba(var(--accent-rgb), 0.07);
            border: 1px solid var(--plum-line);
            border-radius: 0;
            margin-top: auto;
        }
        .pricing-roi strong { color: var(--lichen); font-weight: 500; }
        .pricing-card.featured .pricing-roi strong { color: var(--bone); }

        /* ===================== RESULTS (не используется в разметке, оставлено) ===================== */

        /* ===================== CASES (витрина) ===================== */
        .case-block { padding: 72px 0; border-top: 1px solid var(--line); }
        .section-header + .case-block { border-top: none; padding-top: 0; }

        .case-head {
            display: grid;
            grid-template-columns: 1fr 1.15fr;
            gap: 64px;
            align-items: start;
            margin-bottom: 36px;
        }

        .case-niche {
            font-family: 'JetBrains Mono', monospace;
            font-size: 11px;
            text-transform: uppercase;
            letter-spacing: 0.14em;
            color: var(--amber);
            margin-bottom: 20px;
        }

        .case-headline {
            font-size: clamp(24px, 2.6vw, 32px);
            font-weight: 300;
            line-height: 1.25;
            letter-spacing: -0.01em;
        }
        .case-headline strong { font-weight: 500; color: var(--plum-bright); }

        .case-metrics {
            display: flex;
            gap: 64px;
            flex-wrap: wrap;
            margin-bottom: 40px;
        }
        .case-metric {
            font-size: 38px;
            font-weight: 200;
            letter-spacing: -0.02em;
            display: block;
            line-height: 1;
            color: var(--bone);
            margin-bottom: 8px;
        }
        .case-metric-label {
            font-family: 'JetBrains Mono', monospace;
            font-size: 10.5px;
            color: var(--smoke);
            text-transform: uppercase;
            letter-spacing: 0.08em;
            max-width: 170px;
            display: block;
            line-height: 1.5;
        }

        .case-theses {
            list-style: none;
            margin: 0 0 28px;
            padding: 0;
        }
        .case-theses li {
            position: relative;
            padding-left: 26px;
            font-size: 14.5px;
            font-weight: 300;
            color: var(--ash);
            line-height: 1.6;
            margin-bottom: 14px;
        }
        .case-theses li::before {
            content: "▪";
            position: absolute;
            left: 0;
            top: 4px;
            color: var(--plum);
            font-size: 11px;
        }
        .case-theses li em { font-style: normal; color: var(--lichen); }

        .case-deep-link {
            font-family: 'JetBrains Mono', monospace;
            font-size: 11.5px;
            letter-spacing: 0.06em;
            color: var(--smoke);
            text-decoration: none;
            border-bottom: 1px solid var(--line);
            padding-bottom: 2px;
            transition: color 0.25s, border-color 0.25s;
        }
        .case-deep-link:hover { color: var(--plum-bright); border-color: var(--plum-line); }

        /* — полоса-доказательство: крупный скрин + моно-сайдбар — */
        .case-gallery {
            position: relative;
            display: grid;
            grid-template-columns: 2.3fr 1fr;
            border: 1px solid var(--line);
            background: var(--panel);
        }
        /* уголки-кропмарки */
        .case-gallery::before,
        .case-gallery::after {
            content: "";
            position: absolute;
            width: 11px;
            height: 11px;
            pointer-events: none;
        }
        .case-gallery::before {
            top: -1px;
            left: -1px;
            border-top: 1px solid var(--plum-line);
            border-left: 1px solid var(--plum-line);
        }
        .case-gallery::after {
            bottom: -1px;
            right: -1px;
            border-bottom: 1px solid var(--plum-line);
            border-right: 1px solid var(--plum-line);
        }
        .case-gallery.flip { grid-template-columns: 1fr 2.3fr; }
        .case-gallery.flip .cg-stage { order: 2; }
        .case-gallery.flip .cg-side { order: 1; border-left: none; border-right: 1px solid var(--line); }

        .cg-stage {
            position: relative;
            aspect-ratio: var(--cg-ar, 4 / 3);
            margin: 24px;
            cursor: zoom-in;
        }
        .cg-slide {
            position: absolute;
            inset: 0;
            display: flex;
            align-items: center;
            justify-content: center;
            opacity: 0;
            transition: opacity 0.35s ease;
            pointer-events: none;
        }
        .cg-slide.active { opacity: 1; pointer-events: auto; }
        .cg-slide img {
            max-width: 100%;
            max-height: 100%;
            width: auto;
            height: auto;
            display: block;
            border: 1px solid var(--line-strong);
        }

        .cg-side {
            border-left: 1px solid var(--line);
            padding: 28px;
            display: flex;
            flex-direction: column;
            min-width: 0;
        }
        .cg-tag {
            font-family: 'JetBrains Mono', monospace;
            font-size: 10px;
            text-transform: uppercase;
            letter-spacing: 0.14em;
            color: var(--smoke);
            margin-bottom: 26px;
        }
        .cg-count {
            font-family: 'JetBrains Mono', monospace;
            font-size: 30px;
            color: var(--smoke);
            letter-spacing: 0.04em;
        }
        .cg-count b { font-weight: 500; color: var(--plum-bright); }
        .cg-progress {
            height: 2px;
            background: var(--line);
            margin: 16px 0 24px;
        }
        .cg-progress i {
            display: block;
            height: 100%;
            width: 25%;
            background: var(--plum);
            transition: width 0.3s ease;
        }
        .cg-caption {
            font-family: 'JetBrains Mono', monospace;
            font-size: 11.5px;
            color: var(--ash);
            line-height: 1.7;
            margin: 0;
        }
        .cg-nav {
            margin-top: auto;
            padding-top: 28px;
            display: flex;
            gap: 8px;
            align-items: center;
            justify-content: center;
        }

        .proof-link {
            margin-top: 16px;
            font-family: 'JetBrains Mono', monospace;
            font-size: 10.5px;
            text-transform: uppercase;
            letter-spacing: 0.08em;
            color: var(--smoke);
            background: none;
            border: none;
            border-bottom: 1px solid var(--line);
            padding: 0 0 2px;
            cursor: pointer;
            transition: color 0.25s, border-color 0.25s;
        }
        .proof-link:hover { color: var(--plum-bright); border-color: var(--plum-line); }
        .lightbox.single .lb-arrow,
        .lightbox.single .lb-counter { display: none; }
        .cg-arrow {
            width: 36px;
            height: 36px;
            display: flex;
            align-items: center;
            justify-content: center;
            background: transparent;
            border: 1px solid var(--line-strong);
            border-radius: 0;
            color: var(--bone);
            font-family: 'JetBrains Mono', monospace;
            font-size: 16px;
            line-height: 1;
            cursor: pointer;
            padding: 0;
            user-select: none;
            transition: border-color 0.25s, color 0.25s;
        }
        .cg-arrow:hover { border-color: var(--plum-line); color: var(--plum-bright); }

        /* — лайтбокс — */
        .lightbox {
            position: fixed;
            inset: 0;
            z-index: 300;
            background: rgba(0, 0, 0, 0.93);
            display: none;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            padding: 56px 72px;
        }
        .lightbox.active { display: flex; }
        .lb-img {
            max-width: 100%;
            max-height: calc(100vh - 190px);
            object-fit: contain;
            border: 1px solid var(--line-strong);
        }
        .lb-caption {
            font-family: 'JetBrains Mono', monospace;
            font-size: 11.5px;
            color: var(--ash);
            line-height: 1.6;
            margin-top: 18px;
            text-align: center;
            max-width: 760px;
        }
        .lb-counter {
            font-family: 'JetBrains Mono', monospace;
            font-size: 10.5px;
            letter-spacing: 0.08em;
            color: var(--plum-bright);
            margin-top: 8px;
        }
        .lb-close {
            position: absolute;
            top: 20px;
            right: 20px;
            width: 44px;
            height: 44px;
            display: flex;
            align-items: center;
            justify-content: center;
            background: var(--panel);
            border: 1px solid var(--line-strong);
            border-radius: 0;
            color: var(--bone);
            font-size: 20px;
            line-height: 1;
            cursor: pointer;
            padding: 0;
            transition: border-color 0.25s, color 0.25s;
        }
        .lb-close:hover { border-color: var(--plum-line); color: var(--plum-bright); }
        .lb-arrow {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            width: 48px;
            height: 48px;
            display: flex;
            align-items: center;
            justify-content: center;
            background: var(--panel);
            border: 1px solid var(--line-strong);
            border-radius: 0;
            color: var(--bone);
            font-family: 'JetBrains Mono', monospace;
            font-size: 20px;
            line-height: 1;
            cursor: pointer;
            padding: 0;
            user-select: none;
            transition: border-color 0.25s, color 0.25s;
        }
        .lb-arrow:hover { border-color: var(--plum-line); color: var(--plum-bright); }
        .lb-prev { left: 16px; }
        .lb-next { right: 16px; }

        /* ===================== QUOTE / FILTER ===================== */
        .quote-section {
            max-width: var(--maxw);
            margin: 0 auto;
            padding: 128px 40px;
            text-align: center;
        }

        .quote-text {
            font-size: clamp(26px, 4.2vw, 46px);
            font-weight: 200;
            line-height: 1.25;
            letter-spacing: -0.02em;
            max-width: 940px;
            margin: 0 auto 28px;
            color: var(--bone);
        }
        .quote-text span {
            font-weight: 400;
            background: linear-gradient(120deg, var(--plum-bright), var(--amber));
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
        }

        .quote-subtext {
            font-size: 16px;
            color: var(--ash);
            font-weight: 300;
            max-width: 720px;
            margin: 0 auto;
            line-height: 1.75;
        }

        /* ===================== COMPARISON ===================== */
        .comparison-table {
            display: flex;
            flex-direction: column;
            border: 1px solid var(--line);
            border-radius: var(--radius);
            overflow: hidden;
        }

        .comparison-row {
            display: grid;
            grid-template-columns: 180px 1fr 1fr;
            border-bottom: 1px solid var(--line);
        }
        .comparison-row:last-child { border-bottom: none; }

        .comparison-table.cols4 .comparison-row { grid-template-columns: 170px 1fr 1fr 1.15fr; }

        .comparison-header-row {
            background: var(--panel-2);
            border-bottom: 1px solid var(--line-strong);
        }

        .comparison-cell {
            padding: 20px 24px;
            font-size: 14px;
            font-weight: 300;
            line-height: 1.5;
            color: var(--ash);
            border-right: 1px solid var(--line);
        }
        .comparison-cell:last-child { border-right: none; }

        .comparison-cell.label {
            font-family: 'JetBrains Mono', monospace;
            font-weight: 400;
            text-transform: uppercase;
            font-size: 11px;
            letter-spacing: 0.06em;
            color: var(--smoke);
            background: rgba(255, 255, 255, 0.015);
            word-break: break-word;
            hyphens: auto;
        }

        .comparison-cell.highlight {
            background: rgba(var(--accent-rgb), 0.08);
            color: var(--bone);
            font-weight: 400;
        }

        .comparison-header-row .comparison-cell {
            font-family: 'JetBrains Mono', monospace;
            font-weight: 500;
            text-transform: uppercase;
            font-size: 12px;
            letter-spacing: 0.06em;
            color: var(--bone);
        }
        .comparison-header-row .comparison-cell.highlight {
            background: rgba(var(--accent-rgb), 0.16);
            color: var(--plum-bright);
        }

        /* ===================== FAQ ===================== */
        .faq-list { max-width: 820px; margin: 0 auto; }

        .faq-item {
            padding: 28px 0;
            border-bottom: 1px solid var(--line);
        }

        .faq-question {
            font-size: 19px;
            font-weight: 400;
            letter-spacing: -0.01em;
            margin-bottom: 12px;
            color: var(--bone);
        }

        .faq-answer {
            font-size: 15px;
            color: var(--ash);
            font-weight: 300;
            line-height: 1.7;
        }

        /* ===================== SYSTEM vs HIRE ===================== */
        .system-comparison {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 16px;
            margin-bottom: 52px;
        }

        .system-block {
            padding: 44px;
            border-radius: var(--radius);
            border: 1px solid var(--line);
            background: var(--panel);
        }

        .system-block.system-new {
            background:
                radial-gradient(120% 90% at 0% 0%, rgba(var(--accent-rgb), 0.14), transparent 60%),
                var(--panel-2);
            border-color: var(--plum-line);
        }

        .system-title {
            font-family: 'JetBrains Mono', monospace;
            font-size: 12px;
            font-weight: 500;
            text-transform: uppercase;
            letter-spacing: 0.1em;
            margin-bottom: 22px;
            color: var(--smoke);
        }
        .system-block.system-new .system-title { color: var(--plum-bright); }

        .system-text {
            font-size: 16px;
            line-height: 1.7;
            font-weight: 300;
            color: var(--ash);
        }
        .system-block.system-new .system-text { color: var(--bone); }

        .system-conclusion {
            font-size: clamp(22px, 3vw, 30px);
            font-weight: 200;
            letter-spacing: -0.02em;
            text-align: center;
            max-width: 640px;
            margin: 0 auto;
            color: var(--bone);
        }

        /* ===================== FINAL CTA ===================== */
        .final-cta {
            position: relative;
            max-width: var(--maxw);
            margin: 80px auto;
            padding: 112px 48px;
            border-radius: var(--radius);
            border: 1px solid var(--plum-line);
            background:
                radial-gradient(120% 130% at 50% -20%, rgba(var(--accent-rgb), 0.30), transparent 60%),
                var(--panel);
            text-align: center;
            overflow: hidden;
        }

        .final-cta h2 {
            font-size: clamp(34px, 5.5vw, 60px);
            font-weight: 200;
            letter-spacing: -0.025em;
            margin-bottom: 52px;
            color: var(--bone);
        }

        .final-steps {
            display: flex;
            justify-content: center;
            gap: 56px;
            margin-bottom: 52px;
            flex-wrap: wrap;
        }

        .final-step { text-align: center; }

        .final-step-num {
            font-family: 'JetBrains Mono', monospace;
            font-size: 44px;
            font-weight: 300;
            color: transparent;
            -webkit-text-stroke: 1px var(--plum);
            margin-bottom: 14px;
        }

        .final-step-text {
            font-size: 14px;
            color: var(--ash);
            font-weight: 300;
        }

        /* ===================== OUTRO (финал с частицами DZAMO) ===================== */
        .outro {
            position: relative;
            min-height: 54vh;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: flex-end;
            gap: 26px;
            text-align: center;
            padding: 0 40px 66px;
        }
        .outro-mark {
            font-size: clamp(72px, 17vw, 236px);
            font-weight: 200;
            line-height: 0.86;
            letter-spacing: 0.05em;
            padding-left: 0.05em;
            background: linear-gradient(180deg, rgba(255,255,255,0.88) 0%, rgba(255,255,255,0.30) 52%, rgba(255,255,255,0.04) 100%);
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
            user-select: none;
        }
        .outro-tag {
            font-family: 'JetBrains Mono', monospace;
            font-size: 12px;
            letter-spacing: 0.2em;
            text-transform: uppercase;
            color: var(--smoke);
        }

        /* ===================== FOOTER ===================== */
        footer {
            max-width: var(--maxw);
            margin: 0 auto;
            padding: 44px 40px;
            border-top: 1px solid var(--line);
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        .footer-copy {
            font-family: 'JetBrains Mono', monospace;
            font-size: 12px;
            letter-spacing: 0.04em;
            color: var(--smoke);
        }

        .footer-legal {
            margin-top: 8px;
            font-family: 'Inter', sans-serif;
            font-size: 11.5px;
            font-weight: 300;
            letter-spacing: 0.02em;
            color: var(--smoke);
            opacity: 0.75;
        }

        .footer-links { display: flex; gap: 26px; }

        .footer-links a {
            font-size: 13px;
            color: var(--smoke);
            text-decoration: none;
            transition: color 0.2s;
        }
        .footer-links a:hover { color: var(--bone); }

        /* ===================== FOUNDER ===================== */
        .founder-section {
            max-width: var(--maxw);
            margin: 0 auto;
            padding: 96px 40px;
            border-top: 1px solid var(--line);
        }

        .founder-content {
            max-width: 840px;
            margin: 0 auto;
            display: flex;
            gap: 44px;
            align-items: center;
            padding: 44px;
            border: 1px solid var(--line);
            border-radius: var(--radius);
            background: var(--panel);
        }

        .founder-photo {
            flex-shrink: 0;
            width: 124px;
            height: 124px;
            border-radius: 0;
            overflow: hidden;
            border: 1px solid var(--plum-line);
        }
        .founder-photo img { width: 100%; height: 100%; object-fit: cover; }

        .founder-text { flex: 1; }

        .founder-label {
            font-family: 'JetBrains Mono', monospace;
            font-size: 11px;
            font-weight: 500;
            text-transform: uppercase;
            letter-spacing: 0.14em;
            color: var(--plum-bright);
            margin-bottom: 10px;
        }

        .founder-name {
            font-size: 22px;
            font-weight: 400;
            margin-bottom: 14px;
            color: var(--bone);
        }

        .founder-bio {
            font-size: 14.5px;
            line-height: 1.65;
            font-weight: 300;
            color: var(--ash);
        }
        .founder-bio strong { color: var(--bone); font-weight: 600; }
        .founder-bio a {
            color: var(--bone);
            text-decoration: underline;
            text-underline-offset: 3px;
        }
        .founder-bio a:hover { color: var(--plum-bright); }
        .founder-stat {
            display: inline-block;
            margin-top: 18px;
            padding: 8px 14px;
            border: 1px solid var(--plum-line);
            background: rgba(var(--accent-rgb), 0.07);
            font-family: 'JetBrains Mono', monospace;
            font-size: 13px;
            letter-spacing: 0.04em;
            color: var(--bone);
        }

        /* ===================== MODAL / FORM ===================== */
        .modal-overlay {
            position: fixed;
            inset: 0;
            background: rgba(0, 0, 0, 0.78);
            backdrop-filter: blur(6px);
            -webkit-backdrop-filter: blur(6px);
            z-index: 1000;
            display: none;
            align-items: center;
            justify-content: center;
            padding: 24px;
        }
        .modal-overlay.active { display: flex; }

        .modal {
            background: #0a0a0d;
            border: 1px solid var(--line-strong);
            border-radius: var(--radius);
            max-width: 560px;
            width: 100%;
            max-height: 90vh;
            overflow-y: auto;
            box-shadow: 0 40px 120px -30px rgba(var(--accent-rgb), 0.45);
        }

        .modal-header {
            padding: 30px 36px;
            border-bottom: 1px solid var(--line);
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        .modal-title {
            font-size: 22px;
            font-weight: 400;
            letter-spacing: -0.01em;
            color: var(--bone);
        }

        .modal-close {
            width: 40px;
            height: 40px;
            border-radius: 50%;
            background: none;
            color: var(--ash);
            border: 1px solid var(--line-strong);
            cursor: pointer;
            font-size: 20px;
            font-weight: 400;
            transition: all 0.2s;
        }
        .modal-close:hover { background: var(--plum); color: #fff; border-color: var(--plum); }

        .modal-body { padding: 26px 36px 34px; }

        .form-group { margin-bottom: 18px; }

        .form-label {
            display: block;
            font-family: 'JetBrains Mono', monospace;
            font-size: 11px;
            font-weight: 500;
            text-transform: uppercase;
            letter-spacing: 0.08em;
            color: var(--smoke);
            margin-bottom: 9px;
        }
        .form-label .required { color: var(--plum-bright); }

        .form-input,
        .form-select {
            width: 100%;
            padding: 13px 15px;
            border: 1px solid var(--line-strong);
            background: rgba(255, 255, 255, 0.03);
            color: var(--bone);
            border-radius: 0;
            font-family: inherit;
            font-size: 14px;
            transition: border-color 0.2s, background 0.2s;
        }
        .form-input::placeholder { color: var(--smoke); }

        .form-select {
            appearance: none;
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23c4c4c8' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
            background-repeat: no-repeat;
            background-position: right 14px center;
            padding-right: 40px;
            cursor: pointer;
        }
        .form-select option { background: #0a0a0d; color: var(--bone); }

        .form-input:focus,
        .form-select:focus {
            outline: none;
            border-color: var(--plum);
            background: rgba(var(--accent-rgb), 0.06);
        }

        .form-row {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 16px;
        }

        .form-consent {
            display: flex;
            gap: 12px;
            align-items: flex-start;
            font-size: 12.5px;
            line-height: 1.5;
            color: var(--ash);
            font-weight: 300;
        }
        .form-consent input { margin-top: 3px; accent-color: var(--plum); }
        .form-consent a { color: var(--plum-bright); }

        .form-submit {
            width: 100%;
            padding: 17px;
            margin-top: 10px;
            background: var(--plum);
            color: #fff;
            border: none;
            border-radius: 0;
            font-family: inherit;
            font-size: 13px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.06em;
            cursor: pointer;
            transition: filter 0.2s, transform 0.2s;
        }
        .form-submit:hover { filter: brightness(1.12); transform: translateY(-1px); }
        .form-submit:disabled { opacity: 0.5; cursor: not-allowed; transform: none; }

        .form-success { text-align: center; padding: 40px; }
        .form-success-icon {
            font-size: 34px;
            width: 72px; height: 72px; line-height: 72px;
            margin: 0 auto 18px;
            border-radius: 50%;
            background: rgba(var(--success-rgb), 0.12);
            color: var(--lichen);
            border: 1px solid rgba(var(--success-rgb), 0.4);
        }
        .form-success-title { font-size: 22px; font-weight: 400; margin-bottom: 8px; color: var(--bone); }
        .form-success-text { color: var(--ash); font-weight: 300; }

        .form-error { text-align: center; padding: 40px; }
        .form-error-icon {
            width: 72px; height: 72px; line-height: 72px;
            margin: 0 auto 18px;
            border-radius: 50%;
            background: rgba(var(--accent-rgb), 0.12);
            color: var(--plum-bright);
            border: 1px solid var(--plum-line);
            font-size: 28px;
            font-weight: 400;
        }
        .form-error-title { font-size: 22px; font-weight: 400; margin-bottom: 8px; color: var(--bone); }
        .form-error-text { color: var(--ash); font-weight: 300; margin-bottom: 24px; }
        .form-error-text a { color: var(--plum-bright); font-weight: 500; }

        .form-retry {
            padding: 13px 26px;
            background: rgba(255, 255, 255, 0.05);
            color: var(--bone);
            border: 1px solid var(--line-strong);
            border-radius: 0;
            font-family: inherit;
            font-size: 12px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.06em;
            cursor: pointer;
            transition: all 0.2s;
        }
        .form-retry:hover { background: var(--plum); border-color: var(--plum); }

        /* плазменный «горизонт» внизу */
        .accent-circle {
            position: fixed;
            bottom: -340px;
            left: 50%;
            transform: translateX(-50%);
            width: 1100px;
            height: 620px;
            background: radial-gradient(closest-side, rgba(var(--accent-rgb), 0.16), transparent 72%);
            pointer-events: none;
            z-index: 0;
        }

        /* ===================== АНИМАЦИИ ВХОДА ===================== */
        @media (prefers-reduced-motion: no-preference) {
            .reveal {
                opacity: 0;
                transform: translateY(26px);
                transition: opacity 0.7s ease, transform 0.7s ease;
            }
            .reveal.in { opacity: 1; transform: none; }
        }

        /* ===================== RESPONSIVE ===================== */
        @media (max-width: 1024px) {
            .section-header { grid-template-columns: 1fr; gap: 22px; }
            .features-grid,
            .pricing-grid { grid-template-columns: 1fr; }
            .case-block { padding: 48px 0; }
            .case-head { grid-template-columns: 1fr; gap: 28px; margin-bottom: 28px; }
            .case-metrics { gap: 32px; }
            .case-gallery, .case-gallery.flip { grid-template-columns: 1fr; }
            .case-gallery.flip .cg-stage { order: 1; }
            .case-gallery.flip .cg-side { order: 2; border-right: none; }
            .cg-side { border-left: none; border-top: 1px solid var(--line); }
            .cg-tag { margin-bottom: 18px; }
            .cg-nav { padding-top: 22px; }
            .system-comparison { grid-template-columns: 1fr; }
            .comparison-row { grid-template-columns: 120px 1fr 1fr; }
            .comparison-table.cols4 .comparison-row { grid-template-columns: 110px 1fr 1fr 1.1fr; }
            .comparison-cell { padding: 16px 14px; font-size: 13px; }
            .step { grid-template-columns: 64px 1fr; gap: 22px; }
            .step-text { grid-column: 2; }
            .step-number { font-size: 48px; }
            .final-steps { flex-direction: column; gap: 30px; }
            .section-dark { padding: 64px 32px; }
        }

        @media (max-width: 768px) {
            header { padding: 16px 20px; }
            nav { gap: 16px; }
            nav > a:not(.nav-cta) { display: none; }
            .nav-cta { padding: 9px 16px; font-size: 11px; }

            .hero {
                grid-template-columns: 1fr;
                padding: 128px 22px 48px;
                gap: 36px;
            }
            .hero-title h1 { font-size: 44px; letter-spacing: -0.02em; line-height: 0.98; }
            .stats-column {
                flex-direction: row;
                flex-wrap: wrap;
                gap: 24px;
                border-left: none;
                border-top: 1px solid var(--line);
                padding-left: 0;
                padding-top: 30px;
            }
            .stat-item { flex: 1 1 40%; }
            .stat-number { font-size: 30px; }

            .bottom-bar { flex-direction: column; gap: 28px; align-items: flex-start; }
            .cta-btn { width: 100%; text-align: center; }

            .section { padding: 68px 22px; }
            .section-dark { padding: 56px 24px; margin: 56px 0; }
            .section-title { font-size: 32px; }

            .feature-card, .pricing-card { padding: 32px 26px; }
            .case-metrics { gap: 24px; }
            .case-metric { font-size: 32px; }
            .cg-stage { margin: 14px; }
            .cg-side { padding: 20px; }
            .lightbox { padding: 20px 12px 32px; }
            .lb-img { max-height: calc(100vh - 220px); }
            .lb-arrow { top: auto; bottom: 24px; transform: none; }
            .lb-prev { left: calc(50% - 60px); }
            .lb-next { right: calc(50% - 60px); }
            .lb-caption { font-size: 10.5px; padding: 0 8px; }
            .system-block { padding: 32px 26px; }
            .founder-content { flex-direction: column; text-align: center; padding: 34px 26px; }
            .founder-photo { margin: 0 auto; }

            .comparison-table { overflow-x: auto; -webkit-overflow-scrolling: touch; }
            .comparison-row { grid-template-columns: 92px 1fr 1fr; }
            .comparison-table.cols4 .comparison-row { min-width: 620px; grid-template-columns: 92px 1fr 1fr 1fr; }
            .comparison-cell { padding: 12px 10px; font-size: 11.5px; word-break: break-word; hyphens: auto; }

            .quote-section { padding: 84px 22px; }
            .final-cta { padding: 76px 26px; margin: 56px 0; }

            .modal-header, .modal-body { padding: 24px; }
            .form-row { grid-template-columns: 1fr; }

            footer { flex-direction: column; gap: 22px; text-align: center; }
        }

        /* Фиксированные слоты меню: одинаковая ширина шапки на RU и EN (только широкие экраны) */
        @media (min-width: 861px) {
            header nav > a:nth-child(1) { min-width: 50px; text-align: center; }
            header nav > a:nth-child(2) { min-width: 76px; text-align: center; }
            header nav > a:nth-child(3) { min-width: 86px; text-align: center; }
            header nav > a:nth-child(4) { min-width: 34px; text-align: center; }
            .nav-cta { min-width: 176px; text-align: center; }
        }

        .lang-seg {
            display: flex;
            border: 1px solid var(--line-strong);
            font-family: 'JetBrains Mono', monospace;
            font-size: 11px;
            letter-spacing: 0.1em;
        }
        .lang-seg a { padding: 7px 11px; color: var(--smoke); }
        .lang-seg a.active { background: var(--plum-soft); color: var(--plum-bright); pointer-events: none; }
        .lang-seg a:not(.active):hover { color: var(--bone); }

        .lang-banner {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 6px;
            padding: 10px 44px 10px 16px;
            background: var(--panel-2);
            border-bottom: 1px solid var(--line);
            font-size: 13.5px;
            color: var(--ash);
            position: fixed;
            left: 0;
            right: 0;
            z-index: 90;
        }
        .lang-banner a { color: var(--plum-bright); text-decoration: none; border-bottom: 1px solid var(--plum-line); }
        .lang-banner button {
            position: absolute;
            right: 12px;
            top: 50%;
            transform: translateY(-50%);
            background: none;
            border: none;
            color: var(--smoke);
            font-size: 18px;
            cursor: pointer;
            line-height: 1;
        }