    :root {
        --primary: #84C447;
        --primary-dark: #6AA336;
        --primary-light: rgba(132, 196, 71, 0.1);
        --accent: #FF6B35;
        --white: #FFFFFF;
        --black: #1C1E22;
        --gray-1: #F8F9FA;
        --gray-2: #E9ECEF;
        --gray-3: #DEE2E6;
        --gray-4: #6C757D;
        --gray-5: #495057;
        --gray-6: #343A40;
        --text-primary: #1C1E22;
        --text-secondary: #495057;
        --text-tertiary: #6C757D;
        --background: #FFFFFF;
        --background-secondary: #F8F9FA;
        --background-elevated: #FFFFFF;
        --shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
        --shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.12);
        --shadow-xl: 0 20px 50px rgba(0, 0, 0, 0.15);
        --radius: 12px;
        --radius-lg: 16px;
        --radius-xl: 24px;
        --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        --transition-slow: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    }

    [data-theme="dark"] {
        --background: #0A0A0B;
        --background-secondary: #141416;
        --background-elevated: #1C1E22;
        --text-primary: #FFFFFF;
        --text-secondary: #E9ECEF;
        --text-tertiary: #ADB5BD;
        --shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
        --shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.4);
        --shadow-xl: 0 20px 50px rgba(0, 0, 0, 0.5);
    }

    * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }

    html {
        scroll-behavior: smooth;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }

    body {
        font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
        line-height: 1.6;
        font-weight: 400;
        color: var(--text-primary);
        background: var(--background);
        transition: var(--transition-slow);
    }

    .container {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 24px;
    }

    /* Прелоадер */
    .preloader {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: var(--background);
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        z-index: 10001; /* Выше баннера (10000) чтобы показываться первым */
        transition: opacity 0.5s ease, visibility 0.5s ease;
    }

    .preloader.hidden {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }

    .loader {
        width: 60px;
        height: 60px;
        border: 4px solid var(--primary-light);
        border-top: 4px solid var(--primary);
        border-radius: 50%;
        animation: spin 1s linear infinite;
        margin-bottom: 2rem;
    }

    .loading-text {
        font-size: 1.25rem;
        color: var(--text-secondary);
        font-weight: 500;
        text-align: center;
    }

    .loading-progress {
        width: 200px;
        height: 6px;
        background: transparent;
        border-radius: 3px;
        margin-top: 1rem;
        overflow: hidden;
    }

    .progress-bar {
        height: 100%;
        width: 100%;
        background: var(--primary-light);
        border-radius: 3px;
        position: relative;
        overflow: hidden;
    }
    
    .progress-fill {
        height: 100%;
        background: var(--primary);
        border-radius: 3px;
        width: 0%;
        transition: width 0.3s ease;
        position: absolute;
        top: 0;
        left: 0;
    }

    @keyframes spin {
        0% { transform: rotate(0deg); }
        100% { transform: rotate(360deg); }
    }

    /* Обновленная навигация */
    #main-header {
        position: fixed;
        top: 0;
        width: 100%;
        background: rgba(255, 255, 255, 0.95);
        backdrop-filter: blur(20px);
        -webkit-backdrop-filter: blur(20px);
        border-bottom: 1px solid rgba(0, 0, 0, 0.08);
        z-index: 1000; /* Ниже баннера (9999) и прелоадера (10001) */
        transition: top 0.3s ease, var(--transition); /* Добавляем transition для top */
        /* Важно: top будет изменяться через JavaScript при наличии баннера */
    }

    [data-theme="dark"] #main-header {
        background: rgba(10, 10, 11, 0.95);
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    }

    .navbar {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 1rem 0;
        min-height: 70px;
        gap: 2rem;
    }

    .logo {
        display: flex;
        align-items: center;
        gap: 12px;
        font-size: 1.5rem;
        font-weight: 700;
        text-decoration: none;
        color: var(--text-primary);
        flex-shrink: 0;
    }

    .logo-icon {
        color: var(--primary);
        font-size: 1.75rem;
    }

    .nav-container {
        display: flex;
        align-items: center;
        gap: 1.5rem;
        flex: 1;
        justify-content: flex-end;
    }

    .nav-menu {
        display: flex;
        list-style: none;
        gap: 1.5rem;
        align-items: center;
        margin: 0;
        padding: 0;
    }

    .nav-menu a {
        text-decoration: none;
        color: var(--text-secondary);
        font-weight: 500;
        transition: var(--transition);
        position: relative;
        white-space: nowrap;
        font-size: 0.95rem;
    }

    .nav-menu a:hover {
        color: var(--primary);
    }

    .nav-menu a.active {
        color: var(--primary);
        font-weight: 600;
    }

    .nav-menu a.active::after {
        content: '';
        position: absolute;
        bottom: -8px;
        left: 0;
        width: 100%;
        height: 2px;
        background: var(--primary);
        border-radius: 2px;
    }

    /* Подменю "Еще" */
    .nav-more {
        position: relative;
    }

    .more-dropdown {
        position: absolute;
        top: 100%;
        right: 0;
        background: var(--background-elevated);
        border-radius: var(--radius);
        box-shadow: var(--shadow-lg);
        padding: 0.5rem;
        min-width: 200px;
        display: none;
        z-index: 1001;
    }

    .more-dropdown.active {
        display: block;
    }

    .more-dropdown a {
        display: block;
        padding: 0.75rem 1rem;
        text-decoration: none;
        color: var(--text-secondary);
        border-radius: 6px;
        transition: var(--transition);
        white-space: nowrap;
    }

    .more-dropdown a:hover {
        background: var(--primary-light);
        color: var(--primary);
    }

    /* Обновленные контролы навигации */
    .nav-controls {
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

    .nav-btn {
        background: none;
        border: none;
        color: var(--text-secondary);
        cursor: pointer;
        width: 40px;
        height: 40px;
        border-radius: 8px;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: var(--transition);
        position: relative;
    }

    .nav-btn:hover {
        background: var(--primary-light);
        color: var(--primary);
    }

    .nav-btn-large {
        width: auto;
        padding: 8px 16px;
        gap: 8px;
    }

    /* Корзина с счетчиком */
.cart-count {
    position: absolute;
    top: -5px;
    right: -5px;
    background: var(--accent);
    color: white;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    font-size: 0.7rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    border: 2px solid var(--background);
}

    /* Кнопка входа */
    .login-btn {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 8px 16px;
        background: var(--background-elevated);
        border: 1px solid var(--gray-2);
        border-radius: var(--radius);
        color: var(--text-secondary);
        text-decoration: none;
        font-weight: 500;
        transition: var(--transition);
        font-size: 0.9rem;
    }

    .login-btn:hover {
        background: var(--primary-light);
        color: var(--primary);
        border-color: var(--primary);
    }

    .lang-selector {
        position: relative;
    }

    .lang-indicator {
        font-size: 0.75rem;
        font-weight: 600;
        color: var(--text-primary);
        margin-left: 4px;
        letter-spacing: 0.5px;
    }

    .nav-btn .lang-indicator {
        display: inline-block;
    }

    .lang-dropdown {
        position: absolute;
        top: 100%;
        right: 0;
        background: var(--background-elevated);
        border-radius: var(--radius);
        box-shadow: var(--shadow-lg);
        padding: 0.5rem;
        min-width: 120px;
        display: none;
        z-index: 1001;
    }

    .lang-dropdown.active {
        display: block;
    }

    .lang-option {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.75rem 1rem;
        border-radius: 6px;
        cursor: pointer;
        transition: var(--transition);
        color: var(--text-secondary);
    }

    .lang-option:hover {
        background: var(--primary-light);
        color: var(--primary);
    }

    .lang-option.active {
        background: var(--primary-light);
        color: var(--primary);
        font-weight: 600;
    }

    /* Бургер меню */
    .burger-menu {
        display: none;
        flex-direction: column;
        gap: 4px;
        background: none;
        border: none;
        cursor: pointer;
        padding: 8px;
        border-radius: 6px;
        transition: var(--transition);
    }

    .burger-menu:hover {
        background: var(--primary-light);
    }

    .burger-line {
        width: 20px;
        height: 2px;
        background: var(--text-secondary);
        transition: var(--transition);
        border-radius: 2px;
    }

    .burger-menu.active .burger-line:nth-child(1) {
        transform: rotate(45deg) translate(5px, 5px);
    }

    .burger-menu.active .burger-line:nth-child(2) {
        opacity: 0;
    }

    .burger-menu.active .burger-line:nth-child(3) {
        transform: rotate(-45deg) translate(7px, -6px);
    }

    /* Мобильное меню */
    .mobile-menu {
        position: fixed;
        top: 80px;
        left: 0;
        width: 100%;
        height: calc(100vh - 80px);
        background: var(--background);
        z-index: 999;
        padding: 2rem;
        transform: translateX(-100%);
        transition: var(--transition);
        overflow-y: auto;
        border-top: 1px solid var(--gray-2);
    }

    .mobile-menu.active {
        transform: translateX(0);
    }

    .mobile-nav {
        list-style: none;
        margin-bottom: 2rem;
    }

    .mobile-nav li {
        margin-bottom: 1rem;
    }

    .mobile-nav a {
        display: block;
        padding: 1rem;
        text-decoration: none;
        color: var(--text-primary);
        font-size: 1.125rem;
        font-weight: 500;
        border-radius: var(--radius);
        transition: var(--transition);
    }

    .mobile-nav a:hover, .mobile-nav a.active {
        background: var(--primary-light);
        color: var(--primary);
    }

/* Стили для мобильных контролов */
.mobile-controls {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1rem 0;
}

.mobile-lang-selector {
    position: relative;
}

.mobile-lang-toggle {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding: 1rem;
    background: var(--background-elevated);
    border: 1px solid var(--gray-2);
    border-radius: var(--radius);
    color: var(--text-primary);
    cursor: pointer;
    transition: var(--transition);
}

.mobile-lang-toggle:hover {
    background: var(--primary-light);
}

.mobile-lang-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--background-elevated);
    border-radius: var(--radius);
    box-shadow: var(--shadow-lg);
    display: none;
    z-index: 1001;
    margin-top: 0.5rem;
}

.mobile-lang-dropdown.active {
    display: block;
}

.mobile-lang-option {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    text-decoration: none;
    color: var(--text-secondary);
    border-bottom: 1px solid var(--gray-2);
    transition: var(--transition);
}

.mobile-lang-option:last-child {
    border-bottom: none;
}

.mobile-lang-option:hover {
    background: var(--primary-light);
    color: var(--primary);
}

.mobile-lang-option.active {
    background: var(--primary-light);
    color: var(--primary);
    font-weight: 600;
}

.theme-toggle {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding: 1rem;
    background: var(--background-elevated);
    border: 1px solid var(--gray-2);
    border-radius: var(--radius);
    color: var(--text-primary);
    cursor: pointer;
    transition: var(--transition);
}

