﻿        :root {
            --gold: #C9A96E; --gold-light: #E8D5A3; --gold-dark: #8B7355;
            --dark: #0A0E17; --dark-2: #111827; --dark-3: #1A2332; --dark-4: #243447;
            --light: #F0F4F8; --white: #FFFFFF;
            --green: #22C55E; --green-glow: rgba(34,197,94,0.3);
            --yellow: #F59E0B; --yellow-glow: rgba(245,158,11,0.3);
            --red: #EF4444; --blue: #3B82F6;
            --gray: #94A3B8; --gray-dark: #475569;
            --gradient-gold: linear-gradient(135deg, #C9A96E 0%, #E8D5A3 50%, #C9A96E 100%);
            --shadow-gold: 0 0 40px rgba(201,169,110,0.15);
            --shadow-card: 0 8px 32px rgba(0,0,0,0.4);
        }
        * { margin:0; padding:0; box-sizing:border-box; }
        html { scroll-behavior:smooth; }
        body {
            font-family:'Inter',sans-serif; background:var(--dark); color:var(--light);
            overflow-x:hidden; line-height:1.6;
        }
        .particles {
            position:fixed; top:0; left:0; width:100%; height:100%;
            pointer-events:none; z-index:0; overflow:hidden;
        }
        .particle {
            position:absolute; width:4px; height:4px;
            background:var(--gold); border-radius:50%; opacity:0.3;
            animation:float 15s infinite;
        }
        @keyframes float {
            0%,100% { transform:translateY(100vh) rotate(0deg); opacity:0; }
            10% { opacity:0.3; } 90% { opacity:0.3; }
            100% { transform:translateY(-100vh) rotate(720deg); opacity:0; }
        }
        .nav {
            position:fixed; top:0; left:0; right:0; z-index:1000;
            background:rgba(10,14,23,0.85); backdrop-filter:blur(20px);
            border-bottom:1px solid rgba(201,169,110,0.1); padding:0 40px;
            transition:all 0.3s ease;
        }
        .nav-inner {
            max-width:1400px; margin:0 auto;
            display:flex; align-items:center; justify-content:space-between; height:70px;
        }
        .logo { display:flex; align-items:center; gap:12px; text-decoration:none; }
        .logo-icon {
            width:42px; height:42px; background:var(--gradient-gold); border-radius:12px;
            display:flex; align-items:center; justify-content:center; font-size:20px;
            color:var(--dark); box-shadow:0 0 20px rgba(201,169,110,0.3);
        }
        .logo-text {
            font-family:'Montserrat',sans-serif; font-weight:800; font-size:22px;
            background:var(--gradient-gold); -webkit-background-clip:text;
            -webkit-text-fill-color:transparent; background-clip:text;
        }
        .logo-sub {
            font-size:10px; color:rgba(240,244,248,0.5); letter-spacing:3px;
            text-transform:uppercase; margin-top:-4px;
        }
        .nav-links { display:flex; gap:32px; list-style:none; }
        .nav-links a {
            color:rgba(240,244,248,0.7); text-decoration:none; font-size:14px;
            font-weight:500; transition:all 0.3s; position:relative;
        }
        .nav-links a:hover { color:var(--gold); }
        .nav-links a::after {
            content:''; position:absolute; bottom:-6px; left:0;
            width:0; height:2px; background:var(--gradient-gold); transition:width 0.3s;
        }
        .nav-links a:hover::after { width:100%; }
        .nav-cta {
            background:var(--gradient-gold); color:var(--dark) !important;
            padding:10px 24px; border-radius:8px; font-weight:600 !important;
            font-size:13px !important; border:none; cursor:pointer; transition:all 0.3s;
        }
        .nav-cta:hover {
            transform:translateY(-2px); box-shadow:0 8px 25px rgba(201,169,110,0.4);
        }
        .breadcrumb-nav {
            max-width:1400px; margin:78px auto -40px; padding:10px 40px 0;
            font-size:12px; color:rgba(240,244,248,0.45); position:relative; z-index:2;
        }
        .breadcrumb-nav a { color:rgba(201,169,110,0.8); text-decoration:none; }
        .breadcrumb-nav a:hover { color:var(--gold); }
        .breadcrumb-sep { margin:0 8px; opacity:0.4; }
        .hero {
            min-height:100vh; display:flex; align-items:center; justify-content:center;
            position:relative; padding:120px 40px 80px; overflow:hidden;
        }
        .hero-bg {
            position:absolute; top:0; left:0; width:100%; height:100%;
            background:
                radial-gradient(ellipse at 20% 50%, rgba(201,169,110,0.08) 0%, transparent 50%),
                radial-gradient(ellipse at 80% 50%, rgba(59,130,246,0.05) 0%, transparent 50%);
        }
        .hero-content { max-width:1000px; text-align:center; position:relative; z-index:2; }
        .hero-badge {
            display:inline-flex; align-items:center; gap:8px;
            background:rgba(201,169,110,0.1); border:1px solid rgba(201,169,110,0.2);
            padding:8px 20px; border-radius:50px; font-size:13px; color:var(--gold);
            margin-bottom:32px; animation:fadeInUp 0.8s ease;
        }
        .hero-badge i { animation:pulse 2s infinite; }
        @keyframes pulse { 0%,100% { opacity:1; } 50% { opacity:0.5; } }
        .hero-titles {
            font-size:clamp(36px,6vw,72px);
            margin-bottom:24px; animation:fadeInUp 0.8s ease 0.2s both;
        }
        .hero h1 {
            font-family:'Montserrat',sans-serif; font-size:1em;
            font-weight:900; line-height:1.1; margin:0 0 0.15em;
        }
        .hero-subtitle {
            font-family:'Montserrat',sans-serif; font-size:0.82em;
            font-weight:700; line-height:1.15; margin:0;
            color:rgba(240,244,248,0.92);
        }
        .hero h1 .gold, .hero-subtitle .gold {
            background:var(--gradient-gold); -webkit-background-clip:text;
            -webkit-text-fill-color:transparent; background-clip:text;
        }
        .hero-desc {
            font-size:18px; color:rgba(240,244,248,0.6); max-width:600px;
            margin:0 auto 40px; animation:fadeInUp 0.8s ease 0.4s both;
        }
        .hero-stats {
            display:flex; justify-content:center; gap:48px; margin-bottom:48px;
            animation:fadeInUp 0.8s ease 0.6s both;
        }
        .stat-item { text-align:center; }
        .stat-number {
            font-family:'Montserrat',sans-serif; font-size:36px; font-weight:800;
            background:var(--gradient-gold); -webkit-background-clip:text;
            -webkit-text-fill-color:transparent; background-clip:text;
        }
        .stat-label {
            font-size:13px; color:rgba(240,244,248,0.5);
            text-transform:uppercase; letter-spacing:1px;
        }
        .hero-cta {
            display:flex; gap:16px; justify-content:center;
            animation:fadeInUp 0.8s ease 0.8s both;
        }
        .btn-primary {
            background:var(--gradient-gold); color:var(--dark); padding:16px 40px;
            border-radius:12px; font-weight:700; font-size:15px; border:none;
            cursor:pointer; transition:all 0.3s; display:inline-flex;
            align-items:center; gap:10px; text-decoration:none;
        }
        .btn-primary:hover {
            transform:translateY(-3px); box-shadow:0 12px 40px rgba(201,169,110,0.4);
        }
        .btn-secondary {
            background:transparent; color:var(--light); padding:16px 40px;
            border-radius:12px; font-weight:600; font-size:15px;
            border:1px solid rgba(240,244,248,0.2); cursor:pointer;
            transition:all 0.3s; display:inline-flex; align-items:center;
            gap:10px; text-decoration:none;
        }
        .btn-secondary:hover {
            border-color:var(--gold); color:var(--gold);
            background:rgba(201,169,110,0.05);
        }
        @keyframes fadeInUp {
            from { opacity:0; transform:translateY(30px); }
            to { opacity:1; transform:translateY(0); }
        }
        .section { padding:100px 40px; position:relative; z-index:2; }
        .section-header { text-align:center; max-width:700px; margin:0 auto 60px; }
        .section-label {
            display:inline-flex; align-items:center; gap:8px; color:var(--gold);
            font-size:12px; font-weight:600; text-transform:uppercase;
            letter-spacing:3px; margin-bottom:16px;
        }
        .section-title {
            font-family:'Montserrat',sans-serif; font-size:clamp(28px,4vw,48px);
            font-weight:800; margin-bottom:16px; line-height:1.2;
        }
        .section-title .gold {
            background:var(--gradient-gold); -webkit-background-clip:text;
            -webkit-text-fill-color:transparent; background-clip:text;
        }
        .section-desc { color:rgba(240,244,248,0.6); font-size:16px; }
        .method-grid {
            display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
            gap:24px; max-width:1200px; margin:0 auto;
        }
        .method-card {
            background:var(--dark-2); border:1px solid rgba(201,169,110,0.1);
            border-radius:16px; padding:32px; transition:all 0.4s;
            position:relative; overflow:hidden;
        }
        .method-card::before {
            content:''; position:absolute; top:0; left:0;
            width:100%; height:3px; background:var(--gradient-gold);
            transform:scaleX(0); transition:transform 0.4s;
        }
        .method-card:hover::before { transform:scaleX(1); }
        .method-card:hover {
            transform:translateY(-5px); border-color:rgba(201,169,110,0.3);
            box-shadow:var(--shadow-gold);
        }
        .method-icon {
            width:56px; height:56px; background:rgba(201,169,110,0.1);
            border-radius:14px; display:flex; align-items:center;
            justify-content:center; font-size:24px; color:var(--gold);
            margin-bottom:20px;
        }
        .method-card h3 {
            font-family:'Montserrat',sans-serif; font-size:18px;
            font-weight:700; margin-bottom:12px;
        }
        .method-card p {
            color:rgba(240,244,248,0.6); font-size:14px; line-height:1.7;
        }
        .method-weight {
            display:inline-block; background:rgba(201,169,110,0.15);
            color:var(--gold); padding:4px 12px; border-radius:20px;
            font-size:12px; font-weight:600; margin-top:12px;
        }
        .rating-section {
            background:var(--dark-2);
            border-top:1px solid rgba(201,169,110,0.1);
            border-bottom:1px solid rgba(201,169,110,0.1);
        }
        .rating-table-scroll {
            max-width:1400px; margin:0 auto;
            overflow-x:auto; -webkit-overflow-scrolling:touch;
            border-radius:16px; border:1px solid rgba(201,169,110,0.1);
            background:var(--dark-2);
        }
        .rating-table {
            width:max-content; min-width:100%;
            table-layout:fixed; border-collapse:separate;
            border-spacing:0; font-size:13px;
        }
        .rating-table thead { background:var(--dark-3); }
        .rating-table col.col-num { width:52px; }
        .rating-table col.col-brand { width:190px; }
        .rating-table col.col-model { width:155px; }
        .rating-table col.col-price { width:125px; }
        .rating-table col.col-guarantee { width:108px; }
        .rating-table col.col-data { width:92px; }
        .rating-table col.col-score { width:84px; }
        .rating-table th {
            background:var(--dark-3);
            padding:15px 12px; text-align:left; font-weight:600; color:var(--gold);
            font-size:11px; text-transform:uppercase; letter-spacing:0.6px;
            white-space:nowrap; line-height:1.25; vertical-align:middle;
            border-bottom:2px solid rgba(201,169,110,0.25);
        }
        .rating-table td {
            padding:14px 12px; border-bottom:1px solid rgba(240,244,248,0.05);
            vertical-align:middle;
        }
        .rating-table td.col-brand,
        .rating-table td.col-model,
        .rating-table td.col-price,
        .rating-table th.col-brand,
        .rating-table th.col-model,
        .rating-table th.col-price {
            white-space:nowrap;
        }
        .rating-table tbody tr { transition:all 0.3s; }
        .rating-table tbody tr:hover { background:rgba(201,169,110,0.03); }
        .leader-row {
            background:rgba(148,163,184,0.04) !important;
            border-left:3px solid var(--gray);
        }
        .leader-row td { border-bottom:1px solid rgba(148,163,184,0.08); }
        .leader-badge {
            display:inline-flex; align-items:center; gap:4px;
            background:var(--gray); color:var(--dark); padding:2px 8px;
            border-radius:4px; font-size:10px; font-weight:700; text-transform:uppercase;
        }
        .place-number {
            font-family:'Montserrat',sans-serif; font-weight:800; font-size:18px;
            width:32px; height:32px; display:flex; align-items:center;
            justify-content:center; border-radius:8px;
        }
        .place-1 { background:rgba(148,163,184,0.15); color:var(--gray); }
        .place-2 { background:rgba(192,192,192,0.15); color:#C0C0C0; }
        .place-3 { background:rgba(205,127,50,0.15); color:#CD7F32; }
        .place-other { background:var(--dark-3); color:rgba(240,244,248,0.4); }
        .brand-cell { display:flex; align-items:center; gap:10px; min-width:0; }
        .brand-logo {
            width:36px; height:36px; flex-shrink:0; background:var(--dark-3); border-radius:10px;
            display:flex; align-items:center; justify-content:center; font-size:16px;
            border:1px solid rgba(201,169,110,0.1);
        }
        .brand-name { font-weight:600; font-size:14px; white-space:nowrap; }
        .brand-model { font-size:13px; font-weight:500; color:rgba(240,244,248,0.85); white-space:nowrap; }
        .col-price .price-tag { white-space:nowrap; }
        .col-price .price-range { white-space:nowrap; }
        .score-badge {
            font-family:'Montserrat',sans-serif; font-weight:800; font-size:16px;
            padding:6px 14px; border-radius:8px; display:inline-block;
        }
        .score-high { background:rgba(34,197,94,0.15); color:var(--green); }
        .score-mid { background:rgba(245,158,11,0.15); color:var(--yellow); }
        .score-low { background:rgba(239,68,68,0.15); color:var(--red); }
        .price-tag { font-weight:700; font-size:14px; color:var(--light); }
        .price-range { font-size:10px; color:rgba(240,244,248,0.4); }
        .warranty-tag {
            display:inline-block; padding:3px 8px; border-radius:4px;
            font-size:11px; font-weight:600;
        }
        .warranty-high { background:rgba(34,197,94,0.15); color:var(--green); }
        .warranty-mid { background:rgba(245,158,11,0.15); color:var(--yellow); }
        .warranty-low { background:rgba(239,68,68,0.15); color:var(--red); }
        .compare-section { background:var(--dark); }
        .compare-tool { max-width:1200px; margin:0 auto; }
        .compare-selector {
            display:flex; gap:16px; margin-bottom:40px;
            flex-wrap:wrap; justify-content:center;
        }
        .compare-select {
            background:var(--dark-2); border:1px solid rgba(201,169,110,0.2);
            color:var(--light); padding:14px 24px; border-radius:12px;
            font-size:14px; min-width:220px; cursor:pointer; transition:all 0.3s;
            appearance:none;
            background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%23C9A96E' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10l-5 5z'/%3E%3C/svg%3E");
            background-repeat:no-repeat; background-position:right 16px center;
            padding-right:40px;
        }
        .compare-select:focus {
            outline:none; border-color:var(--gold);
            box-shadow:0 0 20px rgba(201,169,110,0.2);
        }
        .compare-btn {
            background:var(--gradient-gold); color:var(--dark); border:none;
            padding:14px 32px; border-radius:12px; font-weight:700;
            font-size:14px; cursor:pointer; transition:all 0.3s;
        }
        .compare-btn:hover {
            transform:translateY(-2px); box-shadow:0 8px 25px rgba(201,169,110,0.4);
        }
        .compare-grid {
            display:grid; gap:0; border-radius:16px; overflow:hidden;
            border:1px solid rgba(201,169,110,0.1);
            opacity:0; transform:translateY(20px); transition:all 0.6s ease;
        }
        .compare-grid.active { opacity:1; transform:translateY(0); }
        .compare-grid.grid-2 { grid-template-columns:200px 1fr 1fr; }
        .compare-grid.grid-3 { grid-template-columns:200px 1fr 1fr 1fr; }
        .compare-header {
            background:var(--dark-3); padding:24px; text-align:center;
            border-bottom:1px solid rgba(201,169,110,0.1);
        }
        .compare-header:first-child { text-align:left; }
        .compare-header .brand-icon {
            width:64px; height:64px; background:var(--dark-2); border-radius:16px;
            display:flex; align-items:center; justify-content:center; font-size:28px;
            margin:0 auto 12px; border:1px solid rgba(201,169,110,0.2);
        }
        .compare-header h3 {
            font-family:'Montserrat',sans-serif; font-size:18px; font-weight:700;
        }
        .compare-header .price {
            color:var(--gold); font-weight:700; font-size:20px; margin-top:8px;
        }
        .compare-row { display:contents; }
        .compare-label {
            background:var(--dark-2); padding:16px 24px; font-size:13px;
            font-weight:600; color:rgba(240,244,248,0.7);
            border-bottom:1px solid rgba(240,244,248,0.05);
            display:flex; align-items:center; gap:8px;
        }
        .compare-value {
            padding:16px 24px; text-align:center; font-size:14px; font-weight:600;
            border-bottom:1px solid rgba(240,244,248,0.05);
            transition:all 0.3s; position:relative;
        }
        .compare-value.best {
            background:rgba(34,197,94,0.08); color:var(--green);
        }
        .compare-value.best::after {
            content:'✓'; position:absolute; top:8px; right:8px;
            width:18px; height:18px; background:var(--green); color:var(--dark);
            border-radius:50%; font-size:10px; display:flex;
            align-items:center; justify-content:center; font-weight:800;
        }
        .compare-value.worst {
            background:rgba(245,158,11,0.08); color:var(--yellow);
        }
        .compare-value.equal {
            background:rgba(59,130,246,0.05); color:var(--blue);
        }
        .cards-grid {
            display:grid; grid-template-columns:repeat(auto-fill,minmax(360px,1fr));
            gap:24px; max-width:1400px; margin:0 auto;
        }
        .product-card {
            background:var(--dark-2); border:1px solid rgba(201,169,110,0.1);
            border-radius:20px; overflow:hidden; transition:all 0.4s;
            position:relative;
        }
        .product-card:hover {
            transform:translateY(-8px); border-color:rgba(201,169,110,0.3);
            box-shadow:var(--shadow-gold);
        }
        .card-image {
            height:200px; background:var(--dark-3); display:flex;
            align-items:center; justify-content:center; position:relative;
            overflow:hidden;
        }
        .card-image::before {
            content:''; position:absolute;
            width:120px; height:120px;
            background:radial-gradient(circle, rgba(201,169,110,0.1) 0%, transparent 70%);
            border-radius:50%;
        }
        .card-image i {
            font-size:64px; color:rgba(201,169,110,0.3); z-index:1;
        }
        .card-rank {
            position:absolute; top:16px; left:16px;
            width:36px; height:36px; border-radius:10px;
            display:flex; align-items:center; justify-content:center;
            font-family:'Montserrat',sans-serif; font-weight:800;
            font-size:14px; z-index:2;
        }
        .card-body { padding:24px; }
        .card-brand {
            font-family:'Montserrat',sans-serif; font-size:20px;
            font-weight:700; margin-bottom:4px;
        }
        .card-model {
            font-size:13px; color:rgba(240,244,248,0.5); margin-bottom:16px;
        }
        .card-price {
            font-size:28px; font-weight:800;
            background:var(--gradient-gold); -webkit-background-clip:text;
            -webkit-text-fill-color:transparent; background-clip:text;
            margin-bottom:16px;
        }
        .card-specs {
            display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:20px;
        }
        .card-spec {
            display:flex; align-items:center; gap:8px;
            font-size:12px; color:rgba(240,244,248,0.6);
        }
        .card-spec i { color:var(--gold); font-size:14px; width:20px; }
        .card-pros-cons {
            border-top:1px solid rgba(240,244,248,0.05); padding-top:16px;
        }
        .pros-cons-title {
            font-size:11px; font-weight:600; text-transform:uppercase;
            letter-spacing:1px; margin-bottom:8px;
        }
        .pros { color:var(--green); }
        .cons { color:var(--yellow); margin-top:12px; }
        .pros-cons-list {
            list-style:none; font-size:12px; color:rgba(240,244,248,0.7);
        }
        .pros-cons-list li {
            padding:3px 0; display:flex; align-items:flex-start; gap:6px;
        }
        .pros-cons-list li::before {
            content:'•'; color:var(--gold); font-weight:bold;
        }
        .card-cta {
            width:100%; margin-top:16px; padding:12px; background:transparent;
            border:1px solid rgba(201,169,110,0.3); color:var(--gold);
            border-radius:10px; font-weight:600; font-size:13px;
            cursor:pointer; transition:all 0.3s;
        }
        .card-cta:hover {
            background:var(--gradient-gold); color:var(--dark); border-color:transparent;
        }
        .faq-container { max-width:800px; margin:0 auto; }
        .faq-item {
            background:var(--dark-2); border:1px solid rgba(201,169,110,0.1);
            border-radius:12px; margin-bottom:12px; overflow:hidden;
            transition:all 0.3s;
        }
        .faq-item:hover { border-color:rgba(201,169,110,0.2); }
        .faq-question {
            padding:20px 24px; display:flex; justify-content:space-between;
            align-items:center; cursor:pointer; font-weight:600; font-size:15px;
            transition:all 0.3s;
        }
        .faq-question h3 {
            font:inherit; font-weight:inherit; margin:0; flex:1; text-align:left;
            color:inherit; line-height:1.4;
        }
        .faq-question:hover { color:var(--gold); }
        .faq-icon {
            width:28px; height:28px; background:rgba(201,169,110,0.1);
            border-radius:50%; display:flex; align-items:center;
            justify-content:center; font-size:12px; color:var(--gold);
            transition:all 0.3s;
        }
        .faq-item.active .faq-icon {
            transform:rotate(180deg); background:var(--gold); color:var(--dark);
        }
        .faq-answer {
            max-height:0; overflow:hidden;
            transition:max-height 0.4s ease, padding 0.4s ease;
        }
        .faq-item.active .faq-answer { max-height:500px; padding:0 24px 20px; }
        .faq-answer p {
            color:rgba(240,244,248,0.7); font-size:14px; line-height:1.8;
        }
        .footer {
            background:var(--dark-2);
            border-top:1px solid rgba(201,169,110,0.1);
            padding:60px 40px 30px;
        }
        .footer-inner {
            max-width:1200px; margin:0 auto;
            display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:40px;
        }
        .footer-brand {
            font-family:'Montserrat',sans-serif; font-size:24px; font-weight:800;
            background:var(--gradient-gold); -webkit-background-clip:text;
            -webkit-text-fill-color:transparent; background-clip:text;
            margin-bottom:12px;
        }
        .footer-desc {
            color:rgba(240,244,248,0.5); font-size:14px; line-height:1.7;
        }
        .footer-title {
            font-weight:700; font-size:14px; margin-bottom:16px; color:var(--gold);
        }
        .footer-links { list-style:none; }
        .footer-links li { margin-bottom:10px; }
        .footer-links a {
            color:rgba(240,244,248,0.5); text-decoration:none; font-size:14px;
            transition:color 0.3s;
        }
        .footer-links a:hover { color:var(--gold); }
        .footer-bottom {
            max-width:1200px; margin:40px auto 0; padding-top:24px;
            border-top:1px solid rgba(240,244,248,0.05);
            display:flex; justify-content:space-between; align-items:center;
            font-size:13px; color:rgba(240,244,248,0.3);
        }
        .animate-on-scroll { opacity:0; transform:translateY(30px); transition:all 0.8s ease; }
        .animate-on-scroll.visible { opacity:1; transform:translateY(0); }
        @media (max-width:1024px) {
            .footer-inner { grid-template-columns:1fr 1fr; }
        }
        @media (max-width:768px) {
            .nav-links { display:none; }
            .hero-stats { gap:24px; }
            .stat-number { font-size:28px; }
            .section { padding:60px 20px; }
            .cards-grid { grid-template-columns:1fr; }
            .footer-inner { grid-template-columns:1fr; }
            .hero-cta { flex-direction:column; }
            .compare-selector { flex-direction:column; align-items:center; }
            .compare-select { width:100%; max-width:300px; }
        }
        ::-webkit-scrollbar { width:8px; height:8px; }
        ::-webkit-scrollbar-track { background:var(--dark); }
        ::-webkit-scrollbar-thumb { background:var(--dark-4); border-radius:4px; }
        ::-webkit-scrollbar-thumb:hover { background:var(--gold-dark); }
        .loading-bar {
            position:fixed; top:0; left:0; height:3px;
            background:var(--gradient-gold); z-index:9999;
            animation:loading 2s ease forwards;
        }
        @keyframes loading { 0% { width:0; } 100% { width:100%; opacity:0; } }

        .tco-calculator { display:grid; grid-template-columns:300px 1fr; gap:28px; max-width:1400px; margin:0 auto; }
        .tco-sidebar { background:var(--dark-2); border:1px solid rgba(201,169,110,0.1); border-radius:16px; padding:20px; max-height:640px; display:flex; flex-direction:column; }
        .tco-search { margin-bottom:12px; }
        .tco-search input { width:100%; background:var(--dark-3); border:1px solid rgba(201,169,110,0.15); color:var(--light); padding:10px 14px; border-radius:10px; font-size:13px; outline:none; }
        .tco-search input:focus { border-color:var(--gold); }
        .tco-brands { flex:1; overflow-y:auto; display:flex; flex-direction:column; gap:6px; padding-right:4px; }
        .tco-brand-item { display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:8px; cursor:pointer; transition:all 0.2s; font-size:13px; }
        .tco-brand-item:hover { background:rgba(201,169,110,0.06); }
        .tco-brand-item input { accent-color:var(--gold); width:14px; height:14px; cursor:pointer; }
        .tco-brand-color { width:10px; height:10px; border-radius:50%; flex-shrink:0; }
        .tco-summary { margin-top:12px; padding-top:12px; border-top:1px solid rgba(240,244,248,0.05); font-size:12px; color:rgba(240,244,248,0.5); }
        .tco-main { background:var(--dark-2); border:1px solid rgba(201,169,110,0.1); border-radius:16px; padding:24px; }
        .tech-card { background:var(--dark-2); border:1px solid rgba(201,169,110,0.12); border-radius:22px; padding:32px; box-shadow:var(--shadow-card); }
        .tech-wrap { display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-top:30px; }
        .tech-side { padding:24px; border-radius:18px; background:var(--dark-3); min-height:360px; }
        .tech-side h3 { margin-bottom:18px; font-family:'Montserrat',sans-serif; }
        .tech-list { list-style:none; }
        .tech-list li { margin-bottom:14px; color:rgba(240,244,248,.75); }
        .center-stage { transform:scale(1.04); border:1px solid rgba(201,169,110,.35)!important; box-shadow:0 0 50px rgba(201,169,110,.18); position:relative; z-index:2; }
        .center-stage::before { content:'Выбор экспертов по надежности'; position:absolute; top:16px; right:16px; background:var(--gradient-gold); color:var(--dark); font-size:11px; font-weight:800; padding:6px 10px; border-radius:999px; }
        .diff-toggle { display:flex; justify-content:flex-end; margin:0 auto 18px; max-width:1200px; }
        .diff-toggle button { background:var(--dark-2); border:1px solid rgba(201,169,110,.2); color:var(--light); padding:12px 18px; border-radius:12px; cursor:pointer; font-weight:600; transition:all 0.3s; }
        .diff-toggle button.active { background:var(--gold); color:var(--dark); border-color:var(--gold); }
        .tooltip-term { position:relative; cursor:help; border-bottom:1px dashed var(--gold); color:var(--gold-light); }
        .tooltip-box { position:absolute; bottom:calc(100% + 10px); left:50%; transform:translateX(-50%); width:260px; background:var(--dark); border:1px solid rgba(201,169,110,0.25); padding:12px; border-radius:10px; font-size:12px; line-height:1.5; z-index:200; color:var(--light); box-shadow:0 8px 32px rgba(0,0,0,0.5); opacity:0; pointer-events:none; transition:opacity 0.2s; }
        .tooltip-term:hover .tooltip-box { opacity:1; pointer-events:auto; }
        .tooltip-box::after { content:''; position:absolute; top:100%; left:50%; transform:translateX(-50%); border:6px solid transparent; border-top-color:rgba(201,169,110,0.25); }
        .engineer-choice { background:var(--dark-3) !important; border-color:rgba(148,163,184,0.15) !important; }
        .engineer-choice:hover { border-color:rgba(148,163,184,0.3) !important; box-shadow:0 8px 32px rgba(0,0,0,0.3) !important; }
        .engineer-badge { position:absolute; top:16px; right:16px; background:rgba(148,163,184,0.12); color:var(--gray); font-size:10px; font-weight:800; padding:5px 10px; border-radius:999px; border:1px solid rgba(148,163,184,0.2); z-index:2; }
        .inaccuracy-btn { margin-top:10px; width:100%; padding:8px; background:transparent; border:1px solid rgba(239,68,68,0.2); color:rgba(239,68,68,0.7); border-radius:8px; font-size:11px; cursor:pointer; transition:all 0.3s; display:inline-flex; align-items:center; justify-content:center; gap:6px; }
        .inaccuracy-btn:hover { background:rgba(239,68,68,0.1); color:var(--red); border-color:rgba(239,68,68,0.4); }
        .modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.7); backdrop-filter:blur(8px); z-index:5000; display:none; align-items:center; justify-content:center; padding:20px; }
        .modal-overlay.open { display:flex; }
        .modal-content { background:var(--dark-2); border:1px solid rgba(201,169,110,0.15); border-radius:20px; width:100%; max-width:480px; padding:28px; position:relative; animation:modalIn 0.3s ease; }
        @keyframes modalIn { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:translateY(0); } }
        .modal-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:20px; }
        .modal-header h3 { font-family:'Montserrat',sans-serif; font-size:18px; }
        .modal-close { background:none; border:none; color:var(--light); font-size:24px; cursor:pointer; width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; transition:all 0.2s; }
        .modal-close:hover { background:rgba(201,169,110,0.1); color:var(--gold); }
        .form-group { margin-bottom:16px; }
        .form-group label { display:block; font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:0.5px; color:rgba(240,244,248,0.6); margin-bottom:6px; }
        .form-group input, .form-group select, .form-group textarea { width:100%; background:var(--dark-3); border:1px solid rgba(201,169,110,0.15); color:var(--light); padding:12px 14px; border-radius:10px; font-size:14px; outline:none; transition:all 0.2s; font-family:'Inter',sans-serif; }
        .form-group input:focus, .form-group select:focus, .form-group textarea:focus { border-color:var(--gold); }
        .modal-success { text-align:center; padding:20px; }
        .modal-success i { font-size:48px; color:var(--green); margin-bottom:12px; display:block; }
        .compare-mobile { display:none; }
        @media (max-width:900px) {
            .tco-calculator { grid-template-columns:1fr; }
            .tco-sidebar { max-height:320px; }
            .tech-wrap { grid-template-columns:1fr; }
        }
        @media (max-width:768px) {
            .compare-grid { display:none !important; }
            .compare-mobile { display:flex; gap:16px; overflow-x:auto; padding-bottom:16px; scroll-snap-type:x mandatory; }
            .compare-mobile-card { min-width:280px; background:var(--dark-2); border:1px solid rgba(201,169,110,0.1); border-radius:16px; padding:20px; scroll-snap-align:start; flex-shrink:0; }
            .compare-mobile-card h4 { font-family:'Montserrat',sans-serif; margin-bottom:4px; }
            .compare-mobile-card .m-price { color:var(--gold); font-weight:700; font-size:18px; margin-bottom:12px; }
            .compare-mobile-row { display:flex; justify-content:space-between; padding:8px 0; border-bottom:1px solid rgba(240,244,248,0.05); font-size:13px; }
            .compare-mobile-row .m-label { color:rgba(240,244,248,0.5); }
            .compare-mobile-row .m-val { font-weight:600; }
            .compare-mobile-row .m-val.best { color:var(--green); }
            .compare-mobile-row .m-val.worst { color:var(--yellow); }
        }

body {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}
input, textarea, select, .compare-select, .tco-search input, .faq-answer p {
    -webkit-user-select: text;
    -moz-user-select: text;
    user-select: text;
}
img {
    -webkit-user-drag: none;
    user-drag: none;
    pointer-events: none;
}
.brand-logo i, .card-image i, .method-icon i {
    pointer-events: auto;
}