.theme-toggle:hover {
    background: var(--primary-light);
}

    /* Кнопки */
    .btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        padding: 12px 24px;
        border-radius: var(--radius);
        font-size: 1rem;
        font-weight: 600;
        text-decoration: none;
        transition: var(--transition);
        border: none;
        cursor: pointer;
        position: relative;
        overflow: hidden;
    }

    .btn-primary {
        background: var(--primary);
        color: white;
    }

    .btn-primary:hover {
        background: var(--primary-dark);
        transform: translateY(-2px);
        box-shadow: var(--shadow-lg);
    }

    .btn-secondary {
        background: transparent;
        color: var(--primary);
        border: 2px solid var(--primary);
    }

    .btn-secondary:hover {
        background: var(--primary-light);
        transform: translateY(-2px);
    }

    .btn-large {
        padding: 16px 32px;
        font-size: 1.125rem;
    }

    /* Обновленные заголовки секций */
    .section {
        padding: 100px 0;
    }

    .section-header {
        text-align: center;
        margin-bottom: 4rem;
    }

    .section-header h2 {
        margin-bottom: 1rem;
        font-size: 2.75rem;
        line-height: 1.1;
        font-weight: 800;
        letter-spacing: -0.02em;
        background: linear-gradient(135deg, var(--text-primary) 0%, var(--primary) 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

    .section-subtitle {
        font-size: 1.25rem;
        color: var(--text-secondary);
        max-width: 600px;
        margin: 0 auto;
        line-height: 1.6;
    }

    /* Обновленный таймер */
    .promo-timer {
        text-align: center;
        margin-bottom: 2rem;
        padding-bottom: 2rem;
        border-bottom: 1px solid var(--gray-2);
    }

    .promo-timer h3 {
        color: var(--text-primary);
        margin-bottom: 1.5rem;
        font-size: 1.25rem;
        font-weight: 600;
    }

    .timer-numbers {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.75rem;
    }

    .timer-block {
        text-align: center;
        background: var(--background);
        padding: 0.75rem;
        border-radius: var(--radius);
        min-width: 60px;
        box-shadow: var(--shadow);
        transition: all 0.3s ease;
    }

    .timer-block:hover {
        transform: translateY(-2px);
        box-shadow: var(--shadow-lg);
    }

    .timer-number {
        font-size: 1.75rem;
        font-weight: 800;
        color: var(--accent);
        line-height: 1;
        display: block;
        margin-bottom: 0.25rem;
        transition: all 0.3s ease;
    }

    .timer-label {
        font-size: 0.7rem;
        color: var(--text-tertiary);
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

    .timer-separator {
        font-size: 1.25rem;
        font-weight: 700;
        color: var(--primary);
        margin: 0 0.1rem;
        line-height: 1;
    }

    /* Герой-секция */
.hero {
    padding: 140px 0 60px;
    background: linear-gradient(135deg, var(--background) 0%, var(--background-secondary) 100%);
    min-height: 90vh;
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
}
@media (min-width: 1025px) {
    .hero {
        padding: 100px 0 40px !important;
        min-height: 70vh !important;
    }
}
    .hero-content {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 4rem;
        align-items: center;
    }

    .hero-text {
        max-width: 600px;
    }

    .hero-badge {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: var(--primary-light);
        color: var(--primary);
        padding: 8px 16px;
        border-radius: 20px;
        font-size: 0.875rem;
        font-weight: 600;
        margin-bottom: 2rem;
    }

    .hero h1 {
        margin-bottom: 1.5rem;
        font-size: 3.5rem;
        line-height: 1.1;
        font-weight: 800;
        letter-spacing: -0.02em;
        background: linear-gradient(135deg, var(--text-primary) 0%, var(--primary) 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

    .hero-subtitle {
        font-size: 1.25rem;
        color: var(--text-secondary);
        margin-bottom: 2.5rem;
        line-height: 1.6;
    }

    .hero-features {
        display: flex;
        flex-direction: column;
        gap: 1rem;
        margin-bottom: 2.5rem;
    }

    .feature-item {
        display: flex;
        align-items: center;
        gap: 12px;
        font-weight: 500;
    }

    .feature-item i {
        color: var(--primary);
        font-size: 1.125rem;
    }

    .hero-actions {
        display: flex;
        gap: 1rem;
        flex-wrap: wrap;
    }

    .hero-visual {
        position: relative;
        text-align: center;
    }

    .device-showcase {
        position: relative;
        max-width: 500px;
        margin: 0 auto;
    }

    .device-image {
        width: 100%;
        height: auto;
        border-radius: var(--radius-xl);
        box-shadow: var(--shadow-xl);
        transform: perspective(1000px) rotateY(-5deg) rotateX(5deg);
        transition: var(--transition-slow);
    }

    .device-image:hover {
        transform: perspective(1000px) rotateY(0deg) rotateX(0deg);
    }

.floating-badge {
    position: absolute !important;
    top: 20px !important;
    right: 20px !important;
    background: var(--accent) !important;
    color: white !important;
    padding: 8px 16px !important;
    border-radius: 20px !important;
    font-size: 0.875rem !important;
    font-weight: 600 !important;
    z-index: 10 !important;
    animation: float 3s ease-in-out infinite !important;
}

    /* Особенности */
    .features-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
        gap: 2rem;
    }

    .feature-card {
        background: var(--background-elevated);
        border-radius: var(--radius-lg);
        padding: 2.5rem;
        transition: var(--transition);
        border: 1px solid var(--gray-2);
    }

    .feature-card:hover {
        transform: translateY(-8px);
        box-shadow: var(--shadow-xl);
        border-color: var(--primary);
    }

    .feature-icon {
        width: 60px;
        height: 60px;
        margin-bottom: 1.5rem;
        background: var(--primary-light);
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: var(--primary);
        font-size: 1.5rem;
    }

    .feature-card h3 {
        margin-bottom: 1rem;
        font-size: 1.5rem;
        line-height: 1.3;
        font-weight: 600;
    }

    /* Технологии */
    .tech-section {
        background: var(--background-secondary);
    }

    .tech-stack {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        gap: 2rem;
    }

    .tech-item {
        text-align: center;
        padding: 2rem;
        background: var(--background-elevated);
        border-radius: var(--radius-lg);
        transition: var(--transition);
        border: 1px solid var(--gray-2);
    }

    .tech-item:hover {
        transform: translateY(-5px);
        box-shadow: var(--shadow-lg);
        border-color: var(--primary);
    }

    .tech-icon {
        width: 80px;
        height: 80px;
        margin: 0 auto 1.5rem;
        background: var(--primary-light);
        border-radius: 20px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: var(--primary);
        font-size: 2rem;
    }

    .tech-item h3 {
        margin-bottom: 1rem;
        color: var(--text-primary);
        font-size: 1.5rem;
        line-height: 1.3;
        font-weight: 600;
    }

    .tech-item p {
        color: var(--text-secondary);
        line-height: 1.6;
    }

    /* Проблема-Решение */
    .problem-solution {
        background: var(--background-secondary);
    }

    .ps-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 4rem;
        align-items: center;
    }

    .ps-card {
        background: var(--background-elevated);
        padding: 3rem;
        border-radius: var(--radius-xl);
        box-shadow: var(--shadow-lg);
        transition: var(--transition);
    }

    .ps-card:hover {
        transform: translateY(-5px);
        box-shadow: var(--shadow-xl);
    }

    .ps-icon {
        width: 64px;
        height: 64px;
        background: var(--primary-light);
        border-radius: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 1.5rem;
        color: var(--primary);
        font-size: 1.5rem;
    }

    .ps-card h3 {
        margin-bottom: 1rem;
        color: var(--text-primary);
        font-size: 1.5rem;
        line-height: 1.3;
        font-weight: 600;
    }

    .ps-card p {
        color: var(--text-secondary);
        line-height: 1.7;
    }

    /* Технические характеристики */
    .specs-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
        gap: 1.5rem;
    }

    .spec-card {
        background: var(--background-elevated);
        padding: 2rem;
        border-radius: var(--radius-lg);
        border-left: 4px solid var(--primary);
        box-shadow: var(--shadow);
        transition: var(--transition);
    }

    .spec-card:hover {
        transform: translateY(-5px);
        box-shadow: var(--shadow-lg);
    }

    .spec-category {
        font-size: 0.875rem;
        color: var(--primary);
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        margin-bottom: 1.5rem;
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

    .spec-category::before {
        content: '';
        width: 8px;
        height: 8px;
        background: var(--primary);
        border-radius: 50%;
        display: inline-block;
    }

    .spec-list {
        list-style: none;
    }

    .spec-list li {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0.75rem 0;
        border-bottom: 1px solid var(--gray-2);
    }

    .spec-list li:last-child {
        border-bottom: none;
    }

    .spec-name {
        color: var(--text-secondary);
        font-size: 0.95rem;
    }

    .spec-value {
        font-weight: 600;
        color: var(--text-primary);
        text-align: right;
    }

    /* Преимущества */
    .advantages-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
        gap: 2rem;
    }

    .advantage-card {
        text-align: center;
        padding: 2rem;
        background: var(--background-elevated);
        border-radius: var(--radius-lg);
        transition: var(--transition);
    }

    .advantage-card:hover {
        transform: translateY(-5px);
        box-shadow: var(--shadow-lg);
    }

    .advantage-number {
        font-size: 3rem;
        font-weight: 800;
        color: var(--primary);
        margin-bottom: 1rem;
        line-height: 1;
    }

    .advantage-card h3 {
        margin-bottom: 1rem;
        color: var(--text-primary);
        font-size: 1.5rem;
        line-height: 1.3;
        font-weight: 600;
    }

    .advantage-card p {
        color: var(--text-secondary);
        line-height: 1.6;
    }

/* Видео */
.video-container {
    position: relative;
    width: 100%;
    max-width: 800px;
    margin: 0 auto 3rem;
    border-radius: var(--radius-xl);
    overflow: hidden;
    box-shadow: var(--shadow-xl);
    transform: perspective(1000px) rotateY(-5deg) rotateX(5deg);
    transition: var(--transition-slow);
}

.video-container:hover {
    transform: perspective(1000px) rotateY(0deg) rotateX(0deg);
}

.video-placeholder {
    width: 100%;
    height: 450px;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    border-radius: var(--radius-xl);
}

.video-player {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: var(--radius-xl);
    filter: brightness(1.05) contrast(1.1);
    transition: var(--transition-slow);
}

.video-container:hover .video-player {
    filter: brightness(1.1) contrast(1.2);
}

.video-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        135deg,
        rgba(132, 196, 71, 0.1) 0%,
        rgba(106, 163, 54, 0.05) 50%,
        transparent 100%
    );
    display: flex;
    flex-direction: column;
    align-items: flex-start; /* ← ИЗМЕНИЛ */
    justify-content: flex-start; /* ← ИЗМЕНИЛ */
    color: white;
    transition: var(--transition-slow);
    z-index: 2;
    border-radius: var(--radius-xl);
    padding: 2rem; /* ← ДОБАВИЛ */
    pointer-events: none; /* ← ДОБАВИЛ */
}

.video-overlay:hover {
    background: linear-gradient(
        135deg,
        rgba(132, 196, 71, 0.15) 0%,
        rgba(106, 163, 54, 0.1) 50%,
        transparent 100%
    );
    backdrop-filter: blur(2px);
}



.video-title {
    text-align: left; /* ← ИЗМЕНИЛ */
    margin-top: 0; /* ← ИЗМЕНИЛ */
    background: rgba(255, 255, 255, 0.9);
    padding: 1rem 1.5rem; /* ← ИЗМЕНИЛ */
    border-radius: var(--radius-lg);
    backdrop-filter: blur(10px);
    transform: translateZ(10px);
    transition: var(--transition);
    pointer-events: auto; /* ← ДОБАВИЛ */
    cursor: pointer; /* ← ДОБАВИЛ */
}

.video-title h3 {
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
    color: var(--text-primary);
    font-weight: 600;
}

.video-title p {
    color: var(--text-secondary);
    margin: 0;
}

/* Эффект блика */
.video-container::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 50%;
    height: 100%;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(255, 255, 255, 0.1),
        transparent
    );
    transition: var(--transition-slow);
    z-index: 3;
    border-radius: var(--radius-xl);
}

.video-container:hover::before {
    left: 100%;
    transition: left 0.8s ease-in-out;
}
    /* Предзаказ и выгода */
    .preorder-benefits {
        background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
        color: white;
        border-radius: var(--radius-xl);
        padding: 4rem;
        text-align: center;
        margin: 4rem 0;
    }

    .benefits-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        gap: 2rem;
        margin: 3rem 0;
    }

    .benefit-card {
        background: rgba(255, 255, 255, 0.1);
        padding: 2rem;
        border-radius: var(--radius-lg);
        backdrop-filter: blur(10px);
    }

    .benefit-number {
        font-size: 3rem;
        font-weight: 800;
        margin-bottom: 1rem;
    }

    /* FAQ */
    .faq-container {
        max-width: 800px;
        margin: 0 auto;
    }

    .faq-item {
        background: var(--background-elevated);
        border-radius: var(--radius-lg);
        margin-bottom: 1rem;
        overflow: hidden;
        border: 1px solid var(--gray-2);
        transition: var(--transition);
    }

    .faq-item:hover {
        border-color: var(--primary);
    }

    .faq-question {
        padding: 1.5rem;
        cursor: pointer;
        display: flex;
        justify-content: space-between;
        align-items: center;
        font-weight: 600;
        color: var(--text-primary);
        transition: var(--transition);
        background: var(--background-elevated);
    }

    .faq-question:hover {
        background: var(--primary-light);
    }

    .faq-answer {
        padding: 0 1.5rem;
        color: var(--text-secondary);
        line-height: 1.6;
        max-height: 0;
        overflow: hidden;
        transition: all 0.3s ease;
    }

    .faq-item.active .faq-answer {
        padding: 0 1.5rem 1.5rem;
        max-height: 500px;
    }

    .faq-toggle {
        transition: var(--transition);
        color: var(--primary);
    }

    .faq-item.active .faq-toggle {
        transform: rotate(180deg);
    }

    /* Табы FAQ */
    .faq-tabs {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        gap: 1rem;
        margin-bottom: 3rem;
        padding: 0 1rem;
    }

    .faq-tab {
        padding: 0.75rem 1.5rem;
        border: 2px solid var(--primary);
        background: transparent;
        color: var(--primary);
        border-radius: 25px;
        font-weight: 600;
        cursor: pointer;
        transition: var(--transition);
        white-space: nowrap;
    }

    .faq-tab:hover {
        background: var(--primary-light);
        transform: translateY(-2px);
    }

    .faq-tab.active {
        background: var(--primary);
        color: white;
    }

    /* Дорожная карта */
    .roadmap {
        position: relative;
        max-width: 800px;
        margin: 0 auto;
        padding-left: 30px;
    }

    .roadmap::before {
        content: '';
        position: absolute;
        left: 15px;
        top: 0;
        bottom: 0;
        width: 2px;
        background: var(--primary);
    }

    .roadmap-item {
        position: relative;
        margin-bottom: 3rem;
        padding-left: 60px;
    }

    .roadmap-date {
        position: absolute;
        left: 0;
        top: 0;
        width: 50px;
        height: 50px;
        background: var(--primary);
        color: white;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 700;
        font-size: 0.875rem;
        z-index: 2;
    }

    .roadmap-content {
        background: var(--background-elevated);
        padding: 1.5rem;
        border-radius: var(--radius-lg);
        border-left: 4px solid var(--primary);
        box-shadow: var(--shadow);
    }

    .roadmap-content h4 {
        margin-bottom: 0.5rem;
        color: var(--text-primary);
        font-size: 1.25rem;
        line-height: 1.3;
        font-weight: 600;
    }

    .roadmap-content p {
        color: var(--text-secondary);
        margin: 0;
        line-height: 1.6;
    }

    /* Метрики */
    .metrics-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
        gap: 2rem;
        margin: 3rem 0;
    }

    .metric-card {
        text-align: center;
        padding: 2rem;
        background: var(--background-elevated);
        border-radius: var(--radius-lg);
        border: 1px solid var(--gray-2);
        transition: var(--transition);
    }

    .metric-card:hover {
        transform: translateY(-5px);
        box-shadow: var(--shadow-lg);
        border-color: var(--primary);
    }

    .metric-value {
        font-size: 2.5rem;
        font-weight: 800;
        color: var(--primary);
        margin-bottom: 0.5rem;
        line-height: 1;
    }

    .metric-label {
        color: var(--text-secondary);
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        font-size: 0.875rem;
    }

    /* FAQ с колонками */
    .faq-columns {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
        gap: 2rem;
        max-width: 1200px;
        margin: 0 auto;
    }

    .faq-column {
        display: flex;
        flex-direction: column;
        gap: 1rem;
    }

    /* Поиск по FAQ */
    .faq-search {
        max-width: 500px;
        margin: 0 auto 3rem;
    }

    .search-container {
        position: relative;
    }

    .search-container i {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: var(--text-tertiary);
    }

    .search-input {
        width: 100%;
        padding: 1rem 1rem 1rem 3rem;
        border: 2px solid var(--gray-2);
        border-radius: var(--radius);
        font-size: 1rem;
        transition: var(--transition);
        background: var(--background);
        color: var(--text-primary);
    }

    .search-input:focus {
        outline: none;
        border-color: var(--primary);
        box-shadow: 0 0 0 3px var(--primary-light);
    }

    .search-input::placeholder {
        color: var(--text-tertiary);
    }

    /* Магазин кормов */
    .food-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
        gap: 2rem;
    }

    .food-card {
        background: var(--background-elevated);
        border-radius: var(--radius-lg);
        overflow: hidden;
        box-shadow: var(--shadow);
        transition: var(--transition);
    }

    .food-card:hover {
        transform: translateY(-5px);
        box-shadow: var(--shadow-lg);
    }

    .food-image {
        width: 100%;
        object-fit: cover;
    }

    .food-content {
        padding: 1.5rem;
    }

    .food-price {
        font-size: 1.5rem;
        font-weight: 700;
        color: var(--primary);
        margin: 0.5rem 0;
    }

    /* Дополнительные характеристики */
    .additional-specs {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
        gap: 2rem;
        background: var(--background-secondary);
        border-radius: var(--radius-xl);
        padding: 3rem;
        margin-top: 3rem;
    }

    .specs-feature {
        display: flex;
        align-items: flex-start;
        gap: 1.5rem;
    }

    .feature-icon {
        width: 60px;
        height: 60px;
        background: var(--primary);
        border-radius: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: white;
        font-size: 1.5rem;
        flex-shrink: 0;
    }

    .feature-content h3 {
        margin-bottom: 0.75rem;
        color: var(--text-primary);
        font-size: 1.25rem;
        line-height: 1.3;
        font-weight: 600;
    }

    .feature-content p {
        color: var(--text-secondary);
        line-height: 1.6;
        margin: 0;
    }

    /* Форма заказа */
.order-form {
    background: var(--background-elevated);
    border-radius: var(--radius-xl);
    padding: 3rem;
    box-shadow: var(--shadow-xl);
    height: fit-content;
}

    .form-group {
        margin-bottom: 1.5rem;
    }

    .form-label {
        display: block;
        margin-bottom: 0.5rem;
        font-weight: 600;
        color: var(--text-primary);
    }

    .form-input {
        width: 100%;
        padding: 12px 16px;
        border: 2px solid var(--gray-2);
        border-radius: var(--radius);
        font-size: 1rem;
        transition: var(--transition);
        background: var(--background);
        color: var(--text-primary);
    }

    .form-input:focus {
        outline: none;
        border-color: var(--primary);
        box-shadow: 0 0 0 3px var(--primary-light);
    }

    .price-section {
        background: var(--primary-light);
        padding: 1.5rem;
        border-radius: var(--radius);
        margin: 2rem 0;
        text-align: center;
    }

    /* Предзаказ контейнер */
.preorder-container {
    display: grid;
    grid-template-columns: 1fr 350px;
    gap: 3rem;
    align-items: start;
    width: 100%;
}

    /* Промо сайдбар */
.promo-sidebar {
    background: var(--background-elevated);
    border-radius: var(--radius-xl);
    padding: 2rem;
    box-shadow: var(--shadow-lg);
    position: sticky;
    top: 100px;
    height: fit-content;
}

    .original-price {
        font-size: 1.5rem;
        color: var(--text-secondary);
        text-decoration: line-through;
        margin-bottom: 0.5rem;
    }

    .final-price {
        font-size: 2.5rem;
        font-weight: 800;
        color: var(--primary);
    }

    .discount-badge {
        background: var(--accent);
        color: white;
        padding: 4px 12px;
        border-radius: 20px;
        font-size: 0.875rem;
        font-weight: 600;
        display: inline-block;
        margin-left: 1rem;
    }

    /* Промо описание */
    .promo-description {
        margin-bottom: 2rem;
    }

    .promo-description h4 {
        color: var(--text-primary);
        margin-bottom: 1rem;
        font-size: 1.125rem;
        line-height: 1.3;
        font-weight: 600;
    }

    .promo-description p {
        color: var(--text-secondary);
        margin-bottom: 1rem;
        line-height: 1.6;
    }

    .final-price-sm {
        display: flex;
        align-items: center;
        gap: 1rem;
        margin-top: 1rem;
    }

    .original-price-sm {
        color: var(--text-tertiary);
        text-decoration: line-through;
        font-size: 0.9rem;
    }

    .discounted-price {
        color: var(--primary);
        font-weight: 700;
        font-size: 1.1rem;
    }

    /* Промо предупреждение */
    .promo-warning {
        display: flex;
        align-items: flex-start;
        gap: 1rem;
        background: var(--primary-light);
        border-radius: var(--radius);
        padding: 1.5rem;
        margin-bottom: 2rem;
    }

    .promo-warning i {
        color: var(--accent);
        font-size: 1.25rem;
        margin-top: 0.25rem;
    }

    .promo-warning h4 {
        color: var(--text-primary);
        margin-bottom: 0.5rem;
        font-size: 1rem;
        line-height: 1.3;
        font-weight: 600;
    }

    .promo-warning p {
        color: var(--text-secondary);
        margin: 0;
        font-size: 0.9rem;
        line-height: 1.5;
    }

    /* Маркетплейсы */
    .marketplaces-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
        gap: 2rem;
        margin-bottom: 3rem;
    }

    .marketplace-card {
        background: var(--background-elevated);
        border-radius: var(--radius-lg);
        padding: 2rem;
        text-align: center;
        border: 1px solid var(--gray-2);
        transition: var(--transition);
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .marketplace-card:hover {
        transform: translateY(-5px);
        box-shadow: var(--shadow-lg);
        border-color: var(--primary);
    }

    .marketplace-icon {
        width: 80px;
        height: 80px;
        background: var(--primary-light);
        border-radius: 20px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 1.5rem;
        font-size: 2.5rem;
        color: var(--primary);
    }

    .marketplace-card h3 {
        margin-bottom: 1rem;
        color: var(--text-primary);
        font-size: 1.5rem;
        line-height: 1.3;
        font-weight: 600;
    }

    .promo-code {
        background: var(--primary);
        color: white;
        padding: 0.75rem 1.5rem;
        border-radius: 25px;
        font-weight: 700;
        font-size: 1.1rem;
        margin-bottom: 1rem;
        letter-spacing: 0.05em;
    }

    .marketplace-desc {
        color: var(--text-secondary);
        margin-bottom: 1.5rem;
        flex-grow: 1;
    }

    /* Наша продукция */
    .products-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
        gap: 2rem;
        margin-bottom: 4rem;
    }

    .product-card {
        background: var(--background-elevated);
        border-radius: var(--radius-xl);
        overflow: hidden;
        box-shadow: var(--shadow);
        transition: var(--transition);
        position: relative;
    }

    .product-card:hover {
        transform: translateY(-8px);
        box-shadow: var(--shadow-xl);
    }

    .product-badge {
        position: absolute;
        top: 1rem;
        left: 1rem;
        background: var(--primary);
        color: white;
        padding: 0.5rem 1rem;
        border-radius: 20px;
        font-size: 0.8rem;
        font-weight: 700;
        z-index: 2;
    }

    .product-badge.coming-soon {
        background: var(--accent);
    }

    .product-badge.new {
        background: #8A2BE2;
    }

     .product-image {
        /* height: 200px; */
        overflow: hidden;
    }

    .product-img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: var(--transition);
    }

    .product-card:hover .product-img {
        transform: scale(1.05);
    }

    .product-content {
        padding: 1.5rem;
    }

    .product-content h3 {
        margin-bottom: 0.75rem;
        color: var(--text-primary);
        font-size: 1.5rem;
        line-height: 1.3;
        font-weight: 600;
    }

    .product-desc {
        color: var(--text-secondary);
        margin-bottom: 1.5rem;
        line-height: 1.5;
    }

    .product-features {
        margin-bottom: 1.5rem;
    }

    .feature {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin-bottom: 0.5rem;
        color: var(--text-secondary);
    }

    .feature i {
        color: var(--primary);
        font-size: 0.8rem;
    }

    .product-price {
        display: flex;
        align-items: center;
        gap: 1rem;
        margin-bottom: 1.5rem;
    }

    .current-price {
        font-size: 1.5rem;
        font-weight: 800;
        color: var(--primary);
    }

    .old-price {
        font-size: 1rem;
        color: var(--text-tertiary);
        text-decoration: line-through;
    }

    /* CTA продукции */
    .products-cta {
        background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
        border-radius: var(--radius-xl);
        padding: 3rem;
        text-align: center;
        color: white;
    }

    .cta-content h3 {
        color: white;
        margin-bottom: 1rem;
        font-size: 1.75rem;
        line-height: 1.3;
        font-weight: 600;
    }

    .cta-content p {
        color: rgba(255, 255, 255, 0.9);
        margin-bottom: 2rem;
        font-size: 1.125rem;
    }

    .products-cta .btn {
        background: white;
        color: var(--primary);
    }

    .products-cta .btn:hover {
        background: var(--gray-1);
        transform: translateY(-2px);
    }

    /* Примечание маркетплейсов */
    .marketplace-note {
        display: flex;
        align-items: flex-start;
        gap: 1.5rem;
        background: var(--primary-light);
        border-radius: var(--radius-lg);
        padding: 2rem;
        max-width: 800px;
        margin: 0 auto;
    }

    .note-icon {
        color: var(--primary);
        font-size: 1.5rem;
        margin-top: 0.25rem;
    }

    .note-content h4 {
        color: var(--text-primary);
        margin-bottom: 0.75rem;
        font-size: 1.125rem;
        line-height: 1.3;
        font-weight: 600;
    }

    .note-content p {
        color: var(--text-secondary);
        margin: 0;
        line-height: 1.6;
    }

    /* Футер */
    footer {
        background: var(--background-secondary);
        padding: 80px 0 40px;
        border-top: 1px solid var(--gray-2);
    }

    .footer-content {
        display: grid;
        grid-template-columns: 2fr 1fr 1fr 1fr;
        gap: 3rem;
        margin-bottom: 3rem;
    }

    .footer-brand h3 {
        margin-bottom: 1rem;
        font-size: 1.5rem;
        line-height: 1.3;
        font-weight: 600;
    }

    .footer-brand p {
        color: var(--text-tertiary);
        margin-bottom: 1.5rem;
    }

    .social-links {
        display: flex;
        gap: 1rem;
    }

    .social-links a {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        background: var(--background-elevated);
        border-radius: 8px;
        color: var(--text-secondary);
        text-decoration: none;
        transition: var(--transition);
    }

    .social-links a:hover {
        background: var(--primary);
        color: white;
        transform: translateY(-2px);
    }

    .footer-section h4 {
        margin-bottom: 1.5rem;
        font-size: 1.125rem;
        line-height: 1.3;
        font-weight: 600;
    }

    .footer-section ul {
        list-style: none;
    }

    .footer-section ul li {
        margin-bottom: 0.75rem;
    }

    .footer-section ul li a {
        color: var(--text-tertiary);
        text-decoration: none;
        transition: var(--transition);
    }

    .footer-section ul li a:hover {
        color: var(--primary);
    }

    .footer-bottom {
        text-align: center;
        padding-top: 2rem;
        border-top: 1px solid var(--gray-2);
        color: var(--text-tertiary);
    }

    /* Хлебные крошки */
    /*.breadcrumbs {  */
    /*    padding: 1rem 0;  */
    /*    font-size: 0.9rem;  */
    /*    color: var(--text-tertiary);  */
    /*    margin-bottom: 2rem;  */
    /*    position: absolute;  */
    /*    top: 120px;  */
    /*    left: 0;  */
    /*    width: 100%;  */
    /*    z-index: 10;  */
   /* }  */

    .breadcrumbs .container {
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

    .breadcrumbs a {
        color: var(--text-secondary);
        text-decoration: none;
        transition: var(--transition);
    }

    .breadcrumbs a:hover {
        color: var(--primary);
    }

    .breadcrumbs span {
        margin: 0 0.25rem;
        color: var(--text-tertiary);
    }

    .breadcrumbs .current {
        color: var(--text-primary);
        font-weight: 500;
    }

    /* Анимации */
    @keyframes float {
        0%, 100% { transform: translateY(0px); }
        50% { transform: translateY(-10px); }
    }

    .fade-in {
        opacity: 0;
        transform: translateY(30px);
        transition: all 0.6s ease;
    }

    .fade-in.visible {
        opacity: 1;
        transform: translateY(0);
    }

    /* Адаптивность */
    @media (max-width: 1024px) {
    .hero-content {
        grid-template-columns: 1fr;
        gap: 3rem;
        text-align: center;
    }
    
	    .preorder-container {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    .promo-sidebar {
        position: static;
        order: 2;
    }
    
    .order-form {
        order: 1;
    }
	
    .footer-content {
        grid-template-columns: 1fr 1fr;
        gap: 2rem;
    }
    
    .nav-menu {
        display: none;
    }
    
    .burger-menu {
        display: flex;
    }
    
    .features-grid {
        grid-template-columns: 1fr;
    }
    
    .hero-actions {
        justify-content: center;
    }
    
    .preorder-benefits {
        padding: 2rem;
    }
    
    .benefits-grid {
        grid-template-columns: 1fr;
    }
    
    .footer-content {
        grid-template-columns: 1fr;
    }
    
    /* === СКРЫВАЕМ ВСЕ КНОПКИ КРОМЕ БУРГЕРА === */
    .nav-controls .login-btn,
    .nav-controls .lang-selector,
    .nav-controls .nav-btn:has(.fa-globe),
    .nav-controls .nav-btn:has(.fa-moon),
    .nav-controls .nav-btn:has(.fa-sun),
    .nav-controls .nav-btn:has(.fa-shopping-cart),
    .nav-controls .btn-primary.nav-btn-large {
        display: none !important;
    }
    
    .nav-controls .burger-menu {
        display: flex !important;
    }
    /* === КОНЕЦ СКРЫТИЯ КНОПОК === */
    
    .login-btn span {
        display: none;
    }
    
    .login-btn {
        padding: 8px;
    }
    
    .ps-grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    .ps-card {
        padding: 2rem;
    }
    
    .tech-stack {
        grid-template-columns: 1fr;
    }
    
    .advantages-grid {
        grid-template-columns: 1fr;
    }
    
    .video-placeholder {
        height: 300px;
    }
    
    .video-play-btn {
        width: 60px;
        height: 60px;
        font-size: 1.5rem;
    }
    
    .faq-tabs {
        gap: 0.5rem;
    }
    
    .faq-tab {
        padding: 0.6rem 1.2rem;
        font-size: 0.9rem;
    }
    
    .faq-columns {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .faq-question {
        padding: 1.25rem;
        font-size: 1rem;
    }
    
    .faq-answer {
        padding: 0 1.25rem;
    }
    
    .faq-item.active .faq-answer {
        padding: 0 1.25rem 1.25rem;
    }
    
    .specs-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .spec-card {
        padding: 1.5rem;
    }
    
    .additional-specs {
        grid-template-columns: 1fr;
        padding: 2rem;
        gap: 1.5rem;
    }
    
    .specs-feature {
        flex-direction: column;
        text-align: center;
        gap: 1rem;
    }
    
    .products-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    
    .product-content {
        padding: 1.25rem;
    }
    
    .products-cta {
        padding: 2rem;
    }
    
    .marketplaces-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    
    .marketplace-card {
        padding: 1.5rem;
    }
    
    .marketplace-note {
        flex-direction: column;
        text-align: center;
        gap: 1rem;
        padding: 1.5rem;
    }

    .breadcrumbs {
        position: static;
        margin-bottom: 1rem;
    }

    .hero {
        padding: 140px 0 60px;
    }
}

    @media (max-width: 480px) {
        .container {
            padding: 0 16px;
        }
        
        h1 {
            font-size: 2rem;
        }
        
        .section-header h2 {
            font-size: 2rem;
        }
        
        .section-subtitle {
            font-size: 1.125rem;
        }
        
        .section {
            padding: 60px 0;
        }
        
        .order-form {
            padding: 1.5rem;
        }
        
        .price-section {
            padding: 1rem;
        }
        
        .final-price {
            font-size: 2rem;
        }
        
        .ps-card {
            padding: 1.5rem;
        }
        
        .tech-item {
            padding: 1.5rem;
        }
        
        .advantage-card {
            padding: 1.5rem;
        }
        
        .faq-tabs {
            flex-direction: column;
            align-items: center;
        }
        
        .faq-tab {
            width: 100%;
            max-width: 200px;
            text-align: center;
        }
        
        .faq-question {
            padding: 1rem;
        }
        
        .faq-answer {
            padding: 0 1rem;
        }
        
        .faq-item.active .faq-answer {
            padding: 0 1rem 1rem;
        }
        
        .faq-search {
            margin-bottom: 2rem;
        }
        
        .search-input {
            padding: 0.875rem 0.875rem 0.875rem 2.5rem;
        }
        
        .spec-card {
            padding: 1.25rem;
        }
        
        .spec-list li {
            flex-direction: column;
            align-items: flex-start;
            gap: 0.25rem;
        }
        
        .spec-value {
            text-align: left;
        }
        
        .additional-specs {
            padding: 1.5rem;
        }
        
        .promo-sidebar {
            padding: 1.5rem;
        }
        
        .timer-number {
            font-size: 1.5rem;
        }
        
        .timer-separator {
            font-size: 1.25rem;
        }
        
        .timer-block {
            min-width: 50px;
            padding: 0.5rem;
        }
    }
	
	    /* Стили для секции отзывов */
    .reviews-filters {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 2rem;
        flex-wrap: wrap;
        gap: 1rem;
        padding: 1.5rem;
        background: var(--background-elevated);
        border-radius: var(--radius-lg);
        border: 1px solid var(--gray-2);
    }
    
    
    .filter-group {
        display: flex;
        gap: 0.5rem;
        flex-wrap: wrap;
    }

    .filter-btn {
        padding: 0.5rem 1rem;
        border: 2px solid var(--gray-3);
        background: var(--background);
        color: var(--text-secondary);
        border-radius: 20px;
        cursor: pointer;
        transition: var(--transition);
        font-size: 0.9rem;
        font-weight: 500;
    }

    .filter-btn:hover {
        border-color: var(--primary);
        color: var(--primary);
    }

    .filter-btn.active {
        background: var(--primary);
        border-color: var(--primary);
        color: white;
    }

    .reviews-container {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
        gap: 1.5rem;
        margin-bottom: 2rem;
    }

    .review-card {
        background: var(--background-elevated);
        border-radius: var(--radius-lg);
        padding: 1.5rem;
        border: 1px solid var(--gray-2);
        transition: var(--transition);
        position: relative;
    }

    .review-card:hover {
        transform: translateY(-5px);
        box-shadow: var(--shadow-lg);
        border-color: var(--primary);
    }

    .review-header {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        margin-bottom: 1rem;
		gap: 1rem;
    }

    .reviewer-info {
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

    .reviewer-avatar {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        background: var(--primary-light);
        display: flex;
        align-items: center;
        justify-content: center;
        color: var(--primary);
        font-weight: 600;
        font-size: 1rem;
    }

    .reviewer-details h4 {
        margin: 0 0 0.25rem 0;
        color: var(--text-primary);
        font-size: 1rem;
    }

    .review-date {
        color: var(--text-tertiary);
        font-size: 0.8rem;
    }

    .review-rating {
        display: flex;
        gap: 0.25rem;
		margin-top: 1.5rem;
		flex-shrink: 0;
    }

    .star {
        color: var(--gray-3);
        font-size: 0.9rem;
    }

    .star.filled {
        color: #FFD700;
    }

    .review-source {
        position: absolute;
        top: 1rem;
        right: 1rem;
        background: var(--primary-light);
        color: var(--primary);
        padding: 0.25rem 0.75rem;
        border-radius: 12px;
        font-size: 0.75rem;
        font-weight: 600;
    }

    .review-content {
        margin-bottom: 1rem;
    }

    .review-text {
        color: var(--text-secondary);
        line-height: 1.5;
        margin-bottom: 0.75rem;
    }

    .review-images {
        display: flex;
        gap: 0.5rem;
        margin-top: 0.75rem;
    }

    .review-image {
        width: 60px;
        height: 60px;
        border-radius: var(--radius);
        object-fit: cover;
        cursor: pointer;
        transition: var(--transition);
    }

    .review-image:hover {
        transform: scale(1.1);
    }

    .review-footer {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding-top: 1rem;
        border-top: 1px solid var(--gray-2);
        font-size: 0.8rem;
        color: var(--text-tertiary);
    }

    .review-helpful {
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

    .helpful-btn {
        background: none;
        border: none;
        color: var(--text-tertiary);
        cursor: pointer;
        padding: 0.25rem 0.5rem;
        border-radius: 4px;
        transition: var(--transition);
        display: flex;
        align-items: center;
        gap: 0.25rem;
    }

    .helpful-btn:hover {
        background: var(--primary-light);
        color: var(--primary);
    }

    /* Пагинация */
    .pagination {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        margin-top: 2rem;
    }

    .page-btn {
        width: 40px;
        height: 40px;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 1px solid var(--gray-3);
        background: var(--background);
        color: var(--text-secondary);
        border-radius: var(--radius);
        cursor: pointer;
        transition: var(--transition);
        font-weight: 500;
    }

    .page-btn:hover {
        border-color: var(--primary);
        color: var(--primary);
    }

    .page-btn.active {
        background: var(--primary);
        border-color: var(--primary);
        color: white;
    }

    .page-btn.disabled {
        opacity: 0.5;
        cursor: not-allowed;
    }

    .page-btn.disabled:hover {
        border-color: var(--gray-3);
        color: var(--text-secondary);
    }

    /* Адаптивность */
    @media (max-width: 768px) {
        .reviews-filters {
            flex-direction: column;
            align-items: stretch;
        }

        .filter-group {
            justify-content: center;
        }

        .reviews-container {
            grid-template-columns: 1fr;
        }

        .review-header {
            flex-direction: column;
            gap: 0.75rem;
        }

        .review-source {
            position: static;
            align-self: flex-start;
        }
        
    }

    @media (max-width: 480px) {
        .filter-btn {
            padding: 0.4rem 0.8rem;
            font-size: 0.8rem;
        }

        .review-card {
            padding: 1rem;
        }

        .review-images {
            flex-wrap: wrap;
        }

        .pagination {
            flex-wrap: wrap;
        }
    }
	    /* ===== РАСШИРЕННОЕ КУКИ УВЕДОМЛЕНИЕ ===== */
    .cookie-notice {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        background: var(--background-elevated);
        border-radius: var(--radius-lg) var(--radius-lg) 0 0;
        padding: 1.25rem;
        box-shadow: var(--shadow-xl);
        z-index: 1000;
        transform: translateY(100%);
        opacity: 0;
        transition: var(--transition-slow);
        border: 1px solid var(--gray-2);
        border-bottom: none;
    }

    .cookie-notice.show {
        transform: translateY(0);
        opacity: 1;
    }

    .cookie-header {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        margin-bottom: 1rem;
    }

    .cookie-title {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        color: var(--text-primary);
        font-size: 1.1rem;
        font-weight: 600;
        margin: 0;
        flex: 1;
    }

    .cookie-close {
        background: none;
        border: none;
        color: var(--text-tertiary);
        cursor: pointer;
        padding: 0.5rem;
        border-radius: 6px;
        transition: var(--transition);
        flex-shrink: 0;
        margin-left: 0.5rem;
    }

    .cookie-close:hover {
        color: var(--text-primary);
        background: var(--gray-2);
    }

    .cookie-description {
        color: var(--text-secondary);
        margin-bottom: 1.25rem;
        line-height: 1.4;
        font-size: 0.85rem;
    }

    .cookie-settings {
        margin-bottom: 1.25rem;
        border: 1px solid var(--gray-2);
        border-radius: var(--radius);
        overflow: hidden;
    }

    .cookie-setting {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        padding: 0.875rem;
        border-bottom: 1px solid var(--gray-2);
        transition: var(--transition);
        gap: 0.75rem;
    }

    .cookie-setting:last-child {
        border-bottom: none;
    }

    .cookie-setting:hover {
        background: var(--primary-light);
    }

    .setting-info {
        flex: 1;
        min-width: 0;
    }

    .setting-title {
        font-weight: 600;
        color: var(--text-primary);
        margin-bottom: 0.25rem;
        font-size: 0.9rem;
        line-height: 1.3;
    }

    .setting-description {
        color: var(--text-tertiary);
        font-size: 0.75rem;
        line-height: 1.3;
    }

    /* Стили для переключателей */
    .cookie-toggle {
        position: relative;
        display: inline-block;
        width: 44px;
        height: 24px;
        flex-shrink: 0;
        margin-top: 0.125rem;
    }

    .cookie-toggle input {
        opacity: 0;
        width: 0;
        height: 0;
    }

    .toggle-slider {
        position: absolute;
        cursor: pointer;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: var(--gray-3);
        transition: var(--transition);
        border-radius: 24px;
    }

    .toggle-slider:before {
        position: absolute;
        content: "";
        height: 18px;
        width: 18px;
        left: 3px;
        bottom: 3px;
        background-color: white;
        transition: var(--transition);
        border-radius: 50%;
    }

    .cookie-toggle input:checked + .toggle-slider {
        background-color: var(--primary);
    }

    .cookie-toggle input:checked + .toggle-slider:before {
        transform: translateX(20px);
    }

    .cookie-toggle input:disabled + .toggle-slider {
        background-color: var(--gray-2);
        cursor: not-allowed;
    }

    .cookie-toggle input:disabled + .toggle-slider:before {
        background-color: var(--gray-3);
    }

    .cookie-buttons {
        display: flex;
        gap: 0.75rem;
        flex-wrap: wrap;
    }

    .cookie-buttons .btn {
        flex: 1;
        min-width: 120px;
        font-size: 0.85rem;
        padding: 0.75rem 1rem;
    }

    .btn-cookie-settings {
        background: transparent;
        color: var(--text-secondary);
        border: 1px solid var(--gray-3);
        font-size: 0.8rem;
        padding: 0.5rem 0.75rem;
    }

    .btn-cookie-settings:hover {
        background: var(--gray-1);
        color: var(--text-primary);
    }

    /* Расширенные настройки */
    .cookie-advanced {
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.3s ease;
    }

    .cookie-advanced.show {
        max-height: none;
    }

    .privacy-link {
        color: var(--primary);
        text-decoration: none;
        font-size: 0.8rem;
        transition: var(--transition);
        display: inline-flex;
        align-items: center;
        gap: 0.25rem;
    }

    .privacy-link:hover {
        text-decoration: underline;
    }

    .cookie-footer {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 1rem;
        flex-wrap: wrap;
        gap: 0.5rem;
        font-size: 0.8rem;
    }

    /* Адаптивность для куки */
    @media (max-width: 768px) {
        .cookie-notice {
            padding: 1rem;
            border-radius: 0;
        }
        
        .cookie-header {
            margin-bottom: 0.75rem;
        }
        
        .cookie-title {
            font-size: 1rem;
        }
        
        .cookie-description {
            font-size: 0.8rem;
            margin-bottom: 1rem;
        }
        
        .cookie-buttons {
            flex-direction: column;
            gap: 0.5rem;
        }
        
        .cookie-buttons .btn {
            min-width: auto;
            width: 100%;
        }
        
        .cookie-setting {
            flex-direction: column;
            align-items: flex-start;
            gap: 0.5rem;
            padding: 0.75rem;
        }
        
        .setting-info {
            margin-right: 0;
            width: 100%;
        }
        
        .cookie-toggle {
            align-self: flex-end;
        }
        
        .cookie-footer {
            flex-direction: column;
            align-items: flex-start;
            gap: 0.75rem;
        }
    }

    @media (max-width: 480px) {
        .cookie-notice {
            padding: 0.875rem;
        }
        
        .cookie-title {
            font-size: 0.95rem;
        }
        
        .cookie-description {
            font-size: 0.75rem;
        }
        
        .setting-title {
            font-size: 0.85rem;
        }
        
        .setting-description {
            font-size: 0.7rem;
        }
        
        .cookie-buttons .btn {
            font-size: 0.8rem;
            padding: 0.625rem 0.875rem;
        }
    }
	.logo-light {
    display: block;
    height: 32px;
    width: auto;
}

.logo-dark {
    display: none;
    height: 32px;
    width: auto;
}

[data-theme="dark"] .logo-light {
    display: none;
}

[data-theme="dark"] .logo-dark {
    display: block;
}
.footer-logo {
    margin-bottom: 1rem;
}
.footer-logo img {
    height: 40px;
    width: auto;
}

.footer-logo .logo-light {
    display: block;
}

.footer-logo .logo-dark {
    display: none;
}

[data-theme="dark"] .footer-logo .logo-light {
    display: none;
}

[data-theme="dark"] .footer-logo .logo-dark {
    display: block;
}

/* Логотипы для разных языков - скрываем все по умолчанию */
.logo-ru, .logo-en {
    height: 32px;
    width: auto;
    display: none !important;
}

/* Показываем только активные логотипы для текущего языка */
.logo-ru.active, .logo-en.active {
    display: block !important;
}

/* Управление светлыми/темными версиями */
.logo-ru-light.active,
.logo-en-light.active {
    display: block !important;
}

.logo-ru-dark.active,
.logo-en-dark.active {
    display: none !important;
}

/* Темная тема - переключаем на темные версии */
[data-theme="dark"] .logo-ru-light.active,
[data-theme="dark"] .logo-en-light.active {
    display: none !important;
}

[data-theme="dark"] .logo-ru-dark.active,
[data-theme="dark"] .logo-en-dark.active {
    display: block !important;
}

/* Футер логотипы */
.footer-logo-ru, .footer-logo-en {
    height: 40px;
    width: auto;
    display: none !important;
}

.footer-logo-ru.active, .footer-logo-en.active {
    display: block !important;
}

.footer-logo-ru-light.active,
.footer-logo-en-light.active {
    display: block !important;
}

.footer-logo-ru-dark.active,
.footer-logo-en-dark.active {
    display: none !important;
}

[data-theme="dark"] .footer-logo-ru-light.active,
[data-theme="dark"] .footer-logo-en-light.active {
    display: none !important;
}

[data-theme="dark"] .footer-logo-ru-dark.active,
[data-theme="dark"] .footer-logo-en-dark.active {
    display: block !important;
}

/* Плавные переходы для навигации */
.nav-menu {
    transition: opacity 0.3s ease;
}

.burger-menu {
    transition: all 0.3s ease;
}

.mobile-menu {
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Предотвращение ряби при ресайзе */
#main-header {
    will-change: transform;
    contain: layout style;
}

.nav-container {
    will-change: transform;
}

/* Стили для корзины */
.cart-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: none;
    justify-content: flex-end;
    z-index: 2000;
}

.cart-modal.active {
    display: flex;
}

.cart-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.cart-content {
    position: relative;
    width: 400px;
    max-width: 90vw;
    height: 100%;
    background: var(--background);
    box-shadow: -5px 0 30px rgba(0, 0, 0, 0.3);
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform 0.3s ease;
}

.cart-modal.active .cart-content {
    transform: translateX(0);
}

.cart-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem;
    border-bottom: 1px solid var(--gray-2);
}

.cart-header h3 {
    margin: 0;
    font-size: 1.5rem;
}

.cart-close {
    background: none;
    border: none;
    font-size: 1.25rem;
    color: var(--text-secondary);
    cursor: pointer;
    padding: 0.5rem;
    border-radius: 6px;
    transition: var(--transition);
}

.cart-close:hover {
    background: var(--primary-light);
    color: var(--primary);
}

.cart-body {
    flex: 1;
    padding: 1rem;
    overflow-y: auto;
}

.cart-empty {
    text-align: center;
    padding: 3rem 1rem;
    color: var(--text-tertiary);
}

.cart-empty i {
    font-size: 3rem;
    margin-bottom: 1rem;
    opacity: 0.5;
}

.cart-item {
    display: flex;
    align-items: center;
    padding: 1rem;
    border: 1px solid var(--gray-2);
    border-radius: var(--radius);
    margin-bottom: 1rem;
    background: var(--background-elevated);
}

.cart-item-image {
    width: 60px;
    height: 60px;
    border-radius: var(--radius);
    object-fit: cover;
    margin-right: 1rem;
}

.cart-item-info {
    flex: 1;
}

.cart-item-name {
    font-weight: 600;
    margin-bottom: 0.25rem;
}

.cart-item-price {
    color: var(--primary);
    font-weight: 700;
}

.cart-item-controls {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

.quantity-btn {
    width: 30px;
    height: 30px;
    border: 1px solid var(--gray-3);
    background: var(--background);
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition);
}

.quantity-btn:hover {
    background: var(--primary-light);
    border-color: var(--primary);
}

.quantity-input {
    width: 40px;
    text-align: center;
    border: 1px solid var(--gray-3);
    border-radius: 4px;
    padding: 0.25rem;
}

.remove-btn {
    background: none;
    border: none;
    color: var(--text-tertiary);
    cursor: pointer;
    padding: 0.5rem;
    border-radius: 4px;
    transition: var(--transition);
}

.remove-btn:hover {
    color: #ff4444;
    background: rgba(255, 68, 68, 0.1);
}

.cart-footer {
    padding: 1.5rem;
    border-top: 1px solid var(--gray-2);
    background: var(--background-elevated);
}

.cart-total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    font-size: 1.25rem;
    font-weight: 700;
}

.total-price {
    color: var(--primary);
}

@media (max-width: 480px) {
    .cart-content {
        width: 100%;
        max-width: 100vw;
    }
}

/* Боковая панель входа */
.sidebar-login {
    position: fixed;
    top: 0;
    right: -450px;
    width: 450px;
    max-width: 100vw;
    height: 100%;
    z-index: 2000;
    transition: right 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.sidebar-login.active {
    right: 0;
}

.sidebar-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    z-index: 1999;
}

.sidebar-login.active .sidebar-overlay {
    opacity: 1;
    visibility: visible;
}

.sidebar-content {
    position: relative;
    width: 100%;
    height: 100%;
    background: var(--background);
    box-shadow: -5px 0 50px rgba(0, 0, 0, 0.2);
    display: flex;
    flex-direction: column;
    z-index: 2000;
    overflow-y: auto;
}

.sidebar-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.5rem;
    border-bottom: 1px solid var(--gray-2);
    background: var(--background-elevated);
    position: sticky;
    top: 0;
    z-index: 10;
}

.sidebar-logo {
    display: flex;
    align-items: center;
}

.sidebar-logo img {
    height: 32px;
    width: auto;
}

.sidebar-header h3 {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
    flex: 1;
    text-align: center;
}

.sidebar-close {
    background: none;
    border: none;
    font-size: 1.25rem;
    color: var(--text-secondary);
    cursor: pointer;
    padding: 0.5rem;
    border-radius: 8px;
    transition: var(--transition);
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sidebar-close:hover {
    background: var(--primary-light);
    color: var(--primary);
}

.sidebar-body {
    flex: 1;
    padding: 2rem;
    display: flex;
    flex-direction: column;
}

.sidebar-form {
    margin-bottom: 2rem;
}

.form-options {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 1rem 0 1.5rem 0;
    font-size: 0.9rem;
}

.checkbox-label {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    color: var(--text-secondary);
}

.forgot-password {
    color: var(--primary);
    text-decoration: none;
    transition: var(--transition);
}

.forgot-password:hover {
    text-decoration: underline;
}

.login-divider {
    text-align: center;
    margin: 2rem 0;
    position: relative;
    color: var(--text-tertiary);
    font-size: 0.9rem;
}

.login-divider::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 1px;
    background: var(--gray-2);
}

.login-divider span {
    background: var(--background);
    padding: 0 1rem;
    position: relative;
}

.social-login {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-bottom: 2rem;
}

.btn-social {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 1rem;
    border: 2px solid var(--gray-2);
    background: var(--background);
    color: var(--text-primary);
    border-radius: var(--radius);
    font-weight: 500;
    transition: var(--transition);
    width: 100%;
    font-size: 1rem;
}

.btn-social:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow);
    border-color: var(--primary);
}

.btn-google:hover {
    color: #DB4437;
    border-color: #DB4437;
}

.btn-vk:hover {
    color: #4C75A3;
    border-color: #4C75A3;
}

.btn-yandex:hover {
    color: #FF0000;
    border-color: #FF0000;
}

.sidebar-footer {
    text-align: center;
    margin-top: auto;
    padding-top: 2rem;
    border-top: 1px solid var(--gray-2);
    color: var(--text-secondary);
}

.sidebar-footer a {
    color: var(--primary);
    text-decoration: none;
    font-weight: 500;
}

.sidebar-footer a:hover {
    text-decoration: underline;
}

/* Анимация появления формы */
.sidebar-body > * {
    opacity: 0;
    transform: translateX(30px);
    animation: slideInRight 0.5s ease forwards;
}

.sidebar-body > *:nth-child(1) { animation-delay: 0.1s; }
.sidebar-body > *:nth-child(2) { animation-delay: 0.2s; }
.sidebar-body > *:nth-child(3) { animation-delay: 0.3s; }
.sidebar-body > *:nth-child(4) { animation-delay: 0.4s; }

@keyframes slideInRight {
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* Адаптивность */
@media (max-width: 480px) {
    .sidebar-login {
        width: 100vw;
        right: -100vw;
    }
    
    .sidebar-body {
        padding: 1.5rem;
    }
    
    .sidebar-header {
        padding: 1rem 1.5rem;
    }
    
    .sidebar-header h3 {
        font-size: 1.25rem;
    }
    
    .form-options {
        flex-direction: column;
        gap: 1rem;
        align-items: flex-start;
    }
    
    .social-login {
        gap: 0.5rem;
    }
    
    .btn-social {
        padding: 0.875rem;
        font-size: 0.9rem;
    }
}

/* Стили для адаптивных форм инвесторов */
.investor-forms-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
    margin-top: 4rem;
}

.investor-form-section {
    width: 100%;
}

/* Скрываем кнопки темы, глобуса и входа на мобильных */
@media (max-width: 1024px) {
    .nav-controls .login-btn,
    .nav-controls .nav-btn:has(.fa-globe),
    .nav-controls .nav-btn:has(.fa-moon),
    .nav-controls .nav-btn:has(.fa-sun) {
        display: none;
    }
    
    /* Показываем только бургер и кнопку заказа */
    .nav-controls .burger-menu {
        display: flex;
    }
    
    .nav-controls .btn-primary.nav-btn-large {
        display: inline-flex;
    }
}

/* Для планшетов можно оставить кнопку заказа */
@media (max-width: 768px) {
    .nav-controls .btn-primary.nav-btn-large span {
        display: none;
    }
    
    .nav-controls .btn-primary.nav-btn-large {
        padding: 8px;
        min-width: auto;
    }
}

/* Для очень маленьких экранов */
@media (max-width: 480px) {
    .nav-controls .btn-primary.nav-btn-large {
        display: none;
    }
    
    /* Показываем только бургер */
    .nav-controls .burger-menu {
        display: flex;
    }
}

/* Убедимся, что кнопки показываются в мобильном меню */
.mobile-controls .login-btn,
.mobile-controls .theme-toggle,
.mobile-lang-selector {
    display: flex !important;
}

/* Адаптивность для форм инвесторов */
@media (max-width: 1024px) {
    .investor-forms-container {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    .investor-form-section {
        max-width: 600px;
        margin: 0 auto;
    }
}

@media (max-width: 768px) {
    .investor-forms-container {
        gap: 1.5rem;
    }
    
    .investor-form-section {
        max-width: 100%;
    }
    
    .order-form {
        padding: 1.5rem;
    }
    
    .price-section {
        padding: 1rem;
    }
}

@media (max-width: 480px) {
    .investor-forms-container {
        gap: 1rem;
    }
    
    .order-form {
        padding: 1rem;
    }
    
    .form-group {
        margin-bottom: 1rem;
    }
    
    .form-input {
        padding: 10px 12px;
        font-size: 16px; /* Предотвращает масштабирование в iOS */
    }
    
    .btn-large {
        padding: 14px 20px;
        font-size: 1rem;
    }
}

/* Дополнительные улучшения для мобильных устройств */
@media (max-width: 768px) {
    .investor-forms-container .order-form {
        margin-bottom: 0;
    }
    
    .investor-forms-container .form-group > div {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    
    .investor-forms-container .form-group a {
        font-size: 0.85rem;
    }
}

/* Улучшения для очень маленьких экранов */
@media (max-width: 360px) {
    .investor-forms-container .order-form {
        padding: 0.75rem;
    }
    
    .price-section h3 {
        font-size: 1.1rem;
    }
    
    .price-section p {
        font-size: 0.9rem;
    }
}

/* Классы для управления видимостью */
.desktop-only {
    display: flex;
}

.mobile-only {
    display: none;
}

/* Стили для мобильного меню */
.mobile-login-btn {
    background: var(--primary-light);
    color: var(--primary);
    border: 2px solid var(--primary);
    font-weight: 600;
    justify-content: center;
    padding: 1rem;
    text-decoration: none;
    border-radius: var(--radius);
    transition: var(--transition);
}

.mobile-login-btn:hover {
    background: var(--primary);
    color: white;
}

.mobile-quick-actions {
    margin: 0.5rem 0;
}

.mobile-cart-info {
    margin: 0.5rem 0;
}

.mobile-cart-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 1rem;
    background: var(--background-elevated);
    border: 1px solid var(--gray-2);
    border-radius: var(--radius);
    color: var(--text-primary);
    cursor: pointer;
    transition: var(--transition);
}

.mobile-cart-btn:hover {
    background: var(--primary-light);
    border-color: var(--primary);
}

.cart-count-mobile {
    background: var(--accent);
    color: white;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.7rem;
    font-weight: 700;
}

/* Адаптивность */
@media (max-width: 1024px) {
    .desktop-only {
        display: none !important;
    }
    
    .mobile-only {
        display: flex;
    }
    
    .nav-controls .order-btn .order-text {
        display: inline;
    }
}

@media (max-width: 768px) {
    .nav-controls .order-btn .order-text {
        display: none;
    }
    
    .nav-controls .order-btn {
        padding: 8px 12px;
    }
}

@media (max-width: 480px) {
    .nav-controls .order-btn {
        display: none;
    }
    
    .mobile-controls {
        padding: 1rem 0.5rem;
    }
    
    .mobile-login-btn,
    .mobile-cart-btn,
    .theme-toggle,
    .mobile-lang-toggle {
        padding: 0.875rem;
        font-size: 0.9rem;
    }
}

/* Улучшения для очень маленьких экранов */
@media (max-width: 360px) {
    .mobile-controls {
        padding: 0.5rem;
    }
    
    .mobile-login-btn,
    .mobile-cart-btn,
    .theme-toggle,
    .mobile-lang-toggle {
        padding: 0.75rem;
        font-size: 0.85rem;
    }
    
    .mobile-quick-actions .btn {
        padding: 0.75rem;
        font-size: 0.85rem;
    }
}

.preorder-badge {
    background: var(--primary);
    color: white;
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 700;
    margin-bottom: 1rem;
    display: inline-block;
}

.marketplace-options {
    margin: 1rem 0;
}

.option-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
    color: var(--text-secondary);
    font-size: 0.9rem;
}

.option-item i {
    color: var(--primary);
    width: 16px;
}

.marketplace-card .btn-primary {
    background: var(--primary);
    color: white;
    border: none;
}

.marketplace-card .btn-primary:hover {
    background: var(--primary-dark);
}

.preorder-badge.coming-soon {
    background: var(--accent);
    color: white;
}

.crowdfunding-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 2rem;
    margin: 3rem 0;
}

.crowdfunding-stat {
    text-align: center;
    padding: 2rem;
    background: var(--background-elevated);
    border-radius: var(--radius-lg);
    border: 2px solid var(--primary-light);
}

.crowdfunding-stat .stat-value {
    font-size: 2.5rem;
    font-weight: 800;
    color: var(--primary);
    margin-bottom: 0.5rem;
}

.crowdfunding-stat .stat-label {
    color: var(--text-secondary);
    font-weight: 600;
}

/* Стили для секции СМИ */
.media-featured {
    margin-bottom: 3rem;
}

.media-card {
    background: var(--background-elevated);
    border-radius: var(--radius-xl);
    padding: 2rem;
    border: 1px solid var(--gray-2);
    transition: var(--transition);
}

.media-card.featured {
    display: flex;
    gap: 3rem;
    align-items: center;
    box-shadow: var(--shadow-lg);
    border: none;
    padding: 3rem;
}

.media-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-lg);
}

.media-badge {
    background: var(--accent);
    color: white;
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 700;
    display: inline-block;
    margin-bottom: 1rem;
}

.media-content {
    flex: 2;
}

.media-source {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.source-logo {
    width: 40px;
    height: 40px;
    background: var(--primary-light);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.source-info h4 {
    margin: 0 0 0.25rem 0;
    font-size: 1.1rem;
    font-weight: 600;
}

.media-date {
    color: var(--text-tertiary);
    font-size: 0.9rem;
}

.media-title {
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 1rem;
    color: var(--text-primary);
}

.media-excerpt {
    color: var(--text-secondary);
    line-height: 1.6;
    margin-bottom: 1.5rem;
}

.media-stats {
    display: flex;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

.stat {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--text-tertiary);
    font-size: 0.9rem;
}

.stat i {
    color: var(--primary);
}

.media-image {
    flex: 1;
    min-width: 300px;
}

.media-image img {
    width: 100%;
    height: 250px;
    object-fit: cover;
    border-radius: var(--radius-lg);
}

.media-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1.5rem;
    margin-bottom: 3rem;
}

.media-kit {
    background: linear-gradient(135deg, var(--primary-light) 0%, rgba(132, 196, 71, 0.1) 100%);
    border-radius: var(--radius-xl);
    padding: 2rem;
    border: 1px solid var(--primary-light);
}

.kit-content {
    display: flex;
    align-items: center;
    gap: 1.5rem;
}

.kit-icon {
    width: 60px;
    height: 60px;
    background: var(--primary);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1.5rem;
}

.kit-info {
    flex: 1;
}

.kit-info h3 {
    margin: 0 0 0.5rem 0;
    font-size: 1.5rem;
    font-weight: 600;
}

.kit-info p {
    margin: 0;
    color: var(--text-secondary);
}

/* Адаптивность */
@media (max-width: 768px) {
    .media-card.featured {
        flex-direction: column;
        gap: 2rem;
        padding: 1.5rem;
    }
    
    .media-image {
        min-width: auto;
        width: 100%;
    }
    
    .media-image img {
        height: 200px;
    }
    
    .kit-content {
        flex-direction: column;
        text-align: center;
        gap: 1rem;
    }
    
    .media-stats {
        flex-wrap: wrap;
        gap: 1rem;
    }
}
/* НОВЫЙ ДИЗАЙН ГЛАВНОЙ ПУБЛИКАЦИИ */
.media-hero-card {
    position: relative;
    border-radius: var(--radius-xl);
    overflow: hidden;
    box-shadow: var(--shadow-xl);
    min-height: 500px;
    display: flex;
    align-items: center;
}

.media-hero-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.media-hero-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.media-hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.4) 50%, transparent 100%);
    z-index: 2;
}

.media-hero-content {
    position: relative;
    z-index: 3;
    color: white;
    padding: 4rem;
    max-width: 600px;
}

.media-hero-content .media-badge {
    background: var(--accent);
    color: white;
    margin-bottom: 2rem;
}

.media-hero-content .media-source {
    margin-bottom: 2rem;
}

.media-hero-content .source-logo {
    background: rgba(255,255,255,0.2);
}

.media-hero-content .source-info h4 {
    color: white;
}

.media-hero-content .media-date {
    color: rgba(255,255,255,0.8);
}

.media-hero-content .media-title {
    font-size: 2.25rem;
    color: white;
    margin-bottom: 1.5rem;
    line-height: 1.2;
}

.media-hero-content .media-excerpt {
    color: rgba(255,255,255,0.9);
    font-size: 1.1rem;
    line-height: 1.6;
    margin-bottom: 2rem;
}

.media-hero-content .media-stats {
    margin-bottom: 2rem;
}

.media-hero-content .stat {
    color: rgba(255,255,255,0.8);
}

.media-hero-content .stat i {
    color: var(--primary);
}

.media-hero-content .btn-primary {
    background: white;
    color: var(--text-primary);
    border: none;
}

.media-hero-content .btn-primary:hover {
    background: var(--gray-1);
    transform: translateY(-2px);
}

/* Адаптивность */
@media (max-width: 768px) {
    .media-hero-card {
        min-height: 400px;
    }
    
    .media-hero-content {
        padding: 2rem;
        max-width: 100%;
    }
    
    .media-hero-content .media-title {
        font-size: 1.75rem;
    }
    
    .media-hero-overlay {
        background: linear-gradient(90deg, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.6) 100%);
    }
}

@media (max-width: 480px) {
    .media-hero-card {
        min-height: 350px;
    }
    
    .media-hero-content {
        padding: 1.5rem;
    }
    
    .media-hero-content .media-title {
        font-size: 1.5rem;
    }
}
/* ФИКС ВЫРАВНИВАНИЯ PREORDER-CONTAINER */
.preorder-container {
    display: grid !important;
    grid-template-columns: 1fr 400px !important;
    gap: 4rem !important;
    align-items: start !important;
    width: 100% !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
}

.order-form {
    background: var(--background-elevated);
    border-radius: var(--radius-xl);
    padding: 3rem;
    box-shadow: var(--shadow-xl);
    height: fit-content;
}

.promo-sidebar {
    background: var(--background-elevated);
    border-radius: var(--radius-xl);
    padding: 2.5rem;
    box-shadow: var(--shadow-lg);
    position: sticky;
    top: 120px;
    height: fit-content;
}

@media (max-width: 1024px) {
    .preorder-container {
        grid-template-columns: 1fr !important;
        gap: 2rem !important;
        max-width: 600px !important;
    }
    
    .promo-sidebar {
        position: static !important;
    }
}

/* ===== ПЛАВАЮЩАЯ КНОПКА СИСТЕМЫ ПРОМОКОДОВ ===== */
.floating-promo-btn {
    position: fixed;
    bottom: 30px;
    right: 30px;
    background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
    color: white;
    padding: 1rem 1.5rem;
    border-radius: 50px;
    box-shadow: var(--shadow-xl);
    cursor: pointer;
    z-index: 999;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border: none;
    font-weight: 600;
    animation: float 3s ease-in-out infinite;
}

.floating-promo-btn:hover {
    transform: translateY(-5px) scale(1.05);
    box-shadow: 0 10px 40px rgba(132, 196, 71, 0.4);
}

.floating-promo-btn .promo-text {
    white-space: nowrap;
    font-size: 0.9rem;
}

/* Анимация пульсации */
.promo-pulse {
    position: absolute;
    top: -5px;
    right: -5px;
    width: 20px;
    height: 20px;
    background: var(--accent);
    border-radius: 50%;
    animation: pulse 2s infinite;
}

.promo-pulse::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--accent);
    border-radius: 50%;
    animation: pulse-ring 1.5s infinite;
}

@keyframes pulse {
    0% { transform: scale(0.8); }
    50% { transform: scale(1.1); }
    100% { transform: scale(0.8); }
}

@keyframes pulse-ring {
    0% { transform: scale(0.8); opacity: 1; }
    100% { transform: scale(2); opacity: 0; }
}

/* Адаптивность для плавающей кнопки */
@media (max-width: 768px) {
    .floating-promo-btn {
        bottom: 20px;
        right: 20px;
        padding: 0.875rem 1.25rem;
    }
    
    .floating-promo-btn .promo-text {
        display: none;
    }
    
    .floating-promo-btn {
        width: 60px;
        height: 60px;
        border-radius: 50%;
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .floating-promo-btn {
        bottom: 15px;
        right: 15px;
        width: 50px;
        height: 50px;
    }
}
@keyframes float {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-10px); }
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes slideUp {
    from { 
        opacity: 0;
        transform: translateY(30px) scale(0.95);
    }
    to { 
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* ===== БАННЕР ТЕХНИЧЕСКИХ РАБОТ ===== */
.maintenance-banner {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background: linear-gradient(135deg, #ff6b35 0%, #ff8e53 100%);
    color: white;
    padding: 0.75rem 0;
    z-index: 9999; /* Ниже прелоадера (10001), но выше шапки (1000) */
    box-shadow: 0 2px 20px rgba(255, 107, 53, 0.3);
    animation: slideDown 0.5s ease-out;
    min-height: 48px; /* Минимальная высота для правильного позиционирования */
}

.maintenance-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.maintenance-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    flex-shrink: 0;
}

.maintenance-icon i {
    font-size: 1rem;
}

.maintenance-text {
    flex: 1;
    text-align: center;
    font-size: 0.95rem;
    line-height: 1.4;
}

.maintenance-text a {
    color: white;
    text-decoration: underline;
    font-weight: 600;
    transition: all 0.3s ease;
}

.maintenance-text a:hover {
    color: #ffeaa7;
    text-decoration: none;
}

.maintenance-close {
    background: rgba(255, 255, 255, 0.2);
    border: none;
    color: white;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    flex-shrink: 0;
}

.maintenance-close:hover {
    background: rgba(255, 255, 255, 0.3);
    transform: scale(1.1);
}

/* Анимация появления */
@keyframes slideDown {
    from {
        transform: translateY(-100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Анимация пульсации для привлечения внимания */
@keyframes pulse-gentle {
    0%, 100% {
        box-shadow: 0 2px 20px rgba(255, 107, 53, 0.3);
    }
    50% {
        box-shadow: 0 2px 30px rgba(255, 107, 53, 0.6);
    }
}

.maintenance-banner {
    animation: slideDown 0.5s ease-out, pulse-gentle 3s ease-in-out infinite;
}

/* Адаптивность */
@media (max-width: 768px) {
    .maintenance-content {
        flex-direction: column;
        gap: 0.75rem;
        text-align: center;
    }
    
    .maintenance-text {
        font-size: 0.875rem;
        order: 2;
    }
    
    .maintenance-icon {
        order: 1;
    }
    
    .maintenance-close {
        position: absolute;
        top: 0.5rem;
        right: 1rem;
        order: 3;
    }
}

@media (max-width: 480px) {
    .maintenance-banner {
        padding: 0.5rem 0;
    }
    
    .maintenance-text {
        font-size: 0.8rem;
        padding: 0 0.5rem;
    }
    
    .maintenance-text br {
        display: none;
    }
}

/* Добавь отступ для основного контента когда баннер активен */
/* Когда баннер активен, шапка сдвигается вниз */
body.maintenance-banner-active #main-header,
.maintenance-banner-active #main-header {
    /* top будет установлен динамически через JavaScript на основе реальной высоты баннера */
    transition: top 0.3s ease;
    /* Убеждаемся, что шапка не перекрывается баннером */
    position: fixed !important;
}

.maintenance-banner-active .hero {
    padding-top: 200px; /* Увеличиваем отступ для героя */
}

/* На мобильных уменьшаем отступ */
@media (max-width: 768px) {
    .maintenance-banner-active .hero {
        padding-top: 180px;
    }
    
    .maintenance-banner-active #main-header {
        top: 50px; /* Используем top вместо margin-top для position: fixed */
    }
}

/* ВАРИАНТ 3 - МИНИМАЛЬНЫЕ ИЗМЕНЕНИЯ */
@media (max-width: 1024px) {
    .hero {
        padding: 100px 0 40px !important;
        min-height: auto !important;
    }
    
    .hero-content {
        grid-template-columns: 1fr !important;
        gap: 3rem !important;
    }
    
    .hero h1 {
        font-size: 2.4rem !important;
        line-height: 1.25 !important;
    }
    
    .hero-subtitle {
        font-size: 1.3rem !important;
        line-height: 1.4 !important;
    }
    
    .device-showcase {
        max-width: 400px !important;
    }
}

/* Стили для валидации */
.field-error {
    color: #dc3545;
    font-size: 0.875rem;
    margin-top: 0.25rem;
}

input.error {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.1) !important;
}

input.success {
    border-color: #28a745 !important;
}

.promo-status {
    font-size: 0.875rem;
    margin-top: 0.25rem;
    min-height: 1.25rem;
}

.promo-status.error {
    color: #dc3545;
}

.promo-status.success {
    color: #28a745;
}

.promo-status.checking {
    color: #6c757d;
}

/* Добавьте в style.css */
.quantity-selector {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.quantity-btn {
    width: 40px;
    height: 40px;
    border: 2px solid var(--gray-3);
    background: white;
    border-radius: var(--radius);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: var(--transition);
    font-weight: 600;
}

.quantity-btn:hover {
    border-color: var(--primary);
    color: var(--primary);
}

.quantity-input {
    width: 60px;
    text-align: center;
    border: 2px solid var(--gray-3);
    border-radius: var(--radius);
    padding: 0.5rem;
    font-weight: 600;
}

.promo-input-group {
    display: flex;
    gap: 0.5rem;
}

.promo-input-group .form-input {
    flex: 1;
}

.promo-status {
    margin-top: 0.5rem;
    font-size: 0.875rem;
    min-height: 1.25rem;
}

.order-summary {
    background: var(--background-secondary);
    border-radius: var(--radius);
    padding: 1.5rem;
    margin: 1.5rem 0;
}

.summary-item {
    display: flex;
    justify-content: space-between;
    margin-bottom: 0.75rem;
    color: var(--text-secondary);
}

.summary-total {
    display: flex;
    justify-content: space-between;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 2px solid var(--gray-3);
    font-weight: 700;
    font-size: 1.125rem;
    color: var(--text-primary);
}
/* Стили для шагов авторизации */
.auth-step {
    display: block;
}

.order-step {
    display: none;
}

.auth-options {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    margin-top: 2rem;
}

.auth-card {
    background: var(--background-elevated);
    border-radius: var(--radius-lg);
    padding: 2rem;
    border: 1px solid var(--gray-2);
    box-shadow: var(--shadow);
}

.auth-card h3 {
    color: var(--text-primary);
    margin-bottom: 1.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 1.25rem;
}

.user-info-card {
    background: var(--primary-light);
    border-radius: var(--radius);
    padding: 1.5rem;
    margin-bottom: 1.5rem;
    border-left: 4px solid var(--primary);
}

.user-info-card h4 {
    color: var(--text-primary);
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 1.1rem;
}

.user-details {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.user-details span {
    color: var(--text-secondary);
    font-weight: 500;
}

.btn-outline {
    background: transparent;
    border: 2px solid var(--gray-3);
    color: var(--text-secondary);
    padding: 0.5rem 1rem;
    border-radius: var(--radius);
    cursor: pointer;
    transition: var(--transition);
}

.btn-outline:hover {
    border-color: var(--primary);
    color: var(--primary);
}

@media (max-width: 768px) {
    .auth-options {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    
    .auth-card {
        padding: 1.5rem;
    }
}
/* Стили корзины */
.cart-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10000;
    display: none;
}

.cart-modal.active {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.cart-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(5px);
}

.cart-content {
    position: relative;
    background: var(--background-elevated);
    width: 100%;
    max-width: 450px;
    height: 100%;
    display: flex;
    flex-direction: column;
    box-shadow: var(--shadow-xl);
    transform: translateX(100%);
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.cart-modal.active .cart-content {
    transform: translateX(0);
}

.cart-header {
    padding: 1.5rem;
    border-bottom: 1px solid var(--gray-2);
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: var(--background);
}

.cart-header h3 {
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: var(--text-primary);
}

.cart-close {
    background: none;
    border: none;
    font-size: 1.25rem;
    color: var(--text-tertiary);
    cursor: pointer;
    padding: 0.5rem;
    border-radius: var(--radius);
    transition: var(--transition);
}

.cart-close:hover {
    background: var(--gray-1);
    color: var(--text-primary);
}

.cart-body {
    flex: 1;
    overflow-y: auto;
    padding: 1rem;
}

.cart-empty {
    text-align: center;
    padding: 3rem 1rem;
    color: var(--text-tertiary);
}

.cart-empty i {
    font-size: 3rem;
    margin-bottom: 1rem;
    opacity: 0.5;
}

.cart-empty p {
    margin-bottom: 1.5rem;
    font-size: 1.1rem;
}

.cart-item {
    display: flex;
    gap: 1rem;
    padding: 1rem;
    background: var(--background);
    border-radius: var(--radius);
    margin-bottom: 0.75rem;
    border: 1px solid var(--gray-2);
    transition: var(--transition);
}

.cart-item:hover {
    border-color: var(--primary);
    box-shadow: var(--shadow);
}

.cart-item-image {
    width: 80px;
    height: 80px;
    border-radius: var(--radius);
    object-fit: cover;
    flex-shrink: 0;
}

.cart-item-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.cart-item-name {
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 0.5rem;
}

.cart-item-price {
    color: var(--primary);
    font-weight: 700;
    font-size: 1.1rem;
}

.cart-item-controls {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

.quantity-btn {
    width: 32px;
    height: 32px;
    border: 1px solid var(--gray-3);
    background: white;
    border-radius: var(--radius);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: var(--transition);
    font-size: 0.875rem;
}

.quantity-btn:hover {
    border-color: var(--primary);
    color: var(--primary);
}

.quantity-input {
    width: 50px;
    text-align: center;
    border: 1px solid var(--gray-3);
    border-radius: var(--radius);
    padding: 0.25rem;
    font-weight: 600;
    font-size: 0.875rem;
}

.remove-btn {
    background: none;
    border: none;
    color: var(--accent);
    cursor: pointer;
    padding: 0.5rem;
    border-radius: var(--radius);
    transition: var(--transition);
    margin-left: auto;
}

.remove-btn:hover {
    background: var(--accent);
    color: white;
}

.cart-footer {
    padding: 1.5rem;
    border-top: 1px solid var(--gray-2);
    background: var(--background);
}

.cart-total, .cart-discount, .cart-final {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
}

.cart-final {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--text-primary);
    border-top: 2px solid var(--gray-2);
    padding-top: 0.75rem;
    margin-top: 0.75rem;
}

.discount-amount {
    color: var(--primary);
}

/* Плавающая кнопка корзины - ПО ЦЕНТРУ СПРАВА */
.floating-cart-btn {
    position: fixed;
    top: 50%;
    right: 2rem;
    transform: translateY(-50%);
    width: 60px;
    height: 60px;
    background: var(--primary);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: var(--shadow-xl);
    z-index: 9999;
    transition: var(--transition);
    animation: float 3s ease-in-out infinite;
}

.floating-cart-btn:hover {
    transform: translateY(-50%) scale(1.1);
    background: var(--primary-dark);
}

@keyframes float {
    0%, 100% { transform: translateY(-50%); }
    50% { transform: translateY(calc(-50% - 10px)); }
}

.cart-count-badge {
    position: absolute;
    top: -5px;
    right: -5px;
    background: var(--accent);
    color: white;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: 700;
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.1); }
    100% { transform: scale(1); }
}

.cart-pulse {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: var(--primary);
    animation: pulse-ring 1.5s ease-in-out infinite;
}

@keyframes pulse-ring {
    0% { transform: scale(0.8); opacity: 1; }
    100% { transform: scale(1.5); opacity: 0; }
}

/* Адаптивность для мобильных */
@media (max-width: 768px) {
    .floating-cart-btn {
        right: 1rem;
        width: 50px;
        height: 50px;
    }
    
    .cart-count-badge {
        width: 20px;
        height: 20px;
        font-size: 0.7rem;
    }
}

@media (max-width: 480px) {
    .floating-cart-btn {
        right: 0.5rem;
        width: 45px;
        height: 45px;
    }
}

/* ===== СТИЛИ ДЛЯ КУКИ УВЕДОМЛЕНИЯ ===== */
.cookie-notice {
    position: fixed;
    bottom: 20px;
    left: 20px;
    right: 20px;
    max-width: 500px;
    background: var(--background-elevated);
    border-radius: var(--radius-xl);
    padding: 1.5rem;
    box-shadow: var(--shadow-xl);
    z-index: 10000;
    border: 1px solid var(--gray-2);
    transform: translateY(150%);
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.cookie-notice.show {
    transform: translateY(0);
}

.cookie-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1rem;
}

.cookie-title {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: var(--text-primary);
    font-size: 1.25rem;
    font-weight: 600;
    margin: 0;
    flex: 1;
}

.cookie-close {
    background: none;
    border: none;
    color: var(--text-tertiary);
    cursor: pointer;
    padding: 0.5rem;
    border-radius: var(--radius);
    transition: var(--transition);
    flex-shrink: 0;
}

.cookie-close:hover {
    background: var(--gray-1);
    color: var(--text-primary);
}

.cookie-description {
    color: var(--text-secondary);
    line-height: 1.5;
    margin-bottom: 1.5rem;
    font-size: 0.95rem;
}

.cookie-settings {
    margin-bottom: 1.5rem;
}

.cookie-setting {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 1rem;
    border: 1px solid var(--gray-2);
    border-radius: var(--radius);
    margin-bottom: 0.75rem;
    transition: var(--transition);
    gap: 1rem;
}

.cookie-setting:last-child {
    margin-bottom: 0;
}

.cookie-setting:hover {
    border-color: var(--primary);
    background: var(--primary-light);
}

.setting-info {
    flex: 1;
}

.setting-title {
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 0.25rem;
    font-size: 0.95rem;
}

.setting-description {
    color: var(--text-tertiary);
    font-size: 0.85rem;
    line-height: 1.4;
}

/* Стили для переключателей */
.cookie-toggle {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
    flex-shrink: 0;
    margin-top: 0.25rem;
}

.cookie-toggle input {
    opacity: 0;
    width: 0;
    height: 0;
}

.toggle-slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--gray-3);
    transition: var(--transition);
    border-radius: 24px;
}

.toggle-slider:before {
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    transition: var(--transition);
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

.cookie-toggle input:checked + .toggle-slider {
    background-color: var(--primary);
}

.cookie-toggle input:checked + .toggle-slider:before {
    transform: translateX(20px);
}

.cookie-toggle input:disabled + .toggle-slider {
    background-color: var(--gray-2);
    cursor: not-allowed;
}

.cookie-toggle input:disabled + .toggle-slider:before {
    background-color: var(--gray-4);
}

/* Расширенные настройки */
.cookie-advanced {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
    margin-bottom: 1.5rem;
}

.cookie-advanced.show {
    max-height: 500px;
}

.cookie-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
    gap: 1rem;
    font-size: 0.9rem;
}

.privacy-link {
    color: var(--primary);
    text-decoration: none;
    transition: var(--transition);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.privacy-link:hover {
    text-decoration: underline;
}

.btn-cookie-settings {
    background: transparent;
    border: 1px solid var(--gray-3);
    color: var(--text-secondary);
    padding: 0.5rem 1rem;
    border-radius: var(--radius);
    cursor: pointer;
    transition: var(--transition);
    font-size: 0.9rem;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-cookie-settings:hover {
    background: var(--gray-1);
    color: var(--text-primary);
}

.cookie-buttons {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.cookie-buttons .btn {
    flex: 1;
    min-width: 120px;
    font-size: 0.9rem;
    padding: 0.75rem 1.5rem;
}

/* Адаптивность для куки */
@media (max-width: 768px) {
    .cookie-notice {
        left: 10px;
        right: 10px;
        bottom: 10px;
        padding: 1.25rem;
    }
    
    .cookie-header {
        margin-bottom: 0.75rem;
    }
    
    .cookie-title {
        font-size: 1.1rem;
    }
    
    .cookie-description {
        font-size: 0.9rem;
        margin-bottom: 1.25rem;
    }
    
    .cookie-buttons {
        flex-direction: column;
        gap: 0.5rem;
    }
    
    .cookie-buttons .btn {
        min-width: auto;
        width: 100%;
    }
    
    .cookie-setting {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
        padding: 0.875rem;
    }
    
    .cookie-toggle {
        align-self: flex-end;
    }
    
    .cookie-footer {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }
}

@media (max-width: 480px) {
    .cookie-notice {
        left: 5px;
        right: 5px;
        bottom: 5px;
        padding: 1rem;
    }
    
    .cookie-title {
        font-size: 1rem;
    }
    
    .cookie-description {
        font-size: 0.85rem;
    }
    
    .cookie-buttons .btn {
        font-size: 0.85rem;
        padding: 0.625rem 1.25rem;
    }
    
    .btn-cookie-settings {
        font-size: 0.8rem;
        padding: 0.4rem 0.8rem;
    }
}

/* Анимация появления */
@keyframes slideInUp {
    from {
        opacity: 0;
        transform: translateY(100%);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.cookie-notice.show {
    animation: slideInUp 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Стили для улучшенного футера */
.footer-content {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
    gap: 3rem;
    margin-bottom: 3rem;
    padding-bottom: 3rem;
    border-bottom: 1px solid var(--gray-2);
}

.footer-bottom {
    width: 100%;
}

.footer-bottom-content {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 3rem;
    align-items: start;
    margin-bottom: 2rem;
}

.legal-block {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.company-info {
    line-height: 1.6;
    text-align: left;
}

.company-info strong {
    display: block;
    margin-bottom: 0.75rem;
    color: var(--text-primary);
    font-size: 1.1rem;
}

.legal-details {
    display: flex;
    gap: 1.5rem;
    margin-bottom: 0.75rem;
    flex-wrap: wrap;
}

.legal-details span {
    color: var(--text-secondary);
    font-size: 0.9rem;
}

.address {
    color: var(--text-secondary);
    font-size: 0.9rem;
    margin-bottom: 0.75rem;
    line-height: 1.5;
}

.contacts {
    display: flex;
    gap: 1.5rem;
    flex-wrap: wrap;
}

.contacts a {
    color: var(--primary);
    text-decoration: none;
    font-size: 0.9rem;
    transition: var(--transition);
}

.contacts a:hover {
    text-decoration: underline;
}

.payment-block {
    display: flex;
    justify-content: flex-end;
}

.payment-methods {
    text-align: right;
}

.payment-title {
    margin-bottom: 0.75rem;
    font-size: 0.9rem;
    color: var(--text-secondary);
    font-weight: 600;
}

.payment-icons {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.payment-icon {
    background: var(--background-elevated);
    padding: 0.5rem 1rem;
    border-radius: 6px;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--text-secondary);
    border: 1px solid var(--gray-2);
    min-width: 60px;
    text-align: center;
}

.copyright-block {
    border-top: 1px solid var(--gray-2);
    padding-top: 2rem;
    margin-top: 2rem;
    width: 100%;
}

.copyright {
    font-size: 0.9rem;
    color: var(--text-tertiary);
    line-height: 1.8;
    text-align: center;
    max-width: 100%;
}

.copyright p {
    margin: 0;
    padding: 0;
}

.copyright p:first-child {
    margin-bottom: 0.75rem;
    font-weight: 600;
    color: var(--text-secondary);
    font-size: 0.95rem;
}

.copyright p:not(:first-child) {
    font-size: 0.85rem;
    color: var(--text-tertiary);
    line-height: 1.6;
}

.copyright a {
    color: var(--primary);
    text-decoration: none;
    font-weight: 500;
    transition: all 0.2s ease;
    border-bottom: 1px solid transparent;
}

.copyright a:hover {
    color: var(--primary-dark);
    border-bottom-color: var(--primary);
}

.copyright a:focus {
    outline: 2px solid var(--primary-light);
    outline-offset: 2px;
    border-radius: 2px;
}

/* Адаптивность для copyright-block */
@media (max-width: 768px) {
    .copyright-block {
        padding-top: 1.5rem;
        margin-top: 1.5rem;
    }
    
    .copyright {
        text-align: center;
        font-size: 0.85rem;
    }
    
    .copyright p:first-child {
        font-size: 0.9rem;
        margin-bottom: 0.5rem;
    }
    
    .copyright p:not(:first-child) {
        font-size: 0.8rem;
    }
}

@media (max-width: 480px) {
    .copyright-block {
        padding-top: 1rem;
        margin-top: 1rem;
    }
    
    .copyright {
        font-size: 0.8rem;
        line-height: 1.6;
    }
    
    .copyright p:first-child {
        font-size: 0.85rem;
    }
    
    .copyright p:not(:first-child) {
        font-size: 0.75rem;
    }
}

/* Адаптивность */
@media (max-width: 1200px) {
    .footer-content {
        grid-template-columns: 2fr 1fr 1fr 1fr;
    }
    
    .footer-section:last-child {
        grid-column: 1 / -1;
        margin-top: 1rem;
    }
}

@media (max-width: 1024px) {
    .footer-content {
        grid-template-columns: 1fr 1fr 1fr;
        gap: 2rem;
    }
    
    .footer-bottom-content {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    .payment-block {
        justify-content: flex-start;
    }
    
    .payment-methods {
        text-align: left;
    }
    
    .payment-icons {
        justify-content: flex-start;
    }
}

@media (max-width: 768px) {
    .footer-content {
        grid-template-columns: 1fr 1fr;
        gap: 1.5rem;
    }
    
    .footer-bottom-content {
        gap: 1.5rem;
    }
    
    .legal-details {
        flex-direction: column;
        gap: 0.5rem;
    }
    
    .contacts {
        flex-direction: column;
        gap: 0.5rem;
    }
    
    .copyright-block {
        padding-top: 1.5rem;
        margin-top: 1.5rem;
    }
    
    .copyright {
        text-align: center;
        font-size: 0.85rem;
    }
    
    .copyright p:first-child {
        font-size: 0.9rem;
        margin-bottom: 0.5rem;
    }
    
    .copyright p:not(:first-child) {
        font-size: 0.8rem;
    }
}

@media (max-width: 480px) {
    .footer-content {
        grid-template-columns: 1fr;
        gap: 2rem;
        text-align: center;
    }
    
    .footer-section {
        text-align: center;
    }
    
    .social-links {
        justify-content: center;
    }
    
    .payment-icons {
        justify-content: center;
    }
    
    .copyright {
        text-align: center;
    }
}

/* Базовые стили футера (если их нет) */
footer {
    background: var(--background-secondary);
    padding: 80px 0 40px;
    border-top: 1px solid var(--gray-2);
}

.footer-brand {
    margin-bottom: 1rem;
}

.footer-logo {
    margin-bottom: 1rem;
}

.footer-logo img {
    height: 40px;
    width: auto;
}

.footer-logo .logo-light {
    display: block;
}

.footer-logo .logo-dark {
    display: none;
}

[data-theme="dark"] .footer-logo .logo-light {
    display: none;
}

[data-theme="dark"] .footer-logo .logo-dark {
    display: block;
}

.footer-brand p {
    color: var(--text-tertiary);
    margin-bottom: 1.5rem;
    line-height: 1.6;
}

.social-links {
    display: flex;
    gap: 1rem;
}

.social-links a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: var(--background-elevated);
    border-radius: 8px;
    color: var(--text-secondary);
    text-decoration: none;
    transition: var(--transition);
}

.social-links a:hover {
    background: var(--primary);
    color: white;
    transform: translateY(-2px);
}

.footer-section h4 {
    margin-bottom: 1.5rem;
    font-size: 1.125rem;
    line-height: 1.3;
    font-weight: 600;
    color: var(--text-primary);
}

.footer-section ul {
    list-style: none;
}

.footer-section ul li {
    margin-bottom: 0.75rem;
}

.footer-section ul li a {
    color: var(--text-tertiary);
    text-decoration: none;
    transition: var(--transition);
    font-size: 0.95rem;
}

.footer-section ul li a:hover {
    color: var(--primary);
}

/* Строгая плавающая кнопка */
.floating-promo-btn {
    position: fixed;
    bottom: 30px;
    right: 30px;
    background: var(--primary);
    color: white;
    padding: 12px 20px;
    border-radius: 8px;
    box-shadow: var(--shadow-lg);
    cursor: pointer;
    z-index: 999;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: all 0.3s ease;
    border: none;
    font-weight: 600;
    font-size: 14px;
    font-family: 'Inter', sans-serif;
}

.floating-promo-btn:hover {
    background: var(--primary-dark);
    transform: translateY(-2px);
    box-shadow: var(--shadow-xl);
}

.floating-promo-btn i {
    font-size: 16px;
}

/* Адаптивность */
@media (max-width: 768px) {
    .floating-promo-btn {
        bottom: 20px;
        right: 20px;
        padding: 10px 16px;
        font-size: 13px;
    }
}

@media (max-width: 480px) {
    .floating-promo-btn {
        bottom: 15px;
        right: 15px;
        padding: 8px 12px;
    }
    
    .floating-promo-btn span {
        display: none;
    }
    
    .floating-promo-btn i {
        margin-right: 0;
    }
}

/* Анимации для модального окна */
.promo-modal {
    animation: fadeIn 0.3s ease;
}

.promo-modal > div {
    animation: slideUp 0.3s ease;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes slideUp {
    from { 
        opacity: 0;
        transform: translateY(20px) scale(0.95);
    }
    to { 
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Добавьте это в конец CSS файла */
.reviews-filters {
    display: flex !important;
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
    overflow-x: auto !important;
}

.reviews-filters .filter-group {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
}

.cart-promo-section {
    padding: 1.5rem;
    border-top: 1px solid var(--gray-2);
    border-bottom: 1px solid var(--gray-2);
    background: var(--background-secondary);
}

.promo-header {
    margin-bottom: 1rem;
}

.promo-header h4 {
    color: var(--text-primary);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.1rem;
}

.promo-input-group {
    display: flex;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.promo-input-group .form-input {
    flex: 1;
    padding: 0.875rem;
}

.promo-input-group .btn {
    white-space: nowrap;
    padding: 0.875rem 1.25rem;
    font-weight: 600;
}

.promo-status {
    font-size: 0.9rem;
    min-height: 1.25rem;
    margin-top: 0.5rem;
    font-weight: 500;
}

/* СТИЛИ ДЛЯ УЛУЧШЕННОЙ КОРЗИНЫ */
.cart-promo-section {
    padding: 1.5rem;
    border-top: 1px solid var(--gray-2);
    border-bottom: 1px solid var(--gray-2);
    background: var(--background-secondary);
}

.promo-header {
    margin-bottom: 1rem;
}

.promo-header h4 {
    color: var(--text-primary);
    margin: 0 0 0.25rem 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.1rem;
    font-weight: 600;
}

.promo-subtitle {
    color: var(--text-tertiary);
    font-size: 0.85rem;
    margin: 0;
}

.promo-input-group {
    display: flex;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.promo-input-group .form-input {
    flex: 1;
    padding: 0.875rem;
    border: 2px solid var(--gray-3);
    border-radius: 8px;
    font-size: 1rem;
    transition: all 0.3s ease;
}

.promo-input-group .form-input:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(132, 196, 71, 0.1);
}

.promo-input-group .form-input:disabled {
    background-color: var(--gray-1);
    color: var(--text-tertiary);
    cursor: not-allowed;
}

.promo-input-group .btn {
    white-space: nowrap;
    padding: 0.875rem 1.25rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.3s ease;
}

.promo-status {
    font-size: 0.9rem;
    min-height: 1.25rem;
    margin-top: 0.5rem;
    font-weight: 500;
    line-height: 1.4;
}

/* Стили для элементов корзины */
.cart-item {
    display: flex;
    gap: 1rem;
    padding: 1rem;
    background: var(--background);
    border-radius: var(--radius);
    margin-bottom: 0.75rem;
    border: 1px solid var(--gray-2);
    transition: var(--transition);
}

.cart-item:hover {
    border-color: var(--primary);
    box-shadow: var(--shadow);
}

.cart-item-image {
    width: 80px;
    height: 80px;
    border-radius: var(--radius);
    object-fit: cover;
    flex-shrink: 0;
}

.cart-item-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.cart-item-name {
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 0.5rem;
    font-size: 1rem;
}

.cart-item-price {
    color: var(--primary);
    font-weight: 700;
    font-size: 1.1rem;
}

.cart-item-controls {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

.quantity-btn {
    width: 32px;
    height: 32px;
    border: 1px solid var(--gray-3);
    background: white;
    border-radius: var(--radius);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: var(--transition);
    font-size: 0.875rem;
    font-weight: 600;
}

.quantity-btn:hover {
    border-color: var(--primary);
    color: var(--primary);
    background: var(--primary-light);
}

.quantity-input {
    width: 50px;
    text-align: center;
    border: 1px solid var(--gray-3);
    border-radius: var(--radius);
    padding: 0.25rem;
    font-weight: 600;
    font-size: 0.875rem;
}

.remove-btn {
    background: none;
    border: none;
    color: var(--accent);
    cursor: pointer;
    padding: 0.5rem;
    border-radius: var(--radius);
    transition: var(--transition);
    margin-left: auto;
}

.remove-btn:hover {
    background: var(--accent);
    color: white;
}

/* Футер корзины */
.cart-footer {
    padding: 1.5rem;
    border-top: 1px solid var(--gray-2);
    background: var(--background);
}

.cart-total, .cart-discount, .cart-final {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
    font-size: 1rem;
}

.cart-final {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--text-primary);
    border-top: 2px solid var(--gray-2);
    padding-top: 0.75rem;
    margin-top: 0.75rem;
}

.discount-amount {
    color: var(--primary);
    font-weight: 600;
}

/* Адаптивность */
@media (max-width: 768px) {
    .cart-promo-section {
        padding: 1rem;
    }
    
    .promo-input-group {
        flex-direction: column;
    }
    
    .promo-input-group .btn {
        width: 100%;
        justify-content: center;
    }
    
    .cart-item {
        flex-direction: column;
        text-align: center;
    }
    
    .cart-item-image {
        width: 100%;
        height: 120px;
        margin-bottom: 1rem;
    }
    
    .cart-item-controls {
        justify-content: center;
    }
}

.btn-small {
    padding: 0.4rem 0.8rem;
    font-size: 0.85rem;
}

.btn-outline {
    background: transparent;
    border: 1px solid var(--gray-3);
    color: var(--text