/* Сброс стилей и базовые настройки */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Глобальные переменные для единой системы отступов */
:root {
    --container-max-width: 1400px;
    --container-padding-desktop: 60px;
    --container-padding-tablet: 40px;
    --container-padding-expanded: 30px;
    --container-padding-tablet-large: 35px;
    --container-padding-mobile: 20px;
}

/* Визуальные направляющие отключены */

body {
    font-family: 'Unbounded', sans-serif;
    min-height: 100vh;
    overflow-x: hidden;
    position: relative;
    padding-top: 76px;
    background: #EBEBE9;
}

/* Полноэкранное видео фон */
.fullscreen-video-background {
    position: absolute;
    top: -180px;
    left: 50%;
    transform: translateX(-50%);
    width: 1280px;
    max-width: 90%;
    height: calc(100vh + 200px);
    z-index: -1;
    overflow: hidden;
    background: #EBEBE9;
}

.fullscreen-video {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* Контейнер и основная секция */
.hero-section {
    padding: 0 !important;
    margin: 0 !important;
    background: none !important;
    position: relative !important;
    height: 65vh !important;
    min-height: 600px !important;
    max-height: none !important;
    overflow: visible !important;
}

/* Медиа-запрос для диапазона от 1200px до 2000px - увеличиваем высоту hero секции до 65vh */
@media (min-width: 1200px) and (max-width: 2000px) {
    .hero-section {
        height: 65vh !important;
    }
}

.container {
    width: 100%;
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-desktop);
    position: relative;
}

.content {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 80px;
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-desktop);
    width: 100%;
}

/* Текстовый контент */
.text-content {
    flex: 1;
    max-width: 50%;
}

.main-title {
    font-size: 96px;
    font-weight: 500;
    font-family: 'Unbounded', sans-serif;
    color: #191925;
    margin-bottom: 15px;
    line-height: 1.0;
    white-space: nowrap;
}

.ai-text {
    color: #145BDE;
}

.highlight-text {
    font-size: 20px;
    font-weight: 500;
}

.line-separator {
    width: 380px;
    height: 3px;
    background: #145BDE;
    margin: 15px 0 25px 0;
    border-radius: 1px;
}

.subtitle {
    font-size: 28px;
    font-weight: 400;
    font-family: 'Unbounded', sans-serif;
    color: #191925;
    letter-spacing: 1px;
    line-height: 1.3;
    text-transform: uppercase;
    margin-top: 0;
    margin-bottom: 40px;
}

/* Кнопка Call-to-Action */
.cta-button {
    background: #145BDE;
    color: #ffffff;
    border: none;
    padding: 18px 36px;
    font-size: 18px;
    font-weight: 600;
    font-family: 'Gilroy', sans-serif;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    letter-spacing: 0.5px;
    box-shadow: 0 2px 8px rgba(2, 132, 199, 0.2);
}

.cta-button:hover {
    background: #145BDE;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(20, 91, 222, 0.3);
}

.cta-button:active {
    background: #145BDE;
    transform: translateY(0px);
    box-shadow: 0 2px 6px rgba(20, 91, 222, 0.4);
}

/* Подпись под кнопкой */
.cta-subtitle {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 24px;
    font-family: 'Gilroy', sans-serif;
    font-size: 14px;
    font-weight: 400;
    color: #6B7280;
    cursor: pointer;
    transition: color 0.3s ease;
}

.cta-subtitle:hover {
    color: #4B5563;
}

.cta-subtitle svg {
    transition: transform 0.3s ease;
}

.cta-subtitle:hover svg {
    transform: translate(1px, -1px);
}

/* Кнопка под карточками */
.cta-section {
    display: flex;
    justify-content: center;
    margin-top: 60px;
    padding: 0 var(--container-padding-desktop);
}

.cta-button-secondary {
    background: #145BDE;
    color: #ffffff;
    border: none;
    padding: 18px 36px;
    font-size: 18px;
    font-weight: 600;
    font-family: 'Gilroy', sans-serif;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    letter-spacing: 0.5px;
    box-shadow: 0 2px 8px rgba(20, 91, 222, 0.2);
    min-width: 200px;
}

.cta-button-secondary:hover {
    background: #0F4BC7;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(20, 91, 222, 0.4);
}

.cta-button-secondary:active {
    background: #0D42B3;
    transform: translateY(0px);
    box-shadow: 0 2px 6px rgba(20, 91, 222, 0.4);
}

/* Второй блок - Bento стиль */
.second-section {
    min-height: 100vh;
    background: #EBEBE9;
    position: relative;
    z-index: 2;
    padding: 120px 0;
}

.bento-content {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-desktop);
    position: relative;
}

/* Заголовок секции */
.section-header {
    text-align: left;
    margin: 0 0 60px calc(-1 * var(--container-padding-desktop));
}

.section-title {
    font-family: 'Unbounded', sans-serif;
    font-size: 56px;
    font-weight: 500;
    color: #191925;
    line-height: 1.1;
    margin: 0 0 0 calc(-1 * var(--container-padding-desktop));
    text-transform: uppercase;
    text-align: left;
}

.bento-content .section-subtitle {
    font-family: 'Gilroy', sans-serif;
    font-size: 16px;
    font-weight: 500;
    color: #6B7280;
    text-align: left;
    margin: 16px 0 0 calc(-1 * var(--container-padding-desktop));
    text-transform: uppercase;
    letter-spacing: 1px;
}

.second-section .section-title {
    padding-left: 120px;
}

/* Business Problems - Шахматная раскладка */
.business-problems {
    display: grid;
    grid-template-columns: 2fr 1fr 2fr;
    grid-template-rows: 1fr 1fr;
    gap: 24px;
    width: 100%;
    margin-top: 80px;
    min-height: 600px;
    align-items: stretch;
    position: relative;
}

/* Первая карточка - Большая слева сверху */
.problem-solution-card:nth-child(1) {
    grid-column: 1 / 2;
    grid-row: 1 / 2;
}

/* Вторая карточка - Маленькая справа сверху */
.problem-solution-card:nth-child(2) {
    grid-column: 2 / 4;
    grid-row: 1 / 2;
}

/* Третья карточка - Маленькая слева снизу */
.problem-solution-card:nth-child(3) {
    grid-column: 1 / 3;
    grid-row: 2 / 3;
}

/* Четвертая карточка - Большая справа снизу */
.problem-solution-card:nth-child(4) {
    grid-column: 3 / 4;
    grid-row: 2 / 3;
}

/* Анимация появления карточек */
.problem-solution-card {
    opacity: 0;
    transform: translateY(40px) scale(0.9);
    animation: cardAppear 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.problem-solution-card:nth-child(1) { animation-delay: 0.1s; }
.problem-solution-card:nth-child(2) { animation-delay: 0.2s; }
.problem-solution-card:nth-child(3) { animation-delay: 0.3s; }
.problem-solution-card:nth-child(4) { animation-delay: 0.4s; }

@keyframes cardAppear {
    0% {
        opacity: 0;
        transform: translateY(40px) scale(0.9);
    }
    50% {
        opacity: 0.8;
        transform: translateY(-5px) scale(1.02);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Problem Solution Cards */
.problem-solution-card {
    border-radius: 20px;
    padding: 36px 32px;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    cursor: pointer;
    display: grid;
    grid-template-rows: 1fr auto 1fr;
    text-align: left;
    height: 100%;
    box-sizing: border-box;
    gap: 0;
    transform: translateY(30px);
    opacity: 0;
}

/* Анимация появления для карточек проблем */
.problem-solution-card.animate-in {
    transform: translateY(0);
    opacity: 1;
}

/* Hover эффект для карточек проблем */
.problem-solution-card:hover {
    transform: translateY(-8px) scale(1.02);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
}

/* Problem and Solution Sections */
.problem-section {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 20px 0;
}

.solution-section {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 12px;
    padding: 20px 0;
}

/* Section Divider */
.section-divider {
    height: 1px;
    margin: 0;
    opacity: 0.3;
    transition: opacity 0.3s ease;
    align-self: stretch;
}

/* Section Tags */
.section-tag {
    background: rgba(255, 255, 255, 0.2);
    color: #FFFFFF;
    font-family: 'Unbounded', sans-serif;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 8px 16px;
    border-radius: 20px;
    display: inline-block;
    width: fit-content;
    white-space: nowrap;
    backdrop-filter: blur(10px);
}

/* Первая карточка - Синий градиент */
.problem-solution-card:nth-child(1) {
    background: linear-gradient(135deg, #145BDE 0%, #1E6FFF 100%);
    box-shadow: 0 4px 20px rgba(20, 91, 222, 0.15);
}

/* Вторая карточка - Серый градиент */
.problem-solution-card:nth-child(2) {
    background: linear-gradient(135deg, #6B7280 0%, #4B5563 100%);
    box-shadow: 0 4px 20px rgba(107, 114, 128, 0.15);
}

/* Третья карточка - Темный градиент */
.problem-solution-card:nth-child(3) {
    background: linear-gradient(135deg, #374151 0%, #111827 100%);
    box-shadow: 0 4px 20px rgba(31, 41, 55, 0.15);
}

/* Четвертая карточка - Светлый градиент */
.problem-solution-card:nth-child(4) {
    background: linear-gradient(135deg, #F9FAFB 0%, #E5E7EB 100%);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
}

/* Единая типографика для всех карточек */

.problem-solution-card .problem-title {
    font-family: 'Gilroy', sans-serif;
    font-size: 19px;
    font-weight: 500;
    line-height: 1.3;
    margin: 0;
    transition: color 0.3s ease;
}

.solution-text {
    font-family: 'Gilroy', sans-serif;
    font-size: 19px;
    font-weight: 500;
    line-height: 1.4;
    margin: 0;
    transition: color 0.3s ease;
}

/* Синяя карточка - белый текст */
.problem-solution-card:nth-child(1) .problem-title {
    color: #FFFFFF;
}

.problem-solution-card:nth-child(1) .solution-text {
    color: #FFFFFF;
}

/* Серая карточка - белый текст */
.problem-solution-card:nth-child(2) .problem-title {
    color: #FFFFFF;
}

.problem-solution-card:nth-child(2) .solution-text {
    color: #FFFFFF;
}

/* Черная карточка - белый текст */
.problem-solution-card:nth-child(3) .problem-title {
    color: #FFFFFF;
}

.problem-solution-card:nth-child(3) .solution-text {
    color: #FFFFFF;
}

/* Белая карточка - темный текст */
.problem-solution-card:nth-child(4) .problem-title {
    color: #1F2937;
}

.problem-solution-card:nth-child(4) .solution-text {
    color: #1F2937;
}

/* Убираем специфические стили для тегов - теперь все теги имеют единый синий стиль */

/* Divider colors for different cards */
.problem-solution-card:nth-child(1) .section-divider {
    background: rgba(255, 255, 255, 0.3);
}

.problem-solution-card:nth-child(2) .section-divider {
    background: rgba(255, 255, 255, 0.3);
}

.problem-solution-card:nth-child(3) .section-divider {
    background: rgba(255, 255, 255, 0.3);
}

.problem-solution-card:nth-child(4) .section-divider {
    background: rgba(0, 0, 0, 0.15);
}

/* Hover effects for dividers */
.problem-solution-card:hover .section-divider {
    opacity: 0.5;
}

/* Card Content Styles */
.problem-badge {
    font-family: 'Gilroy', sans-serif;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 8px 14px;
    border-radius: 8px;
    display: inline-block;
    margin-bottom: 16px;
    background: linear-gradient(135deg, #FFE5E5 0%, #FFD0D0 100%);
    color: #DC2626;
    border: 1px solid rgba(220, 38, 38, 0.2);
}

.solution-badge {
    font-family: 'Gilroy', sans-serif;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 8px 14px;
    border-radius: 8px;
    display: inline-block;
    margin-bottom: 16px;
    background: rgba(255, 255, 255, 0.2);
    color: #FFFFFF;
    border: 1px solid rgba(255, 255, 255, 0.3);
    backdrop-filter: blur(10px);
}

.problem-title {
    font-family: 'Gilroy', sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: #111827;
    line-height: 1.3;
    margin: 0 0 12px 0;
    padding-right: 60px;
}

.solution-title {
    font-family: 'Gilroy', sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: #FFFFFF;
    line-height: 1.3;
    margin: 0 0 12px 0;
    padding-right: 60px;
}

.problem-description {
    font-family: 'Gilroy', sans-serif;
    font-size: 13px;
    font-weight: 400;
    color: #6B7280;
    line-height: 1.4;
    margin: 0;
    padding-right: 40px;
}

.solution-description {
    font-family: 'Gilroy', sans-serif;
    font-size: 13px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.9);
    line-height: 1.4;
    margin: 0;
    padding-right: 40px;
}

/* Теги на светлой карточке */
.problem-solution-card:nth-child(4) .section-tag {
    background: rgba(0, 0, 0, 0.1);
    color: #1F2937;
}

/* Третий блок - Возможности AI-ассистента */
.third-section {
    background: #1A202C;
    position: relative;
    z-index: 2;
    padding: 140px 0;
    overflow: hidden;
}

.third-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(circle at 20% 80%, rgba(255, 255, 255, 0.15) 0%, transparent 50%),
        radial-gradient(circle at 80% 20%, rgba(255, 255, 255, 0.1) 0%, transparent 50%),
        radial-gradient(circle at 40% 40%, rgba(185, 227, 255, 0.1) 0%, transparent 30%);
    pointer-events: none;
}

.third-section::after {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Ccircle cx='7' cy='7' r='1'/%3E%3Ccircle cx='37' cy='37' r='1'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    pointer-events: none;
    animation: float 20s ease-in-out infinite;
}

@keyframes float {
    0%, 100% { transform: translateX(0) translateY(0); }
    25% { transform: translateX(10px) translateY(-10px); }
    50% { transform: translateX(-5px) translateY(-20px); }
    75% { transform: translateX(-10px) translateY(-10px); }
}

/* Анимации для персонажей */
@keyframes breathe {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.02); }
}

@keyframes wave {
    0%, 100% { transform: rotate(0deg) scale(1); }
    25% { transform: rotate(-2deg) scale(1.01); }
    50% { transform: rotate(2deg) scale(1.02); }
    75% { transform: rotate(-1deg) scale(1.01); }
}

@keyframes blink {
    0%, 90%, 100% { opacity: 1; }
    95% { opacity: 0.3; }
}

@keyframes wiggle {
    0%, 100% { transform: translateX(0) translateY(0) rotate(0deg); }
    20% { transform: translateX(-2px) translateY(-1px) rotate(-1deg); }
    40% { transform: translateX(2px) translateY(1px) rotate(1deg); }
    60% { transform: translateX(-1px) translateY(0px) rotate(-0.5deg); }
    80% { transform: translateX(1px) translateY(-1px) rotate(0.5deg); }
}

@keyframes sparkle {
    0%, 100% { opacity: 0; transform: scale(0.5); }
    50% { opacity: 1; transform: scale(1); }
}

@keyframes characterAppear {
    0% { 
        opacity: 0; 
        transform: scale(0.3) rotate(-10deg) translateY(30px); 
    }
    50% { 
        opacity: 0.8; 
        transform: scale(1.1) rotate(5deg) translateY(-10px); 
    }
    100% { 
        opacity: 1; 
        transform: scale(1) rotate(0deg) translateY(0); 
    }
}

.capabilities-content {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-desktop);
    position: relative;
    z-index: 1;
}

.white-title {
    color: #FFFFFF !important;
}

.section-subtitle {
    font-family: 'Gilroy', sans-serif;
    font-size: 20px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.8);
    text-align: left;
    margin-top: 24px;
    line-height: 1.4;
    position: relative;
    padding-left: 32px;
}



.capabilities-list {
    display: flex;
    flex-direction: column;
    gap: 48px;
    margin-top: 80px;
    width: 100%;
}

.capability-item {
    display: flex;
    align-items: flex-start;
    gap: 40px;
    opacity: 0;
    transform: translateX(-50px);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    padding: 24px;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid transparent;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}

/* Убрано белое свечение при hover */

.capability-item.animate-in {
    opacity: 1;
    transform: translateX(0);
}

.capability-item:nth-child(1) { transition-delay: 0.1s; }
.capability-item:nth-child(2) { transition-delay: 0.3s; }
.capability-item:nth-child(3) { transition-delay: 0.5s; }

.capability-item:hover {
    transform: translateX(8px) translateY(-4px);
    box-shadow: 
        0 0 0 1px rgba(20, 91, 222, 0.6),
        0 0 20px rgba(20, 91, 222, 0.4),
        0 0 40px rgba(20, 91, 222, 0.2),
        0 12px 40px rgba(20, 91, 222, 0.2), 
        0 4px 16px rgba(0, 0, 0, 0.3);
    background: rgba(0, 0, 0, 0.15);
}

.capability-number {
    font-family: 'Gilroy', sans-serif;
    font-size: 120px;
    font-weight: 800;
    color: #ffffff;
    line-height: 0.8;
    min-width: 160px;
    text-align: center;
    position: relative;
    transition: all 0.4s ease;
    align-self: flex-end;
}

.capability-number::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0);
    width: 140px;
    height: 140px;
    background: radial-gradient(circle, rgba(20, 91, 222, 0.4) 0%, transparent 70%);
    border-radius: 50%;
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 0 40px rgba(20, 91, 222, 0.6);
}

.capability-number::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 120px;
    height: 120px;
    border: 2px solid rgba(20, 91, 222, 0.6);
    border-radius: 50%;
    opacity: 0;
    transition: all 0.4s ease;
    box-shadow: 0 0 30px rgba(20, 91, 222, 0.5);
}

.capability-item:hover .capability-number {
    background: linear-gradient(135deg, #145BDE 0%, #1E6FFF 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    transform: scale(1.05);
}

.capability-item:hover .capability-number::before {
    transform: translate(-50%, -50%) scale(1);
}

.capability-item:hover .capability-number::after {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1.2);
    animation: numberGlow 2s ease-in-out infinite alternate;
}

@keyframes numberGlow {
    0% { 
        opacity: 0.7;
        box-shadow: 0 0 30px rgba(20, 91, 222, 0.5);
    }
    100% { 
        opacity: 1;
        box-shadow: 0 0 50px rgba(20, 91, 222, 0.8);
    }
}

.capability-content {
    flex: 1;
    padding-top: 8px;
}

.capability-title {
    font-family: 'Gilroy', sans-serif;
    font-size: 28px;
    font-weight: 700;
    color: #FFFFFF;
    line-height: 1.2;
    margin: 0 0 16px 0;
    transition: color 0.3s ease;
}

.capability-item:hover .capability-title {
    color: #FFFFFF;
}

.capability-description {
    font-family: 'Gilroy', sans-serif;
    font-size: 18px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.6;
    margin: 0;
    transition: color 0.3s ease;
}

.capability-item:hover .capability-description {
    color: rgba(255, 255, 255, 0.95);
}

/* Виды ассистентов */
.implementation-examples {
    margin-top: 120px;
}

.section-subtitle-wrapper {
    text-align: left;
    margin: 0 0 48px calc(-1 * var(--container-padding-desktop));
}

.implementation-title {
    font-family: 'Unbounded', sans-serif;
    font-size: 28px;
    font-weight: 600;
    color: white;
    position: relative;
    display: inline-block;
    margin: 0;
    padding-left: 60px;
}

/* Убираем подчеркивание у заголовка "Виды ассистентов" */

/* Убираем стили кнопки */

.examples-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 40px;
    width: 100%;
}

.example-card {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid transparent;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-radius: 24px;
    padding: 28px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    transform: translateY(20px);
    opacity: 0;
    position: relative;
    display: flex;
    flex-direction: column;
}

.example-card.animate-in {
    opacity: 1;
    transform: translateY(0);
}

.example-card:nth-child(1) { transition-delay: 0.6s; }
.example-card:nth-child(2) { transition-delay: 0.8s; }

.example-card:hover {
    transform: translateY(-8px) scale(1.02);
    box-shadow: 
        0 0 0 1px rgba(20, 91, 222, 0.6),
        0 0 20px rgba(20, 91, 222, 0.4),
        0 0 40px rgba(20, 91, 222, 0.2),
        0 12px 40px rgba(20, 91, 222, 0.2), 
        0 4px 16px rgba(0, 0, 0, 0.3);
    background: rgba(0, 0, 0, 0.15);
}

.card-image {
    width: 100%;
    height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
    position: relative;
    overflow: hidden;
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.03) 100%);
}

/* Добавляем мерцающие элементы для оживления */
.card-image::before {
    content: '';
    position: absolute;
    top: 20%;
    left: 20%;
    width: 6px;
    height: 6px;
    background: rgba(255, 255, 255, 0.8);
    border-radius: 50%;
    animation: sparkle 2s ease-in-out infinite;
    z-index: 1;
}

.card-image::after {
    content: '';
    position: absolute;
    top: 30%;
    right: 25%;
    width: 4px;
    height: 4px;
    background: rgba(255, 255, 255, 0.6);
    border-radius: 50%;
    animation: sparkle 3s ease-in-out infinite;
    animation-delay: 1s;
    z-index: 1;
}

.example-image {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    border-radius: 12px;
    transform-origin: center center;
}

/* Анимация появления убрана */

/* Hover анимация изображений убрана */

/* Специальные анимации для изображений убраны */

.card-header {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 20px;
    position: relative;
    top: 0;
    left: 0;
    z-index: 2;
}

.card-number {
    font-family: 'Gilroy', sans-serif;
    font-size: 32px;
    font-weight: 800;
    color: #145BDE;
    line-height: 1;
}

.card-badge {
    background: rgba(255, 255, 255, 0.15);
    color: rgba(255, 255, 255, 0.9);
    padding: 8px 16px;
    border-radius: 20px;
    font-weight: 600;
    font-size: 12px;
    white-space: nowrap;
    text-transform: uppercase;
}

.example-title {
    font-family: 'Unbounded', sans-serif;
    font-size: 20px;
    font-weight: 600;
    color: #ffffff;
    line-height: 1.3;
    margin: 0 0 16px 0;
}

.example-description {
    font-family: 'Gilroy', sans-serif;
    font-size: 15px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.5;
    margin: 0 0 20px 0;
}

.example-cta-button {
    background: linear-gradient(135deg, #145BDE 0%, #0F4BC7 50%, #1E6EFF 100%);
    color: #ffffff;
    border: none;
    padding: 16px 24px;
    font-size: 15px;
    font-weight: 600;
    font-family: 'Gilroy', sans-serif;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    width: 100%;
    margin-top: auto;
    position: relative;
    overflow: hidden;
    letter-spacing: 0.5px;
    box-shadow: 0 4px 15px rgba(20, 91, 222, 0.3);
    text-align: center;
}

.example-cta-button::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transition: left 0.5s;
}

.example-cta-button:hover {
    background: linear-gradient(135deg, #0F4BC7 0%, #145BDE 50%, #2A7EFF 100%);
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(20, 91, 222, 0.5);
    scale: 1.02;
}

.example-cta-button:hover::before {
    left: 100%;
}

.example-cta-button:active {
    background: linear-gradient(135deg, #0D3F9F 0%, #0F4BC7 50%, #1A6BF5 100%);
    transform: translateY(-1px);
    box-shadow: 0 4px 15px rgba(20, 91, 222, 0.4);
    scale: 0.98;
}

/* Адаптивность */
@media (max-width: 1311px) and (min-width: 1025px) {
    .subtitle {
        font-size: 20px;
    }
}

/* Медиа-запрос для всех разрешений от 1200px и выше - карточки ассистентов в два ряда */
@media (min-width: 1200px) {
    /* Верхний padding для текста первого блока - 60px */
    .hero-section .text-content,
    .text-content {
        padding-top: 60px !important;
    }
    
    /* Размер шрифта описания в плашках "Кому будет полезен?" - 16px */
    .second-section .problem-solution-card .solution-text,
    .problem-solution-card .solution-text,
    .solution-text {
        font-size: 16px !important;
    }
    
    /* Контейнер блока "Виды ассистентов" - выравнивание по направляющим 60px */
    .third-section .implementation-examples,
    .implementation-examples {
        padding-left: 60px !important;
        padding-right: 60px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }
    
    /* Принудительные стили для блока "Виды ассистентов" - максимальная специфичность */
    .third-section .implementation-examples .examples-grid,
    .implementation-examples .examples-grid,
    section .implementation-examples .examples-grid,
    .examples-grid {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        grid-template-rows: auto !important;
        gap: 30px !important;
        flex-direction: unset !important;
        flex-wrap: unset !important;
        justify-content: unset !important;
        align-items: unset !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
        max-width: none !important;
        box-sizing: border-box !important;
    }
    
    .third-section .implementation-examples .example-card,
    .implementation-examples .example-card,
    section .implementation-examples .example-card,
    .example-card {
        width: 100% !important;
        max-width: none !important;
        min-width: unset !important;
        margin: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        flex: unset !important;
        flex-basis: unset !important;
        box-sizing: border-box !important;
        padding: 24px !important;
    }
    
    /* Заголовок "Виды ассистентов" - выравнивание по направляющим */
    .third-section .implementation-examples .implementation-title,
    .implementation-examples .implementation-title,
    .implementation-title {
        padding-left: 60px !important;
        margin-left: 0 !important;
        text-align: left !important;
    }
    
    /* Размер шрифта описания в карточках ассистентов - 16px */
    .third-section .implementation-examples .example-card .example-description,
    .implementation-examples .example-card .example-description,
    .example-card .example-description,
    .example-description {
        font-size: 16px !important;
    }
    
    /* Блок "Ключевые возможности" - выравнивание по направляющим и размеры шрифтов */
    
    /* Заголовок "КЛЮЧЕВЫЕ ВОЗМОЖНОСТИ" - размер 56px и выравнивание с отступом 120px */
    .third-section .section-title,
    .third-section .capabilities-content .section-title,
    section.third-section .section-title {
        font-size: 56px !important;
        padding-left: 120px !important;
        margin-left: 0 !important;
        text-align: left !important;
    }
    
    /* Контейнер плашек "Ключевые возможности" - выравнивание по направляющим */
    .third-section .capabilities-list,
    .capabilities-list {
        padding-left: 60px !important;
        padding-right: 60px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }
    
    /* Плашки "Ключевые возможности" - принудительное выравнивание */
    .third-section .capability-item,
    .capability-item {
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 24px !important;
        padding-right: 24px !important;
        width: 100% !important;
        max-width: none !important;
        box-sizing: border-box !important;
    }
    
    /* Описание в плашках "Ключевые возможности" - размер шрифта 16px */
    .third-section .capability-item .capability-description,
    .capability-item .capability-description,
    .capability-description {
        font-size: 16px !important;
    }
}

/* Медиа-запрос для всех разрешений от 1025px и выше - размер шрифта описания в карточках ассистентов 16px */
@media (min-width: 1025px) {
    /* Размер шрифта описания в карточках ассистентов - 16px */
    .third-section .implementation-examples .example-card .example-description,
    .implementation-examples .example-card .example-description,
    .example-card .example-description,
    .example-description {
        font-size: 16px !important;
    }
    
    /* Размер шрифта описания в карточках "Ключевые возможности" - 16px */
    .third-section .capability-item .capability-description,
    .capability-item .capability-description,
    .capability-description {
        font-size: 16px !important;
    }
    
    /* Размер шрифта текста в блоке "Результаты внедрения" - 16px */
    .offer-section .benefit-item .benefit-text,
    .benefit-item .benefit-text,
    .benefit-text {
        font-size: 16px !important;
    }
    
    /* Размер шрифта текста в блоке "Наши эксперты" - 16px */
    .ready-section .ready-experts-list li,
    .ready-experts-list li {
        font-size: 16px !important;
    }
    
    /* Подзаголовок "АВТОМАТИЗАЦИЯ ОБЩЕНИЯ И ПРОЦЕССОВ С ИИ" - верхний padding 40px */
    .hero-section .subtitle,
    .content .subtitle,
    .text-content .subtitle {
        padding-top: 40px !important;
    }
}

/* Медиа-запрос для всех разрешений от 1280px и выше - убираем боковые padding'и у блока "Как работает AI-ассистент?" */
@media (min-width: 1280px) {
    /* Убираем боковые padding'и у контейнера блока "Как работает AI-ассистент?" */
    .how-it-works-section .container {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    /* Адаптируем timeline-container для размещения между направляющими */
    .how-it-works-section .timeline-container {
        padding-left: 60px !important;
        padding-right: 60px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }
    
    /* Адаптируем карточки шагов для правильного размещения */
    .how-it-works-section .timeline-content {
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 24px !important;
        padding-right: 24px !important;
        box-sizing: border-box !important;
        width: 100% !important;
        max-width: none !important;
    }
    
    /* Заголовок "Как работает AI-ассистент?" - левый padding 120px - ПРИНУДИТЕЛЬНО */
    .how-it-works-section .section-title,
    .how-it-works-section .section-header .section-title,
    section.how-it-works-section .section-title,
    section.how-it-works-section .section-header .section-title,
    #how-works .section-title,
    #how-works .section-header .section-title {
        padding-left: 120px !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        text-align: left !important;
        text-indent: 0 !important;
        transform: translateX(0) !important;
    }
    
    /* Убираем левый padding у section-header блока "Какие задачи решает?" */
    .tasks-section .section-header,
    section.tasks-section .section-header,
    #scenarios .section-header {
        padding-left: 0px !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        text-align: left !important;
        text-indent: 0 !important;
        transform: translateX(0) !important;
    }
    
    /* ПРИНУДИТЕЛЬНО убираем левый padding у заголовка "Какие задачи решает?" - МАКСИМАЛЬНАЯ СПЕЦИФИЧНОСТЬ */
    body .tasks-section .section-header .section-title,
    body section.tasks-section .section-header .section-title,
    body #scenarios .section-header .section-title,
    body .tasks-section .section-title,
    body section.tasks-section .section-title,
    body #scenarios .section-title,
    .tasks-section .section-header .section-title[class*="section-title"],
    section.tasks-section .section-header .section-title[class*="section-title"],
    #scenarios .section-header .section-title[class*="section-title"],
    .tasks-section .section-title[class*="section-title"],
    section.tasks-section .section-title[class*="section-title"],
    #scenarios .section-title[class*="section-title"] {
        padding-left: 0px !important;
        padding-right: 0px !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
        text-align: left !important;
        text-indent: 0px !important;
        transform: translateX(0px) !important;
                 box-sizing: border-box !important;
    }
    
    /* Заголовок "Виды ассистентов" - размер шрифта 56px */
    .implementation-title,
    .third-section .implementation-title,
    .third-section .implementation-examples .implementation-title,
    .capabilities-content .implementation-title,
    .implementation-examples .implementation-title {
        font-size: 56px !important;
        line-height: 1.2 !important;
    }
    
    /* Убираем padding'и у контейнера блока "Кому будет полезен?" */
    .second-section .container,
    section.second-section .container,
    #suitable .container {
        padding-left: 0px !important;
        padding-right: 0px !important;
        max-width: 100% !important;
    }
    
    /* Убираем padding'и у контейнера первого блока (hero-section) */
    .hero-section .container,
    section.hero-section .container {
        padding-left: 0px !important;
        padding-right: 0px !important;
        max-width: 100% !important;
    }
    
    /* Подзаголовок первого блока - верхний padding 40px и размер шрифта 24px */
    .hero-section .subtitle,
    .hero-section .text-content .subtitle,
    .text-content .subtitle,
    .content .subtitle {
        padding-top: 40px !important;
        font-size: 24px !important;
        line-height: 1.3 !important;
    }
}

/* Медиа-запрос от 1400px и выше */
@media (min-width: 1400px) {
    /* Убираем левые и правые margin'ы у контейнеров блоков */
    .tasks-section .container,
    section.tasks-section .container,
    #scenarios .container {
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    
    .ready-section .container,
    section.ready-section .container {
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    
    .offer-section .container,
    section.offer-section .container,
    #pricing .container,
    .offer-section .offer-content,
    section.offer-section .offer-content {
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    
    /* Дополнительная принудительная настройка для блока "Мы предлагаем" */
    body .offer-section .container,
    body section.offer-section .container,
    body #pricing .container {
        margin-left: 0px !important;
        margin-right: 0px !important;
        max-width: 100% !important;
    }
    
    /* Убираем margin'ы у контейнера блока "Как работает AI-ассистент?" */
    .how-it-works-section .container,
    section.how-it-works-section .container,
    #how-works .container,
    body .how-it-works-section .container,
    body section.how-it-works-section .container,
    body #how-works .container {
        margin-left: 0px !important;
        margin-right: 0px !important;
        max-width: 100% !important;
    }
    
    /* Убираем margin'ы у контейнера блока "Ключевые возможности" */
    .third-section .container,
    section.third-section .container,
    #capabilities .container,
    body .third-section .container,
    body section.third-section .container,
    body #capabilities .container {
        margin-left: 0px !important;
        margin-right: 0px !important;
        max-width: 100% !important;
    }
    
    /* Дополнительная принудительная настройка для блока "Готовы начать?" */
    body .ready-section .container,
    body section.ready-section .container,
    .ready-section .ready-section-content .container,
    section.ready-section .ready-section-content .container {
        margin-left: 0px !important;
        margin-right: 0px !important;
        max-width: 100% !important;
    }
    
    /* Убираем margin: 0 auto у ready-section-content */
    .ready-section-content,
    .ready-section .ready-section-content,
    section.ready-section .ready-section-content {
        margin-left: 0px !important;
        margin-right: 0px !important;
        margin: 0 !important;
    }
    
    /* Убираем margin: 0 auto у всех основных элементов */
    .container,
    .content,
    .bento-content,
    .capabilities-content,
    .offer-content,
    .timeline-container,
    .tasks-timeline,
    .pricing-card-wrapper,
    .pricing-card-single,
    .footer-content {
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
}

/* Сброс стилей и базовые настройки */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Глобальные переменные для единой системы отступов */
:root {
    --container-max-width: 1400px;
    --container-padding-desktop: 60px;
    --container-padding-tablet: 40px;
    --container-padding-expanded: 30px;
    --container-padding-tablet-large: 35px;
    --container-padding-mobile: 20px;
}

/* Визуальные направляющие отключены */

body {
    font-family: 'Unbounded', sans-serif;
    min-height: 100vh;
    overflow-x: hidden;
    position: relative;
    padding-top: 76px;
    background: #EBEBE9;
}

/* Полноэкранное видео фон */
.fullscreen-video-background {
    position: absolute;
    top: -180px;
    left: 50%;
    transform: translateX(-50%);
    width: 1280px;
    max-width: 90%;
    height: calc(100vh + 200px);
    z-index: -1;
    overflow: hidden;
    background: #EBEBE9;
}

.fullscreen-video {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* Контейнер и основная секция */
.hero-section {
    padding: 0 !important;
    margin: 0 !important;
    background: none !important;
    position: relative !important;
    height: 60vh !important;
    min-height: 600px !important;
    max-height: none !important;
    overflow: visible !important;
}

.container {
    width: 100%;
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-desktop);
    position: relative;
}

.content {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 80px;
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-desktop);
    width: 100%;
}

/* Текстовый контент */
.text-content {
    flex: 1;
    max-width: 50%;
}

.main-title {
    font-size: 96px;
    font-weight: 500;
    font-family: 'Unbounded', sans-serif;
    color: #191925;
    margin-bottom: 15px;
    line-height: 1.0;
    white-space: nowrap;
}

.ai-text {
    color: #145BDE;
}

.highlight-text {
    font-size: 20px;
    font-weight: 500;
}

.line-separator {
    width: 380px;
    height: 3px;
    background: #145BDE;
    margin: 15px 0 25px 0;
    border-radius: 1px;
}

.subtitle {
    font-size: 28px;
    font-weight: 400;
    font-family: 'Unbounded', sans-serif;
    color: #191925;
    letter-spacing: 1px;
    line-height: 1.3;
    text-transform: uppercase;
    margin-top: 0;
    margin-bottom: 40px;
}

/* Кнопка Call-to-Action */
.cta-button {
    background: #145BDE;
    color: #ffffff;
    border: none;
    padding: 18px 36px;
    font-size: 18px;
    font-weight: 600;
    font-family: 'Gilroy', sans-serif;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    letter-spacing: 0.5px;
    box-shadow: 0 2px 8px rgba(2, 132, 199, 0.2);
}

.cta-button:hover {
    background: #145BDE;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(20, 91, 222, 0.3);
}

.cta-button:active {
    background: #145BDE;
    transform: translateY(0px);
    box-shadow: 0 2px 6px rgba(20, 91, 222, 0.4);
}

/* Подпись под кнопкой */
.cta-subtitle {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 24px;
    font-family: 'Gilroy', sans-serif;
    font-size: 14px;
    font-weight: 400;
    color: #6B7280;
    cursor: pointer;
    transition: color 0.3s ease;
}

.cta-subtitle:hover {
    color: #4B5563;
}

.cta-subtitle svg {
    transition: transform 0.3s ease;
}

.cta-subtitle:hover svg {
    transform: translate(1px, -1px);
}

/* Кнопка под карточками */
.cta-section {
    display: flex;
    justify-content: center;
    margin-top: 60px;
    padding: 0 var(--container-padding-desktop);
}

.cta-button-secondary {
    background: #145BDE;
    color: #ffffff;
    border: none;
    padding: 18px 36px;
    font-size: 18px;
    font-weight: 600;
    font-family: 'Gilroy', sans-serif;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    letter-spacing: 0.5px;
    box-shadow: 0 2px 8px rgba(20, 91, 222, 0.2);
    min-width: 200px;
}

.cta-button-secondary:hover {
    background: #0F4BC7;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(20, 91, 222, 0.4);
}

.cta-button-secondary:active {
    background: #0D42B3;
    transform: translateY(0px);
    box-shadow: 0 2px 6px rgba(20, 91, 222, 0.4);
}

/* Второй блок - Bento стиль */
.second-section {
    min-height: 100vh;
    background: #EBEBE9;
    position: relative;
    z-index: 2;
    padding: 120px 0;
}

.bento-content {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-desktop);
    position: relative;
}

/* Заголовок секции */
.section-header {
    text-align: left;
    margin: 0 0 60px calc(-1 * var(--container-padding-desktop));
}

.section-title {
    font-family: 'Unbounded', sans-serif;
    font-size: 56px;
    font-weight: 500;
    color: #191925;
    line-height: 1.1;
    margin: 0 0 0 calc(-1 * var(--container-padding-desktop));
    text-transform: uppercase;
    text-align: left;
}

.bento-content .section-subtitle {
    font-family: 'Gilroy', sans-serif;
    font-size: 16px;
    font-weight: 500;
    color: #6B7280;
    text-align: left;
    margin: 16px 0 0 calc(-1 * var(--container-padding-desktop));
    text-transform: uppercase;
    letter-spacing: 1px;
}

.second-section .section-title {
    padding-left: 120px;
}

/* Business Problems - Шахматная раскладка */
.business-problems {
    display: grid;
    grid-template-columns: 2fr 1fr 2fr;
    grid-template-rows: 1fr 1fr;
    gap: 24px;
    width: 100%;
    margin-top: 80px;
    min-height: 600px;
    align-items: stretch;
    position: relative;
}

/* Первая карточка - Большая слева сверху */
.problem-solution-card:nth-child(1) {
    grid-column: 1 / 2;
    grid-row: 1 / 2;
}

/* Вторая карточка - Маленькая справа сверху */
.problem-solution-card:nth-child(2) {
    grid-column: 2 / 4;
    grid-row: 1 / 2;
}

/* Третья карточка - Маленькая слева снизу */
.problem-solution-card:nth-child(3) {
    grid-column: 1 / 3;
    grid-row: 2 / 3;
}

/* Четвертая карточка - Большая справа снизу */
.problem-solution-card:nth-child(4) {
    grid-column: 3 / 4;
    grid-row: 2 / 3;
}

/* Анимация появления карточек */
.problem-solution-card {
    opacity: 0;
    transform: translateY(40px) scale(0.9);
    animation: cardAppear 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.problem-solution-card:nth-child(1) { animation-delay: 0.1s; }
.problem-solution-card:nth-child(2) { animation-delay: 0.2s; }
.problem-solution-card:nth-child(3) { animation-delay: 0.3s; }
.problem-solution-card:nth-child(4) { animation-delay: 0.4s; }

@keyframes cardAppear {
    0% {
        opacity: 0;
        transform: translateY(40px) scale(0.9);
    }
    50% {
        opacity: 0.8;
        transform: translateY(-5px) scale(1.02);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Problem Solution Cards */
.problem-solution-card {
    border-radius: 20px;
    padding: 36px 32px;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    cursor: pointer;
    display: grid;
    grid-template-rows: 1fr auto 1fr;
    text-align: left;
    height: 100%;
    box-sizing: border-box;
    gap: 0;
    transform: translateY(30px);
    opacity: 0;
}

/* Анимация появления для карточек проблем */
.problem-solution-card.animate-in {
    transform: translateY(0);
    opacity: 1;
}

/* Hover эффект для карточек проблем */
.problem-solution-card:hover {
    transform: translateY(-8px) scale(1.02);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
}

/* Problem and Solution Sections */
.problem-section {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 20px 0;
}

.solution-section {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 12px;
    padding: 20px 0;
}

/* Section Divider */
.section-divider {
    height: 1px;
    margin: 0;
    opacity: 0.3;
    transition: opacity 0.3s ease;
    align-self: stretch;
}

/* Section Tags */
.section-tag {
    background: rgba(255, 255, 255, 0.2);
    color: #FFFFFF;
    font-family: 'Unbounded', sans-serif;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 8px 16px;
    border-radius: 20px;
    display: inline-block;
    width: fit-content;
    white-space: nowrap;
    backdrop-filter: blur(10px);
}

/* Первая карточка - Синий градиент */
.problem-solution-card:nth-child(1) {
    background: linear-gradient(135deg, #145BDE 0%, #1E6FFF 100%);
    box-shadow: 0 4px 20px rgba(20, 91, 222, 0.15);
}

/* Вторая карточка - Серый градиент */
.problem-solution-card:nth-child(2) {
    background: linear-gradient(135deg, #6B7280 0%, #4B5563 100%);
    box-shadow: 0 4px 20px rgba(107, 114, 128, 0.15);
}

/* Третья карточка - Темный градиент */
.problem-solution-card:nth-child(3) {
    background: linear-gradient(135deg, #374151 0%, #111827 100%);
    box-shadow: 0 4px 20px rgba(31, 41, 55, 0.15);
}

/* Четвертая карточка - Светлый градиент */
.problem-solution-card:nth-child(4) {
    background: linear-gradient(135deg, #F9FAFB 0%, #E5E7EB 100%);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
}

/* Единая типографика для всех карточек */

.problem-solution-card .problem-title {
    font-family: 'Gilroy', sans-serif;
    font-size: 19px;
    font-weight: 500;
    line-height: 1.3;
    margin: 0;
    transition: color 0.3s ease;
}

.solution-text {
    font-family: 'Gilroy', sans-serif;
    font-size: 19px;
    font-weight: 500;
    line-height: 1.4;
    margin: 0;
    transition: color 0.3s ease;
}

/* Синяя карточка - белый текст */
.problem-solution-card:nth-child(1) .problem-title {
    color: #FFFFFF;
}

.problem-solution-card:nth-child(1) .solution-text {
    color: #FFFFFF;
}

/* Серая карточка - белый текст */
.problem-solution-card:nth-child(2) .problem-title {
    color: #FFFFFF;
}

.problem-solution-card:nth-child(2) .solution-text {
    color: #FFFFFF;
}

/* Черная карточка - белый текст */
.problem-solution-card:nth-child(3) .problem-title {
    color: #FFFFFF;
}

.problem-solution-card:nth-child(3) .solution-text {
    color: #FFFFFF;
}

/* Белая карточка - темный текст */
.problem-solution-card:nth-child(4) .problem-title {
    color: #1F2937;
}

.problem-solution-card:nth-child(4) .solution-text {
    color: #1F2937;
}

/* Убираем специфические стили для тегов - теперь все теги имеют единый синий стиль */

/* Divider colors for different cards */
.problem-solution-card:nth-child(1) .section-divider {
    background: rgba(255, 255, 255, 0.3);
}

.problem-solution-card:nth-child(2) .section-divider {
    background: rgba(255, 255, 255, 0.3);
}

.problem-solution-card:nth-child(3) .section-divider {
    background: rgba(255, 255, 255, 0.3);
}

.problem-solution-card:nth-child(4) .section-divider {
    background: rgba(0, 0, 0, 0.15);
}

/* Hover effects for dividers */
.problem-solution-card:hover .section-divider {
    opacity: 0.5;
}

/* Card Content Styles */
.problem-badge {
    font-family: 'Gilroy', sans-serif;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 8px 14px;
    border-radius: 8px;
    display: inline-block;
    margin-bottom: 16px;
    background: linear-gradient(135deg, #FFE5E5 0%, #FFD0D0 100%);
    color: #DC2626;
    border: 1px solid rgba(220, 38, 38, 0.2);
}

.solution-badge {
    font-family: 'Gilroy', sans-serif;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 8px 14px;
    border-radius: 8px;
    display: inline-block;
    margin-bottom: 16px;
    background: rgba(255, 255, 255, 0.2);
    color: #FFFFFF;
    border: 1px solid rgba(255, 255, 255, 0.3);
    backdrop-filter: blur(10px);
}

.problem-title {
    font-family: 'Gilroy', sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: #111827;
    line-height: 1.3;
    margin: 0 0 12px 0;
    padding-right: 60px;
}

.solution-title {
    font-family: 'Gilroy', sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: #FFFFFF;
    line-height: 1.3;
    margin: 0 0 12px 0;
    padding-right: 60px;
}

.problem-description {
    font-family: 'Gilroy', sans-serif;
    font-size: 13px;
    font-weight: 400;
    color: #6B7280;
    line-height: 1.4;
    margin: 0;
    padding-right: 40px;
}

.solution-description {
    font-family: 'Gilroy', sans-serif;
    font-size: 13px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.9);
    line-height: 1.4;
    margin: 0;
    padding-right: 40px;
}

/* Теги на светлой карточке */
.problem-solution-card:nth-child(4) .section-tag {
    background: rgba(0, 0, 0, 0.1);
    color: #1F2937;
}

/* Третий блок - Возможности AI-ассистента */
.third-section {
    background: #1A202C;
    position: relative;
    z-index: 2;
    padding: 140px 0;
    overflow: hidden;
}

.third-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(circle at 20% 80%, rgba(255, 255, 255, 0.15) 0%, transparent 50%),
        radial-gradient(circle at 80% 20%, rgba(255, 255, 255, 0.1) 0%, transparent 50%),
        radial-gradient(circle at 40% 40%, rgba(185, 227, 255, 0.1) 0%, transparent 30%);
    pointer-events: none;
}

.third-section::after {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Ccircle cx='7' cy='7' r='1'/%3E%3Ccircle cx='37' cy='37' r='1'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    pointer-events: none;
    animation: float 20s ease-in-out infinite;
}

@keyframes float {
    0%, 100% { transform: translateX(0) translateY(0); }
    25% { transform: translateX(10px) translateY(-10px); }
    50% { transform: translateX(-5px) translateY(-20px); }
    75% { transform: translateX(-10px) translateY(-10px); }
}

/* Анимации для персонажей */
@keyframes breathe {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.02); }
}

@keyframes wave {
    0%, 100% { transform: rotate(0deg) scale(1); }
    25% { transform: rotate(-2deg) scale(1.01); }
    50% { transform: rotate(2deg) scale(1.02); }
    75% { transform: rotate(-1deg) scale(1.01); }
}

@keyframes blink {
    0%, 90%, 100% { opacity: 1; }
    95% { opacity: 0.3; }
}

@keyframes wiggle {
    0%, 100% { transform: translateX(0) translateY(0) rotate(0deg); }
    20% { transform: translateX(-2px) translateY(-1px) rotate(-1deg); }
    40% { transform: translateX(2px) translateY(1px) rotate(1deg); }
    60% { transform: translateX(-1px) translateY(0px) rotate(-0.5deg); }
    80% { transform: translateX(1px) translateY(-1px) rotate(0.5deg); }
}

@keyframes sparkle {
    0%, 100% { opacity: 0; transform: scale(0.5); }
    50% { opacity: 1; transform: scale(1); }
}

@keyframes characterAppear {
    0% { 
        opacity: 0; 
        transform: scale(0.3) rotate(-10deg) translateY(30px); 
    }
    50% { 
        opacity: 0.8; 
        transform: scale(1.1) rotate(5deg) translateY(-10px); 
    }
    100% { 
        opacity: 1; 
        transform: scale(1) rotate(0deg) translateY(0); 
    }
}

.capabilities-content {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-desktop);
    position: relative;
    z-index: 1;
}

.white-title {
    color: #FFFFFF !important;
}

.section-subtitle {
    font-family: 'Gilroy', sans-serif;
    font-size: 20px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.8);
    text-align: left;
    margin-top: 24px;
    line-height: 1.4;
    position: relative;
    padding-left: 32px;
}



.capabilities-list {
    display: flex;
    flex-direction: column;
    gap: 48px;
    margin-top: 80px;
    width: 100%;
}

.capability-item {
    display: flex;
    align-items: flex-start;
    gap: 40px;
    opacity: 0;
    transform: translateX(-50px);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    padding: 24px;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid transparent;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}

/* Убрано белое свечение при hover */

.capability-item.animate-in {
    opacity: 1;
    transform: translateX(0);
}

.capability-item:nth-child(1) { transition-delay: 0.1s; }
.capability-item:nth-child(2) { transition-delay: 0.3s; }
.capability-item:nth-child(3) { transition-delay: 0.5s; }

.capability-item:hover {
    transform: translateX(8px) translateY(-4px);
    box-shadow: 
        0 0 0 1px rgba(20, 91, 222, 0.6),
        0 0 20px rgba(20, 91, 222, 0.4),
        0 0 40px rgba(20, 91, 222, 0.2),
        0 12px 40px rgba(20, 91, 222, 0.2), 
        0 4px 16px rgba(0, 0, 0, 0.3);
    background: rgba(0, 0, 0, 0.15);
}

.capability-number {
    font-family: 'Gilroy', sans-serif;
    font-size: 120px;
    font-weight: 800;
    color: #ffffff;
    line-height: 0.8;
    min-width: 160px;
    text-align: center;
    position: relative;
    transition: all 0.4s ease;
    align-self: flex-end;
}

.capability-number::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0);
    width: 140px;
    height: 140px;
    background: radial-gradient(circle, rgba(20, 91, 222, 0.4) 0%, transparent 70%);
    border-radius: 50%;
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 0 40px rgba(20, 91, 222, 0.6);
}

.capability-number::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 120px;
    height: 120px;
    border: 2px solid rgba(20, 91, 222, 0.6);
    border-radius: 50%;
    opacity: 0;
    transition: all 0.4s ease;
    box-shadow: 0 0 30px rgba(20, 91, 222, 0.5);
}

.capability-item:hover .capability-number {
    background: linear-gradient(135deg, #145BDE 0%, #1E6FFF 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    transform: scale(1.05);
}

.capability-item:hover .capability-number::before {
    transform: translate(-50%, -50%) scale(1);
}

.capability-item:hover .capability-number::after {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1.2);
    animation: numberGlow 2s ease-in-out infinite alternate;
}

@keyframes numberGlow {
    0% { 
        opacity: 0.7;
        box-shadow: 0 0 30px rgba(20, 91, 222, 0.5);
    }
    100% { 
        opacity: 1;
        box-shadow: 0 0 50px rgba(20, 91, 222, 0.8);
    }
}

.capability-content {
    flex: 1;
    padding-top: 8px;
}

.capability-title {
    font-family: 'Gilroy', sans-serif;
    font-size: 28px;
    font-weight: 700;
    color: #FFFFFF;
    line-height: 1.2;
    margin: 0 0 16px 0;
    transition: color 0.3s ease;
}

.capability-item:hover .capability-title {
    color: #FFFFFF;
}

.capability-description {
    font-family: 'Gilroy', sans-serif;
    font-size: 18px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.6;
    margin: 0;
    transition: color 0.3s ease;
}

.capability-item:hover .capability-description {
    color: rgba(255, 255, 255, 0.95);
}

/* Виды ассистентов */
.implementation-examples {
    margin-top: 120px;
}

.section-subtitle-wrapper {
    text-align: left;
    margin: 0 0 48px calc(-1 * var(--container-padding-desktop));
}

.implementation-title {
    font-family: 'Unbounded', sans-serif;
    font-size: 28px;
    font-weight: 600;
    color: white;
    position: relative;
    display: inline-block;
    margin: 0;
    padding-left: 60px;
}

/* Убираем подчеркивание у заголовка "Виды ассистентов" */

/* Убираем стили кнопки */

.examples-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 40px;
    width: 100%;
}

.example-card {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid transparent;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-radius: 24px;
    padding: 28px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    transform: translateY(20px);
    opacity: 0;
    position: relative;
    display: flex;
    flex-direction: column;
}

.example-card.animate-in {
    opacity: 1;
    transform: translateY(0);
}

.example-card:nth-child(1) { transition-delay: 0.6s; }
.example-card:nth-child(2) { transition-delay: 0.8s; }

.example-card:hover {
    transform: translateY(-8px) scale(1.02);
    box-shadow: 
        0 0 0 1px rgba(20, 91, 222, 0.6),
        0 0 20px rgba(20, 91, 222, 0.4),
        0 0 40px rgba(20, 91, 222, 0.2),
        0 12px 40px rgba(20, 91, 222, 0.2), 
        0 4px 16px rgba(0, 0, 0, 0.3);
    background: rgba(0, 0, 0, 0.15);
}

.card-image {
    width: 100%;
    height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
    position: relative;
    overflow: hidden;
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.03) 100%);
}

/* Добавляем мерцающие элементы для оживления */
.card-image::before {
    content: '';
    position: absolute;
    top: 20%;
    left: 20%;
    width: 6px;
    height: 6px;
    background: rgba(255, 255, 255, 0.8);
    border-radius: 50%;
    animation: sparkle 2s ease-in-out infinite;
    z-index: 1;
}

.card-image::after {
    content: '';
    position: absolute;
    top: 30%;
    right: 25%;
    width: 4px;
    height: 4px;
    background: rgba(255, 255, 255, 0.6);
    border-radius: 50%;
    animation: sparkle 3s ease-in-out infinite;
    animation-delay: 1s;
    z-index: 1;
}

.example-image {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    border-radius: 12px;
    transform-origin: center center;
}

/* Анимация появления убрана */

/* Hover анимация изображений убрана */

/* Специальные анимации для изображений убраны */

.card-header {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 20px;
    position: relative;
    top: 0;
    left: 0;
    z-index: 2;
}

.card-number {
    font-family: 'Gilroy', sans-serif;
    font-size: 32px;
    font-weight: 800;
    color: #145BDE;
    line-height: 1;
}

.card-badge {
    background: rgba(255, 255, 255, 0.15);
    color: rgba(255, 255, 255, 0.9);
    padding: 8px 16px;
    border-radius: 20px;
    font-weight: 600;
    font-size: 12px;
    white-space: nowrap;
    text-transform: uppercase;
}

.example-title {
    font-family: 'Unbounded', sans-serif;
    font-size: 20px;
    font-weight: 600;
    color: #ffffff;
    line-height: 1.3;
    margin: 0 0 16px 0;
}

.example-description {
    font-family: 'Gilroy', sans-serif;
    font-size: 15px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.5;
    margin: 0 0 20px 0;
}

.example-cta-button {
    background: linear-gradient(135deg, #145BDE 0%, #0F4BC7 50%, #1E6EFF 100%);
    color: #ffffff;
    border: none;
    padding: 16px 24px;
    font-size: 15px;
    font-weight: 600;
    font-family: 'Gilroy', sans-serif;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    width: 100%;
    margin-top: auto;
    position: relative;
    overflow: hidden;
    letter-spacing: 0.5px;
    box-shadow: 0 4px 15px rgba(20, 91, 222, 0.3);
    text-align: center;
}

.example-cta-button::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transition: left 0.5s;
}

.example-cta-button:hover {
    background: linear-gradient(135deg, #0F4BC7 0%, #145BDE 50%, #2A7EFF 100%);
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(20, 91, 222, 0.5);
    scale: 1.02;
}

.example-cta-button:hover::before {
    left: 100%;
}

.example-cta-button:active {
    background: linear-gradient(135deg, #0D3F9F 0%, #0F4BC7 50%, #1A6BF5 100%);
    transform: translateY(-1px);
    box-shadow: 0 4px 15px rgba(20, 91, 222, 0.4);
    scale: 0.98;
}

/* Адаптивность */
@media (max-width: 1311px) and (min-width: 1025px) {
    .subtitle {
        font-size: 20px;
    }
}

/* Медиа-запрос для всех разрешений от 1200px и выше - карточки ассистентов в два ряда */
@media (min-width: 1200px) {
    /* Верхний padding для текста первого блока - 60px */
    .hero-section .text-content,
    .text-content {
        padding-top: 60px !important;
    }
    
    /* Размер шрифта описания в плашках "Кому будет полезен?" - 16px */
    .second-section .problem-solution-card .solution-text,
    .problem-solution-card .solution-text,
    .solution-text {
        font-size: 16px !important;
    }
    
    /* Контейнер блока "Виды ассистентов" - выравнивание по направляющим 60px */
    .third-section .implementation-examples,
    .implementation-examples {
        padding-left: 60px !important;
        padding-right: 60px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }
    
    /* Принудительные стили для блока "Виды ассистентов" - максимальная специфичность */
    .third-section .implementation-examples .examples-grid,
    .implementation-examples .examples-grid,
    section .implementation-examples .examples-grid,
    .examples-grid {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        grid-template-rows: auto !important;
        gap: 30px !important;
        flex-direction: unset !important;
        flex-wrap: unset !important;
        justify-content: unset !important;
        align-items: unset !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
        max-width: none !important;
        box-sizing: border-box !important;
    }
    
    .third-section .implementation-examples .example-card,
    .implementation-examples .example-card,
    section .implementation-examples .example-card,
    .example-card {
        width: 100% !important;
        max-width: none !important;
        min-width: unset !important;
        margin: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        flex: unset !important;
        flex-basis: unset !important;
        box-sizing: border-box !important;
        padding: 24px !important;
    }
    
    /* Заголовок "Виды ассистентов" - выравнивание по направляющим */
    .third-section .implementation-examples .implementation-title,
    .implementation-examples .implementation-title,
    .implementation-title {
        padding-left: 60px !important;
        margin-left: 0 !important;
        text-align: left !important;
    }
    
    /* Размер шрифта описания в карточках ассистентов - 16px */
    .third-section .implementation-examples .example-card .example-description,
    .implementation-examples .example-card .example-description,
    .example-card .example-description,
    .example-description {
        font-size: 16px !important;
    }
    
    /* Блок "Ключевые возможности" - выравнивание по направляющим и размеры шрифтов */
    
    /* Заголовок "КЛЮЧЕВЫЕ ВОЗМОЖНОСТИ" - размер 56px и выравнивание с отступом 120px */
    .third-section .section-title,
    .third-section .capabilities-content .section-title,
    section.third-section .section-title {
        font-size: 56px !important;
        padding-left: 120px !important;
        margin-left: 0 !important;
        text-align: left !important;
    }
    
    /* Контейнер плашек "Ключевые возможности" - выравнивание по направляющим */
    .third-section .capabilities-list,
    .capabilities-list {
        padding-left: 60px !important;
        padding-right: 60px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }
    
    /* Плашки "Ключевые возможности" - принудительное выравнивание */
    .third-section .capability-item,
    .capability-item {
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 24px !important;
        padding-right: 24px !important;
        width: 100% !important;
        max-width: none !important;
        box-sizing: border-box !important;
    }
    
    /* Описание в плашках "Ключевые возможности" - размер шрифта 16px */
    .third-section .capability-item .capability-description,
    .capability-item .capability-description,
    .capability-description {
        font-size: 16px !important;
    }
}

/* Медиа-запрос для всех разрешений от 1025px и выше - размер шрифта описания в карточках ассистентов 16px */
@media (min-width: 1025px) {
    /* Размер шрифта описания в карточках ассистентов - 16px */
    .third-section .implementation-examples .example-card .example-description,
    .implementation-examples .example-card .example-description,
    .example-card .example-description,
    .example-description {
        font-size: 16px !important;
    }
    
    /* Размер шрифта описания в карточках "Ключевые возможности" - 16px */
    .third-section .capability-item .capability-description,
    .capability-item .capability-description,
    .capability-description {
        font-size: 16px !important;
    }
    
    /* Размер шрифта текста в блоке "Результаты внедрения" - 16px */
    .offer-section .benefit-item .benefit-text,
    .benefit-item .benefit-text,
    .benefit-text {
        font-size: 16px !important;
    }
    
    /* Размер шрифта текста в блоке "Наши эксперты" - 16px */
    .ready-section .ready-experts-list li,
    .ready-experts-list li {
        font-size: 16px !important;
    }
    
    /* Подзаголовок "АВТОМАТИЗАЦИЯ ОБЩЕНИЯ И ПРОЦЕССОВ С ИИ" - верхний padding 40px */
    .hero-section .subtitle,
    .content .subtitle,
    .text-content .subtitle {
        padding-top: 40px !important;
    }
}

/* Медиа-запрос для всех разрешений от 1280px и выше - убираем боковые padding'и у блока "Как работает AI-ассистент?" */
@media (min-width: 1280px) {
    /* Убираем боковые padding'и у контейнера блока "Как работает AI-ассистент?" */
    .how-it-works-section .container {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    /* Адаптируем timeline-container для размещения между направляющими */
    .how-it-works-section .timeline-container {
        padding-left: 60px !important;
        padding-right: 60px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }
    
    /* Адаптируем карточки шагов для правильного размещения */
    .how-it-works-section .timeline-content {
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 24px !important;
        padding-right: 24px !important;
        box-sizing: border-box !important;
        width: 100% !important;
        max-width: none !important;
    }
    
    /* Заголовок "Как работает AI-ассистент?" - левый padding 120px - ПРИНУДИТЕЛЬНО */
    .how-it-works-section .section-title,
    .how-it-works-section .section-header .section-title,
    section.how-it-works-section .section-title,
    section.how-it-works-section .section-header .section-title,
    #how-works .section-title,
    #how-works .section-header .section-title {
        padding-left: 120px !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        text-align: left !important;
        text-indent: 0 !important;
        transform: translateX(0) !important;
    }
    
    /* Убираем левый padding у section-header блока "Какие задачи решает?" */
    .tasks-section .section-header,
    section.tasks-section .section-header,
    #scenarios .section-header {
        padding-left: 0px !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        text-align: left !important;
        text-indent: 0 !important;
        transform: translateX(0) !important;
    }
    
    /* ПРИНУДИТЕЛЬНО убираем левый padding у заголовка "Какие задачи решает?" - МАКСИМАЛЬНАЯ СПЕЦИФИЧНОСТЬ */
    body .tasks-section .section-header .section-title,
    body section.tasks-section .section-header .section-title,
    body #scenarios .section-header .section-title,
    body .tasks-section .section-title,
    body section.tasks-section .section-title,
    body #scenarios .section-title,
    .tasks-section .section-header .section-title[class*="section-title"],
    section.tasks-section .section-header .section-title[class*="section-title"],
    #scenarios .section-header .section-title[class*="section-title"],
    .tasks-section .section-title[class*="section-title"],
    section.tasks-section .section-title[class*="section-title"],
    #scenarios .section-title[class*="section-title"] {
        padding-left: 0px !important;
        padding-right: 0px !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
        text-align: left !important;
        text-indent: 0px !important;
        transform: translateX(0px) !important;
                 box-sizing: border-box !important;
    }
    
    /* Заголовок "Виды ассистентов" - размер шрифта 56px */
    .implementation-title,
    .third-section .implementation-title,
    .third-section .implementation-examples .implementation-title,
    .capabilities-content .implementation-title,
    .implementation-examples .implementation-title {
        font-size: 56px !important;
        line-height: 1.2 !important;
    }
    
    /* Убираем padding'и у контейнера блока "Кому будет полезен?" */
    .second-section .container,
    section.second-section .container,
    #suitable .container {
        padding-left: 0px !important;
        padding-right: 0px !important;
        max-width: 100% !important;
    }
    
    /* Убираем padding'и у контейнера первого блока (hero-section) */
    .hero-section .container,
    section.hero-section .container {
        padding-left: 0px !important;
        padding-right: 0px !important;
        max-width: 100% !important;
    }
    
    /* Подзаголовок первого блока - верхний padding 40px и размер шрифта 24px */
    .hero-section .subtitle,
    .hero-section .text-content .subtitle,
    .text-content .subtitle,
    .content .subtitle {
        padding-top: 40px !important;
        font-size: 24px !important;
        line-height: 1.3 !important;
    }
}

/* Медиа-запрос от 1400px и выше */
@media (min-width: 1400px) {
    /* Убираем левые и правые margin'ы у контейнеров блоков */
    .tasks-section .container,
    section.tasks-section .container,
    #scenarios .container {
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    
    .ready-section .container,
    section.ready-section .container {
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    
    .offer-section .container,
    section.offer-section .container,
    #pricing .container,
    .offer-section .offer-content,
    section.offer-section .offer-content {
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    
    /* Дополнительная принудительная настройка для блока "Мы предлагаем" */
    body .offer-section .container,
    body section.offer-section .container,
    body #pricing .container {
        margin-left: 0px !important;
        margin-right: 0px !important;
        max-width: 100% !important;
    }
    
    /* Убираем margin'ы у контейнера блока "Как работает AI-ассистент?" */
    .how-it-works-section .container,
    section.how-it-works-section .container,
    #how-works .container,
    body .how-it-works-section .container,
    body section.how-it-works-section .container,
    body #how-works .container {
        margin-left: 0px !important;
        margin-right: 0px !important;
        max-width: 100% !important;
    }
    
    /* Убираем margin'ы у контейнера блока "Ключевые возможности" */
    .third-section .container,
    section.third-section .container,
    #capabilities .container,
    body .third-section .container,
    body section.third-section .container,
    body #capabilities .container {
        margin-left: 0px !important;
        margin-right: 0px !important;
        max-width: 100% !important;
    }
    
    /* Дополнительная принудительная настройка для блока "Готовы начать?" */
    body .ready-section .container,
    body section.ready-section .container,
    .ready-section .ready-section-content .container,
    section.ready-section .ready-section-content .container {
        margin-left: 0px !important;
        margin-right: 0px !important;
        max-width: 100% !important;
    }
    
    /* Убираем margin: 0 auto у ready-section-content */
    .ready-section-content,
    .ready-section .ready-section-content,
    section.ready-section .ready-section-content {
        margin-left: 0px !important;
        margin-right: 0px !important;
        margin: 0 !important;
    }
    
    /* Убираем margin: 0 auto у всех основных элементов */
    .container,
    .content,
    .bento-content,
    .capabilities-content,
    .offer-content,
    .timeline-container,
    .tasks-timeline,
    .pricing-card-wrapper,
    .pricing-card-single,
    .footer-content {
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
}

/* Медиа-запрос от 1440px и выше */
@media (min-width: 1440px) {
    /* Убираем левый padding у подзаголовка блока "Мы предлагаем" */
    .offer-section .section-subtitle,
    .offer-content .section-subtitle,
    section.offer-section .section-subtitle {
        padding-left: 0px !important;
        margin-left: 0px !important;
    }
    
    /* Направляющие линии по всему лендингу */
    body::before,
    body::after {
        content: '';
        position: fixed;
        top: 0;
        bottom: 0;
        width: 1px;
        background: rgba(20, 91, 222, 0.3);
        z-index: 9999;
        pointer-events: none;
    }
    
    /* Левая направляющая - по левому краю блока "Какие задачи решает?" */
    body::before {
        left: 120px;
    }
    
    /* Правая направляющая - по правому краю блока "Какие задачи решает?" */
    body::after {
        right: 120px;
    }
    
    /* Выравниваем все блоки по направляющим */
    
    /* Первый блок (Hero) */
    .hero-section .container,
    .hero-section .content {
        padding-left: 120px !important;
        padding-right: 120px !important;
        max-width: 100% !important;
    }
    
    /* Второй блок (Кому будет полезен?) */
    .second-section .container,
    .second-section .bento-content {
        padding-left: 120px !important;
        padding-right: 120px !important;
        max-width: 100% !important;
    }
    
    /* Третий блок (Ключевые возможности) */
    .third-section .container,
    .third-section .capabilities-content {
        padding-left: 120px !important;
        padding-right: 120px !important;
        max-width: 100% !important;
    }
    
    /* Четвертый блок (Как работает AI-ассистент?) */
    .how-it-works-section .container {
        padding-left: 120px !important;
        padding-right: 120px !important;
        max-width: 100% !important;
    }
    
    /* Пятый блок (Какие задачи решает?) */
    .tasks-section .container {
        padding-left: 120px !important;
        padding-right: 120px !important;
        max-width: 100% !important;
    }
    
    /* Шестой блок (Мы предлагаем) */
    .offer-section .offer-content {
        padding-left: 120px !important;
        padding-right: 120px !important;
        max-width: 100% !important;
    }
    
    /* Седьмой блок (Готовы начать?) */
    .ready-section .ready-section-content {
        padding-left: 120px !important;
        padding-right: 120px !important;
        max-width: 100% !important;
    }
    
    /* Футер */
    .footer-section .footer-content {
        padding-left: 120px !important;
        padding-right: 120px !important;
        max-width: 100% !important;
    }
    
    /* Убираем левые padding'и у текстов блока "Готовы начать?" */
    
    /* Заголовок "Готовы начать?" */
    .ready-section .section-title,
    .ready-header .section-title {
        padding-left: 0px !important;
        margin-left: 0px !important;
    }
    
    /* Описание под заголовком */
    .ready-description,
    .ready-left .ready-description {
        padding-left: 0px !important;
        margin-left: 0px !important;
    }
    
    /* Заголовок "Наши эксперты:" */
    .ready-experts-title,
    .ready-experts .ready-experts-title,
    .ready-left .ready-experts .ready-experts-title,
    .ready-section .ready-experts-title,
    .ready-section .ready-left .ready-experts-title,
    body .ready-section .ready-experts-title {
        padding-left: 0px !important;
        margin-left: 0px !important;
        text-indent: 0px !important;
        transform: translateX(0) !important;
    }
    
    /* Список экспертов */
    .ready-experts-list,
    .ready-experts .ready-experts-list {
        padding-left: 0px !important;
        margin-left: 0px !important;
    }
    
    /* Элементы списка экспертов */
    .ready-experts-list li {
        padding-left: 20px !important;
        margin-left: 0px !important;
        text-indent: 0px !important;
    }
    
    /* Псевдоэлементы буллитов */
    .ready-experts-list li::before {
        left: 0px !important;
        margin-left: 0px !important;
        transform: translateX(0) !important;
    }
    
    /* Контейнер "Наши эксперты" */
    .ready-experts,
    .ready-left .ready-experts,
    .ready-section .ready-experts,
    body .ready-section .ready-experts {
        padding-left: 0px !important;
        padding-right: 0px !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    
    /* Левая часть футера */
    .footer-left,
    .footer-content .footer-left,
    .footer-section .footer-left,
    body .footer-section .footer-left {
        padding-left: 0px !important;
        margin-left: 0px !important;
    }
    
    /* Timeline блока "Какие задачи решает?" */
    .tasks-timeline,
    .tasks-section .tasks-timeline,
    body .tasks-section .tasks-timeline {
        padding-left: 0px !important;
        padding-right: 0px !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    
    /* Timeline-container блока "Как работает AI-ассистент?" - убираем padding'и */
    .timeline-container,
    .how-it-works-section .timeline-container,
    body .how-it-works-section .timeline-container {
        padding-left: 0px !important;
        padding-right: 0px !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    
    /* Заголовок "Как работает AI-ассистент?" - левый padding 60px */
    .how-it-works-section .section-title,
    .how-it-works-section .section-header .section-title,
    section.how-it-works-section .section-title,
    section.how-it-works-section .section-header .section-title,
    #how-works .section-title,
    #how-works .section-header .section-title,
    body .how-it-works-section .section-title {
        padding-left: 60px !important;
        padding-right: 0px !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
        text-align: left !important;
        text-indent: 0px !important;
        transform: translateX(0) !important;
    }
    
    /* Плашки timeline-content на всю ширину контейнера без ограничений - ПРИНУДИТЕЛЬНО */
    .timeline-content,
    .how-it-works-section .timeline-content,
    body .how-it-works-section .timeline-content,
    section.how-it-works-section .timeline-content,
    .how-it-works-section .timeline-step .timeline-content {
        width: 100% !important;
        max-width: none !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
        box-sizing: border-box !important;
        flex: 1 !important;
        min-width: 0 !important;
    }
    
    /* Контейнер с видами ассистентов - убираем padding'и */
    .implementation-examples,
    .third-section .implementation-examples,
    body .third-section .implementation-examples {
        padding-left: 0px !important;
        padding-right: 0px !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    
    /* Сетка с карточками видов ассистентов - убираем padding'и */
    .examples-grid,
    .implementation-examples .examples-grid,
    .third-section .examples-grid,
    body .third-section .examples-grid {
        padding-left: 0px !important;
        padding-right: 0px !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    
    /* Контейнер capabilities-list - убираем padding'и */
    .capabilities-list,
    .third-section .capabilities-list,
    body .third-section .capabilities-list {
        padding-left: 0px !important;
        padding-right: 0px !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    
    /* Заголовок "КЛЮЧЕВЫЕ ВОЗМОЖНОСТИ" - левый padding 60px */
    .third-section .section-title,
    .third-section .capabilities-content .section-title,
    section.third-section .section-title,
    body .third-section .section-title {
        padding-left: 60px !important;
        padding-right: 0px !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
        text-align: left !important;
        text-indent: 0px !important;
        transform: translateX(0) !important;
    }
    
    /* Заголовок "Какие задачи решает?" - размер шрифта 56px */
    .tasks-section .section-title,
    .tasks-section .section-header .section-title,
    section.tasks-section .section-title,
    section.tasks-section .section-header .section-title,
    #scenarios .section-title,
    #scenarios .section-header .section-title {
        font-size: 56px !important;
        line-height: 1.2 !important;
    }
}

/* Мобильные стили для hero-section */
@media (max-width: 768px) {
    /* Отключение анимаций для capability-item в мобильных устройствах */
    .capability-item {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
    
    .capability-item:nth-child(1),
    .capability-item:nth-child(2),
    .capability-item:nth-child(3) {
        transition-delay: 0s !important;
    }
    
    .capability-item.animate-in {
        opacity: 1 !important;
        transform: none !important;
    }
    
    .capability-item:hover {
        transform: none !important;
    }

    /* Отключение анимаций для example-card (плашек) в мобильных устройствах */
    .example-card {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
    
    .example-card:nth-child(1),
    .example-card:nth-child(2) {
        transition-delay: 0s !important;
    }
    
    .example-card.animate-in {
        opacity: 1 !important;
        transform: none !important;
    }
    
    .example-card:hover {
        transform: none !important;
        scale: 1 !important;
        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2) !important;
    }

    .hero-section {
        display: flex !important;
        flex-direction: column !important;
        justify-content: space-between !important;
        min-height: 100vh !important;
        padding-bottom: 40px !important;
        overflow: visible !important;
        position: relative !important;
        background: transparent !important;
        z-index: 1 !important;
    }
    
    .hero-section .container {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 !important;
        justify-content: space-between !important;
        overflow: visible !important;
    }
    
    .hero-section .content {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 !important;
        justify-content: space-between !important;
        min-height: 350px !important;
        max-height: 450px !important;
        background: transparent !important;
        z-index: 2 !important;
        position: relative !important;
    }
    
    .hero-section .text-content {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 !important;
        justify-content: space-between !important;
        width: 100% !important;
        max-width: 100% !important;
        height: 65vh !important;
        white-space: normal !important;
        overflow: visible !important;
    }

    .hero-section .subtitle {
        margin-top: 0 !important;
        padding-top: 0 !important;
        font-size: 12px !important;
        line-height: 1.4 !important;
        display: block !important;
        white-space: normal !important;
        text-align: left !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        width: 100% !important;
        max-width: 300px !important;
        word-break: break-word !important;
        overflow-wrap: break-word !important;
        overflow: visible !important;
        margin-bottom: 24px !important;
    }
    
    .hero-section .cta-subtitle {
        display: none !important;
    }
    
    .hero-section .cta-button {
        width: 100% !important;
        margin-top: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        text-align: center !important;
        align-self: stretch !important;
        order: 999 !important;
        margin-bottom: 0 !important;
    }

    .hero-section .fullscreen-video-background {
        margin-top: 60px !important;
        overflow: visible !important;
        transform: translateX(-50%) scale(2.55) !important;
        max-width: 140% !important;
        position: absolute !important;
        top: 180px !important;
        z-index: 1 !important;
        width: 100% !important;
        height: 100% !important;
    }

    .hero-section .fullscreen-video {
        transform: scale(2.55) !important;
    }
}

@media (max-width: 640px) {
    /* Отключение анимаций для capability-item в мобильных устройствах */
    .capability-item {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
    
    .capability-item:nth-child(1),
    .capability-item:nth-child(2),
    .capability-item:nth-child(3) {
        transition-delay: 0s !important;
    }
    
    .capability-item.animate-in {
        opacity: 1 !important;
        transform: none !important;
    }
    
    .capability-item:hover {
        transform: none !important;
    }

    /* Отключение анимаций для example-card (плашек) в мобильных устройствах */
    .example-card {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
    
    .example-card:nth-child(1),
    .example-card:nth-child(2) {
        transition-delay: 0s !important;
    }
    
    .example-card.animate-in {
        opacity: 1 !important;
        transform: none !important;
    }
    
    .example-card:hover {
        transform: none !important;
        scale: 1 !important;
        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2) !important;
    }

    .hero-section {
        display: flex !important;
        flex-direction: column !important;
        justify-content: space-between !important;
        min-height: 100vh !important;
        padding-bottom: 40px !important;
        overflow: visible !important;
        position: relative !important;
        background: transparent !important;
        z-index: 1 !important;
    }
    
    .hero-section .container {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 !important;
        justify-content: space-between !important;
        overflow: visible !important;
    }
    
    .hero-section .content {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 !important;
        justify-content: space-between !important;
        min-height: 350px !important;
        max-height: 450px !important;
        background: transparent !important;
        z-index: 2 !important;
        position: relative !important;
    }
    
    .hero-section .text-content {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 !important;
        justify-content: space-between !important;
        width: 100% !important;
        max-width: 100% !important;
        height: 65vh !important;
        white-space: normal !important;
        overflow: visible !important;
    }

    .hero-section .subtitle {
        margin-top: 0 !important;
        padding-top: 0 !important;
        font-size: 12px !important;
        line-height: 1.4 !important;
        display: block !important;
        white-space: normal !important;
        text-align: left !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        width: 100% !important;
        max-width: 300px !important;
        word-break: break-word !important;
        overflow-wrap: break-word !important;
        overflow: visible !important;
        margin-bottom: 24px !important;
    }
    
    .hero-section .cta-subtitle {
        display: none !important;
    }
    
    .hero-section .cta-button {
        width: 100% !important;
        margin-top: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        text-align: center !important;
        align-self: stretch !important;
        order: 999 !important;
        margin-bottom: 0 !important;
    }

    .hero-section .fullscreen-video-background {
        margin-top: 60px !important;
        overflow: visible !important;
        transform: translateX(-50%) scale(2.55) !important;
        max-width: 140% !important;
        position: absolute !important;
        top: 180px !important;
        z-index: 1 !important;
        width: 100% !important;
        height: 100% !important;
    }

    .hero-section .fullscreen-video {
        transform: scale(2.55) !important;
    }
}

@media (max-width: 480px) {
    /* Отключение анимаций для capability-item в мобильных устройствах */
    .capability-item {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
    
    .capability-item:nth-child(1),
    .capability-item:nth-child(2),
    .capability-item:nth-child(3) {
        transition-delay: 0s !important;
    }
    
    .capability-item.animate-in {
        opacity: 1 !important;
        transform: none !important;
    }
    
    .capability-item:hover {
        transform: none !important;
    }

    /* Отключение анимаций для example-card (плашек) в мобильных устройствах */
    .example-card {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
    
    .example-card:nth-child(1),
    .example-card:nth-child(2) {
        transition-delay: 0s !important;
    }
    
    .example-card.animate-in {
        opacity: 1 !important;
        transform: none !important;
    }
    
    .example-card:hover {
        transform: none !important;
        scale: 1 !important;
        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2) !important;
    }

    .hero-section {
        display: flex !important;
        flex-direction: column !important;
        justify-content: space-between !important;
        min-height: 100vh !important;
        padding-bottom: 40px !important;
        overflow: visible !important;
        position: relative !important;
        background: transparent !important;
        z-index: 1 !important;
    }
    
    .hero-section .container {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 !important;
        justify-content: space-between !important;
        overflow: visible !important;
    }
    
    .hero-section .content {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 !important;
        justify-content: space-between !important;
        min-height: 350px !important;
        max-height: 450px !important;
        background: transparent !important;
        z-index: 2 !important;
        position: relative !important;
    }
    
    .hero-section .text-content {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 !important;
        justify-content: space-between !important;
        width: 100% !important;
        max-width: 100% !important;
        height: 65vh !important;
        white-space: normal !important;
        overflow: visible !important;
    }

    .hero-section .subtitle {
        margin-top: -200px !important;
        padding-top: 40px !important;
        font-size: 12px !important;
        line-height: 1.4 !important;
        display: block !important;
        white-space: normal !important;
        text-align: left !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        width: 100% !important;
        max-width: 300px !important;
        word-break: break-word !important;
        overflow-wrap: break-word !important;
        overflow: visible !important;
        margin-bottom: 24px !important;
    }
    
    .hero-section .cta-subtitle {
        display: none !important;
    }
    
    .hero-section .cta-button {
        width: 100% !important;
        margin-top: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        text-align: center !important;
        align-self: stretch !important;
        order: 999 !important;
        min-width: auto !important;
        margin-bottom: 0 !important;
    }

    .hero-section .fullscreen-video-background {
        margin-top: 60px !important;
        overflow: visible !important;
        transform: translateX(-50%) scale(2.55) !important;
        max-width: 140% !important;
        position: absolute !important;
        top: 180px !important;
        z-index: 1 !important;
        width: 100% !important;
        height: 100% !important;
    }

    .hero-section .fullscreen-video {
        transform: scale(2.55) !important;
    }
}

@media (max-width: 479px) {
    /* Отключение анимаций для capability-item в мобильных устройствах */
    .capability-item {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
    
    .capability-item:nth-child(1),
    .capability-item:nth-child(2),
    .capability-item:nth-child(3) {
        transition-delay: 0s !important;
    }
    
    .capability-item.animate-in {
        opacity: 1 !important;
        transform: none !important;
    }
    
    .capability-item:hover {
        transform: none !important;
    }

    /* Отключение анимаций для example-card (плашек) в мобильных устройствах */
    .example-card {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
    
    .example-card:nth-child(1),
    .example-card:nth-child(2) {
        transition-delay: 0s !important;
    }
    
    .example-card.animate-in {
        opacity: 1 !important;
        transform: none !important;
    }
    
    .example-card:hover {
        transform: none !important;
        scale: 1 !important;
        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2) !important;
    }

    .hero-section {
        display: flex !important;
        flex-direction: column !important;
        justify-content: space-between !important;
        min-height: 100vh !important;
        padding-bottom: 40px !important;
        overflow: visible !important;
        position: relative !important;
        background: transparent !important;
        z-index: 1 !important;
    }
    
    .hero-section .container {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 !important;
        justify-content: space-between !important;
        overflow: visible !important;
    }
    
    .hero-section .content {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 !important;
        justify-content: space-between !important;
        min-height: 350px !important;
        max-height: 450px !important;
        background: transparent !important;
        z-index: 2 !important;
        position: relative !important;
    }
    
    .hero-section .text-content {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 !important;
        justify-content: space-between !important;
        width: 100% !important;
        max-width: 100% !important;
        height: 65vh !important;
        white-space: normal !important;
        overflow: visible !important;
    }

    .hero-section .subtitle {
        margin-top: -200px !important;
        padding-top: 40px !important;
        font-size: 12px !important;
        line-height: 1.4 !important;
        display: block !important;
        white-space: normal !important;
        text-align: left !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        width: 100% !important;
        max-width: 300px !important;
        word-break: break-word !important;
        overflow-wrap: break-word !important;
        overflow: visible !important;
        margin-bottom: 24px !important;
    }
    
    .hero-section .cta-subtitle {
        display: none !important;
    }
    
    .hero-section .cta-button {
        width: 100% !important;
        margin-top: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        text-align: center !important;
        align-self: stretch !important;
        order: 999 !important;
        min-width: auto !important;
        margin-bottom: 0 !important;
    }

    .hero-section .fullscreen-video-background {
        margin-top: 60px !important;
        overflow: visible !important;
        transform: translateX(-50%) scale(2.55) !important;
        max-width: 140% !important;
        position: absolute !important;
        top: 180px !important;
        z-index: 1 !important;
        width: 100% !important;
        height: 100% !important;
    }

    .hero-section .fullscreen-video {
        transform: scale(2.55) !important;
    }
}

@media (max-width: 374px) {
    /* Отключение анимаций для capability-item в мобильных устройствах */
    .capability-item {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
    
    .capability-item:nth-child(1),
    .capability-item:nth-child(2),
    .capability-item:nth-child(3) {
        transition-delay: 0s !important;
    }
    
    .capability-item.animate-in {
        opacity: 1 !important;
        transform: none !important;
    }
    
    .capability-item:hover {
        transform: none !important;
    }

    /* Отключение анимаций для example-card (плашек) в мобильных устройствах */
    .example-card {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
    
    .example-card:nth-child(1),
    .example-card:nth-child(2) {
        transition-delay: 0s !important;
    }
    
    .example-card.animate-in {
        opacity: 1 !important;
        transform: none !important;
    }
    
    .example-card:hover {
        transform: none !important;
        scale: 1 !important;
        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2) !important;
    }

    .hero-section {
        display: flex !important;
        flex-direction: column !important;
        justify-content: space-between !important;
        min-height: 100vh !important;
        padding-bottom: 40px !important;
        overflow: visible !important;
        position: relative !important;
        background: transparent !important;
        z-index: 1 !important;
    }
    
    .hero-section .container {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 !important;
        justify-content: space-between !important;
        overflow: visible !important;
    }
    
    .hero-section .content {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 !important;
        justify-content: space-between !important;
        min-height: 350px !important;
        max-height: 450px !important;
        background: transparent !important;
        z-index: 2 !important;
        position: relative !important;
    }
    
    .hero-section .text-content {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 !important;
        justify-content: space-between !important;
        width: 100% !important;
        max-width: 100% !important;
        height: 65vh !important;
        white-space: normal !important;
        overflow: visible !important;
    }

    .hero-section .subtitle {
        margin-top: -200px !important;
        padding-top: 40px !important;
        font-size: 12px !important;
        line-height: 1.4 !important;
        display: block !important;
        white-space: normal !important;
        text-align: left !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        width: 100% !important;
        max-width: 300px !important;
        word-break: break-word !important;
        overflow-wrap: break-word !important;
        overflow: visible !important;
        margin-bottom: 24px !important;
    }
    
    .hero-section .cta-subtitle {
        display: none !important;
    }
    
    .hero-section .cta-button {
        width: 100% !important;
        margin-top: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        text-align: center !important;
        align-self: stretch !important;
        order: 999 !important;
        min-width: auto !important;
        margin-bottom: 0 !important;
    }

    .hero-section .fullscreen-video-background {
        margin-top: 60px !important;
        overflow: visible !important;
        transform: translateX(-50%) scale(2.55) !important;
        max-width: 140% !important;
        position: absolute !important;
        top: 180px !important;
        z-index: 1 !important;
        width: 100% !important;
        height: 100% !important;
    }

    .hero-section .fullscreen-video {
        transform: scale(2.55) !important;
    }
}

/* Глобальное отключение анимаций для всех мобильных устройств */
@media (max-width: 768px) {
    .example-card,
    .capability-item {
        animation: none !important;
        transition: none !important;
        transform: none !important;
        opacity: 1 !important;
        border: 1px solid transparent !important;
        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2) !important;
    }
    
    .example-card:hover,
    .capability-item:hover {
        animation: none !important;
        transition: none !important;
        transform: none !important;
        background: rgba(255, 255, 255, 0.05) !important;
        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2) !important;
        border: 1px solid transparent !important;
    }
    
    /* Отключение всех эффектов для цифр в capability-number */
    .capability-number {
        transition: none !important;
        transform: none !important;
        background: none !important;
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
    }
    
    .capability-number::before,
    .capability-number::after {
        display: none !important;
        opacity: 0 !important;
        transform: none !important;
        animation: none !important;
        transition: none !important;
    }
    
    .capability-item:hover .capability-number {
        background: none !important;
        -webkit-background-clip: unset !important;
        -webkit-text-fill-color: #ffffff !important;
        background-clip: unset !important;
        transform: none !important;
        color: #ffffff !important;
    }
    
    .capability-item:hover .capability-number::before,
    .capability-item:hover .capability-number::after {
        display: none !important;
        opacity: 0 !important;
        transform: none !important;
        animation: none !important;
    }
    
    .capability-item:hover .capability-title {
        color: #FFFFFF !important;
    }
    
    .capability-item:hover .capability-description {
        color: rgba(255, 255, 255, 0.85) !important;
    }
    
    /* Отключение active состояния для плашек */
    .capability-item:active,
    .example-card:active {
        transform: none !important;
        scale: 1 !important;
        background: rgba(255, 255, 255, 0.05) !important;
        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2) !important;
        border: 1px solid transparent !important;
    }
    
    /* Отключение focus состояния для плашек */
    .capability-item:focus,
    .example-card:focus {
        outline: none !important;
        transform: none !important;
        background: rgba(255, 255, 255, 0.05) !important;
        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2) !important;
        border: 1px solid transparent !important;
    }
}

/* Медиазапрос для разрешения 1640px и выше */
@media (min-width: 1640px) {
    /* Timeline-container компенсирует отступы родительского контейнера - ПРИНУДИТЕЛЬНО */
    .timeline-container,
    .how-it-works-section .timeline-container,
    body .how-it-works-section .timeline-container {
        max-width: none !important;
        width: calc(100% + 240px) !important;
        margin-left: -120px !important;
        margin-right: -120px !important;
        padding-left: 120px !important;
        padding-right: 120px !important;
    }
    
    /* Timeline-step с центрированием и flex - ПРИНУДИТЕЛЬНО */
    .timeline-step,
    .how-it-works-section .timeline-step,
    body .how-it-works-section .timeline-step {
        display: flex !important;
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
        box-sizing: border-box !important;
    }
    
    /* Плашки timeline-content на всю ширину контейнера без ограничений - ПРИНУДИТЕЛЬНО */
    .timeline-content,
    .how-it-works-section .timeline-content,
    body .how-it-works-section .timeline-content,
    section.how-it-works-section .timeline-content,
    .how-it-works-section .timeline-step .timeline-content {
        width: 100% !important;
        max-width: none !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
        box-sizing: border-box !important;
        flex: 1 !important;
        min-width: 0 !important;
    }
}

/* Медиазапрос для разрешения 1920px и выше */
@media (min-width: 1920px) {
    /* Направляющие линии по всему лендингу - по границам хедера */
    body::before,
    body::after {
        content: '';
        position: fixed;
        top: 0;
        bottom: 0;
        width: 2px;
        background: rgba(20, 91, 222, 0.7);
        z-index: 9999;
        pointer-events: none;
    }
    
    /* Левая направляющая - по левой границе логотипа в хедере */
    body::before {
        left: calc(50% - 640px);
    }
    
    /* Правая направляющая - по правой границе кнопки "Связаться" в хедере */
    body::after {
        right: calc(50% - 640px);
    }
    
    /* Выравниваем все блоки по направляющим */
    
    /* Первый блок (Hero) */
    .hero-section .container,
    .hero-section .content {
        padding-left: 120px !important;
        padding-right: 120px !important;
        max-width: 100% !important;
    }
    
    /* Второй блок (Кому будет полезен?) */
    .second-section .container,
    .second-section .bento-content {
        padding-left: 120px !important;
        padding-right: 120px !important;
        max-width: 100% !important;
    }
    
    /* Третий блок (Ключевые возможности) */
    .third-section .container,
    .third-section .capabilities-content {
        padding-left: 120px !important;
        padding-right: 120px !important;
        max-width: 100% !important;
    }
    
    /* Четвертый блок (Как работает AI-ассистент?) */
    .how-it-works-section .container {
        padding-left: 120px !important;
        padding-right: 120px !important;
        max-width: 100% !important;
    }
    
    /* Пятый блок (Какие задачи решает?) */
    .tasks-section .container {
        padding-left: 120px !important;
        padding-right: 120px !important;
        max-width: 100% !important;
    }
    
    /* Шестой блок (Мы предлагаем) */
    .offer-section .offer-content {
        padding-left: 120px !important;
        padding-right: 120px !important;
        max-width: 100% !important;
    }
    
    /* Седьмой блок (Готовы начать?) */
    .ready-section .ready-section-content {
        padding-left: 120px !important;
        padding-right: 120px !important;
        max-width: 100% !important;
    }
    
    /* Футер */
    .footer-section .footer-content {
        padding-left: 120px !important;
        padding-right: 120px !important;
        max-width: 100% !important;
    }
    
    /* Timeline-container компенсирует отступы родительского контейнера - ПРИНУДИТЕЛЬНО */
    .timeline-container,
    .how-it-works-section .timeline-container,
    body .how-it-works-section .timeline-container {
        max-width: none !important;
        width: calc(100% + 2 * (50vw - 640px)) !important;
        margin-left: calc(-(50vw - 640px)) !important;
        margin-right: calc(-(50vw - 640px)) !important;
        padding-left: calc(50vw - 640px) !important;
        padding-right: calc(50vw - 640px) !important;
    }
    
    /* Timeline-step с центрированием и flex - ПРИНУДИТЕЛЬНО */
    .timeline-step,
    .how-it-works-section .timeline-step,
    body .how-it-works-section .timeline-step {
        display: flex !important;
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
        box-sizing: border-box !important;
    }
    
    /* Плашки timeline-content на всю ширину контейнера - ПРИНУДИТЕЛЬНО */
    .timeline-content,
    .how-it-works-section .timeline-content,
    body .how-it-works-section .timeline-content,
    section.how-it-works-section .timeline-content,
    .how-it-works-section .timeline-step .timeline-content {
        width: 100% !important;
        max-width: none !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
        box-sizing: border-box !important;
        flex: 1 !important;
        min-width: 0 !important;
    }
    
    /* Прозрачный верхний padding для второго блока */
    .second-section {
        background: linear-gradient(to bottom, 
            transparent 0px, 
            transparent 120px, 
            #EBEBE9 120px, 
            #EBEBE9 100%) !important;
    }

    /* Настройки видео фона как на 1164px */
    .offer-video-background {
        width: 60% !important;
        max-width: 600px !important;
        height: 50% !important;
        object-fit: cover !important;
        right: calc(18% + 700px) !important;
    }

    /* Отступы контента как на 1164px */
    .offer-section .container {
        padding: 0 60px 0 0 !important;
    }
}

/* Медиа-запрос для диапазона 1200-1440px */
@media (max-width: 1440px) and (min-width: 1200px) {
    /* Направляющие для всего лендинга */
    body::before {
        content: "";
        position: fixed;
        top: 0;
        left: 60px;
        width: 2px;
        height: 100vh;
        background: rgba(255, 0, 255, 0.8);
        z-index: 9999;
        pointer-events: none;
    }
    
    body::after {
        content: "";
        position: fixed;
        top: 0;
        right: 60px;
        width: 2px;
        height: 100vh;
        background: rgba(255, 0, 255, 0.8);
        z-index: 9999;
        pointer-events: none;
    }
    
    /* Направляющие для блока "Кому будет полезен?" */
    .second-section::before {
        display: none !important;
    }
    
    .second-section::after {
        display: none !important;
    }
    
    .second-section {
        position: relative;
    }
    
    /* ПРИНУДИТЕЛЬНО убираем левый padding - ИСТОЧНИК ОТСТУПА: .footer-left имеет padding-left: 60px */
    .footer-left {
        padding-left: 0 !important;
    }
    
    /* Дополнительная страховка для названия компании */
    .footer-section .footer-content .footer-left .footer-company .footer-company-name,
    .footer-section .footer-content .footer-left .footer-company-name,
    .footer-section .footer-left .footer-company .footer-company-name,
    .footer-section .footer-left .footer-company-name,
    .footer-content .footer-left .footer-company .footer-company-name,
    .footer-content .footer-left .footer-company-name,
    .footer-left .footer-company .footer-company-name,
    .footer-left .footer-company-name,
    h3.footer-company-name,
    .footer-company-name {
        padding-left: 0 !important;
        margin-left: 0 !important;
        text-indent: 0 !important;
        transform: translateX(0) !important;
    }
    
    /* Выравнивание блока "Ключевые возможности" по розовым направляющим */
    .third-section .container {
        max-width: 100% !important;
        padding: 0 60px !important;
    }
    
    .capabilities-content {
        padding: 0 !important;
    }
    
    /* Выравнивание "Виды ассистентов" по розовым направляющим */
    .implementation-examples {
        padding: 0 !important;
        margin: 60px 0 0 0 !important;
    }
    
    /* Карточки ассистентов в один ряд - две рядом */
    .examples-grid {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 30px !important;
        padding: 0 !important;
        margin: 0 !important;
    }
    
    .example-card {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
    }
    
    /* Убираем левый padding у всех текстовых элементов блока "Готовы начать?" */
    .ready-section .section-title {
        padding-left: 0 !important;
    }
    
    .ready-description {
        padding-left: 0 !important;
    }
    
    .ready-subtitle {
        padding-left: 0 !important;
    }
    
    .ready-experts {
        padding-left: 0 !important;
    }
    
    /* Убираем левый padding у подзаголовка блока "Мы предлагаем" */
    .offer-section .section-subtitle {
        padding-left: 0 !important;
    }
    
    /* Убираем левый margin у плашки "ПРЕДЛОЖЕНИЕ" */
    .pricing-card-wrapper {
        margin-left: 0 !important;
    }
    
    /* ПРИНУДИТЕЛЬНО устанавливаем стили для заголовка "Какие задачи решает?" ТОЛЬКО в диапазоне 1200-1440px */
    .tasks-section .section-title,
    .tasks-section .section-header .section-title,
    section.tasks-section .section-title,
    section.tasks-section .section-header .section-title,
    #scenarios .section-title,
    #scenarios .section-header .section-title {
        padding-left: 60px !important;
        padding-right: 0 !important;
        text-align: left !important;
        margin-left: 0 !important;
        font-size: 56px !important;
    }
    
    .tasks-timeline {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    .task-right {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    .task-left {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    .task-item {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    /* Показываем перенос строки для "ОНБОРДИНГ СОТРУДНИКОВ" только в диапазоне 1200-1440px */
    .task-title-br {
        display: inline !important;
    }
}

/* Диапазон 1200-1279px - контентная область 100% с внешними отступами 60px для первого и второго блока */
@media (max-width: 1279px) and (min-width: 1200px) {
    /* Первый блок - Hero секция */
    .hero-section .container {
        max-width: 100% !important;
        padding: 0 60px !important;
    }

    /* Убираем все padding 30px у первого блока */
    .hero-section .content {
        padding: 0 !important;
    }

    .text-content {
        padding: 0 !important;
    }

    /* Второй блок - Кому будет полезен */
    .second-section .container {
        max-width: 100% !important;
        padding: 0 60px !important;
    }

    .business-problems {
        padding: 0 !important;
    }

    /* Убираем все padding 30px у второго блока и связанных элементов */
    .bento-content {
        padding: 0 !important;
    }

    .section-header {
        padding: 0 !important;
    }

    /* Блок "Как работает AI-ассистент" - выравнивание по направляющим */
    .how-it-works-section .container {
        max-width: 100% !important;
        padding: 0 60px !important;
    }

    .timeline-container {
        padding: 0 !important;
    }

    .how-it-works-section .section-header {
        padding: 0 !important;
    }

    /* БЛОК 4: "Как работает AI-ассистент?" - специальный отступ для диапазона 1200-1279px */
    .how-it-works-section .section-title {
        padding-left: 60px !important;
        text-align: left;
        margin-left: 0 !important;
    }

    /* БЛОК 5: "Какие задачи решает?" - специальный отступ для диапазона 1200-1279px */
    .tasks-section .section-title {
        padding-left: 90px !important;
        text-align: left;
        margin-left: 0 !important;
    }
}

@media (max-width: 1199px) and (min-width: 1025px) {
    /* ИНДИВИДУАЛЬНОЕ ВЫРАВНИВАНИЕ ЗАГОЛОВКОВ ПО СОДЕРЖИМОМУ КАЖДОГО БЛОКА - ДИАПАЗОН 1025-1199px */
    
    /* БЛОК 2: "Кому будет полезен?" */
    /* business-problems имеет padding: 0 15px в медиа-запросе 1200px */
    /* Карточки начинаются с левого края business-problems (без дополнительных отступов) */
    /* Заголовок настроен с кастомным отступом */
    .second-section .section-title {
        text-align: left;
        margin-left: 0 !important; /* Убираем отрицательный margin */
        padding-left: 65px; /* Кастомный отступ для выравнивания */
    }
    
    /* БЛОК 3: "КЛЮЧЕВЫЕ ВОЗМОЖНОСТИ" */
    /* ПРИНУДИТЕЛЬНО устанавливаем padding 75px для заголовка в диапазоне 1025-1200px */
    .third-section .section-title,
    .third-section .capabilities-content .section-title,
    section.third-section .section-title,
    body .third-section .section-title,
    body .third-section .capabilities-content .section-title,
    body section.third-section .section-title {
        padding-left: 75px !important;
    }
    
    /* "Виды ассистентов" - ПРИНУДИТЕЛЬНО устанавливаем padding 75px */
    .implementation-title,
    .third-section .implementation-title,
    .third-section .implementation-examples .implementation-title,
    .capabilities-content .implementation-title,
    .implementation-examples .implementation-title,
    body .implementation-title,
    body .third-section .implementation-title,
    body .third-section .implementation-examples .implementation-title {
        text-align: left !important;
        margin-left: 0 !important;
        padding-left: 75px !important; /* ПРИНУДИТЕЛЬНО устанавливаем padding 75px */
    }
    
    /* БЛОК 4: "Как работает AI-ассистент?" */
    /* timeline-container в медиа-запросе 1024px имеет padding: 0 16px */
    /* Но в медиа-запросе 1200px timeline-container имеет padding: 0 16px */
    .how-it-works-section .section-title {
        text-align: left;
        margin-left: 0 !important;
        padding-left: 90px;
    }
    
    /* ПРИНУДИТЕЛЬНО устанавливаем padding 90px для заголовка "Как работает" в диапазоне 1025-1199px */
    .how-it-works-section .section-title,
    body .how-it-works-section .section-title,
    section.how-it-works-section .section-title,
    body section.how-it-works-section .section-title {
        padding-left: 90px !important;
    }
    
    /* БЛОК 5: "Какие задачи решает?" */
    /* tasks-timeline в медиа-запросе 1024px имеет padding: 0 20px */
    /* Для диапазона 1025-1199px устанавливаем отступ 70px */
    .tasks-section .section-title {
        text-align: left;
        margin-left: 0 !important;
        padding-left: 70px; /* Отступ 70px для диапазона 1025-1199px */
    }
    
    /* БЛОК 6: "Мы предлагаем" */
    /* offer-section .section-title теперь наследует стандартные отступы */
    /* offer-content имеет стандартный padding контейнера */
    .offer-section .section-title {
        text-align: left;
        margin-left: 0 !important;
        padding-left: 60px; /* Выравниваем как другие заголовки */
    }
    
    .offer-section .section-subtitle {
        text-align: left;
        margin-left: 0 !important;
        padding-left: 60px; /* Сохраняем отступ для подзаголовка */
    }
    
    /* БЛОК 7: "Готовы начать?" */
    /* ready-section-content имеет стандартный padding контейнера */
    .ready-section .section-title {
        text-align: left;
        margin-left: 0 !important;
        padding-left: 0; /* По краю ready-section-content */
    }

    /* Стили для offer-section */
    .offer-video-background {
        width: 60%;
        max-width: 600px;
        height: 50%;
    }
    
    .pricing-card-wrapper {
        margin-left: 0;
    }
    
    .offer-section .section-title,
    .ready-section .section-title {
        font-size: 48px;
    }
    
    .offer-content {
        padding: 0 60px 0 0 !important;
    }
    
    .ready-section-content {
        padding: 0;
    }
    
    /* Дополнительные стили для ready-section в диапазоне 1025-1279px */
    .ready-content {
        grid-template-columns: 1fr 380px;
        gap: 50px;
    }
    
    .ready-left {
        padding-right: 20px;
    }
    
    .ready-section .section-title {
        white-space: normal;
        padding-left: 0;
    }
    
    .ready-description {
        font-size: 16px;
        padding-left: 0;
    }
    
    .ready-subtitle {
        padding-left: 0;
    }
    
    .ready-experts {
        padding-left: 0;
    }
    
    .ready-right {
        margin-top: 0;
        justify-content: flex-start;
        align-self: start;
    }
    
    .ready-form-container {
        max-width: 380px;
        padding: 24px;
    }
    
    .ready-form-input {
        padding: 14px 18px;
        font-size: 16px;
    }
    
    .ready-form-submit {
        padding: 16px 24px;
        font-size: 16px;
    }
    
    .ready-form-tag {
        font-size: 10px;
        padding: 5px 12px;
        margin-bottom: 16px;
    }
    
    .ready-privacy-text {
        font-size: 12px;
        line-height: 1.4;
    }
    
    .ready-form {
        gap: 16px;
    }

    
    .pricing-card-single {
        padding: 36px;
        max-width: 420px;
    }
    
    .offer-section .section-subtitle {
        max-width: 100%;
    }
    
    .price-amount {
        font-size: 38px;
    }
    
    .ready-form-container {
        padding: 24px;
        max-width: 320px;
    }
    
    .ready-right {
        margin-top: -80px;
    }

    .main-title {
        font-size: 90px;
    }
    
    .subtitle {
        font-size: 24px;
    }
    
    .line-separator {
        width: 300px;
    }
    
    .cta-button {
        font-size: 16px;
        padding: 16px 32px;
    }

    .section-title {
        font-size: 52px;
    }

    .business-problems {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto auto auto;
        gap: 20px;
        padding: 0 0px;
        margin-top: 40px;
        min-height: auto;
        align-items: stretch;
    }
    
    /* На планшетах сохраняем шахматную структуру */
    .problem-solution-card {
        padding: 28px 24px;
    }
    
    .problem-solution-card:nth-child(1) {
        grid-column: 1 / 2;
        grid-row: 1 / 2;
    }
    
    .problem-solution-card:nth-child(2) {
        grid-column: 2 / 4;
        grid-row: 1 / 2;
    }
    
    .problem-solution-card:nth-child(3) {
        grid-column: 1 / 3;
        grid-row: 2 / 3;
    }
    
    .problem-solution-card:nth-child(4) {
        grid-column: 3 / 4;
        grid-row: 2 / 3;
    }

    .problem-solution-card {
        padding: 40px 32px;
        border-radius: 24px;
    }

    .card-number-circle {
        width: 48px;
        height: 48px;
        font-size: 19px;
        margin-bottom: 28px;
    }

    .problem-solution-card .problem-title {
        font-size: 19px;
        margin-bottom: 22px;
    }

    .solution-arrow {
        font-size: 26px;
        margin: 18px 0;
    }

    .solution-block {
        padding: 24px 20px;
        border-radius: 18px;
    }

    .solution-intro {
        font-size: 12px;
    }

    .solution-text {
        font-size: 16px;
    }

    /* Блок "Ключевые возможности" - настройки аналогично диапазону 769-1024px, но с отступами 60px */
    .third-section {
        padding: 0 !important;
    }
    
    .capabilities-content {
        padding: 0 60px !important;
        max-width: none !important;
    }

    .capabilities-list {
        margin: 0 !important;
        padding: 0 60px !important;
        gap: 42px;
        margin-top: 70px;
    }

    .capability-item {
        margin: 0 0 24px 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 24px !important;
        box-sizing: border-box !important;
        background: rgba(255, 255, 255, 0.05) !important;
        border-radius: 16px !important;
        border: 1px solid rgba(255, 255, 255, 0.1) !important;
        outline: none !important;
        gap: 28px;
    }

    /* Убираем все возможные розовые линии и outline для плашек */
    .capability-item *,
    .capability-item::before,
    .capability-item::after {
        outline: none !important;
        border: none !important;
        box-shadow: none !important;
    }

    /* Дополнительное переопределение для устранения розовых пунктирных линий */
    .third-section .capability-item {
        outline: none !important;
        border: 1px solid rgba(255, 255, 255, 0.1) !important;
    }

    .capability-number {
        font-size: 104px;
        min-width: 130px;
    }

    .capability-title {
        font-size: 26px;
    }

    .capability-description {
        font-size: 17px;
    }

    .section-subtitle {
        font-size: 18px;
    }

    .types-title {
        font-size: 28px;
        margin-bottom: 40px;
    }

    .types-grid {
        gap: 24px;
    }

    .solution-pair {
        gap: 20px;
        min-height: 200px;
    }

    .problem-card, .solution-card {
        padding: 28px 24px;
    }

    .pair-number {
        top: -16px;
        font-size: 28px;
        width: 56px;
        height: 56px;
    }

    .problem-title {
        font-size: 16px;
        margin-bottom: 8px;
    }

    .problem-description {
        font-size: 13px;
    }

    .solution-badge, .problem-badge {
        font-size: 9px;
        padding: 3px 6px;
        margin-bottom: 8px;
    }

    .solution-title {
        font-size: 18px;
        margin-bottom: 8px;
    }

    .solution-description {
        font-size: 16px;
    }

    .arrow-connector svg {
        width: 32px;
        height: 16px;
    }

    /* Блок виды ассистентов - карточки в одну строку с отступами 60px */
    .implementation-examples {
        margin: 0 !important;
        padding: 0 !important;
    }

    .third-section .examples-grid {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        gap: 16px !important;
        justify-content: flex-start !important;
        margin-left: 20px !important;
        margin-right: 20px !important;
        padding: 0 !important;
        grid-template-columns: none !important;
        width: calc(100% - 40px) !important;
        box-sizing: border-box !important;
    }

    .third-section .example-card {
        flex: 1 1 calc(50% - 8px) !important;
        max-width: calc(50% - 8px) !important;
        min-width: calc(50% - 8px) !important;
        width: calc(50% - 8px) !important;
        margin: 0 !important;
        padding: 20px !important;
        box-sizing: border-box !important;
    }

    .third-section .example-card:first-child {
        margin-left: 0 !important;
    }

    .third-section .example-card:last-child {
        margin-right: 0 !important;
    }

    /* Размеры заголовков в диапазоне 1025-1279px - максимальная специфичность */
    .third-section .section-title,
    .third-section .capabilities-content .section-title {
        font-size: 40px !important;
    }

    .implementation-title,
    .third-section .implementation-title,
    .third-section .implementation-examples .implementation-title {
        font-size: 40px !important;
    }

    .card-image {
        height: 160px !important;
    }

    .example-title {
        font-size: 18px !important;
    }

    .example-description {
        font-size: 16px !important;
    }

    .example-cta-button {
        padding: 12px 20px !important;
        font-size: 16px !important;
    }

    /* Красные направляющие линии для диапазона 1025-1279px */
    body::before {
        content: '';
        position: fixed;
        top: 0;
        left: 60px;
        width: 2px;
        height: 100vh;
        background: #ff0000;
        z-index: 9999;
        pointer-events: none;
    }

    body::after {
        content: '';
        position: fixed;
        top: 0;
        right: 60px;
        width: 2px;
        height: 100vh;
        background: #ff0000;
        z-index: 9999;
        pointer-events: none;
    }
}

@media (max-width: 768px) and (min-width: 641px) {
  /* Направляющие линии для диапазона 641-768px */
  body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 20px;
    width: 2px;
    height: 100vh;
    background: red;
    z-index: 9999;
    pointer-events: none;
  }
  
  body::after {
    content: '' !important;
    position: fixed !important;
    top: 0 !important;
    right: 16px !important;
    width: 2px !important;
    height: 100% !important;
    background: red !important;
    z-index: 9999 !important;
    pointer-events: none !important;
  }
  
  /* Выравнивание футера по направляющим */
  .footer-content {
    padding-left: 20px !important;
    padding-right: 20px !important;
    max-width: none !important;
  }
  
  .footer-left,
  .footer-right {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  
  /* Размер текста и выравнивание */
  .footer-company-name,
  .footer-details p,
  .footer-phone,
  .footer-link {
    font-size: 16px !important;
  }
  
  .footer-right {
    text-align: right !important;
  }
  
  .footer-contact {
    align-items: flex-end !important;
  }
  
  .footer-links {
    justify-content: flex-end !important;
    text-align: right !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
  }
  
  /* Заголовок "Готовы начать?" */
  .ready-section .section-title {
    padding-left: 0 !important;
    margin-left: 0 !important;
    margin-bottom: 20px !important;
    font-size: 32px !important;
    text-align: left !important;
  }
  
  /* Блок "Мы предлагаем" - выравнивание по направляющим */
  .offer-content {
    padding-left: 20px !important;
    padding-right: 20px !important;
    max-width: none !important;
  }
  
  .offer-section .section-title {
    padding-left: 20px !important;
    margin-left: 0 !important;
    font-size: 32px !important;
    text-align: left !important;
  }
  
  .offer-section .section-subtitle {
    padding-left: 20px !important;
    margin-left: 0 !important;
    text-align: left !important;
  }
  
  /* Заголовок "Какие задачи решает?" */
  .tasks-section .section-title {
    padding-left: 30px !important;
    margin-left: 0 !important;
    font-size: 32px !important;
    text-align: left !important;
  }
  
  /* Заголовок "Как работает AI-ассистент" в две строки */
  .how-it-works-section .section-title {
    padding-left: 60px !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    font-size: 30px !important;
    text-align: left !important;
    white-space: normal !important;
    line-height: 1.2 !important;
  }
  
  .how-it-works-section .section-title::after {
    content: "" !important;
  }
  
  /* Блок "Как работает AI-ассистент" - выравнивание по направляющим */
  .how-it-works-section {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  
  .how-it-works-section .container {
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: none !important;
  }
  
  .timeline-container {
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: none !important;
  }
  
  .timeline-content {
    margin-left: 20px !important;
    margin-right: 20px !important;
    padding: 24px 20px !important;
    width: calc(100vw - 40px) !important;
    max-width: calc(100vw - 40px) !important;
    box-sizing: border-box !important;
  }
  
  /* Текст примечания под плашками */
  .timeline-note {
    padding-left: 20px !important;
    margin-left: 0 !important;
  }
  
  /* Увеличиваем размер шрифта в описании timeline карточек */
  .timeline-description {
    font-size: 16px !important;
  }
  
  /* Увеличиваем размер шрифта в описании task карточек */
  .task-description {
    font-size: 16px !important;
  }
  
  /* Увеличиваем размер шрифта для пунктов списка в блоке "Готовы начать?" */
  .ready-experts-list li {
    font-size: 16px !important;
  }
  
  /* Блок "Ключевые возможности" - убираем все padding'и */
  .third-section {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  
  .third-section .container {
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: none !important;
  }
  
  .capabilities-content {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  
  /* Заголовок третьего блока по направляющей */
  .third-section .section-title {
    font-size: 32px !important;
    font-weight: 600 !important;
    color: white !important;
    text-align: left !important;
    padding-left: 20px !important;
    margin-bottom: 60px !important;
    line-height: 1.2 !important;
  }
  
  /* Карточки возможностей по направляющим */
  .capabilities-list {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  
  .capability-item {
    margin-left: 20px !important;
    margin-right: 20px !important;
    padding: 24px 20px !important;
    width: calc(100vw - 40px) !important;
    max-width: calc(100vw - 40px) !important;
    box-sizing: border-box !important;
  }
  
  .capability-description {
    font-size: 16px !important;
  }
  
  /* Дополнительная специфичность для блока "Ключевые возможности" */
  .third-section .capability-description {
    font-size: 16px !important;
  }
  
  /* Максимальная специфичность для переопределения базового стиля */
  .third-section .capability-item .capability-description {
    font-size: 16px !important;
  }
  
  /* Максимальная специфичность для заголовков блоков */
  .third-section .capabilities-content .section-title {
    font-size: 32px !important;
    padding-left: 40px !important;
  }
  
  .third-section .implementation-examples .implementation-title {
    font-size: 32px !important;
    padding-left: 40px !important;
  }
  
  /* Блок "Виды ассистентов" по направляющим */
  .implementation-examples {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 60px !important;
  }
  
  .implementation-title {
    font-size: 32px !important;
    padding-left: 20px !important;
    margin-bottom: 0 !important;
  }
  
  .examples-grid {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
  
  .example-card {
    margin-left: 20px !important;
    margin-right: 20px !important;
    width: calc(100vw - 40px) !important;
    max-width: calc(100vw - 40px) !important;
    box-sizing: border-box !important;
    padding: 24px !important;
  }
  
  /* Исключение для диапазона 375-640px - не применяем стили выше */
  @media (max-width: 640px) {
    .example-card {
      margin-left: 0 !important;
      margin-right: 0 !important;
      width: 100% !important;
      max-width: 100% !important;
    }
  }
  
  .example-description {
    font-size: 16px !important;
  }
  
  /* Дополнительное переопределение для блока "Виды ассистентов" в диапазоне 641-768px */
  .third-section .implementation-examples .example-description {
    font-size: 16px !important;
  }
  
  .third-section .examples-grid .example-card .example-description {
    font-size: 16px !important;
  }
  
  .implementation-examples .example-card .example-description {
    font-size: 16px !important;
  }
  
  /* Карточка предложения */
  .pricing-card-wrapper {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  
  .pricing-card-single {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  
  /* Скрытие видео в блоке "Мы предлагаем" */
  .offer-video-background {
    display: none !important;
  }
  
  /* Хедер от направляющей до направляющей - убираем конфликт с header.css */
  
  /* Блок "Кому будет полезен?" по направляющим */
  .second-section {
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 0 !important;
  }
  
  .second-section .container {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  
  .bento-content {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  
  .second-section .section-title {
    font-size: 32px !important;
    padding-left: 40px !important;
    margin-bottom: 40px !important;
    margin-left: 0 !important;
  }
  
  .business-problems {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
  }
  
  .problem-solution-card {
    margin-left: 20px !important;
    margin-right: 20px !important;
    width: calc(100vw - 40px) !important;
    max-width: calc(100vw - 40px) !important;
    box-sizing: border-box !important;
    padding: 24px !important;
  }
  
  .problem-solution-card .problem-title {
    font-size: 16px !important;
  }
  
  .solution-text {
    font-size: 16px !important;
  }
  
  /* Первый блок (hero-section) по направляющим */
  .hero-section {
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-bottom: 0 !important;
    min-height: 82vh !important;
    padding-top: 70px !important;
  }
  
  .hero-section .container {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  
  .content {
    padding-left: 20px !important;
    padding-right: 20px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    text-align: left !important;
  }
  
  .text-content {
    padding-left: 0 !important;
    margin-left: 0 !important;
  }
  
  .main-title {
    font-size: 48px !important;
    text-align: left !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
  }
  
  .subtitle {
    font-size: 16px !important;
    text-align: left !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
  }
  
  .line-separator {
    margin-left: 0 !important;
  }
  
  .cta-button {
    margin-left: 0 !important;
  }
  
  .cta-subtitle {
    text-align: left !important;
    margin-left: 0 !important;
  }
  
  /* Исключения для мобильной версии в диапазоне 641-768px */
  @media (min-width: 641px) {
    .content {
      padding-left: 20px !important;
      padding-right: 20px !important;
      text-align: left !important;
      flex-direction: row !important;
      gap: 60px !important;
    }
    
    .main-title {
      font-size: 48px !important;
      text-align: left !important;
      white-space: nowrap !important;
      margin-bottom: 16px !important;
    }
    
    .subtitle {
      font-size: 16px !important;
      text-align: left !important;
      margin-bottom: 24px !important;
    }
    
    .line-separator {
      width: 200px !important;
      margin: 16px 0 24px 0 !important;
    }
    
    .cta-button {
      font-size: 16px !important;
      padding: 16px 32px !important;
      margin-bottom: 16px !important;
    }
    
    .cta-subtitle {
      font-size: 16px !important;
      margin-top: 8px !important;
      text-align: left !important;
    }
  }
}

@media (max-width: 768px) and (min-width: 641px) {
    .hero-section {
        padding: 80px 0 60px;
    }
    
    .content {
        flex-direction: column;
        text-align: center;
        gap: 48px;
        padding: 0 var(--container-padding-tablet);
    }
    
    .main-title {
        font-size: 52px;
        white-space: normal;
        margin-bottom: 24px;
    }
    
    .subtitle {
        font-size: 22px;
        line-height: 1.3;
        margin-bottom: 32px;
    }
    
    .line-separator {
        width: 240px;
        height: 3px;
        margin: 0 auto 32px;
    }
    
    .cta-button {
        font-size: 16px;
        padding: 16px 32px;
        margin-bottom: 24px;
        border-radius: 12px;
    }
    
    .cta-subtitle {
        font-size: 14px;
        margin-top: 16px;
    }

    .second-section {
        padding: 80px 0;
    }

    .container {
        padding: 0 var(--container-padding-tablet);
    }
    
    .bento-content {
        padding: 0 var(--container-padding-tablet);
    }
    
    .capabilities-content {
        padding: 0 var(--container-padding-tablet);
    }
    
    .timeline-container {
        padding: 0 var(--container-padding-tablet);
    }
    
    .tasks-timeline {
        padding: 0 var(--container-padding-tablet);
    }
    
    .section-title {
        font-size: 40px;
        line-height: 1.2;
        margin-bottom: 8px;
    }

    .section-header {
        margin-bottom: 56px;
        text-align: left;
    }

    .third-section {
        padding: 100px 0;
    }
    
    .capabilities-list {
        gap: 40px;
        margin-top: 56px;
    }

    .capability-item {
        flex-direction: column;
        gap: 24px;
        text-align: left;
        padding: 32px 24px;
        border-radius: 24px;
    }

    .capability-number {
        font-size: 96px;
        min-width: auto;
        line-height: 0.9;
        margin-bottom: 8px;
        text-align: left;
    }

    .capability-title {
        font-size: 24px;
        margin-bottom: 12px;
    }

    .capability-description {
        font-size: 17px;
        line-height: 1.5;
    }

    .section-subtitle {
        font-size: 16px;
    }

    .implementation-examples {
        margin-top: 80px;
    }
    
    /* Исключение для диапазона 641-768px */
    @media (min-width: 641px) {
        .implementation-examples {
            margin-top: 60px !important;
        }
    }

    .examples-grid {
        grid-template-columns: 1fr;
        gap: 20px;
        width: 100%;
    }

    .example-card {
        padding: 24px;
        border-radius: 18px;
    }
    
    .card-image {
        height: 160px;
        border-radius: 14px;
        margin-bottom: 20px;
    }
    
    .card-header {
        margin-bottom: 16px;
    }
    
    .card-badge {
        font-size: 11px;
        padding: 6px 12px;
    }
    
    .example-title {
        font-size: 18px;
        margin-bottom: 12px;
    }
    
    .example-description {
        font-size: 16px;
        line-height: 1.5;
    }
    
    .business-problems {
        grid-template-columns: 1fr;
        gap: 24px;
        margin-top: 40px;
    }

    .problem-solution-card {
        padding: 32px 28px;
        border-radius: 24px;
    }

    .card-number-circle {
        width: 44px;
        height: 44px;
        font-size: 18px;
        margin-bottom: 24px;
    }

    .problem-solution-card .problem-title {
        font-size: 18px;
        margin-bottom: 16px;
    }

    .solution-text {
        font-size: 14px;
    }

    .problem-title {
        font-size: 15px;
        margin-bottom: 6px;
    }

    .problem-description {
        font-size: 12px;
    }

    .solution-badge, .problem-badge {
        font-size: 8px;
        padding: 2px 4px;
        margin-bottom: 6px;
    }

    .solution-title {
        font-size: 16px;
        margin-bottom: 6px;
    }

    .solution-description {
        font-size: 13px;
    }
    
    .cta-section {
        margin-top: 40px;
        padding: 0 var(--container-padding-tablet);
    }
    
    .cta-button-secondary {
        padding: 16px 28px;
        font-size: 16px;
        min-width: 180px;
    }
}

/* iPhone 375px адаптивность с направляющими */
@media (max-width: 1199px) and (min-width: 1025px) {
    /* === ЕДИНАЯ СИСТЕМА РАСШИРЕННЫХ ОТСТУПОВ 30PX === */
    .container {
        padding: 0 var(--container-padding-expanded);
        max-width: 1200px;
        margin: 0 auto;
    }

    .third-section .container {
        padding: 0 var(--container-padding-expanded);
        max-width: calc(100% - 90px) !important;
        margin: 0 auto;
    }

    .hero-section {
        min-height: 100vh;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 20px 0 0 0;
        margin-top: -150px;
        position: relative;
    }

    .content {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 80px;
        padding: 0 var(--container-padding-expanded);
        text-align: left;
        flex-direction: row;
        width: 100%;
        max-width: 1200px;
        margin: 0 auto;
    }

    /* Заголовки для планшетов */
    .main-title {
        font-size: 64px;
        line-height: 1.0;
        text-align: left;
        margin-bottom: 15px;
        white-space: nowrap;
        font-weight: 500;
        font-family: 'Unbounded', sans-serif;
        color: #191925;
        max-width: 100%;
    }

    .subtitle {
        font-size: 22px;
        line-height: 1.3;
        text-align: left;
        margin-bottom: 40px;
        letter-spacing: 1px;
        font-weight: 400;
        font-family: 'Unbounded', sans-serif;
        color: #191925;
        text-transform: uppercase;
        max-width: 100%;
    }

    .line-separator {
        width: 280px;
        height: 3px;
        margin: 15px 0 25px 0;
        background: #145BDE;
        border-radius: 1px;
    }

    .cta-button {
        padding: 18px 36px;
        font-size: 16px;
        margin: 0 0 24px 0;
        border-radius: 12px;
        background: #145BDE;
        color: #ffffff;
        border: none;
        font-weight: 600;
        font-family: 'Gilroy', sans-serif;
        cursor: pointer;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        letter-spacing: 0.5px;
        box-shadow: 0 2px 8px rgba(20, 91, 222, 0.2);
        display: inline-block;
        min-width: 200px;
        text-align: center;
    }

    .cta-button:hover {
        background: #0F4BC7;
        transform: translateY(-2px);
        box-shadow: 0 6px 20px rgba(20, 91, 222, 0.4);
    }

    .cta-button:active {
        background: #0D42B3;
        transform: translateY(0px);
        box-shadow: 0 2px 8px rgba(20, 91, 222, 0.5);
    }

    .cta-subtitle {
        font-size: 16px;
        text-align: left;
        margin: 0;
        font-family: 'Gilroy', sans-serif;
        font-weight: 400;
        color: #6B7280;
        display: flex;
        align-items: center;
        gap: 8px;
        cursor: pointer;
        transition: color 0.3s ease;
        max-width: 100%;
    }

    .cta-subtitle:hover {
        color: #4B5563;
    }

    .cta-subtitle svg {
        width: 12px;
        height: 12px;
        transition: transform 0.3s ease;
    }

    .cta-subtitle:hover svg {
        transform: translate(1px, -1px);
    }

    /* Вторая секция */
    .second-section {
        padding: 0 0 80px 0;
    }

    .bento-content,
    .capabilities-content,
    .timeline-container,
    .tasks-timeline,
    .offer-content,
    .ready-section-content {
        padding: 0 var(--container-padding-expanded);
    }

    .section-title {
        font-size: 40px;
        line-height: 1.1;
        text-align: left;
        margin-bottom: 24px;
    }

    .section-header {
        margin-bottom: 32px;
        text-align: left;
    }

    .section-subtitle {
        text-align: left;
        font-size: 16px;
        margin-bottom: 24px;
    }

    /* Карточки проблем */
    .business-problems {
        grid-template-columns: 1fr 1.3fr;
        grid-template-rows: auto auto;
        gap: 16px;
        margin-top: 24px;
        padding: 0;
    }

    .problem-solution-card {
        padding: 20px 16px;
        border-radius: 16px;
        text-align: left;
    }

    /* Серая карточка - меньше */
    .problem-solution-card:nth-child(1) {
        grid-column: 1 / 2;
        grid-row: 1 / 2;
    }

    /* Синяя карточка - больше */
    .problem-solution-card:nth-child(2) {
        grid-column: 2 / 3;
        grid-row: 1 / 2;
    }

    /* Третья карточка - меньше */
    .problem-solution-card:nth-child(3) {
        grid-column: 1 / 2;
        grid-row: 2 / 3;
    }

    /* Четвертая карточка - больше */
    .problem-solution-card:nth-child(4) {
        grid-column: 2 / 3;
        grid-row: 2 / 3;
    }

    .card-number-circle {
        width: 36px;
        height: 36px;
        font-size: 16px;
        margin-bottom: 16px;
    }

    .problem-solution-card .problem-title {
        font-size: 16px;
        margin-bottom: 12px;
        text-align: left;
    }

    .solution-text {
        font-size: 16px;
        text-align: left;
    }

    /* Третья секция */
    .third-section {
        padding: 60px 0;
    }



    .capabilities-list {
        gap: 24px;
        margin-top: 32px;
    }

    .capability-item {
        padding: 24px 16px;
        gap: 16px;
        border-radius: 16px;
        text-align: left;
    }

    .capability-number {
        font-size: 64px;
        line-height: 0.8;
        margin-bottom: 8px;
        text-align: left;
    }

    .capability-title {
        font-size: 20px;
        margin-bottom: 8px;
        text-align: left;
    }

    .capability-description {
        font-size: 16px;
        line-height: 1.4;
        text-align: left;
    }

    /* Примеры */
    .implementation-examples {
        margin-top: 48px;
    }



    .card-image {
        height: 140px;
        border-radius: 12px;
        margin-bottom: 16px;
    }

    .example-title {
        font-size: 17px;
        margin-bottom: 12px;
        text-align: left;
    }

    .example-description {
        font-size: 16px;
        margin-bottom: 20px;
        text-align: left;
    }

    .example-cta-button {
        padding: 12px 24px;
        font-size: 16px;
        border-radius: 8px;
        width: 100%;
    }

    /* Timeline секция */
    .how-it-works-section {
        padding: 80px 0;
    }

    .how-it-works-section .section-title {
        text-align: left;
        font-size: 40px;
        padding: 0;
    }

    .timeline-container {
        gap: 32px;
        padding: 0 30px !important;
        
    }

    .timeline-content {
        padding: 24px 20px;
        border-radius: 16px;
        text-align: left;
    }

    .timeline-title {
        font-size: 18px;
        margin-bottom: 12px;
        text-align: left;
    }

    .timeline-description {
        font-size: 16px;
        text-align: left;
        line-height: 1.5;
    }

    /* Tasks секция */
    .tasks-section {
        padding: 60px 0;
    }

    .tasks-section .section-title {
        font-size: 40px;
        text-align: left;
        margin-bottom: 24px;
        padding-left: 70px;
    }

    .tasks-timeline {
        padding: 0 30px !important;
    }





    /* === OFFER СЕКЦИЯ === */
    .offer-section {
        padding: 60px 0;
    }

    /* Скрываем видео фон */
    .offer-video-background {
        display: none;
    }

    .offer-section .section-title {
        font-size: 40px;
        text-align: left;
        margin-bottom: 24px;
        padding-left: 60px;
    }

    .offer-section .section-subtitle {
        font-size: 20px;
        text-align: left;
        margin-bottom: 40px;
    }

    .pricing-card-single {
        max-width: 600px;
        margin: 0;
        padding: 32px;
        border-radius: 20px;
    }

    .price-amount {
        font-size: 32px;
        margin-bottom: 8px;
    }

    .benefits-title {
        font-size: 18px;
        margin-bottom: 20px;
    }

    .benefit-text {
        font-size: 16px;
        line-height: 1.5;
    }

    /* === READY СЕКЦИЯ === */
    .ready-section {
        padding: 60px 0;
    }



    .ready-content {
        display: flex;
        flex-direction: column;
        gap: 40px;
        align-items: center;
    }

    .ready-section .section-title {
        font-size: 40px !important;
        text-align: left;
        margin-bottom: 24px;
        white-space: normal;
        padding-left: 0;
    }

    /* Убираем розовые пунктирные линии */
    .ready-section *,
    .ready-section *::before,
    .ready-section *::after {
        outline: none !important;
        border: none !important;
        box-shadow: none !important;
    }

    .ready-section-content {
        padding: 0 60px 0 0 !important;
    }

    .ready-description {
        font-size: 16px;
        text-align: left;
        margin-bottom: 24px;
    }

    .ready-subtitle {
        font-size: 16px;
        text-align: left;
        margin-bottom: 20px;
    }

    .ready-experts-title {
        font-size: 16px;
        margin-bottom: 16px;
    }

    .ready-experts-list {
        font-size: 16px;
        line-height: 1.6;
    }

    .ready-form-container {
        max-width: 500px;
        width: 100%;
        margin: 0 auto;
    }

    .ready-form-input {
        font-size: 16px;
        padding: 14px 16px;
    }

    .ready-form-submit {
        font-size: 16px;
        padding: 14px 24px;
    }

    /* === ФУТЕР === */
    .footer-content {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 60px;
        padding: 0 60px 0 0;
    }

    .footer-left {
        padding-left: 0;
        transform: none;
        margin-left: -60px;
    }

    .footer-right {
        transform: none;
    }

    .footer-details {
        transform: none;
    }

    .footer-link:first-child {
        transform: none;
        margin-bottom: 4px;
    }

    .footer-link:last-child {
        transform: none;
        margin-bottom: 0;
    }

    .footer-company-name {
        font-size: 16px;
    }

    .footer-details p {
        font-size: 16px;
    }

    .footer-phone {
        font-size: 24px;
    }

    .footer-link {
        font-size: 16px;
    }
}

@media (max-width: 480px) {
    .hero-section {
        padding: 60px 0 40px;
    }
    
    .content {
        padding: 0 var(--container-padding-mobile);
    }
    
    .container {
        padding: 0 var(--container-padding-mobile);
    }
    
    .main-title {
        font-size: 40px;
        white-space: normal;
        margin-bottom: 20px;
    }
    
    .subtitle {
        font-size: 16px;
        letter-spacing: 0.5px;
        margin-bottom: 28px;
    }
    
    .line-separator {
        width: 180px;
        height: 2px;
        margin: 0 auto 28px;
    }
    
    .cta-button {
        font-size: 14px;
        padding: 14px 28px;
        margin-bottom: 20px;
        border-radius: 10px;
    }
    
    .cta-subtitle {
        font-size: 12px;
        margin-top: 12px;
    }

    /* Видео для экранов 480px и меньше */
    .fullscreen-video-background {
        top: -220px !important;
    }

    .second-section {
        padding: 60px 0;
    }
    
    .bento-content {
        padding: 0 var(--container-padding-mobile);
    }
    
    .capabilities-content {
        padding: 0 var(--container-padding-mobile);
    }
    
    .timeline-container {
        padding: 0 var(--container-padding-mobile);
    }
    
    .tasks-timeline {
        padding: 0 var(--container-padding-mobile);
    }

    .section-title {
        font-size: 32px;
        line-height: 1.1;
    }
    
    .section-header {
        margin-bottom: 40px;
    }

    .business-problems {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto auto;
        gap: 20px;
        margin-top: 32px;
        min-height: auto;
        align-items: stretch;
    }
    
    /* На мобильных все карточки в столбик */
    .problem-solution-card {
        padding: 24px 20px;
        border-radius: 18px;
    }
    
    .problem-solution-card:nth-child(1),
    .problem-solution-card:nth-child(2),
    .problem-solution-card:nth-child(3),
    .problem-solution-card:nth-child(4) {
        grid-column: 1 / 2;
    }
    
    .problem-solution-card:nth-child(1) {
        grid-row: 1 / 2;
    }
    
    .problem-solution-card:nth-child(2) {
        grid-row: 2 / 3;
    }
    
    .problem-solution-card:nth-child(3) {
        grid-row: 3 / 4;
    }
    
    .problem-solution-card:nth-child(4) {
        grid-row: 4 / 5;
    }

    .card-number-circle {
        width: 40px;
        height: 40px;
        font-size: 16px;
        margin-bottom: 20px;
    }

    .problem-solution-card .problem-title {
        font-size: 17px;
        margin-bottom: 12px;
    }

    .solution-text {
        font-size: 13px;
    }

    .third-section {
        padding: 80px 0;
    }

    .capabilities-list {
        gap: 32px;
        margin-top: 40px;
    }
    
    .capability-item {
        padding: 28px 20px;
        gap: 20px;
        border-radius: 20px;
        text-align: left;
    }

    .capability-number {
        font-size: 72px;
        line-height: 0.8;
        margin-bottom: 4px;
        text-align: left;
    }

    .capability-title {
        font-size: 22px;
        margin-bottom: 8px;
    }

    .capability-description {
        font-size: 16px;
        line-height: 1.4;
    }
    
    .implementation-examples {
        margin-top: 60px;
    }
    
    .examples-grid {
        gap: 16px;
        width: 100%;
    }
    
    .example-card {
        padding: 24px;
        border-radius: 18px;
    }
    
    .card-image {
        height: 160px;
        border-radius: 14px;
        margin-bottom: 20px;
    }
    
    .card-header {
        margin-bottom: 16px;
    }

    .card-number {
        font-size: 24px;
    }
    
    .card-badge {
        font-size: 11px;
        padding: 6px 12px;
    }

    .example-title {
        font-size: 18px;
        margin-bottom: 12px;
    }

    .example-description {
        font-size: 14px;
        line-height: 1.5;
    }

    .example-cta-button {
        padding: 14px 20px;
        font-size: 14px;
        border-radius: 10px;
    }
    
    .cta-section {
        margin-top: 32px;
        padding: 0 var(--container-padding-mobile);
    }
    
    .cta-button-secondary {
        padding: 14px 24px;
        font-size: 15px;
        min-width: 160px;
        border-radius: 10px;
    }
}

/* Оптимизация для touch-устройств */
@media (hover: none) and (pointer: coarse) {
    .capability-item:hover,
    .example-card:hover,
    .solution-card:hover,
    .problem-card:hover {
        transform: none;
        background: initial;
        border-color: initial;
        box-shadow: initial;
    }
    
    .capability-item:active {
        transform: scale(0.98);
    }
    
    .example-card:active {
        transform: scale(0.98);
    }
    
    .cta-button:active {
        transform: scale(0.96);
    }

    .example-cta-button:hover {
        background: linear-gradient(135deg, #145BDE 0%, #0F4BC7 50%, #1E6EFF 100%);
        transform: none;
        box-shadow: 0 4px 15px rgba(20, 91, 222, 0.3);
        scale: 1;
    }

    .example-cta-button:hover::before {
        left: -100%;
    }

    .example-cta-button:active {
        transform: scale(0.96);
        background: linear-gradient(135deg, #0D3F9F 0%, #0F4BC7 50%, #1A6BF5 100%);
    }
    
    /* Убираем сложные hover-эффекты на мобильных */
    .solution-pair:hover .connection-flow .flow-line,
    .solution-pair:hover .flow-arrow {
        transform: none;
        background: initial;
    }
    
    /* На мобильных оставляем только легкие анимации персонажей */
    .example-image {
        animation: breathe 6s ease-in-out infinite !important;
    }
    
    .example-card:nth-child(1) .example-image,
    .example-card:nth-child(2) .example-image {
        animation: breathe 6s ease-in-out infinite !important;
    }
    
    /* Убираем сложные декоративные эффекты для лучшей производительности */
    .third-section::after {
        animation: none;
    }
    
    .capability-number::before,
    .capability-number::after {
        display: none;
    }
    
    .card-image::before,
    .card-image::after {
        animation: none;
        opacity: 0;
    }
}

/* Дополнительный брейкпоинт для больших планшетов */
@media (max-width: 1024px) and (min-width: 769px) {
    /* Контейнеры и отступы - фиксация по левой стороне */
    .container,
    .timeline-container {
        max-width: none !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 35px !important;
        box-sizing: border-box !important;
    }
    
    .bento-content {
        max-width: none !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 35px !important;
        box-sizing: border-box !important;
    }
    
    .second-section .bento-content {
        padding-left: 0 !important;
        padding-right: 0 !important;
        max-width: none !important;
    }
    
    /* Главная секция - выравнивание по левой направляющей */
    .hero-section {
        min-height: 85vh !important;
        padding-top: 90px !important;
    }
    
    .fullscreen-video {
        transform: translateY(-1%) !important;
    }
    
    .content {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    .text-content {
        padding-left: 0 !important;
        margin-left: 0 !important;
    }
    
    .main-title {
        font-size: 72px;
        line-height: 1.1;
        text-align: left !important;
        margin-left: 0 !important;
        padding-left: 0 !important;
    }
    
    .subtitle {
        font-size: 14px;
        line-height: 1.4;
        margin-bottom: 20px;
        text-align: left !important;
        margin-left: 0 !important;
        padding-left: 0 !important;
    }
    
    .line-separator {
        width: 80px;
        height: 3px;
        margin-left: 0 !important;
    }
    
    .cta-button {
        padding: 16px 32px;
        font-size: 16px;
        margin-left: 0 !important;
    }
    
    .cta-subtitle {
        font-size: 14px;
        text-align: left !important;
        margin-left: 0 !important;
        padding-left: 0 !important;
    }
    
    /* Заголовки секций - фиксация по левой стороне */
    .section-title {
        font-size: 32px !important;
        line-height: 1.2;
        margin-left: 0 !important;
        padding-left: 0 !important;
        text-align: left !important;
    }
    
    .third-section .section-title {
        font-size: 32px !important;
        margin-left: 0 !important;
        padding-left: 30px !important;
        text-align: left !important;
    }
    
    .section-subtitle {
        font-size: 16px;
    }
    
    /* Вторая секция - фиксация по левой стороне */
    .second-section {
        padding-top: 0;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    /* Вторая секция - карточки проблем */
    .business-problems {
        margin-left: -35px !important;
        margin-right: -35px !important;
        width: calc(100% + 70px) !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        grid-template-rows: 1fr 1fr !important;
        gap: 24px !important;
        box-sizing: border-box !important;
        margin-top: 50px !important;
    }
    
    .problem-solution-card:nth-child(1) {
        grid-column: 1 / 2 !important;
        grid-row: 1 / 2 !important;
    }
    
    .problem-solution-card:nth-child(2) {
        grid-column: 2 / 3 !important;
        grid-row: 1 / 2 !important;
    }
    
    .problem-solution-card:nth-child(3) {
        grid-column: 1 / 2 !important;
        grid-row: 2 / 3 !important;
    }
    
    .problem-solution-card:nth-child(4) {
        grid-column: 2 / 3 !important;
        grid-row: 2 / 3 !important;
    }
    
    .problem-solution-card {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
        max-width: none !important;
        box-sizing: border-box !important;
        padding: 32px 24px !important;
    }
    
    .problem-solution-card:nth-child(odd) {
        margin-left: 0 !important;
    }
    
    .problem-solution-card:nth-child(even) {
        margin-right: 35px !important;
    }
    
    .card-number-circle {
        width: 44px;
        height: 44px;
        font-size: 16px;
    }
    
    .problem-solution-card .problem-title {
        font-size: 16px;
        white-space: normal !important;
        word-wrap: break-word !important;
        line-height: 1.3 !important;
    }
    
    .problem-solution-card:nth-child(1) .problem-title {
        white-space: normal !important;
        word-wrap: normal !important;
        overflow-wrap: normal !important;
        hyphens: none !important;
        max-width: none !important;
        width: auto !important;
        height: auto !important;
        line-height: 1.2 !important;
        margin: 0 !important;
        padding: 0 !important;
        text-overflow: clip !important;
        overflow: visible !important;
        margin-left: 0 !important;
        padding-left: 0 !important;
    }
    
    .problem-solution-card:nth-child(1) .title-line {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        white-space: nowrap !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }
    
    .problem-solution-card:nth-child(1),
    .problem-solution-card:nth-child(2) {
        display: flex !important;
        flex-direction: column !important;
        height: 100% !important;
        min-height: 300px !important;
    }
    
    .problem-solution-card:nth-child(1) .solution-section {
        display: flex !important;
        flex-direction: column !important;
        justify-content: flex-end !important;
        align-items: flex-start !important;
        margin-top: auto !important;
        padding: 16px 24px 24px 0px !important;
    }
    
    .problem-solution-card:nth-child(2) .solution-section {
        display: flex !important;
        flex-direction: column !important;
        justify-content: flex-end !important;
        align-items: flex-start !important;
        margin-top: auto !important;
        padding: 16px 24px 24px 0px !important;
    }
    
    .problem-solution-card:nth-child(1) .solution-text {
        font-size: 16px !important;
        line-height: 1.4 !important;
        margin: 0 !important;
        margin-left: 0 !important;
        padding-left: 0 !important;
    }
    
    .problem-solution-card:nth-child(2) .solution-text {
        font-size: 16px !important;
        line-height: 1.4 !important;
        margin: 0 !important;
    }
    
        .problem-solution-card:nth-child(1) .problem-section {
        padding: 24px 24px 16px 0px !important;
        min-height: 120px !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
    }

    .problem-solution-card:nth-child(2) .problem-section {
        padding: 24px 24px 16px 0px !important;
        min-height: 120px !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
    }
    
    .solution-text {
        font-size: 16px;
    }
    
    /* Третья секция - возможности */
    .capabilities-list {
        gap: 36px;
        margin-top: 60px;
    }
    
    .capability-item {
        gap: 28px;
        padding: 24px;
    }
    
    .capability-number {
        font-size: 96px;
        min-width: 120px;
    }
    
    .capability-title {
        font-size: 22px;
    }
    
    .capability-description {
        font-size: 16px;
    }
    
    /* Примеры реализации */
    .implementation-title {
        font-size: 32px;
    }
    
    .examples-grid {
        gap: 24px;
    }
    
    .example-card {
        padding: 20px;
    }
    
    .card-image {
        height: 160px;
    }
    
    .example-title {
        font-size: 18px;
    }
    
    .example-description {
        font-size: 16px;
    }
    
    .example-cta-button {
        padding: 12px 20px;
        font-size: 16px;
    }
    
    /* Как это работает */
    .how-it-works-section {
        padding: 80px 0;
    }
    
    .how-it-works-section .section-title {
        font-size: 32px;
        margin-bottom: 50px;
        padding-left: 35px !important;
        margin-left: 0 !important;
        text-align: left !important;
    }
    
    .timeline-content {
        padding: 28px;
    }
    
    .timeline-title {
        font-size: 18px;
    }
    
    .timeline-description {
        font-size: 16px;
    }
    
    /* Задачи - вертикальные карточки с подчеркиванием */
    .tasks-section {
        padding: 50px 0;
    }
    
    .tasks-section .section-title {
        font-size: 32px;
        margin: 0 0 80px 0;
        padding-left: 30px !important;
        margin-left: 0 !important;
        text-align: left !important;
    }
    
    .tasks-timeline {
        max-width: none !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 35px !important;
        display: flex;
        flex-direction: column;
        gap: 0;
        box-sizing: border-box !important;
    }
    
    .task-item {
        background: none !important;
        border: none !important;
        border-bottom: none !important;
        border-radius: 0 !important;
        padding: 20px 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        text-align: left !important;
        gap: 0 !important;
        position: relative !important;
        transition: all 0.3s ease;
        transform: none !important;
        opacity: 1 !important;
        min-height: auto !important;
        margin-bottom: 0 !important;
    }
    
    .task-item:hover {
        background: rgba(255, 255, 255, 0.02);
        border-bottom-color: rgba(30, 111, 255, 0.3);
        transform: none;
        box-shadow: none;
    }
    
    .task-item:last-child {
        border-bottom: none;
    }
    
    .task-left {
        width: 100% !important;
        text-align: left !important;
        margin-bottom: 16px !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        gap: 16px !important;
        flex: none !important;
        padding-right: 0 !important;
    }
    
    .task-title {
        font-size: 12px !important;
        font-weight: 600;
        font-family: 'Unbounded', sans-serif;
        margin: 0 !important;
        color: #ffffff;
        text-transform: uppercase;
        line-height: 1.3;
        letter-spacing: 1px;
        text-align: left !important;
        flex: none;
        background: rgba(255, 255, 255, 0.2) !important;
        border-radius: 20px !important;
        padding: 8px 16px !important;
        display: inline-block !important;
        width: fit-content !important;
        white-space: nowrap !important;
        backdrop-filter: blur(10px) !important;
        order: 2 !important;
    }
    
    .task-number {
        font-size: 24px !important;
        font-weight: 700;
        color: #ffffff;
        font-family: 'Unbounded', sans-serif;
        line-height: 1;
        margin: 0 !important;
        display: block;
        background: none;
        border: none;
        min-width: auto !important;
        border-radius: 0;
        text-align: left !important;
        order: 1 !important;
        opacity: 0.7 !important;
    }
    
    .task-divider {
        display: none;
    }
    
    .task-right {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        display: block !important;
        text-align: left !important;
        flex: none !important;
        padding-left: 0 !important;
    }
    
    .task-description {
        font-size: 16px !important;
        line-height: 1.5;
        color: #d1d5db;
        margin: 0 !important;
        text-align: left !important;
        padding: 0 !important;
        max-width: 400px;
        font-family: 'Gilroy', sans-serif !important;
        font-weight: 400 !important;
    }
    
    .task-item:not(:last-child)::after {
        content: '' !important;
        position: absolute !important;
        bottom: -8px !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        height: 1px !important;
        background: rgba(255, 255, 255, 0.1) !important;
        overflow: hidden !important;
        z-index: 0 !important;
    }
    
    .task-item:not(:last-child)::before {
        content: '' !important;
        position: absolute !important;
        bottom: -8px !important;
        left: -100% !important;
        width: 100% !important;
        height: 1px !important;
        background: linear-gradient(90deg, 
            transparent 0%, 
            #145BDE 20%, 
            #1E6FFF 50%, 
            #145BDE 80%, 
            transparent 100%) !important;
        animation: loaderMove 2s ease-in-out infinite !important;
        z-index: 1 !important;
    }
    
    @keyframes loaderMove {
        0% {
            left: -100%;
        }
        50% {
            left: 0%;
        }
        100% {
            left: 100%;
        }
    }
    
    .task-separator {
        display: none;
    }
}

/* Блок "Какие задачи решает" - специальные стили для диапазона 769-1024px */
@media (max-width: 1024px) and (min-width: 769px) {
    .tasks-section {
        padding: 80px 0;
    }
    
    .tasks-timeline {
        max-width: 600px;
        margin: 0 auto;
        padding: 0 35px;
    }
    
    .task-item {
        background: none !important;
        border: none !important;
        border-radius: 0 !important;
        padding: 24px 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 12px !important;
        position: relative !important;
        margin-bottom: 0 !important;
    }
    
    .task-left {
        width: 100% !important;
        display: flex !important;
        align-items: center !important;
        gap: 16px !important;
        margin-bottom: 0 !important;
    }
    
    .task-number {
        font-size: 20px !important;
        font-weight: 700 !important;
        color: #ffffff !important;
        font-family: 'Unbounded', sans-serif !important;
        margin: 0 !important;
        order: 1 !important;
        opacity: 0.8 !important;
        flex-shrink: 0 !important;
    }
    
    .task-title {
        font-size: 11px !important;
        font-weight: 600 !important;
        font-family: 'Unbounded', sans-serif !important;
        color: #ffffff !important;
        text-transform: uppercase !important;
        letter-spacing: 1px !important;
        background: rgba(255, 255, 255, 0.15) !important;
        border-radius: 16px !important;
        padding: 6px 12px !important;
        backdrop-filter: blur(10px) !important;
        order: 2 !important;
        margin: 0 !important;
    }
    
    .task-description {
        font-size: 15px;
        line-height: 1.5 !important;
        color: #d1d5db !important;
        font-family: 'Gilroy', sans-serif !important;
        font-weight: 400 !important;
        margin: 0 !important;
        max-width: 450px !important;
    }
    
    .task-divider {
        display: none !important;
    }
    
    .task-item:not(:last-child) {
        position: relative !important;
        margin-bottom: 8px !important;
        padding-bottom: 24px !important;
    }
    
    .task-item:not(:last-child)::after {
        content: '' !important;
        position: absolute !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        height: 1px !important;
        background: rgba(255, 255, 255, 0.08) !important;
    }
    
    .task-item:not(:last-child)::before {
        display: none !important;
    }
}

/* Сброс стилей и базовые настройки */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Глобальные переменные для единой системы отступов */
:root {
    --container-max-width: 1400px;
    --container-padding-desktop: 60px;
    --container-padding-tablet: 40px;
    --container-padding-expanded: 30px;
    --container-padding-tablet-large: 35px;
    --container-padding-mobile: 20px;
}

/* Визуальные направляющие отключены */

body {
    font-family: 'Unbounded', sans-serif;
    min-height: 100vh;
    overflow-x: hidden;
    position: relative;
    padding-top: 76px;
    background: #EBEBE9;
}

/* Полноэкранное видео фон */
.fullscreen-video-background {
    position: absolute;
    top: -180px;
    left: 50%;
    transform: translateX(-50%);
    width: 1280px;
    max-width: 120%;
    height: calc(100vh + 200px);
    z-index: -1;
    overflow: hidden;
    background: #EBEBE9;
}

.fullscreen-video {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* Контейнер и основная секция */
.hero-section {
    padding: 0 !important;
    margin: 0 !important;
    background: none !important;
    position: relative !important;
    height: 65vh !important;
    min-height: 600px !important;
    max-height: none !important;
    overflow: visible !important;
}

.container {
    width: 100%;
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-desktop);
    position: relative;
}

.content {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 80px;
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-desktop);
    width: 100%;
}

/* Текстовый контент */
.text-content {
    flex: 1;
    max-width: 50%;
}

.main-title {
    font-size: 96px;
    font-weight: 500;
    font-family: 'Unbounded', sans-serif;
    color: #191925;
    margin-bottom: 15px;
    line-height: 1.0;
    white-space: nowrap;
}

.ai-text {
    color: #145BDE;
}

.highlight-text {
    font-size: 20px;
    font-weight: 500;
}

.line-separator {
    width: 380px;
    height: 3px;
    background: #145BDE;
    margin: 15px 0 25px 0;
    border-radius: 1px;
}

.subtitle {
    font-size: 28px;
    font-weight: 400;
    font-family: 'Unbounded', sans-serif;
    color: #191925;
    letter-spacing: 1px;
    line-height: 1.3;
    text-transform: uppercase;
    margin-top: 0;
    margin-bottom: 40px;
}

/* Кнопка Call-to-Action */
.cta-button {
    background: #145BDE;
    color: #ffffff;
    border: none;
    padding: 18px 36px;
    font-size: 18px;
    font-weight: 600;
    font-family: 'Gilroy', sans-serif;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    letter-spacing: 0.5px;
    box-shadow: 0 2px 8px rgba(2, 132, 199, 0.2);
}

.cta-button:hover {
    background: #145BDE;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(20, 91, 222, 0.3);
}

.cta-button:active {
    background: #145BDE;
    transform: translateY(0px);
    box-shadow: 0 2px 6px rgba(20, 91, 222, 0.4);
}

/* Подпись под кнопкой */
.cta-subtitle {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 24px;
    font-family: 'Gilroy', sans-serif;
    font-size: 14px;
    font-weight: 400;
    color: #6B7280;
    cursor: pointer;
    transition: color 0.3s ease;
}

.cta-subtitle:hover {
    color: #4B5563;
}

.cta-subtitle svg {
    transition: transform 0.3s ease;
}

.cta-subtitle:hover svg {
    transform: translate(1px, -1px);
}

/* Кнопка под карточками */
.cta-section {
    display: flex;
    justify-content: center;
    margin-top: 60px;
    padding: 0 var(--container-padding-desktop);
}

.cta-button-secondary {
    background: #145BDE;
    color: #ffffff;
    border: none;
    padding: 18px 36px;
    font-size: 18px;
    font-weight: 600;
    font-family: 'Gilroy', sans-serif;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    letter-spacing: 0.5px;
    box-shadow: 0 2px 8px rgba(20, 91, 222, 0.2);
    min-width: 200px;
}

.cta-button-secondary:hover {
    background: #0F4BC7;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(20, 91, 222, 0.4);
}

.cta-button-secondary:active {
    background: #0D42B3;
    transform: translateY(0px);
    box-shadow: 0 2px 6px rgba(20, 91, 222, 0.4);
}

/* Второй блок - Bento стиль */
.second-section {
    min-height: 100vh;
    background: #EBEBE9;
    position: relative;
    z-index: 2;
    padding: 120px 0;
}

.bento-content {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-desktop);
    position: relative;
}

/* Заголовок секции */
.section-header {
    text-align: left;
    margin: 0 0 60px calc(-1 * var(--container-padding-desktop));
}

.section-title {
    font-family: 'Unbounded', sans-serif;
    font-size: 56px;
    font-weight: 500;
    color: #191925;
    line-height: 1.1;
    margin: 0 0 0 calc(-1 * var(--container-padding-desktop));
    text-transform: uppercase;
    text-align: left;
}

.bento-content .section-subtitle {
    font-family: 'Gilroy', sans-serif;
    font-size: 16px;
    font-weight: 500;
    color: #6B7280;
    text-align: left;
    margin: 16px 0 0 calc(-1 * var(--container-padding-desktop));
    text-transform: uppercase;
    letter-spacing: 1px;
}

.second-section .section-title {
    padding-left: 120px;
}

/* Business Problems - Шахматная раскладка */
.business-problems {
    display: grid;
    grid-template-columns: 2fr 1fr 2fr;
    grid-template-rows: 1fr 1fr;
    gap: 24px;
    width: 100%;
    margin-top: 80px;
    min-height: 600px;
    align-items: stretch;
    position: relative;
}

/* Первая карточка - Большая слева сверху */
.problem-solution-card:nth-child(1) {
    grid-column: 1 / 2;
    grid-row: 1 / 2;
}

/* Вторая карточка - Маленькая справа сверху */
.problem-solution-card:nth-child(2) {
    grid-column: 2 / 4;
    grid-row: 1 / 2;
}

/* Третья карточка - Маленькая слева снизу */
.problem-solution-card:nth-child(3) {
    grid-column: 1 / 3;
    grid-row: 2 / 3;
}

/* Четвертая карточка - Большая справа снизу */
.problem-solution-card:nth-child(4) {
    grid-column: 3 / 4;
    grid-row: 2 / 3;
}

/* Анимация появления карточек */
.problem-solution-card {
    opacity: 0;
    transform: translateY(40px) scale(0.9);
    animation: cardAppear 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.problem-solution-card:nth-child(1) { animation-delay: 0.1s; }
.problem-solution-card:nth-child(2) { animation-delay: 0.2s; }
.problem-solution-card:nth-child(3) { animation-delay: 0.3s; }
.problem-solution-card:nth-child(4) { animation-delay: 0.4s; }

@keyframes cardAppear {
    0% {
        opacity: 0;
        transform: translateY(40px) scale(0.9);
    }
    50% {
        opacity: 0.8;
        transform: translateY(-5px) scale(1.02);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Problem Solution Cards */
.problem-solution-card {
    border-radius: 20px;
    padding: 36px 32px;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    cursor: pointer;
    display: grid;
    grid-template-rows: 1fr auto 1fr;
    text-align: left;
    height: 100%;
    box-sizing: border-box;
    gap: 0;
    transform: translateY(30px);
    opacity: 0;
}

/* Анимация появления для карточек проблем */
.problem-solution-card.animate-in {
    transform: translateY(0);
    opacity: 1;
}

/* Hover эффект для карточек проблем */
.problem-solution-card:hover {
    transform: translateY(-8px) scale(1.02);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
}

/* Problem and Solution Sections */
.problem-section {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 20px 0;
}

.solution-section {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 12px;
    padding: 20px 0;
}

/* Section Divider */
.section-divider {
    height: 1px;
    margin: 0;
    opacity: 0.3;
    transition: opacity 0.3s ease;
    align-self: stretch;
}

/* Section Tags */
.section-tag {
    background: rgba(255, 255, 255, 0.2);
    color: #FFFFFF;
    font-family: 'Unbounded', sans-serif;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 8px 16px;
    border-radius: 20px;
    display: inline-block;
    width: fit-content;
    white-space: nowrap;
    backdrop-filter: blur(10px);
}

/* Первая карточка - Синий градиент */
.problem-solution-card:nth-child(1) {
    background: linear-gradient(135deg, #145BDE 0%, #1E6FFF 100%);
    box-shadow: 0 4px 20px rgba(20, 91, 222, 0.15);
}

/* Вторая карточка - Серый градиент */
.problem-solution-card:nth-child(2) {
    background: linear-gradient(135deg, #6B7280 0%, #4B5563 100%);
    box-shadow: 0 4px 20px rgba(107, 114, 128, 0.15);
}

/* Третья карточка - Темный градиент */
.problem-solution-card:nth-child(3) {
    background: linear-gradient(135deg, #374151 0%, #111827 100%);
    box-shadow: 0 4px 20px rgba(31, 41, 55, 0.15);
}

/* Четвертая карточка - Светлый градиент */
.problem-solution-card:nth-child(4) {
    background: linear-gradient(135deg, #F9FAFB 0%, #E5E7EB 100%);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
}

/* Единая типографика для всех карточек */

.problem-solution-card .problem-title {
    font-family: 'Gilroy', sans-serif;
    font-size: 19px;
    font-weight: 500;
    line-height: 1.3;
    margin: 0;
    transition: color 0.3s ease;
}

.solution-text {
    font-family: 'Gilroy', sans-serif;
    font-size: 19px;
    font-weight: 500;
    line-height: 1.4;
    margin: 0;
    transition: color 0.3s ease;
}

/* Синяя карточка - белый текст */
.problem-solution-card:nth-child(1) .problem-title {
    color: #FFFFFF;
}

.problem-solution-card:nth-child(1) .solution-text {
    color: #FFFFFF;
}

/* Серая карточка - белый текст */
.problem-solution-card:nth-child(2) .problem-title {
    color: #FFFFFF;
}

.problem-solution-card:nth-child(2) .solution-text {
    color: #FFFFFF;
}

/* Черная карточка - белый текст */
.problem-solution-card:nth-child(3) .problem-title {
    color: #FFFFFF;
}

.problem-solution-card:nth-child(3) .solution-text {
    color: #FFFFFF;
}

/* Белая карточка - темный текст */
.problem-solution-card:nth-child(4) .problem-title {
    color: #1F2937;
}

.problem-solution-card:nth-child(4) .solution-text {
    color: #1F2937;
}

/* Убираем специфические стили для тегов - теперь все теги имеют единый синий стиль */

/* Divider colors for different cards */
.problem-solution-card:nth-child(1) .section-divider {
    background: rgba(255, 255, 255, 0.3);
}

.problem-solution-card:nth-child(2) .section-divider {
    background: rgba(255, 255, 255, 0.3);
}

.problem-solution-card:nth-child(3) .section-divider {
    background: rgba(255, 255, 255, 0.3);
}

.problem-solution-card:nth-child(4) .section-divider {
    background: rgba(0, 0, 0, 0.15);
}

/* Hover effects for dividers */
.problem-solution-card:hover .section-divider {
    opacity: 0.5;
}

/* Card Content Styles */
.problem-badge {
    font-family: 'Gilroy', sans-serif;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 8px 14px;
    border-radius: 8px;
    display: inline-block;
    margin-bottom: 16px;
    background: linear-gradient(135deg, #FFE5E5 0%, #FFD0D0 100%);
    color: #DC2626;
    border: 1px solid rgba(220, 38, 38, 0.2);
}

.solution-badge {
    font-family: 'Gilroy', sans-serif;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 8px 14px;
    border-radius: 8px;
    display: inline-block;
    margin-bottom: 16px;
    background: rgba(255, 255, 255, 0.2);
    color: #FFFFFF;
    border: 1px solid rgba(255, 255, 255, 0.3);
    backdrop-filter: blur(10px);
}

.problem-title {
    font-family: 'Gilroy', sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: #111827;
    line-height: 1.3;
    margin: 0 0 12px 0;
    padding-right: 60px;
}

.solution-title {
    font-family: 'Gilroy', sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: #FFFFFF;
    line-height: 1.3;
    margin: 0 0 12px 0;
    padding-right: 60px;
}

.problem-description {
    font-family: 'Gilroy', sans-serif;
    font-size: 13px;
    font-weight: 400;
    color: #6B7280;
    line-height: 1.4;
    margin: 0;
    padding-right: 40px;
}

.solution-description {
    font-family: 'Gilroy', sans-serif;
    font-size: 13px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.9);
    line-height: 1.4;
    margin: 0;
    padding-right: 40px;
}

/* Теги на светлой карточке */
.problem-solution-card:nth-child(4) .section-tag {
    background: rgba(0, 0, 0, 0.1);
    color: #1F2937;
}

/* Третий блок - Возможности AI-ассистента */
.third-section {
    background: #1A202C;
    position: relative;
    z-index: 2;
    padding: 140px 0;
    overflow: hidden;
}

.third-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(circle at 20% 80%, rgba(255, 255, 255, 0.15) 0%, transparent 50%),
        radial-gradient(circle at 80% 20%, rgba(255, 255, 255, 0.1) 0%, transparent 50%),
        radial-gradient(circle at 40% 40%, rgba(185, 227, 255, 0.1) 0%, transparent 30%);
    pointer-events: none;
}

.third-section::after {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Ccircle cx='7' cy='7' r='1'/%3E%3Ccircle cx='37' cy='37' r='1'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    pointer-events: none;
    animation: float 20s ease-in-out infinite;
}

@keyframes float {
    0%, 100% { transform: translateX(0) translateY(0); }
    25% { transform: translateX(10px) translateY(-10px); }
    50% { transform: translateX(-5px) translateY(-20px); }
    75% { transform: translateX(-10px) translateY(-10px); }
}

/* Анимации для персонажей */
@keyframes breathe {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.02); }
}

@keyframes wave {
    0%, 100% { transform: rotate(0deg) scale(1); }
    25% { transform: rotate(-2deg) scale(1.01); }
    50% { transform: rotate(2deg) scale(1.02); }
    75% { transform: rotate(-1deg) scale(1.01); }
}

@keyframes blink {
    0%, 90%, 100% { opacity: 1; }
    95% { opacity: 0.3; }
}

@keyframes wiggle {
    0%, 100% { transform: translateX(0) translateY(0) rotate(0deg); }
    20% { transform: translateX(-2px) translateY(-1px) rotate(-1deg); }
    40% { transform: translateX(2px) translateY(1px) rotate(1deg); }
    60% { transform: translateX(-1px) translateY(0px) rotate(-0.5deg); }
    80% { transform: translateX(1px) translateY(-1px) rotate(0.5deg); }
}

@keyframes sparkle {
    0%, 100% { opacity: 0; transform: scale(0.5); }
    50% { opacity: 1; transform: scale(1); }
}

@keyframes characterAppear {
    0% { 
        opacity: 0; 
        transform: scale(0.3) rotate(-10deg) translateY(30px); 
    }
    50% { 
        opacity: 0.8; 
        transform: scale(1.1) rotate(5deg) translateY(-10px); 
    }
    100% { 
        opacity: 1; 
        transform: scale(1) rotate(0deg) translateY(0); 
    }
}

.capabilities-content {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-desktop);
    position: relative;
    z-index: 1;
}

.white-title {
    color: #FFFFFF !important;
}

.section-subtitle {
    font-family: 'Gilroy', sans-serif;
    font-size: 20px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.8);
    text-align: left;
    margin-top: 24px;
    line-height: 1.4;
    position: relative;
    padding-left: 32px;
}



.capabilities-list {
    display: flex;
    flex-direction: column;
    gap: 48px;
    margin-top: 80px;
    width: 100%;
}

.capability-item {
    display: flex;
    align-items: flex-start;
    gap: 40px;
    opacity: 0;
    transform: translateX(-50px);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    padding: 24px;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid transparent;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}

/* Убрано белое свечение при hover */

.capability-item.animate-in {
    opacity: 1;
    transform: translateX(0);
}

.capability-item:nth-child(1) { transition-delay: 0.1s; }
.capability-item:nth-child(2) { transition-delay: 0.3s; }
.capability-item:nth-child(3) { transition-delay: 0.5s; }

.capability-item:hover {
    transform: translateX(8px) translateY(-4px);
    box-shadow: 
        0 0 0 1px rgba(20, 91, 222, 0.6),
        0 0 20px rgba(20, 91, 222, 0.4),
        0 0 40px rgba(20, 91, 222, 0.2),
        0 12px 40px rgba(20, 91, 222, 0.2), 
        0 4px 16px rgba(0, 0, 0, 0.3);
    background: rgba(0, 0, 0, 0.15);
}

.capability-number {
    font-family: 'Gilroy', sans-serif;
    font-size: 120px;
    font-weight: 800;
    color: #ffffff;
    line-height: 0.8;
    min-width: 160px;
    text-align: center;
    position: relative;
    transition: all 0.4s ease;
    align-self: flex-end;
}

.capability-number::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0);
    width: 140px;
    height: 140px;
    background: radial-gradient(circle, rgba(20, 91, 222, 0.4) 0%, transparent 70%);
    border-radius: 50%;
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 0 40px rgba(20, 91, 222, 0.6);
}

.capability-number::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 120px;
    height: 120px;
    border: 2px solid rgba(20, 91, 222, 0.6);
    border-radius: 50%;
    opacity: 0;
    transition: all 0.4s ease;
    box-shadow: 0 0 30px rgba(20, 91, 222, 0.5);
}

.capability-item:hover .capability-number {
    background: linear-gradient(135deg, #145BDE 0%, #1E6FFF 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    transform: scale(1.05);
}

.capability-item:hover .capability-number::before {
    transform: translate(-50%, -50%) scale(1);
}

.capability-item:hover .capability-number::after {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1.2);
    animation: numberGlow 2s ease-in-out infinite alternate;
}

@keyframes numberGlow {
    0% { 
        opacity: 0.7;
        box-shadow: 0 0 30px rgba(20, 91, 222, 0.5);
    }
    100% { 
        opacity: 1;
        box-shadow: 0 0 50px rgba(20, 91, 222, 0.8);
    }
}

.capability-content {
    flex: 1;
    padding-top: 8px;
}

.capability-title {
    font-family: 'Gilroy', sans-serif;
    font-size: 28px;
    font-weight: 700;
    color: #FFFFFF;
    line-height: 1.2;
    margin: 0 0 16px 0;
    transition: color 0.3s ease;
}

.capability-item:hover .capability-title {
    color: #FFFFFF;
}

.capability-description {
    font-family: 'Gilroy', sans-serif;
    font-size: 18px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.6;
    margin: 0;
    transition: color 0.3s ease;
}

.capability-item:hover .capability-description {
    color: rgba(255, 255, 255, 0.95);
}

/* Виды ассистентов */
.implementation-examples {
    margin-top: 120px;
}

.section-subtitle-wrapper {
    text-align: left;
    margin: 0 0 48px calc(-1 * var(--container-padding-desktop));
}

.implementation-title {
    font-family: 'Unbounded', sans-serif;
    font-size: 28px;
    font-weight: 600;
    color: white;
    position: relative;
    display: inline-block;
    margin: 0;
    padding-left: 60px;
}

/* Убираем подчеркивание у заголовка "Виды ассистентов" */

/* Убираем стили кнопки */

.examples-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 40px;
    width: 100%;
}

.example-card {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid transparent;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-radius: 24px;
    padding: 28px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    transform: translateY(20px);
    opacity: 0;
    position: relative;
    display: flex;
    flex-direction: column;
}

.example-card.animate-in {
    opacity: 1;
    transform: translateY(0);
}

.example-card:nth-child(1) { transition-delay: 0.6s; }
.example-card:nth-child(2) { transition-delay: 0.8s; }

.example-card:hover {
    transform: translateY(-8px) scale(1.02);
    box-shadow: 
        0 0 0 1px rgba(20, 91, 222, 0.6),
        0 0 20px rgba(20, 91, 222, 0.4),
        0 0 40px rgba(20, 91, 222, 0.2),
        0 12px 40px rgba(20, 91, 222, 0.2), 
        0 4px 16px rgba(0, 0, 0, 0.3);
    background: rgba(0, 0, 0, 0.15);
}

.card-image {
    width: 100%;
    height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
    position: relative;
    overflow: hidden;
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.03) 100%);
}

/* Добавляем мерцающие элементы для оживления */
.card-image::before {
    content: '';
    position: absolute;
    top: 20%;
    left: 20%;
    width: 6px;
    height: 6px;
    background: rgba(255, 255, 255, 0.8);
    border-radius: 50%;
    animation: sparkle 2s ease-in-out infinite;
    z-index: 1;
}

.card-image::after {
    content: '';
    position: absolute;
    top: 30%;
    right: 25%;
    width: 4px;
    height: 4px;
    background: rgba(255, 255, 255, 0.6);
    border-radius: 50%;
    animation: sparkle 3s ease-in-out infinite;
    animation-delay: 1s;
    z-index: 1;
}

.example-image {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    border-radius: 12px;
    transform-origin: center center;
}

/* Анимация появления убрана */

/* Hover анимация изображений убрана */

/* Специальные анимации для изображений убраны */

.card-header {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 20px;
    position: relative;
    top: 0;
    left: 0;
    z-index: 2;
}

.card-number {
    font-family: 'Gilroy', sans-serif;
    font-size: 32px;
    font-weight: 800;
    color: #145BDE;
    line-height: 1;
}

.card-badge {
    background: rgba(255, 255, 255, 0.15);
    color: rgba(255, 255, 255, 0.9);
    padding: 8px 16px;
    border-radius: 20px;
    font-weight: 600;
    font-size: 12px;
    white-space: nowrap;
    text-transform: uppercase;
}

.example-title {
    font-family: 'Unbounded', sans-serif;
    font-size: 20px;
    font-weight: 600;
    color: #ffffff;
    line-height: 1.3;
    margin: 0 0 16px 0;
}

.example-description {
    font-family: 'Gilroy', sans-serif;
    font-size: 15px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.5;
    margin: 0 0 20px 0;
}

.example-cta-button {
    background: linear-gradient(135deg, #145BDE 0%, #0F4BC7 50%, #1E6EFF 100%);
    color: #ffffff;
    border: none;
    padding: 16px 24px;
    font-size: 15px;
    font-weight: 600;
    font-family: 'Gilroy', sans-serif;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    width: 100%;
    margin-top: auto;
    position: relative;
    overflow: hidden;
    letter-spacing: 0.5px;
    box-shadow: 0 4px 15px rgba(20, 91, 222, 0.3);
    text-align: center;
}

.example-cta-button::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transition: left 0.5s;
}

.example-cta-button:hover {
    background: linear-gradient(135deg, #0F4BC7 0%, #145BDE 50%, #2A7EFF 100%);
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(20, 91, 222, 0.5);
    scale: 1.02;
}

.example-cta-button:hover::before {
    left: 100%;
}

.example-cta-button:active {
    background: linear-gradient(135deg, #0D3F9F 0%, #0F4BC7 50%, #1A6BF5 100%);
    transform: translateY(-1px);
    box-shadow: 0 4px 15px rgba(20, 91, 222, 0.4);
    scale: 0.98;
}

/* Адаптивность */
@media (max-width: 1311px) and (min-width: 1025px) {
    .subtitle {
        font-size: 20px;
    }
}

/* Медиа-запрос для всех разрешений от 1200px и выше - карточки ассистентов в два ряда */
@media (min-width: 1200px) {
    /* Верхний padding для текста первого блока - 60px */
    .hero-section .text-content,
    .text-content {
        padding-top: 60px !important;
    }
    
    /* Размер шрифта описания в плашках "Кому будет полезен?" - 16px */
    .second-section .problem-solution-card .solution-text,
    .problem-solution-card .solution-text,
    .solution-text {
        font-size: 16px !important;
    }
    
    /* Контейнер блока "Виды ассистентов" - выравнивание по направляющим 60px */
    .third-section .implementation-examples,
    .implementation-examples {
        padding-left: 60px !important;
        padding-right: 60px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }
    
    /* Принудительные стили для блока "Виды ассистентов" - максимальная специфичность */
    .third-section .implementation-examples .examples-grid,
    .implementation-examples .examples-grid,
    section .implementation-examples .examples-grid,
    .examples-grid {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        grid-template-rows: auto !important;
        gap: 30px !important;
        flex-direction: unset !important;
        flex-wrap: unset !important;
        justify-content: unset !important;
        align-items: unset !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
        max-width: none !important;
        box-sizing: border-box !important;
    }
    
    .third-section .implementation-examples .example-card,
    .implementation-examples .example-card,
    section .implementation-examples .example-card,
    .example-card {
        width: 100% !important;
        max-width: none !important;
        min-width: unset !important;
        margin: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        flex: unset !important;
        flex-basis: unset !important;
        box-sizing: border-box !important;
        padding: 24px !important;
    }
    
    /* Заголовок "Виды ассистентов" - выравнивание по направляющим */
    .third-section .implementation-examples .implementation-title,
    .implementation-examples .implementation-title,
    .implementation-title {
        padding-left: 60px !important;
        margin-left: 0 !important;
        text-align: left !important;
    }
    
    /* Размер шрифта описания в карточках ассистентов - 16px */
    .third-section .implementation-examples .example-card .example-description,
    .implementation-examples .example-card .example-description,
    .example-card .example-description,
    .example-description {
        font-size: 16px !important;
    }
    
    /* Блок "Ключевые возможности" - выравнивание по направляющим и размеры шрифтов */
    
    /* Заголовок "КЛЮЧЕВЫЕ ВОЗМОЖНОСТИ" - размер 56px и выравнивание с отступом 120px */
    .third-section .section-title,
    .third-section .capabilities-content .section-title,
    section.third-section .section-title {
        font-size: 56px !important;
        padding-left: 120px !important;
        margin-left: 0 !important;
        text-align: left !important;
    }
    
    /* Контейнер плашек "Ключевые возможности" - выравнивание по направляющим */
    .third-section .capabilities-list,
    .capabilities-list {
        padding-left: 60px !important;
        padding-right: 60px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }
    
    /* Плашки "Ключевые возможности" - принудительное выравнивание */
    .third-section .capability-item,
    .capability-item {
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 24px !important;
        padding-right: 24px !important;
        width: 100% !important;
        max-width: none !important;
        box-sizing: border-box !important;
    }
    
    /* Описание в плашках "Ключевые возможности" - размер шрифта 16px */
    .third-section .capability-item .capability-description,
    .capability-item .capability-description,
    .capability-description {
        font-size: 16px !important;
    }
}

/* Медиа-запрос для всех разрешений от 1025px и выше - размер шрифта описания в карточках ассистентов 16px */
@media (min-width: 1025px) {
    /* Размер шрифта описания в карточках ассистентов - 16px */
    .third-section .implementation-examples .example-card .example-description,
    .implementation-examples .example-card .example-description,
    .example-card .example-description,
    .example-description {
        font-size: 16px !important;
    }
    
    /* Размер шрифта описания в карточках "Ключевые возможности" - 16px */
    .third-section .capability-item .capability-description,
    .capability-item .capability-description,
    .capability-description {
        font-size: 16px !important;
    }
    
    /* Размер шрифта текста в блоке "Результаты внедрения" - 16px */
    .offer-section .benefit-item .benefit-text,
    .benefit-item .benefit-text,
    .benefit-text {
        font-size: 16px !important;
    }
    
    /* Размер шрифта текста в блоке "Наши эксперты" - 16px */
    .ready-section .ready-experts-list li,
    .ready-experts-list li {
        font-size: 16px !important;
    }
    
    /* Подзаголовок "АВТОМАТИЗАЦИЯ ОБЩЕНИЯ И ПРОЦЕССОВ С ИИ" - верхний padding 40px */
    .hero-section .subtitle,
    .content .subtitle,
    .text-content .subtitle {
        padding-top: 40px !important;
    }
}

/* Медиа-запрос для всех разрешений от 1280px и выше - убираем боковые padding'и у блока "Как работает AI-ассистент?" */
@media (min-width: 1280px) {
    /* Убираем боковые padding'и у контейнера блока "Как работает AI-ассистент?" */
    .how-it-works-section .container {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    /* Адаптируем timeline-container для размещения между направляющими */
    .how-it-works-section .timeline-container {
        padding-left: 60px !important;
        padding-right: 60px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }
    
    /* Адаптируем карточки шагов для правильного размещения */
    .how-it-works-section .timeline-content {
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 24px !important;
        padding-right: 24px !important;
        box-sizing: border-box !important;
        width: 100% !important;
        max-width: none !important;
    }
    
    /* Заголовок "Как работает AI-ассистент?" - левый padding 120px - ПРИНУДИТЕЛЬНО */
    .how-it-works-section .section-title,
    .how-it-works-section .section-header .section-title,
    section.how-it-works-section .section-title,
    section.how-it-works-section .section-header .section-title,
    #how-works .section-title,
    #how-works .section-header .section-title {
        padding-left: 120px !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        text-align: left !important;
        text-indent: 0 !important;
        transform: translateX(0) !important;
    }
    
    /* Убираем левый padding у section-header блока "Какие задачи решает?" */
    .tasks-section .section-header,
    section.tasks-section .section-header,
    #scenarios .section-header {
        padding-left: 0px !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        text-align: left !important;
        text-indent: 0 !important;
        transform: translateX(0) !important;
    }
    
    /* ПРИНУДИТЕЛЬНО убираем левый padding у заголовка "Какие задачи решает?" - МАКСИМАЛЬНАЯ СПЕЦИФИЧНОСТЬ */
    body .tasks-section .section-header .section-title,
    body section.tasks-section .section-header .section-title,
    body #scenarios .section-header .section-title,
    body .tasks-section .section-title,
    body section.tasks-section .section-title,
    body #scenarios .section-title,
    .tasks-section .section-header .section-title[class*="section-title"],
    section.tasks-section .section-header .section-title[class*="section-title"],
    #scenarios .section-header .section-title[class*="section-title"],
    .tasks-section .section-title[class*="section-title"],
    section.tasks-section .section-title[class*="section-title"],
    #scenarios .section-title[class*="section-title"] {
        padding-left: 0px !important;
        padding-right: 0px !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
        text-align: left !important;
        text-indent: 0px !important;
        transform: translateX(0px) !important;
                 box-sizing: border-box !important;
    }
    
    /* Заголовок "Виды ассистентов" - размер шрифта 56px */
    .implementation-title,
    .third-section .implementation-title,
    .third-section .implementation-examples .implementation-title,
    .capabilities-content .implementation-title,
    .implementation-examples .implementation-title {
        font-size: 56px !important;
        line-height: 1.2 !important;
    }
    
    /* Убираем padding'и у контейнера блока "Кому будет полезен?" */
    .second-section .container,
    section.second-section .container,
    #suitable .container {
        padding-left: 0px !important;
        padding-right: 0px !important;
        max-width: 100% !important;
    }
    
    /* Убираем padding'и у контейнера первого блока (hero-section) */
    .hero-section .container,
    section.hero-section .container {
        padding-left: 0px !important;
        padding-right: 0px !important;
        max-width: 100% !important;
    }
    
    /* Подзаголовок первого блока - верхний padding 40px и размер шрифта 24px */
    .hero-section .subtitle,
    .hero-section .text-content .subtitle,
    .text-content .subtitle,
    .content .subtitle {
        padding-top: 40px !important;
        font-size: 24px !important;
        line-height: 1.3 !important;
    }
}

/* Медиа-запрос от 1400px и выше */
@media (min-width: 1400px) {
    /* Убираем левые и правые margin'ы у контейнеров блоков */
    .tasks-section .container,
    section.tasks-section .container,
    #scenarios .container {
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    
    .ready-section .container,
    section.ready-section .container {
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    
    .offer-section .container,
    section.offer-section .container,
    #pricing .container,
    .offer-section .offer-content,
    section.offer-section .offer-content {
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    
    /* Дополнительная принудительная настройка для блока "Мы предлагаем" */
    body .offer-section .container,
    body section.offer-section .container,
    body #pricing .container {
        margin-left: 0px !important;
        margin-right: 0px !important;
        max-width: 100% !important;
    }
    
    /* Убираем margin'ы у контейнера блока "Как работает AI-ассистент?" */
    .how-it-works-section .container,
    section.how-it-works-section .container,
    #how-works .container,
    body .how-it-works-section .container,
    body section.how-it-works-section .container,
    body #how-works .container {
        margin-left: 0px !important;
        margin-right: 0px !important;
        max-width: 100% !important;
    }
    
    /* Убираем margin'ы у контейнера блока "Ключевые возможности" */
    .third-section .container,
    section.third-section .container,
    #capabilities .container,
    body .third-section .container,
    body section.third-section .container,
    body #capabilities .container {
        margin-left: 0px !important;
        margin-right: 0px !important;
        max-width: 100% !important;
    }
    
    /* Дополнительная принудительная настройка для блока "Готовы начать?" */
    body .ready-section .container,
    body section.ready-section .container,
    .ready-section .ready-section-content .container,
    section.ready-section .ready-section-content .container {
        margin-left: 0px !important;
        margin-right: 0px !important;
        max-width: 100% !important;
    }
    
    /* Убираем margin: 0 auto у ready-section-content */
    .ready-section-content,
    .ready-section .ready-section-content,
    section.ready-section .ready-section-content {
        margin-left: 0px !important;
        margin-right: 0px !important;
        margin: 0 !important;
    }
    
    /* Убираем margin: 0 auto у всех основных элементов */
    .container,
    .content,
    .bento-content,
    .capabilities-content,
    .offer-content,
    .timeline-container,
    .tasks-timeline,
    .pricing-card-wrapper,
    .pricing-card-single,
    .footer-content {
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
}

/* Медиа-запрос от 1440px и выше */
@media (min-width: 1440px) {
    /* Убираем левый padding у подзаголовка блока "Мы предлагаем" */
    .offer-section .section-subtitle,
    .offer-content .section-subtitle,
    section.offer-section .section-subtitle {
        padding-left: 0px !important;
        margin-left: 0px !important;
    }
    
    /* Направляющие линии по всему лендингу */
    body::before,
    body::after {
        content: '';
        position: fixed;
        top: 0;
        bottom: 0;
        width: 1px;
        background: rgba(20, 91, 222, 0.3);
        z-index: 9999;
        pointer-events: none;
    }
    
    /* Левая направляющая - по левому краю блока "Какие задачи решает?" */
    body::before {
        left: 120px;
    }
    
    /* Правая направляющая - по правому краю блока "Какие задачи решает?" */
    body::after {
        right: 120px;
    }
    
    /* Выравниваем все блоки по направляющим */
    
    /* Первый блок (Hero) */
    .hero-section .container,
    .hero-section .content {
        padding-left: 120px !important;
        padding-right: 120px !important;
        max-width: 100% !important;
    }
    
    /* Второй блок (Кому будет полезен?) */
    .second-section .container,
    .second-section .bento-content {
        padding-left: 120px !important;
        padding-right: 120px !important;
        max-width: 100% !important;
    }
    
    /* Третий блок (Ключевые возможности) */
    .third-section .container,
    .third-section .capabilities-content {
        padding-left: 120px !important;
        padding-right: 120px !important;
        max-width: 100% !important;
    }
    
    /* Четвертый блок (Как работает AI-ассистент?) */
    .how-it-works-section .container {
        padding-left: 120px !important;
        padding-right: 120px !important;
        max-width: 100% !important;
    }
    
    /* Пятый блок (Какие задачи решает?) */
    .tasks-section .container {
        padding-left: 120px !important;
        padding-right: 120px !important;
        max-width: 100% !important;
    }
    
    /* Шестой блок (Мы предлагаем) */
    .offer-section .offer-content {
        padding-left: 120px !important;
        padding-right: 120px !important;
        max-width: 100% !important;
    }
    
    /* Седьмой блок (Готовы начать?) */
    .ready-section .ready-section-content {
        padding-left: 120px !important;
        padding-right: 120px !important;
        max-width: 100% !important;
    }
    
    /* Футер */
    .footer-section .footer-content {
        padding-left: 120px !important;
        padding-right: 120px !important;
        max-width: 100% !important;
    }
    
    /* Убираем левые padding'и у текстов блока "Готовы начать?" */
    
    /* Заголовок "Готовы начать?" */
    .ready-section .section-title,
    .ready-header .section-title {
        padding-left: 0px !important;
        margin-left: 0px !important;
    }
    
    /* Описание под заголовком */
    .ready-description,
    .ready-left .ready-description {
        padding-left: 0px !important;
        margin-left: 0px !important;
    }
    
    /* Заголовок "Наши эксперты:" */
    .ready-experts-title,
    .ready-experts .ready-experts-title,
    .ready-left .ready-experts .ready-experts-title,
    .ready-section .ready-experts-title,
    .ready-section .ready-left .ready-experts-title,
    body .ready-section .ready-experts-title {
        padding-left: 0px !important;
        margin-left: 0px !important;
        text-indent: 0px !important;
        transform: translateX(0) !important;
    }
    
    /* Список экспертов */
    .ready-experts-list,
    .ready-experts .ready-experts-list {
        padding-left: 0px !important;
        margin-left: 0px !important;
    }
    
    /* Элементы списка экспертов */
    .ready-experts-list li {
        padding-left: 20px !important;
        margin-left: 0px !important;
        text-indent: 0px !important;
    }
    
    /* Псевдоэлементы буллитов */
    .ready-experts-list li::before {
        left: 0px !important;
        margin-left: 0px !important;
        transform: translateX(0) !important;
    }
    
    /* Контейнер "Наши эксперты" */
    .ready-experts,
    .ready-left .ready-experts,
    .ready-section .ready-experts,
    body .ready-section .ready-experts {
        padding-left: 0px !important;
        padding-right: 0px !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    
    /* Левая часть футера */
    .footer-left,
    .footer-content .footer-left,
    .footer-section .footer-left,
    body .footer-section .footer-left {
        padding-left: 0px !important;
        margin-left: 0px !important;
    }
    
    /* Timeline блока "Какие задачи решает?" */
    .tasks-timeline,
    .tasks-section .tasks-timeline,
    body .tasks-section .tasks-timeline {
        padding-left: 0px !important;
        padding-right: 0px !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    
    /* Timeline-container блока "Как работает AI-ассистент?" - убираем padding'и */
    .timeline-container,
    .how-it-works-section .timeline-container,
    body .how-it-works-section .timeline-container {
        padding-left: 0px !important;
        padding-right: 0px !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    
    /* Заголовок "Как работает AI-ассистент?" - левый padding 60px */
    .how-it-works-section .section-title,
    .how-it-works-section .section-header .section-title,
    section.how-it-works-section .section-title,
    section.how-it-works-section .section-header .section-title,
    #how-works .section-title,
    #how-works .section-header .section-title,
    body .how-it-works-section .section-title {
        padding-left: 60px !important;
        padding-right: 0px !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
        text-align: left !important;
        text-indent: 0px !important;
        transform: translateX(0) !important;
    }
    
    /* Плашки timeline-content на всю ширину контейнера */
    .timeline-content,
    .how-it-works-section .timeline-content,
    body .how-it-works-section .timeline-content {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
        box-sizing: border-box !important;
    }
    
    /* Контейнер с видами ассистентов - убираем padding'и */
    .implementation-examples,
    .third-section .implementation-examples,
    body .third-section .implementation-examples {
        padding-left: 0px !important;
        padding-right: 0px !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    
    /* Сетка с карточками видов ассистентов - убираем padding'и */
    .examples-grid,
    .implementation-examples .examples-grid,
    .third-section .examples-grid,
    body .third-section .examples-grid {
        padding-left: 0px !important;
        padding-right: 0px !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    
    /* Контейнер capabilities-list - убираем padding'и */
    .capabilities-list,
    .third-section .capabilities-list,
    body .third-section .capabilities-list {
        padding-left: 0px !important;
        padding-right: 0px !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    
    /* Заголовок "КЛЮЧЕВЫЕ ВОЗМОЖНОСТИ" - левый padding 60px */
    .third-section .section-title,
    .third-section .capabilities-content .section-title,
    section.third-section .section-title,
    body .third-section .section-title {
        padding-left: 60px !important;
        padding-right: 0px !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
        text-align: left !important;
        text-indent: 0px !important;
        transform: translateX(0) !important;
    }
    
    /* Заголовок "Какие задачи решает?" - размер шрифта 56px */
    .tasks-section .section-title,
    .tasks-section .section-header .section-title,
    section.tasks-section .section-title,
    section.tasks-section .section-header .section-title,
    #scenarios .section-title,
    #scenarios .section-header .section-title {
        font-size: 56px !important;
        line-height: 1.2 !important;
    }
}

/* Медиазапрос для разрешения 1640px и выше */
@media (min-width: 1640px) {
    /* Timeline-container компенсирует отступы родительского контейнера - ПРИНУДИТЕЛЬНО */
    .timeline-container,
    .how-it-works-section .timeline-container,
    body .how-it-works-section .timeline-container {
        max-width: none !important;
        width: calc(100% + 240px) !important;
        margin-left: -120px !important;
        margin-right: -120px !important;
        padding-left: 120px !important;
        padding-right: 120px !important;
    }
    
    /* Плашки timeline-content на всю ширину контейнера без ограничений - ПРИНУДИТЕЛЬНО */
    .timeline-content,
    .how-it-works-section .timeline-content,
    body .how-it-works-section .timeline-content,
    section.how-it-works-section .timeline-content,
    .how-it-works-section .timeline-step .timeline-content {
        width: 100% !important;
        max-width: none !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
        box-sizing: border-box !important;
        flex: 1 !important;
        min-width: 0 !important;
    }
}



/* Медиа-запрос для диапазона 1200-1440px */
@media (max-width: 1440px) and (min-width: 1200px) {
    /* Направляющие для всего лендинга */
    body::before {
        content: "";
        position: fixed;
        top: 0;
        left: 60px;
        width: 2px;
        height: 100vh;
        background: rgba(255, 0, 255, 0.8);
        z-index: 9999;
        pointer-events: none;
    }
    
    body::after {
        content: "";
        position: fixed;
        top: 0;
        right: 60px;
        width: 2px;
        height: 100vh;
        background: rgba(255, 0, 255, 0.8);
        z-index: 9999;
        pointer-events: none;
    }
    
    /* Направляющие для блока "Кому будет полезен?" */
    .second-section::before {
        display: none !important;
    }
    
    .second-section::after {
        display: none !important;
    }
    
    .second-section {
        position: relative;
    }
    
    /* ПРИНУДИТЕЛЬНО убираем левый padding - ИСТОЧНИК ОТСТУПА: .footer-left имеет padding-left: 60px */
    .footer-left {
        padding-left: 0 !important;
    }
    
    /* Дополнительная страховка для названия компании */
    .footer-section .footer-content .footer-left .footer-company .footer-company-name,
    .footer-section .footer-content .footer-left .footer-company-name,
    .footer-section .footer-left .footer-company .footer-company-name,
    .footer-section .footer-left .footer-company-name,
    .footer-content .footer-left .footer-company .footer-company-name,
    .footer-content .footer-left .footer-company-name,
    .footer-left .footer-company .footer-company-name,
    .footer-left .footer-company-name,
    h3.footer-company-name,
    .footer-company-name {
        padding-left: 0 !important;
        margin-left: 0 !important;
        text-indent: 0 !important;
        transform: translateX(0) !important;
    }
    
    /* Выравнивание блока "Ключевые возможности" по розовым направляющим */
    .third-section .container {
        max-width: 100% !important;
        padding: 0 60px !important;
    }
    
    .capabilities-content {
        padding: 0 !important;
    }
    
    /* Выравнивание "Виды ассистентов" по розовым направляющим */
    .implementation-examples {
        padding: 0 !important;
        margin: 60px 0 0 0 !important;
    }
    
    /* Карточки ассистентов в один ряд - две рядом */
    .examples-grid {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 30px !important;
        padding: 0 !important;
        margin: 0 !important;
    }
    
    .example-card {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
    }
    
    /* Убираем левый padding у всех текстовых элементов блока "Готовы начать?" */
    .ready-section .section-title {
        padding-left: 0 !important;
    }
    
    .ready-description {
        padding-left: 0 !important;
    }
    
    .ready-subtitle {
        padding-left: 0 !important;
    }
    
    .ready-experts {
        padding-left: 0 !important;
    }
    
    /* Убираем левый padding у подзаголовка блока "Мы предлагаем" */
    .offer-section .section-subtitle {
        padding-left: 0 !important;
    }
    
    /* Убираем левый margin у плашки "ПРЕДЛОЖЕНИЕ" */
    .pricing-card-wrapper {
        margin-left: 0 !important;
    }
    
    /* ПРИНУДИТЕЛЬНО устанавливаем стили для заголовка "Какие задачи решает?" ТОЛЬКО в диапазоне 1200-1440px */
    .tasks-section .section-title,
    .tasks-section .section-header .section-title,
    section.tasks-section .section-title,
    section.tasks-section .section-header .section-title,
    #scenarios .section-title,
    #scenarios .section-header .section-title {
        padding-left: 60px !important;
        padding-right: 0 !important;
        text-align: left !important;
        margin-left: 0 !important;
        font-size: 56px !important;
    }
    
    .tasks-timeline {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    .task-right {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    .task-left {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    .task-item {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    /* Показываем перенос строки для "ОНБОРДИНГ СОТРУДНИКОВ" только в диапазоне 1200-1440px */
    .task-title-br {
        display: inline !important;
    }
}

/* Диапазон 1200-1279px - контентная область 100% с внешними отступами 60px для первого и второго блока */
@media (max-width: 1279px) and (min-width: 1200px) {
    /* Первый блок - Hero секция */
    .hero-section .container {
        max-width: 100% !important;
        padding: 0 60px !important;
    }

    /* Убираем все padding 30px у первого блока */
    .hero-section .content {
        padding: 0 !important;
    }

    .text-content {
        padding: 0 !important;
    }

    /* Второй блок - Кому будет полезен */
    .second-section .container {
        max-width: 100% !important;
        padding: 0 60px !important;
    }

    .business-problems {
        padding: 0 !important;
    }

    /* Убираем все padding 30px у второго блока и связанных элементов */
    .bento-content {
        padding: 0 !important;
    }

    .section-header {
        padding: 0 !important;
    }

    /* Блок "Как работает AI-ассистент" - выравнивание по направляющим */
    .how-it-works-section .container {
        max-width: 100% !important;
        padding: 0 60px !important;
    }

    .timeline-container {
        padding: 0 !important;
    }

    .how-it-works-section .section-header {
        padding: 0 !important;
    }

    /* БЛОК 4: "Как работает AI-ассистент?" - специальный отступ для диапазона 1200-1279px */
    .how-it-works-section .section-title {
        padding-left: 60px !important;
        text-align: left;
        margin-left: 0 !important;
    }

    /* БЛОК 5: "Какие задачи решает?" - специальный отступ для диапазона 1200-1279px */
    .tasks-section .section-title {
        padding-left: 90px !important;
        text-align: left;
        margin-left: 0 !important;
    }
}

@media (max-width: 1199px) and (min-width: 1025px) {
    /* ИНДИВИДУАЛЬНОЕ ВЫРАВНИВАНИЕ ЗАГОЛОВКОВ ПО СОДЕРЖИМОМУ КАЖДОГО БЛОКА - ДИАПАЗОН 1025-1199px */
    
    /* БЛОК 2: "Кому будет полезен?" */
    /* business-problems имеет padding: 0 15px в медиа-запросе 1200px */
    /* Карточки начинаются с левого края business-problems (без дополнительных отступов) */
    /* Заголовок настроен с кастомным отступом */
    .second-section .section-title {
        text-align: left;
        margin-left: 0 !important; /* Убираем отрицательный margin */
        padding-left: 65px; /* Кастомный отступ для выравнивания */
    }
    
    /* БЛОК 3: "КЛЮЧЕВЫЕ ВОЗМОЖНОСТИ" */
    /* ПРИНУДИТЕЛЬНО устанавливаем padding 75px для заголовка в диапазоне 1025-1200px */
    .third-section .section-title,
    .third-section .capabilities-content .section-title,
    section.third-section .section-title,
    body .third-section .section-title,
    body .third-section .capabilities-content .section-title,
    body section.third-section .section-title {
        padding-left: 75px !important;
    }
    
    /* "Виды ассистентов" - ПРИНУДИТЕЛЬНО устанавливаем padding 75px */
    .implementation-title,
    .third-section .implementation-title,
    .third-section .implementation-examples .implementation-title,
    .capabilities-content .implementation-title,
    .implementation-examples .implementation-title,
    body .implementation-title,
    body .third-section .implementation-title,
    body .third-section .implementation-examples .implementation-title {
        text-align: left !important;
        margin-left: 0 !important;
        padding-left: 75px !important; /* ПРИНУДИТЕЛЬНО устанавливаем padding 75px */
    }
    
    /* БЛОК 4: "Как работает AI-ассистент?" */
    /* timeline-container в медиа-запросе 1024px имеет padding: 0 16px */
    /* Но в медиа-запросе 1200px timeline-container имеет padding: 0 16px */
    .how-it-works-section .section-title {
        text-align: left;
        margin-left: 0 !important;
        padding-left: 90px;
    }
    
    /* ПРИНУДИТЕЛЬНО устанавливаем padding 90px для заголовка "Как работает" в диапазоне 1025-1199px */
    .how-it-works-section .section-title,
    body .how-it-works-section .section-title,
    section.how-it-works-section .section-title,
    body section.how-it-works-section .section-title {
        padding-left: 90px !important;
    }
    
    /* БЛОК 5: "Какие задачи решает?" */
    /* tasks-timeline в медиа-запросе 1024px имеет padding: 0 20px */
    /* Для диапазона 1025-1199px устанавливаем отступ 70px */
    .tasks-section .section-title {
        text-align: left;
        margin-left: 0 !important;
        padding-left: 70px; /* Отступ 70px для диапазона 1025-1199px */
    }
    
    /* БЛОК 6: "Мы предлагаем" */
    /* offer-section .section-title теперь наследует стандартные отступы */
    /* offer-content имеет стандартный padding контейнера */
    .offer-section .section-title {
        text-align: left;
        margin-left: 0 !important;
        padding-left: 60px; /* Выравниваем как другие заголовки */
    }
    
    .offer-section .section-subtitle {
        text-align: left;
        margin-left: 0 !important;
        padding-left: 60px; /* Сохраняем отступ для подзаголовка */
    }
    
    /* БЛОК 7: "Готовы начать?" */
    /* ready-section-content имеет стандартный padding контейнера */
    .ready-section .section-title {
        text-align: left;
        margin-left: 0 !important;
        padding-left: 0; /* По краю ready-section-content */
    }

    /* Стили для offer-section */
    .offer-video-background {
        width: 60%;
        max-width: 600px;
        height: 50%;
    }
    
    .pricing-card-wrapper {
        margin-left: 0;
    }
    
    .offer-section .section-title,
    .ready-section .section-title {
        font-size: 48px;
    }
    
    .offer-content {
        padding: 0 60px 0 0 !important;
    }
    
    .ready-section-content {
        padding: 0;
    }
    
    /* Дополнительные стили для ready-section в диапазоне 1025-1279px */
    .ready-content {
        grid-template-columns: 1fr 380px;
        gap: 50px;
    }
    
    .ready-left {
        padding-right: 20px;
    }
    
    .ready-section .section-title {
        white-space: normal;
        padding-left: 0;
    }
    
    .ready-description {
        font-size: 16px;
        padding-left: 0;
    }
    
    .ready-subtitle {
        padding-left: 0;
    }
    
    .ready-experts {
        padding-left: 0;
    }
    
    .ready-right {
        margin-top: 0;
        justify-content: flex-start;
        align-self: start;
    }
    
    .ready-form-container {
        max-width: 380px;
        padding: 24px;
    }
    
    .ready-form-input {
        padding: 14px 18px;
        font-size: 16px;
    }
    
    .ready-form-submit {
        padding: 16px 24px;
        font-size: 16px;
    }
    
    .ready-form-tag {
        font-size: 10px;
        padding: 5px 12px;
        margin-bottom: 16px;
    }
    
    .ready-privacy-text {
        font-size: 12px;
        line-height: 1.4;
    }
    
    .ready-form {
        gap: 16px;
    }

    
    .pricing-card-single {
        padding: 36px;
        max-width: 420px;
    }
    
    .offer-section .section-subtitle {
        max-width: 100%;
    }
    
    .price-amount {
        font-size: 38px;
    }
    
    .ready-form-container {
        padding: 24px;
        max-width: 320px;
    }
    
    .ready-right {
        margin-top: -80px;
    }

    .main-title {
        font-size: 90px;
    }
    
    .subtitle {
        font-size: 24px;
    }
    
    .line-separator {
        width: 300px;
    }
    
    .cta-button {
        font-size: 16px;
        padding: 16px 32px;
    }

    .section-title {
        font-size: 52px;
    }

    .business-problems {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto auto auto;
        gap: 20px;
        padding: 0 0px;
        margin-top: 40px;
        min-height: auto;
        align-items: stretch;
    }
    
    /* На планшетах сохраняем шахматную структуру */
    .problem-solution-card {
        padding: 28px 24px;
    }
    
    .problem-solution-card:nth-child(1) {
        grid-column: 1 / 2;
        grid-row: 1 / 2;
    }
    
    .problem-solution-card:nth-child(2) {
        grid-column: 2 / 4;
        grid-row: 1 / 2;
    }
    
    .problem-solution-card:nth-child(3) {
        grid-column: 1 / 3;
        grid-row: 2 / 3;
    }
    
    .problem-solution-card:nth-child(4) {
        grid-column: 3 / 4;
        grid-row: 2 / 3;
    }

    .problem-solution-card {
        padding: 40px 32px;
        border-radius: 24px;
    }

    .card-number-circle {
        width: 48px;
        height: 48px;
        font-size: 19px;
        margin-bottom: 28px;
    }

    .problem-solution-card .problem-title {
        font-size: 19px;
        margin-bottom: 22px;
    }

    .solution-arrow {
        font-size: 26px;
        margin: 18px 0;
    }

    .solution-block {
        padding: 24px 20px;
        border-radius: 18px;
    }

    .solution-intro {
        font-size: 12px;
    }

    .solution-text {
        font-size: 16px;
    }

    /* Блок "Ключевые возможности" - настройки аналогично диапазону 769-1024px, но с отступами 60px */
    .third-section {
        padding: 0 !important;
    }
    
    .capabilities-content {
        padding: 0 60px !important;
        max-width: none !important;
    }

    .capabilities-list {
        margin: 0 !important;
        padding: 0 60px !important;
        gap: 42px;
        margin-top: 70px;
    }

    .capability-item {
        margin: 0 0 24px 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 24px !important;
        box-sizing: border-box !important;
        background: rgba(255, 255, 255, 0.05) !important;
        border-radius: 16px !important;
        border: 1px solid rgba(255, 255, 255, 0.1) !important;
        outline: none !important;
        gap: 28px;
    }

    /* Убираем все возможные розовые линии и outline для плашек */
    .capability-item *,
    .capability-item::before,
    .capability-item::after {
        outline: none !important;
        border: none !important;
        box-shadow: none !important;
    }

    /* Дополнительное переопределение для устранения розовых пунктирных линий */
    .third-section .capability-item {
        outline: none !important;
        border: 1px solid rgba(255, 255, 255, 0.1) !important;
    }

    .capability-number {
        font-size: 104px;
        min-width: 130px;
    }

    .capability-title {
        font-size: 26px;
    }

    .capability-description {
        font-size: 17px;
    }

    .section-subtitle {
        font-size: 18px;
    }

    .types-title {
        font-size: 28px;
        margin-bottom: 40px;
    }

    .types-grid {
        gap: 24px;
    }

    .solution-pair {
        gap: 20px;
        min-height: 200px;
    }

    .problem-card, .solution-card {
        padding: 28px 24px;
    }

    .pair-number {
        top: -16px;
        font-size: 28px;
        width: 56px;
        height: 56px;
    }

    .problem-title {
        font-size: 16px;
        margin-bottom: 8px;
    }

    .problem-description {
        font-size: 13px;
    }

    .solution-badge, .problem-badge {
        font-size: 9px;
        padding: 3px 6px;
        margin-bottom: 8px;
    }

    .solution-title {
        font-size: 18px;
        margin-bottom: 8px;
    }

    .solution-description {
        font-size: 16px;
    }

    .arrow-connector svg {
        width: 32px;
        height: 16px;
    }

    /* Блок виды ассистентов - карточки в одну строку с отступами 60px */
    .implementation-examples {
        margin: 0 !important;
        padding: 0 !important;
    }

    .third-section .examples-grid {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        gap: 16px !important;
        justify-content: flex-start !important;
        margin-left: 20px !important;
        margin-right: 20px !important;
        padding: 0 !important;
        grid-template-columns: none !important;
        width: calc(100% - 40px) !important;
        box-sizing: border-box !important;
    }

    .third-section .example-card {
        flex: 1 1 calc(50% - 8px) !important;
        max-width: calc(50% - 8px) !important;
        min-width: calc(50% - 8px) !important;
        width: calc(50% - 8px) !important;
        margin: 0 !important;
        padding: 20px !important;
        box-sizing: border-box !important;
    }

    .third-section .example-card:first-child {
        margin-left: 0 !important;
    }

    .third-section .example-card:last-child {
        margin-right: 0 !important;
    }

    /* Размеры заголовков в диапазоне 1025-1279px - максимальная специфичность */
    .third-section .section-title,
    .third-section .capabilities-content .section-title {
        font-size: 40px !important;
    }

    .implementation-title,
    .third-section .implementation-title,
    .third-section .implementation-examples .implementation-title {
        font-size: 40px !important;
    }

    .card-image {
        height: 160px !important;
    }

    .example-title {
        font-size: 18px !important;
    }

    .example-description {
        font-size: 16px !important;
    }

    .example-cta-button {
        padding: 12px 20px !important;
        font-size: 16px !important;
    }

    /* Красные направляющие линии для диапазона 1025-1279px */
    body::before {
        content: '';
        position: fixed;
        top: 0;
        left: 60px;
        width: 2px;
        height: 100vh;
        background: #ff0000;
        z-index: 9999;
        pointer-events: none;
    }

    body::after {
        content: '';
        position: fixed;
        top: 0;
        right: 60px;
        width: 2px;
        height: 100vh;
        background: #ff0000;
        z-index: 9999;
        pointer-events: none;
    }
}

@media (max-width: 768px) and (min-width: 641px) {
  /* Направляющие линии для диапазона 641-768px */
  body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 20px;
    width: 2px;
    height: 100vh;
    background: red;
    z-index: 9999;
    pointer-events: none;
  }
  
  body::after {
    content: '' !important;
    position: fixed !important;
    top: 0 !important;
    right: 16px !important;
    width: 2px !important;
    height: 100% !important;
    background: red !important;
    z-index: 9999 !important;
    pointer-events: none !important;
  }
  
  /* Выравнивание футера по направляющим */
  .footer-content {
    padding-left: 20px !important;
    padding-right: 20px !important;
    max-width: none !important;
  }
  
  .footer-left,
  .footer-right {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  
  /* Размер текста и выравнивание */
  .footer-company-name,
  .footer-details p,
  .footer-phone,
  .footer-link {
    font-size: 16px !important;
  }
  
  .footer-right {
    text-align: right !important;
  }
  
  .footer-contact {
    align-items: flex-end !important;
  }
  
  .footer-links {
    justify-content: flex-end !important;
    text-align: right !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
  }
  
  /* Заголовок "Готовы начать?" */
  .ready-section .section-title {
    padding-left: 0 !important;
    margin-left: 0 !important;
    margin-bottom: 20px !important;
    font-size: 32px !important;
    text-align: left !important;
  }
  
  /* Блок "Мы предлагаем" - выравнивание по направляющим */
  .offer-content {
    padding-left: 20px !important;
    padding-right: 20px !important;
    max-width: none !important;
  }
  
  .offer-section .section-title {
    padding-left: 20px !important;
    margin-left: 0 !important;
    font-size: 32px !important;
    text-align: left !important;
  }
  
  .offer-section .section-subtitle {
    padding-left: 20px !important;
    margin-left: 0 !important;
    text-align: left !important;
  }
  
  /* Заголовок "Какие задачи решает?" */
  .tasks-section .section-title {
    padding-left: 30px !important;
    margin-left: 0 !important;
    font-size: 32px !important;
    text-align: left !important;
  }
  
  /* Заголовок "Как работает AI-ассистент" в две строки */
  .how-it-works-section .section-title {
    padding-left: 60px !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    font-size: 30px !important;
    text-align: left !important;
    white-space: normal !important;
    line-height: 1.2 !important;
  }
  
  .how-it-works-section .section-title::after {
    content: "" !important;
  }
  
  /* Блок "Как работает AI-ассистент" - выравнивание по направляющим */
  .how-it-works-section {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  
  .how-it-works-section .container {
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: none !important;
  }
  
  .timeline-container {
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: none !important;
  }
  
  .timeline-content {
    margin-left: 20px !important;
    margin-right: 20px !important;
    padding: 24px 20px !important;
    width: calc(100vw - 40px) !important;
    max-width: calc(100vw - 40px) !important;
    box-sizing: border-box !important;
  }
  
  /* Текст примечания под плашками */
  .timeline-note {
    padding-left: 20px !important;
    margin-left: 0 !important;
  }
  
  /* Увеличиваем размер шрифта в описании timeline карточек */
  .timeline-description {
    font-size: 16px !important;
  }
  
  /* Увеличиваем размер шрифта в описании task карточек */
  .task-description {
    font-size: 16px !important;
  }
  
  /* Увеличиваем размер шрифта для пунктов списка в блоке "Готовы начать?" */
  .ready-experts-list li {
    font-size: 16px !important;
  }
  
  /* Блок "Ключевые возможности" - убираем все padding'и */
  .third-section {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  
  .third-section .container {
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: none !important;
  }
  
  .capabilities-content {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  
  /* Заголовок третьего блока по направляющей */
  .third-section .section-title {
    font-size: 32px !important;
    font-weight: 600 !important;
    color: white !important;
    text-align: left !important;
    padding-left: 20px !important;
    margin-bottom: 60px !important;
    line-height: 1.2 !important;
  }
  
  /* Карточки возможностей по направляющим */
  .capabilities-list {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  
  .capability-item {
    margin-left: 20px !important;
    margin-right: 20px !important;
    padding: 24px 20px !important;
    width: calc(100vw - 40px) !important;
    max-width: calc(100vw - 40px) !important;
    box-sizing: border-box !important;
  }
  
  .capability-description {
    font-size: 16px !important;
  }
  
  /* Дополнительная специфичность для блока "Ключевые возможности" */
  .third-section .capability-description {
    font-size: 16px !important;
  }
  
  /* Максимальная специфичность для переопределения базового стиля */
  .third-section .capability-item .capability-description {
    font-size: 16px !important;
  }
  
  /* Максимальная специфичность для заголовков блоков */
  .third-section .capabilities-content .section-title {
    font-size: 32px !important;
    padding-left: 40px !important;
  }
  
  .third-section .implementation-examples .implementation-title {
    font-size: 32px !important;
    padding-left: 40px !important;
  }
  
  /* Блок "Виды ассистентов" по направляющим */
  .implementation-examples {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 60px !important;
  }
  
  .implementation-title {
    font-size: 32px !important;
    padding-left: 20px !important;
    margin-bottom: 0 !important;
  }
  
  .examples-grid {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
  
  .example-card {
    margin-left: 20px !important;
    margin-right: 20px !important;
    width: calc(100vw - 40px) !important;
    max-width: calc(100vw - 40px) !important;
    box-sizing: border-box !important;
    padding: 24px !important;
  }
  
  /* Исключение для диапазона 375-640px - не применяем стили выше */
  @media (max-width: 640px) {
    .example-card {
      margin-left: 0 !important;
      margin-right: 0 !important;
      width: 100% !important;
      max-width: 100% !important;
    }
  }
  
  .example-description {
    font-size: 16px !important;
  }
  
  /* Дополнительное переопределение для блока "Виды ассистентов" в диапазоне 641-768px */
  .third-section .implementation-examples .example-description {
    font-size: 16px !important;
  }
  
  .third-section .examples-grid .example-card .example-description {
    font-size: 16px !important;
  }
  
  .implementation-examples .example-card .example-description {
    font-size: 16px !important;
  }
  
  /* Карточка предложения */
  .pricing-card-wrapper {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  
  .pricing-card-single {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  
  /* Скрытие видео в блоке "Мы предлагаем" */
  .offer-video-background {
    display: none !important;
  }
  
  /* Хедер от направляющей до направляющей - убираем конфликт с header.css */
  
  /* Блок "Кому будет полезен?" по направляющим */
  .second-section {
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 0 !important;
  }
  
  .second-section .container {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  
  .bento-content {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  
  .second-section .section-title {
    font-size: 32px !important;
    padding-left: 40px !important;
    margin-bottom: 40px !important;
    margin-left: 0 !important;
  }
  
  .business-problems {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
  }
  
  .problem-solution-card {
    margin-left: 20px !important;
    margin-right: 20px !important;
    width: calc(100vw - 40px) !important;
    max-width: calc(100vw - 40px) !important;
    box-sizing: border-box !important;
    padding: 24px !important;
  }
  
  .problem-solution-card .problem-title {
    font-size: 16px !important;
  }
  
  .solution-text {
    font-size: 16px !important;
  }
  
  /* Первый блок (hero-section) по направляющим */
  .hero-section {
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-bottom: 0 !important;
    min-height: 82vh !important;
    padding-top: 70px !important;
  }
  
  .hero-section .container {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  
  .content {
    padding-left: 20px !important;
    padding-right: 20px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    text-align: left !important;
  }
  
  .text-content {
    padding-left: 0 !important;
    margin-left: 0 !important;
  }
  
  .main-title {
    font-size: 48px !important;
    text-align: left !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
  }
  
  .subtitle {
    font-size: 16px !important;
    text-align: left !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
  }
  
  .line-separator {
    margin-left: 0 !important;
  }
  
  .cta-button {
    margin-left: 0 !important;
  }
  
  .cta-subtitle {
    text-align: left !important;
    margin-left: 0 !important;
  }
  
  /* Исключения для мобильной версии в диапазоне 641-768px */
  @media (min-width: 641px) {
    .content {
      padding-left: 20px !important;
      padding-right: 20px !important;
      text-align: left !important;
      flex-direction: row !important;
      gap: 60px !important;
    }
    
    .main-title {
      font-size: 48px !important;
      text-align: left !important;
      white-space: nowrap !important;
      margin-bottom: 16px !important;
    }
    
    .subtitle {
      font-size: 16px !important;
      text-align: left !important;
      margin-bottom: 24px !important;
    }
    
    .line-separator {
      width: 200px !important;
      margin: 16px 0 24px 0 !important;
    }
    
    .cta-button {
      font-size: 16px !important;
      padding: 16px 32px !important;
      margin-bottom: 16px !important;
    }
    
    .cta-subtitle {
      font-size: 16px !important;
      margin-top: 8px !important;
      text-align: left !important;
    }
  }
}

@media (max-width: 768px) and (min-width: 641px) {
    .hero-section {
        padding: 80px 0 60px;
    }
    
    .content {
        flex-direction: column;
        text-align: center;
        gap: 48px;
        padding: 0 var(--container-padding-tablet);
    }
    
    .main-title {
        font-size: 52px;
        white-space: normal;
        margin-bottom: 24px;
    }
    
    .subtitle {
        font-size: 22px;
        line-height: 1.3;
        margin-bottom: 32px;
    }
    
    .line-separator {
        width: 240px;
        height: 3px;
        margin: 0 auto 32px;
    }
    
    .cta-button {
        font-size: 16px;
        padding: 16px 32px;
        margin-bottom: 24px;
        border-radius: 12px;
    }
    
    .cta-subtitle {
        font-size: 14px;
        margin-top: 16px;
    }

    .second-section {
        padding: 80px 0;
    }

    .container {
        padding: 0 var(--container-padding-tablet);
    }
    
    .bento-content {
        padding: 0 var(--container-padding-tablet);
    }
    
    .capabilities-content {
        padding: 0 var(--container-padding-tablet);
    }
    
    .timeline-container {
        padding: 0 var(--container-padding-tablet);
    }
    
    .tasks-timeline {
        padding: 0 var(--container-padding-tablet);
    }
    
    .section-title {
        font-size: 40px;
        line-height: 1.2;
        margin-bottom: 8px;
    }

    .section-header {
        margin-bottom: 56px;
        text-align: left;
    }

    .third-section {
        padding: 100px 0;
    }
    
    .capabilities-list {
        gap: 40px;
        margin-top: 56px;
    }

    .capability-item {
        flex-direction: column;
        gap: 24px;
        text-align: left;
        padding: 32px 24px;
        border-radius: 24px;
    }

    .capability-number {
        font-size: 96px;
        min-width: auto;
        line-height: 0.9;
        margin-bottom: 8px;
        text-align: left;
    }

    .capability-title {
        font-size: 24px;
        margin-bottom: 12px;
    }

    .capability-description {
        font-size: 17px;
        line-height: 1.5;
    }

    .section-subtitle {
        font-size: 16px;
    }

    .implementation-examples {
        margin-top: 80px;
    }
    
    /* Исключение для диапазона 641-768px */
    @media (min-width: 641px) {
        .implementation-examples {
            margin-top: 60px !important;
        }
    }

    .examples-grid {
        grid-template-columns: 1fr;
        gap: 20px;
        width: 100%;
    }

    .example-card {
        padding: 24px;
        border-radius: 18px;
    }
    
    .card-image {
        height: 160px;
        border-radius: 14px;
        margin-bottom: 20px;
    }
    
    .card-header {
        margin-bottom: 16px;
    }
    
    .card-badge {
        font-size: 11px;
        padding: 6px 12px;
    }
    
    .example-title {
        font-size: 18px;
        margin-bottom: 12px;
    }
    
    .example-description {
        font-size: 16px;
        line-height: 1.5;
    }
    
    .business-problems {
        grid-template-columns: 1fr;
        gap: 24px;
        margin-top: 40px;
    }

    .problem-solution-card {
        padding: 32px 28px;
        border-radius: 24px;
    }

    .card-number-circle {
        width: 44px;
        height: 44px;
        font-size: 18px;
        margin-bottom: 24px;
    }

    .problem-solution-card .problem-title {
        font-size: 18px;
        margin-bottom: 16px;
    }

    .solution-text {
        font-size: 14px;
    }

    .problem-title {
        font-size: 15px;
        margin-bottom: 6px;
    }

    .problem-description {
        font-size: 12px;
    }

    .solution-badge, .problem-badge {
        font-size: 8px;
        padding: 2px 4px;
        margin-bottom: 6px;
    }

    .solution-title {
        font-size: 16px;
        margin-bottom: 6px;
    }

    .solution-description {
        font-size: 13px;
    }
    
    .cta-section {
        margin-top: 40px;
        padding: 0 var(--container-padding-tablet);
    }
    
    .cta-button-secondary {
        padding: 16px 28px;
        font-size: 16px;
        min-width: 180px;
    }
}

/* iPhone 375px адаптивность с направляющими */
@media (max-width: 1199px) and (min-width: 1025px) {
    /* === ЕДИНАЯ СИСТЕМА РАСШИРЕННЫХ ОТСТУПОВ 30PX === */
    .container {
        padding: 0 var(--container-padding-expanded);
        max-width: 1200px;
        margin: 0 auto;
    }

    .third-section .container {
        padding: 0 var(--container-padding-expanded);
        max-width: calc(100% - 90px) !important;
        margin: 0 auto;
    }

    .hero-section {
        min-height: 100vh;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 20px 0 0 0;
        margin-top: -150px;
        position: relative;
    }

    .content {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 80px;
        padding: 0 var(--container-padding-expanded);
        text-align: left;
        flex-direction: row;
        width: 100%;
        max-width: 1200px;
        margin: 0 auto;
    }

    /* Заголовки для планшетов */
    .main-title {
        font-size: 64px;
        line-height: 1.0;
        text-align: left;
        margin-bottom: 15px;
        white-space: nowrap;
        font-weight: 500;
        font-family: 'Unbounded', sans-serif;
        color: #191925;
        max-width: 100%;
    }

    .subtitle {
        font-size: 22px;
        line-height: 1.3;
        text-align: left;
        margin-bottom: 40px;
        letter-spacing: 1px;
        font-weight: 400;
        font-family: 'Unbounded', sans-serif;
        color: #191925;
        text-transform: uppercase;
        max-width: 100%;
    }

    .line-separator {
        width: 280px;
        height: 3px;
        margin: 15px 0 25px 0;
        background: #145BDE;
        border-radius: 1px;
    }

    .cta-button {
        padding: 18px 36px;
        font-size: 16px;
        margin: 0 0 24px 0;
        border-radius: 12px;
        background: #145BDE;
        color: #ffffff;
        border: none;
        font-weight: 600;
        font-family: 'Gilroy', sans-serif;
        cursor: pointer;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        letter-spacing: 0.5px;
        box-shadow: 0 2px 8px rgba(20, 91, 222, 0.2);
        display: inline-block;
        min-width: 200px;
        text-align: center;
    }

    .cta-button:hover {
        background: #0F4BC7;
        transform: translateY(-2px);
        box-shadow: 0 6px 20px rgba(20, 91, 222, 0.4);
    }

    .cta-button:active {
        background: #0D42B3;
        transform: translateY(0px);
        box-shadow: 0 2px 8px rgba(20, 91, 222, 0.5);
    }

    .cta-subtitle {
        font-size: 16px;
        text-align: left;
        margin: 0;
        font-family: 'Gilroy', sans-serif;
        font-weight: 400;
        color: #6B7280;
        display: flex;
        align-items: center;
        gap: 8px;
        cursor: pointer;
        transition: color 0.3s ease;
        max-width: 100%;
    }

    .cta-subtitle:hover {
        color: #4B5563;
    }

    .cta-subtitle svg {
        width: 12px;
        height: 12px;
        transition: transform 0.3s ease;
    }

    .cta-subtitle:hover svg {
        transform: translate(1px, -1px);
    }

    /* Вторая секция */
    .second-section {
        padding: 0 0 80px 0;
    }

    .bento-content,
    .capabilities-content,
    .timeline-container,
    .tasks-timeline,
    .offer-content,
    .ready-section-content {
        padding: 0 var(--container-padding-expanded);
    }

    .section-title {
        font-size: 40px;
        line-height: 1.1;
        text-align: left;
        margin-bottom: 24px;
    }

    .section-header {
        margin-bottom: 32px;
        text-align: left;
    }

    .section-subtitle {
        text-align: left;
        font-size: 16px;
        margin-bottom: 24px;
    }

    /* Карточки проблем */
    .business-problems {
        grid-template-columns: 1fr 1.3fr;
        grid-template-rows: auto auto;
        gap: 16px;
        margin-top: 24px;
        padding: 0;
    }

    .problem-solution-card {
        padding: 20px 16px;
        border-radius: 16px;
        text-align: left;
    }

    /* Серая карточка - меньше */
    .problem-solution-card:nth-child(1) {
        grid-column: 1 / 2;
        grid-row: 1 / 2;
    }

    /* Синяя карточка - больше */
    .problem-solution-card:nth-child(2) {
        grid-column: 2 / 3;
        grid-row: 1 / 2;
    }

    /* Третья карточка - меньше */
    .problem-solution-card:nth-child(3) {
        grid-column: 1 / 2;
        grid-row: 2 / 3;
    }

    /* Четвертая карточка - больше */
    .problem-solution-card:nth-child(4) {
        grid-column: 2 / 3;
        grid-row: 2 / 3;
    }

    .card-number-circle {
        width: 36px;
        height: 36px;
        font-size: 16px;
        margin-bottom: 16px;
    }

    .problem-solution-card .problem-title {
        font-size: 16px;
        margin-bottom: 12px;
        text-align: left;
    }

    .solution-text {
        font-size: 16px;
        text-align: left;
    }

    /* Третья секция */
    .third-section {
        padding: 60px 0;
    }



    .capabilities-list {
        gap: 24px;
        margin-top: 32px;
    }

    .capability-item {
        padding: 24px 16px;
        gap: 16px;
        border-radius: 16px;
        text-align: left;
    }

    .capability-number {
        font-size: 64px;
        line-height: 0.8;
        margin-bottom: 8px;
        text-align: left;
    }

    .capability-title {
        font-size: 20px;
        margin-bottom: 8px;
        text-align: left;
    }

    .capability-description {
        font-size: 16px;
        line-height: 1.4;
        text-align: left;
    }

    /* Примеры */
    .implementation-examples {
        margin-top: 48px;
    }



    .card-image {
        height: 140px;
        border-radius: 12px;
        margin-bottom: 16px;
    }

    .example-title {
        font-size: 17px;
        margin-bottom: 12px;
        text-align: left;
    }

    .example-description {
        font-size: 16px;
        margin-bottom: 20px;
        text-align: left;
    }

    .example-cta-button {
        padding: 12px 24px;
        font-size: 16px;
        border-radius: 8px;
        width: 100%;
    }

    /* Timeline секция */
    .how-it-works-section {
        padding: 80px 0;
    }

    .how-it-works-section .section-title {
        text-align: left;
        font-size: 40px;
        padding: 0;
    }

    .timeline-container {
        gap: 32px;
        padding: 0 30px !important;
        
    }

    .timeline-content {
        padding: 24px 20px;
        border-radius: 16px;
        text-align: left;
    }

    .timeline-title {
        font-size: 18px;
        margin-bottom: 12px;
        text-align: left;
    }

    .timeline-description {
        font-size: 16px;
        text-align: left;
        line-height: 1.5;
    }

    /* Tasks секция */
    .tasks-section {
        padding: 60px 0;
    }

    .tasks-section .section-title {
        font-size: 40px;
        text-align: left;
        margin-bottom: 24px;
        padding-left: 70px;
    }

    .tasks-timeline {
        padding: 0 30px !important;
    }





    /* === OFFER СЕКЦИЯ === */
    .offer-section {
        padding: 60px 0;
    }

    /* Скрываем видео фон */
    .offer-video-background {
        display: none;
    }

    .offer-section .section-title {
        font-size: 40px;
        text-align: left;
        margin-bottom: 24px;
        padding-left: 60px;
    }

    .offer-section .section-subtitle {
        font-size: 20px;
        text-align: left;
        margin-bottom: 40px;
    }

    .pricing-card-single {
        max-width: 600px;
        margin: 0;
        padding: 32px;
        border-radius: 20px;
    }

    .price-amount {
        font-size: 32px;
        margin-bottom: 8px;
    }

    .benefits-title {
        font-size: 18px;
        margin-bottom: 20px;
    }

    .benefit-text {
        font-size: 16px;
        line-height: 1.5;
    }

    /* === READY СЕКЦИЯ === */
    .ready-section {
        padding: 60px 0;
    }



    .ready-content {
        display: flex;
        flex-direction: column;
        gap: 40px;
        align-items: center;
    }

    .ready-section .section-title {
        font-size: 40px !important;
        text-align: left;
        margin-bottom: 24px;
        white-space: normal;
        padding-left: 0;
    }

    /* Убираем розовые пунктирные линии */
    .ready-section *,
    .ready-section *::before,
    .ready-section *::after {
        outline: none !important;
        border: none !important;
        box-shadow: none !important;
    }

    .ready-section-content {
        padding: 0 60px 0 0 !important;
    }

    .ready-description {
        font-size: 16px;
        text-align: left;
        margin-bottom: 24px;
    }

    .ready-subtitle {
        font-size: 16px;
        text-align: left;
        margin-bottom: 20px;
    }

    .ready-experts-title {
        font-size: 16px;
        margin-bottom: 16px;
    }

    .ready-experts-list {
        font-size: 16px;
        line-height: 1.6;
    }

    .ready-form-container {
        max-width: 500px;
        width: 100%;
        margin: 0 auto;
    }

    .ready-form-input {
        font-size: 16px;
        padding: 14px 16px;
    }

    .ready-form-submit {
        font-size: 16px;
        padding: 14px 24px;
    }

    /* === ФУТЕР === */
    .footer-content {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 60px;
        padding: 0 60px 0 0;
    }

    .footer-left {
        padding-left: 0;
        transform: none;
        margin-left: -60px;
    }

    .footer-right {
        transform: none;
    }

    .footer-details {
        transform: none;
    }

    .footer-link:first-child {
        transform: none;
        margin-bottom: 4px;
    }

    .footer-link:last-child {
        transform: none;
        margin-bottom: 0;
    }

    .footer-company-name {
        font-size: 16px;
    }

    .footer-details p {
        font-size: 16px;
    }

    .footer-phone {
        font-size: 24px;
    }

    .footer-link {
        font-size: 16px;
    }
}

@media (max-width: 480px) {
    .hero-section {
        padding: 60px 0 40px;
    }
    
    .content {
        padding: 0 var(--container-padding-mobile);
    }
    
    .container {
        padding: 0 var(--container-padding-mobile);
    }
    
    .main-title {
        font-size: 40px;
        white-space: normal;
        margin-bottom: 20px;
    }
    
    .subtitle {
        font-size: 16px;
        letter-spacing: 0.5px;
        margin-bottom: 28px;
    }
    
    .line-separator {
        width: 180px;
        height: 2px;
        margin: 0 auto 28px;
    }
    
    .cta-button {
        font-size: 14px;
        padding: 14px 28px;
        margin-bottom: 20px;
        border-radius: 10px;
    }
    
    .cta-subtitle {
        font-size: 12px;
        margin-top: 12px;
    }

    /* Видео для экранов 480px и меньше */
    .fullscreen-video-background {
        top: -260px !important;
    }

    .second-section {
        padding: 60px 0;
    }
    
    .bento-content {
        padding: 0 var(--container-padding-mobile);
    }
    
    .capabilities-content {
        padding: 0 var(--container-padding-mobile);
    }
    
    .timeline-container {
        padding: 0 var(--container-padding-mobile);
    }
    
    .tasks-timeline {
        padding: 0 var(--container-padding-mobile);
    }

    .section-title {
        font-size: 32px;
        line-height: 1.1;
    }
    
    .section-header {
        margin-bottom: 40px;
    }

    .business-problems {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto auto;
        gap: 20px;
        margin-top: 32px;
        min-height: auto;
        align-items: stretch;
    }
    
    /* На мобильных все карточки в столбик */
    .problem-solution-card {
        padding: 24px 20px;
        border-radius: 18px;
    }
    
    .problem-solution-card:nth-child(1),
    .problem-solution-card:nth-child(2),
    .problem-solution-card:nth-child(3),
    .problem-solution-card:nth-child(4) {
        grid-column: 1 / 2;
    }
    
    .problem-solution-card:nth-child(1) {
        grid-row: 1 / 2;
    }
    
    .problem-solution-card:nth-child(2) {
        grid-row: 2 / 3;
    }
    
    .problem-solution-card:nth-child(3) {
        grid-row: 3 / 4;
    }
    
    .problem-solution-card:nth-child(4) {
        grid-row: 4 / 5;
    }

    .card-number-circle {
        width: 40px;
        height: 40px;
        font-size: 16px;
        margin-bottom: 20px;
    }

    .problem-solution-card .problem-title {
        font-size: 17px;
        margin-bottom: 12px;
    }

    .solution-text {
        font-size: 13px;
    }

    .third-section {
        padding: 80px 0;
    }

    .capabilities-list {
        gap: 32px;
        margin-top: 40px;
    }
    
    .capability-item {
        padding: 28px 20px;
        gap: 20px;
        border-radius: 20px;
        text-align: left;
    }

    .capability-number {
        font-size: 72px;
        line-height: 0.8;
        margin-bottom: 4px;
        text-align: left;
    }

    .capability-title {
        font-size: 22px;
        margin-bottom: 8px;
    }

    .capability-description {
        font-size: 16px;
        line-height: 1.4;
    }
    
    .implementation-examples {
        margin-top: 60px;
    }
    
    .examples-grid {
        gap: 16px;
        width: 100%;
    }
    
    .example-card {
        padding: 24px;
        border-radius: 18px;
    }
    
    .card-image {
        height: 160px;
        border-radius: 14px;
        margin-bottom: 20px;
    }
    
    .card-header {
        margin-bottom: 16px;
    }

    .card-number {
        font-size: 24px;
    }
    
    .card-badge {
        font-size: 11px;
        padding: 6px 12px;
    }

    .example-title {
        font-size: 18px;
        margin-bottom: 12px;
    }

    .example-description {
        font-size: 14px;
        line-height: 1.5;
    }

    .example-cta-button {
        padding: 14px 20px;
        font-size: 14px;
        border-radius: 10px;
    }
    
    .cta-section {
        margin-top: 32px;
        padding: 0 var(--container-padding-mobile);
    }
    
    .cta-button-secondary {
        padding: 14px 24px;
        font-size: 15px;
        min-width: 160px;
        border-radius: 10px;
    }
}

/* Оптимизация для touch-устройств */
@media (hover: none) and (pointer: coarse) {
    .capability-item:hover,
    .example-card:hover,
    .solution-card:hover,
    .problem-card:hover {
        transform: none;
        background: initial;
        border-color: initial;
        box-shadow: initial;
    }
    
    .capability-item:active {
        transform: scale(0.98);
    }
    
    .example-card:active {
        transform: scale(0.98);
    }
    
    .cta-button:active {
        transform: scale(0.96);
    }

    .example-cta-button:hover {
        background: linear-gradient(135deg, #145BDE 0%, #0F4BC7 50%, #1E6EFF 100%);
        transform: none;
        box-shadow: 0 4px 15px rgba(20, 91, 222, 0.3);
        scale: 1;
    }

    .example-cta-button:hover::before {
        left: -100%;
    }

    .example-cta-button:active {
        transform: scale(0.96);
        background: linear-gradient(135deg, #0D3F9F 0%, #0F4BC7 50%, #1A6BF5 100%);
    }
    
    /* Убираем сложные hover-эффекты на мобильных */
    .solution-pair:hover .connection-flow .flow-line,
    .solution-pair:hover .flow-arrow {
        transform: none;
        background: initial;
    }
    
    /* На мобильных оставляем только легкие анимации персонажей */
    .example-image {
        animation: breathe 6s ease-in-out infinite !important;
    }
    
    .example-card:nth-child(1) .example-image,
    .example-card:nth-child(2) .example-image {
        animation: breathe 6s ease-in-out infinite !important;
    }
    
    /* Убираем сложные декоративные эффекты для лучшей производительности */
    .third-section::after {
        animation: none;
    }
    
    .capability-number::before,
    .capability-number::after {
        display: none;
    }
    
    .card-image::before,
    .card-image::after {
        animation: none;
        opacity: 0;
    }
}

/* Дополнительный брейкпоинт для больших планшетов */
@media (max-width: 1024px) and (min-width: 769px) {
    /* Контейнеры и отступы - фиксация по левой стороне */
    .container,
    .timeline-container {
        max-width: none !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 35px !important;
        box-sizing: border-box !important;
    }
    
    .bento-content {
        max-width: none !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 35px !important;
        box-sizing: border-box !important;
    }
    
    .second-section .bento-content {
        padding-left: 0 !important;
        padding-right: 0 !important;
        max-width: none !important;
    }
    
    /* Главная секция - выравнивание по левой направляющей */
    .hero-section {
        min-height: 85vh !important;
        padding-top: 90px !important;
    }
    
    .fullscreen-video {
        transform: translateY(-1%) !important;
    }
    
    .content {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    .text-content {
        padding-left: 0 !important;
        margin-left: 0 !important;
    }
    
    .main-title {
        font-size: 72px;
        line-height: 1.1;
        text-align: left !important;
        margin-left: 0 !important;
        padding-left: 0 !important;
    }
    
    .subtitle {
        font-size: 14px;
        line-height: 1.4;
        margin-bottom: 20px;
        text-align: left !important;
        margin-left: 0 !important;
        padding-left: 0 !important;
    }
    
    .line-separator {
        width: 80px;
        height: 3px;
        margin-left: 0 !important;
    }
    
    .cta-button {
        padding: 16px 32px;
        font-size: 16px;
        margin-left: 0 !important;
    }
    
    .cta-subtitle {
        font-size: 14px;
        text-align: left !important;
        margin-left: 0 !important;
        padding-left: 0 !important;
    }
    
    /* Заголовки секций - фиксация по левой стороне */
    .section-title {
        font-size: 32px !important;
        line-height: 1.2;
        margin-left: 0 !important;
        padding-left: 0 !important;
        text-align: left !important;
    }
    
    .third-section .section-title {
        font-size: 32px !important;
        margin-left: 0 !important;
        padding-left: 30px !important;
        text-align: left !important;
    }
    
    .section-subtitle {
        font-size: 16px;
    }
    
    /* Вторая секция - фиксация по левой стороне */
    .second-section {
        padding-top: 0;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    /* Вторая секция - карточки проблем */
    .business-problems {
        margin-left: -35px !important;
        margin-right: -35px !important;
        width: calc(100% + 70px) !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        grid-template-rows: 1fr 1fr !important;
        gap: 24px !important;
        box-sizing: border-box !important;
        margin-top: 50px !important;
    }
    
    .problem-solution-card:nth-child(1) {
        grid-column: 1 / 2 !important;
        grid-row: 1 / 2 !important;
    }
    
    .problem-solution-card:nth-child(2) {
        grid-column: 2 / 3 !important;
        grid-row: 1 / 2 !important;
    }
    
    .problem-solution-card:nth-child(3) {
        grid-column: 1 / 2 !important;
        grid-row: 2 / 3 !important;
    }
    
    .problem-solution-card:nth-child(4) {
        grid-column: 2 / 3 !important;
        grid-row: 2 / 3 !important;
    }
    
    .problem-solution-card {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
        max-width: none !important;
        box-sizing: border-box !important;
        padding: 32px 24px !important;
    }
    
    .problem-solution-card:nth-child(odd) {
        margin-left: 0 !important;
    }
    
    .problem-solution-card:nth-child(even) {
        margin-right: 35px !important;
    }
    
    .card-number-circle {
        width: 44px;
        height: 44px;
        font-size: 16px;
    }
    
    .problem-solution-card .problem-title {
        font-size: 16px;
        white-space: normal !important;
        word-wrap: break-word !important;
        line-height: 1.3 !important;
    }
    
    .problem-solution-card:nth-child(1) .problem-title {
        white-space: normal !important;
        word-wrap: normal !important;
        overflow-wrap: normal !important;
        hyphens: none !important;
        max-width: none !important;
        width: auto !important;
        height: auto !important;
        line-height: 1.2 !important;
        margin: 0 !important;
        padding: 0 !important;
        text-overflow: clip !important;
        overflow: visible !important;
        margin-left: 0 !important;
        padding-left: 0 !important;
    }
    
    .problem-solution-card:nth-child(1) .title-line {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        white-space: nowrap !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }
    
    .problem-solution-card:nth-child(1),
    .problem-solution-card:nth-child(2) {
        display: flex !important;
        flex-direction: column !important;
        height: 100% !important;
        min-height: 300px !important;
    }
    
    .problem-solution-card:nth-child(1) .solution-section {
        display: flex !important;
        flex-direction: column !important;
        justify-content: flex-end !important;
        align-items: flex-start !important;
        margin-top: auto !important;
        padding: 16px 24px 24px 0px !important;
    }
    
    .problem-solution-card:nth-child(2) .solution-section {
        display: flex !important;
        flex-direction: column !important;
        justify-content: flex-end !important;
        align-items: flex-start !important;
        margin-top: auto !important;
        padding: 16px 24px 24px 0px !important;
    }
    
    .problem-solution-card:nth-child(1) .solution-text {
        font-size: 16px !important;
        line-height: 1.4 !important;
        margin: 0 !important;
        margin-left: 0 !important;
        padding-left: 0 !important;
    }
    
    .problem-solution-card:nth-child(2) .solution-text {
        font-size: 16px !important;
        line-height: 1.4 !important;
        margin: 0 !important;
    }
    
        .problem-solution-card:nth-child(1) .problem-section {
        padding: 24px 24px 16px 0px !important;
        min-height: 120px !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
    }

    .problem-solution-card:nth-child(2) .problem-section {
        padding: 24px 24px 16px 0px !important;
        min-height: 120px !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
    }
    
    .solution-text {
        font-size: 16px;
    }
    
    /* Третья секция - возможности */
    .capabilities-list {
        gap: 36px;
        margin-top: 60px;
    }
    
    .capability-item {
        gap: 28px;
        padding: 24px;
    }
    
    .capability-number {
        font-size: 96px;
        min-width: 120px;
    }
    
    .capability-title {
        font-size: 22px;
    }
    
    .capability-description {
        font-size: 16px;
    }
    
    /* Примеры реализации */
    .implementation-title {
        font-size: 32px;
    }
    
    .examples-grid {
        gap: 24px;
    }
    
    .example-card {
        padding: 20px;
    }
    
    .card-image {
        height: 160px;
    }
    
    .example-title {
        font-size: 18px;
    }
    
    .example-description {
        font-size: 16px;
    }
    
    .example-cta-button {
        padding: 12px 20px;
        font-size: 16px;
    }
    
    /* Как это работает */
    .how-it-works-section {
        padding: 80px 0;
    }
    
    .how-it-works-section .section-title {
        font-size: 32px;
        margin-bottom: 50px;
        padding-left: 35px !important;
        margin-left: 0 !important;
        text-align: left !important;
    }
    
    .timeline-content {
        padding: 28px;
    }
    
    .timeline-title {
        font-size: 18px;
    }
    
    .timeline-description {
        font-size: 16px;
    }
    
    /* Задачи - вертикальные карточки с подчеркиванием */
    .tasks-section {
        padding: 50px 0;
    }
    
    .tasks-section .section-title {
        font-size: 32px;
        margin: 0 0 80px 0;
        padding-left: 30px !important;
        margin-left: 0 !important;
        text-align: left !important;
    }
    
    .tasks-timeline {
        max-width: none !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 35px !important;
        display: flex;
        flex-direction: column;
        gap: 0;
        box-sizing: border-box !important;
    }
    
    .task-item {
        background: none !important;
        border: none !important;
        border-bottom: none !important;
        border-radius: 0 !important;
        padding: 20px 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        text-align: left !important;
        gap: 0 !important;
        position: relative !important;
        transition: all 0.3s ease;
        transform: none !important;
        opacity: 1 !important;
        min-height: auto !important;
        margin-bottom: 0 !important;
    }
    
    .task-item:hover {
        background: rgba(255, 255, 255, 0.02);
        border-bottom-color: rgba(30, 111, 255, 0.3);
        transform: none;
        box-shadow: none;
    }
    
    .task-item:last-child {
        border-bottom: none;
    }
    
    .task-left {
        width: 100% !important;
        text-align: left !important;
        margin-bottom: 16px !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        gap: 16px !important;
        flex: none !important;
        padding-right: 0 !important;
    }
    
    .task-title {
        font-size: 12px !important;
        font-weight: 600;
        font-family: 'Unbounded', sans-serif;
        margin: 0 !important;
        color: #ffffff;
        text-transform: uppercase;
        line-height: 1.3;
        letter-spacing: 1px;
        text-align: left !important;
        flex: none;
        background: rgba(255, 255, 255, 0.2) !important;
        border-radius: 20px !important;
        padding: 8px 16px !important;
        display: inline-block !important;
        width: fit-content !important;
        white-space: nowrap !important;
        backdrop-filter: blur(10px) !important;
        order: 2 !important;
    }
    
    .task-number {
        font-size: 24px !important;
        font-weight: 700;
        color: #ffffff;
        font-family: 'Unbounded', sans-serif;
        line-height: 1;
        margin: 0 !important;
        display: block;
        background: none;
        border: none;
        min-width: auto !important;
        border-radius: 0;
        text-align: left !important;
        order: 1 !important;
        opacity: 0.7 !important;
    }
    
    .task-divider {
        display: none;
    }
    
    .task-right {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        display: block !important;
        text-align: left !important;
        flex: none !important;
        padding-left: 0 !important;
    }
    
    .task-description {
        font-size: 16px !important;
        line-height: 1.5;
        color: #d1d5db;
        margin: 0 !important;
        text-align: left !important;
        padding: 0 !important;
        max-width: 400px;
        font-family: 'Gilroy', sans-serif !important;
        font-weight: 400 !important;
    }
    
    .task-item:not(:last-child)::after {
        content: '' !important;
        position: absolute !important;
        bottom: -8px !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        height: 1px !important;
        background: rgba(255, 255, 255, 0.1) !important;
        overflow: hidden !important;
        z-index: 0 !important;
    }
    
    .task-item:not(:last-child)::before {
        content: '' !important;
        position: absolute !important;
        bottom: -8px !important;
        left: -100% !important;
        width: 100% !important;
        height: 1px !important;
        background: linear-gradient(90deg, 
            transparent 0%, 
            #145BDE 20%, 
            #1E6FFF 50%, 
            #145BDE 80%, 
            transparent 100%) !important;
        animation: loaderMove 2s ease-in-out infinite !important;
        z-index: 1 !important;
    }
    
    @keyframes loaderMove {
        0% {
            left: -100%;
        }
        50% {
            left: 0%;
        }
        100% {
            left: 100%;
        }
    }
    
    .task-separator {
        display: none;
    }
}

/* Блок "Какие задачи решает" - специальные стили для диапазона 769-1024px */
@media (max-width: 1024px) and (min-width: 769px) {
    .tasks-section {
        padding: 80px 0;
    }
    
    .tasks-timeline {
        max-width: 600px;
        margin: 0 auto;
        padding: 0 35px;
    }
    
    .task-item {
        background: none !important;
        border: none !important;
        border-radius: 0 !important;
        padding: 24px 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 12px !important;
        position: relative !important;
        margin-bottom: 0 !important;
    }
    
    .task-left {
        width: 100% !important;
        display: flex !important;
        align-items: center !important;
        gap: 16px !important;
        margin-bottom: 0 !important;
    }
    
    .task-number {
        font-size: 20px !important;
        font-weight: 700 !important;
        color: #ffffff !important;
        font-family: 'Unbounded', sans-serif !important;
        margin: 0 !important;
        order: 1 !important;
        opacity: 0.8 !important;
        flex-shrink: 0 !important;
    }
    
    .task-title {
        font-size: 11px !important;
        font-weight: 600 !important;
        font-family: 'Unbounded', sans-serif !important;
        color: #ffffff !important;
        text-transform: uppercase !important;
        letter-spacing: 1px !important;
        background: rgba(255, 255, 255, 0.15) !important;
        border-radius: 16px !important;
        padding: 6px 12px !important;
        backdrop-filter: blur(10px) !important;
        order: 2 !important;
        margin: 0 !important;
    }
    
    .task-description {
        font-size: 15px;
        line-height: 1.5 !important;
        color: #d1d5db !important;
        font-family: 'Gilroy', sans-serif !important;
        font-weight: 400 !important;
        margin: 0 !important;
        max-width: 450px !important;
    }
    
    .task-divider {
        display: none !important;
    }
    
    .task-item:not(:last-child) {
        position: relative !important;
        margin-bottom: 8px !important;
        padding-bottom: 24px !important;
    }
    
    .task-item:not(:last-child)::after {
        content: '' !important;
        position: absolute !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        height: 1px !important;
        background: rgba(255, 255, 255, 0.08) !important;
    }
    
    .task-item:not(:last-child)::before {
        display: none !important;
    }
}

@media (max-width: 1024px) and (min-width: 769px) {
    
    /* Предложение - убираем видео */
    .offer-video-background {
        display: none !important;
    }
    
    .offer-section .section-title {
        font-size: 32px;
        margin: 0 0 24px 0;
        padding-left: 30px !important;
    }
    
    .offer-section .section-subtitle {
        font-size: 16px;
        padding-left: 30px !important;
    }
    
    .pricing-card-wrapper {
        margin-left: 30px !important;
    }
    
    .pricing-card-single {
        padding: 36px 28px;
        max-width: 420px;
    }
    
    .price-amount {
        font-size: 42px;
    }
    
    .benefits-title {
        font-size: 18px;
    }
    
    .benefit-text {
        font-size: 16px;
    }
    
    /* Готовы начать - одна колонка: текст сверху, форма снизу */
    .ready-section-content {
        max-width: 800px;
        padding: 0 var(--container-padding-tablet-large) 0 0;
    }
    
    .ready-content {
        display: flex !important;
        flex-direction: column !important;
        gap: 8px !important;
        align-items: flex-start !important;
        text-align: left !important;
        grid-template-columns: none !important;
    }
    
    .ready-left {
        width: 100% !important;
        max-width: 100% !important;
        order: 1 !important;
        margin-bottom: 0 !important;
        position: relative !important;
        z-index: 1 !important;
        display: flex !important;
        flex-direction: column !important;
    }
    
    .ready-header {
        margin-bottom: 0 !important;
    }
    
    .ready-section .section-title {
        font-size: 32px !important;
        text-align: left !important;
        margin: 0 0 5px 0 !important;
        padding: 0 !important;
        line-height: 1.1 !important;
    }
    
    .ready-description {
        font-size: 18px !important;
        text-align: left !important;
        max-width: 600px !important;
        margin: 25px 0 0 0 !important;
        padding: 0 !important;
        line-height: 1.4 !important;
        position: relative !important;
        z-index: 3 !important;
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        color: rgba(255, 255, 255, 0.8) !important;
        order: 0 !important;
        width: 100% !important;
    }
    
    .ready-subtitle {
        display: none !important;
    }
    
    .ready-experts {
        display: none !important;
    }
    
    .ready-right {
        width: 100% !important;
        max-width: 400px !important;
        order: 3 !important;
        align-self: flex-start !important;
        margin-top: 20px !important;
    }
    
    .ready-form-container {
        max-width: 100% !important;
        padding: 20px !important;
        margin-top: 0 !important;
        position: relative !important;
        z-index: 2 !important;
    }
    
    .ready-form-input {
        padding: 14px 18px;
        font-size: 15px;
    }
    
    .ready-form-submit {
        padding: 16px 24px;
        font-size: 15px;
        width: 100%;
    }
    
    .ready-form-tag {
        font-size: 12px;
        padding: 8px 14px;
        position: relative !important;
        z-index: 2 !important;
        margin-bottom: 20px !important;
        margin-top: 0 !important;
        text-align: left !important;
        margin-left: 0 !important;
        align-self: flex-start !important;
    }
    
    .ready-privacy-text {
        font-size: 12px;
    }
    
    /* Футер */
    .footer-section {
        padding: 35px 0 !important;
    }
    
    .footer-content {
        max-width: none !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 35px !important;
        gap: 35px !important;
        align-items: center !important;
        box-sizing: border-box !important;
    }
    
    .footer-left {
        padding-left: 0 !important;
        margin-left: 0 !important;
        gap: 10px !important;
        transform: translateY(-10px) !important;
        text-align: left !important;
    }
    
    .footer-right {
        gap: 10px !important;
        transform: translateY(-10px) !important;
    }
    
    .footer-company-name {
        font-size: 16px !important;
        margin: -2px 0 6px 0 !important;
        max-width: 350px !important;
        text-align: left !important;
    }
    
    .footer-details {
        transform: translateY(10px) !important;
        gap: 3px !important;
        text-align: left !important;
    }
    
    .footer-details p {
        font-size: 13px !important;
        text-align: left !important;
    }
    
    .footer-phone {
        font-size: 24px !important;
        margin-top: -4px !important;
        letter-spacing: 0.2px !important;
    }
    
    .footer-contact {
        gap: 10px !important;
    }
    
    .footer-links {
        gap: 3px !important;
    }
    
    .footer-link {
        font-size: 13px !important;
    }
    
    .footer-link:first-child {
        margin-bottom: 3px !important;
        transform: translateY(16px) !important;
    }
    
    .footer-link:last-child {
        margin-bottom: -1px !important;
        transform: translateY(12px) !important;
    }
}

/* Четвертый блок - Простой и красивый Timeline */
.how-it-works-section {
    background: #EBEBE9;
    padding: 100px 0;
}

.how-it-works-section .section-title {
    text-align: left;
    margin: 0 0 60px 0;
    padding-left: 60px;
}

.timeline-container {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-desktop);
    position: relative;
}

/* Убираем центральную линию */

/* Шаги таймлайна */
.timeline-step {
    margin-bottom: 40px;
    position: relative;
}

.timeline-step:last-child {
    margin-bottom: 0;
}

/* Новые градиентные карточки */
.timeline-content {
    border-radius: 20px;
    padding: 32px;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 16px;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    transform: translateY(30px);
    opacity: 0;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

/* Анимация появления */
.timeline-content.animate-in {
    transform: translateY(0);
    opacity: 1;
}

/* Задержки для последовательного появления */
.timeline-step:nth-child(1) .timeline-content { animation-delay: 0.2s; }
.timeline-step:nth-child(2) .timeline-content { animation-delay: 0.4s; }
.timeline-step:nth-child(3) .timeline-content { animation-delay: 0.6s; }
.timeline-step:nth-child(4) .timeline-content { animation-delay: 0.8s; }

/* Hover эффекты */
.timeline-content:hover {
    transform: translateY(-8px) scale(1.02);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
}

/* Синий градиент */
.timeline-blue {
    background: linear-gradient(135deg, #145BDE 0%, #1E6FFF 100%);
    color: white;
}

/* Серый градиент */
.timeline-gray {
    background: linear-gradient(135deg, #6B7280 0%, #4B5563 100%);
    color: white;
}

/* Темный градиент */
.timeline-dark {
    background: linear-gradient(135deg, #374151 0%, #111827 100%);
    color: white;
}

/* Светлый градиент */
.timeline-light {
    background: linear-gradient(135deg, #F9FAFB 0%, #E5E7EB 100%);
    color: #1F2937;
}

/* Иконки */
.timeline-icon {
    position: absolute;
    top: 32px;
    right: 32px;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.15);
    border-radius: 12px;
    backdrop-filter: blur(10px);
    transition: all 0.3s ease;
}

/* Hover эффект для иконок */
.timeline-content:hover .timeline-icon {
    transform: scale(1.05);
    background: rgba(255, 255, 255, 0.25);
}

.timeline-light .timeline-icon {
    background: rgba(0, 0, 0, 0.05);
}

/* Теги шагов */
.step-tag {
    background: rgba(255, 255, 255, 0.2);
    color: currentColor;
    font-family: 'Unbounded', sans-serif;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 8px 16px;
    border-radius: 20px;
    display: inline-block;
    width: fit-content;
    margin-bottom: 20px;
}

/* Пульсация тегов убрана */

/* Анимация tagPulse удалена */

.timeline-light .step-tag {
    background: rgba(0, 0, 0, 0.1);
}

.timeline-title {
    font-size: 20px;
    font-weight: 500;
    margin: 0;
    font-family: 'Unbounded', sans-serif;
    color: inherit;
    line-height: 1.3;
}

.timeline-description {
    font-size: 16px;
    line-height: 1.4;
    margin: 0;
    font-family: 'Gilroy', sans-serif;
    color: inherit;
    opacity: 0.9;
    font-weight: 400;
}

/* Серый текст */
.timeline-note {
    margin-top: 60px;
    text-align: left;
    padding-left: 0;
}

.timeline-note p {
    color: #718096;
    font-size: 14px;
    margin: 8px 0;
    font-style: italic;
}

/* Адаптивность */
@media (max-width: 768px) {
    .how-it-works-section {
        padding: 80px 0;
    }
    
    .timeline-container {
        padding: 0 20px;
    }
    
    .timeline-step {
        margin-bottom: 32px;
    }
    
    .timeline-content {
        padding: 24px;
    }
    
    .timeline-icon {
        top: 24px;
        right: 24px;
        width: 40px;
        height: 40px;
    }
    
    .step-tag {
        font-size: 10px;
        padding: 6px 12px;
    }
    
    .timeline-title {
        font-size: 18px;
    }
    
    .timeline-description {
        font-size: 14px;
    }
}

@media (max-width: 480px) {
    .how-it-works-section {
        padding: 60px 0;
    }
    
    .timeline-container {
        padding: 0 15px;
    }
    
    .timeline-step {
        margin-bottom: 24px;
    }
    
    .timeline-content {
        padding: 20px;
    }
    
    .timeline-icon {
        top: 20px;
        right: 20px;
        width: 32px;
        height: 32px;
    }
    
    .step-tag {
        font-size: 10px;
        padding: 6px 12px;
    }
    
    .timeline-title {
        font-size: 16px;
    }
    
    .timeline-description {
        font-size: 13px;
    }
}

/* Пятый блок - Какие задачи решает */
.tasks-section {
    background: linear-gradient(135deg, #2D3748 0%, #1A202C 100%);
    padding: 100px 0;
    position: relative;
    overflow: hidden;
}

.tasks-section .section-title {
    font-family: 'Unbounded', sans-serif;
    font-size: 40px;
    font-weight: 700;
    color: #ffffff;
    text-align: left;
    margin: 0 0 80px 0;
    line-height: 1.2;
}

.tasks-timeline {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-desktop);
    position: relative;
}

/* Прогрессивная линия убрана */

.task-item {
    display: flex;
    align-items: center;
    min-height: 120px;
    margin-bottom: 0;
    position: relative;
    z-index: 2;
    opacity: 0;
    transform: translateX(-50px);
    transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    padding: 30px 0;
}

.task-item:not(:last-child) {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

/* Разделительная полоса */
.task-separator {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: rgba(255, 255, 255, 0.1);
    overflow: hidden;
}

.task-separator-fill {
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, 
        transparent 0%, 
        #145BDE 20%, 
        #1E6FFF 50%, 
        #145BDE 80%, 
        transparent 100%
    );
    transition: left 1.2s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 0 15px rgba(20, 91, 222, 0.6);
}

.task-separator-fill::after {
    content: '';
    position: absolute;
    top: -1px;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, 
        transparent 0%, 
        rgba(20, 91, 222, 0.8) 20%, 
        rgba(30, 111, 255, 0.9) 50%, 
        rgba(20, 91, 222, 0.8) 80%, 
        transparent 100%
    );
    filter: blur(1px);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.task-item.animate-in .task-separator-fill::after {
    opacity: 1;
    animation: separatorGlow 2s ease-in-out infinite alternate;
}

@keyframes separatorGlow {
    0% { 
        opacity: 0.6;
        transform: scaleY(1);
    }
    100% { 
        opacity: 1;
        transform: scaleY(1.2);
    }
}

/* Анимация заливки разделителя */
.task-item.animate-in .task-separator-fill {
    left: 0;
}

/* Анимация появления элементов */
.task-item.animate-in {
    opacity: 1;
    transform: translateX(0);
}

/* Задержки для последовательного появления */
.task-item:nth-child(2) { transition-delay: 0.2s; }
.task-item:nth-child(3) { transition-delay: 0.4s; }
.task-item:nth-child(4) { transition-delay: 0.6s; }
.task-item:nth-child(5) { transition-delay: 0.8s; }
.task-item:nth-child(6) { transition-delay: 1.0s; }
.task-item:nth-child(7) { transition-delay: 1.2s; }

.task-left {
    flex: 0 0 450px;
    display: flex;
    align-items: center;
    gap: 20px;
    padding-right: 40px;
}

.task-number {
    font-family: 'Unbounded', sans-serif;
    font-size: 48px;
    font-weight: 800;
    color: #ffffff;
    line-height: 1;
    min-width: 100px;
    text-align: center;
    transition: all 0.3s ease;
}

.task-title {
    font-family: 'Unbounded', sans-serif;
    font-size: 18px;
    font-weight: 600;
    color: #ffffff;
    line-height: 1.2;
    margin: 0;
    text-transform: uppercase;
    transition: color 0.3s ease;
}

/* Скрываем перенос строки по умолчанию */
.task-title-br {
    display: none;
}

.task-divider {
    display: none;
}

/* Активная линия при скролле - убрано */

.task-right {
    flex: 1;
    padding-left: 40px;
}

.task-description {
    font-family: 'Gilroy', sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: #d1d5db;
    line-height: 1.5;
    margin: 0;
    transition: color 0.3s ease;
}

/* Hover эффекты */
.task-item:hover .task-number {
    color: #1E6FFF;
    transform: scale(1.1);
}

.task-item:hover .task-title {
    color: #1E6FFF;
}

.task-item:hover .task-description {
    color: #ffffff;
}

/* Hover эффект для разделителя убран */

/* Адаптивность */


@media (max-width: 768px) {
    .tasks-section {
        padding: 80px 0;
    }
    
    .tasks-timeline {
        padding: 0 15px;
    }
    
         .task-item {
         flex-direction: column;
         text-align: center;
         min-height: auto;
         padding: 30px 0;
         border-bottom: 1px solid rgba(255, 255, 255, 0.1);
     }
     
     .task-separator {
         left: 15px;
         right: 15px;
     }
    
    .task-item:last-child {
        border-bottom: none;
    }
    
    .task-left {
        flex: none;
        padding-right: 0;
        margin-bottom: 20px;
        flex-direction: column;
        gap: 10px;
    }
    
    /* task-divider убран */
    
    .task-right {
        flex: none;
        padding-left: 0;
    }
    
    .task-number {
        font-size: 32px;
        min-width: auto;
    }
    
    .task-title {
        font-size: 14px;
    }
    
    .task-description {
        font-size: 14px;
        text-align: center;
    }
    
    /* Убираем центральную линию на мобильных */
    .timeline-progress {
        display: none;
    }
}

@media (max-width: 480px) {
    .tasks-section {
        padding: 60px 0;
    }
    
    .task-number {
        font-size: 28px;
    }
    
    .task-title {
        font-size: 13px;
    }
    
    .task-description {
    font-size: 14px;
    }
} 

/* Новый блок - Мы предлагаем с видео фоном */
.offer-section {
    background: #EBEBE9;
    padding: 120px 0;
    position: relative;
    overflow: hidden;
}



/* Видео фон для offer-section */
.offer-video-background {
    position: absolute;
    top: 62%;
    right: calc(18% + 200px);
    transform: translateY(-50%) scaleX(-1);
    width: 70%;
    max-width: 800px;
    height: 60%;
    z-index: 0;
    overflow: hidden;
    border-radius: 20px;
}

/* Сдвиг видео влево на 200px для десктопов */
@media (min-width: 1200px) {
    .offer-video-background {
        right: calc(18% + 400px) !important;
    }
}

.offer-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.offer-content {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-desktop);
    position: relative;
    z-index: 2;
}

.offer-section .section-header {
    text-align: left;
    margin: 0 0 80px 0;
}

.offer-section .section-title {
    font-family: 'Unbounded', sans-serif;
    font-weight: 500;
    color: #191925;
    line-height: 1.1;
    margin: 0 0 24px 0;
    text-transform: uppercase;
    text-align: left;
}

.offer-section .section-subtitle {
    font-family: 'Gilroy', sans-serif;
    font-size: 24px;
    font-weight: 400;
    color: #4B5563;
    line-height: 1.4;
    max-width: 100%;
    margin: 0;
    padding-left: 60px;
    text-align: left;
}

/* Левая карточка предложения */
.pricing-card-wrapper {
    display: flex;
    justify-content: flex-start;
    margin-top: 80px;
    margin-left: 60px;
}

/* Скрываем новые карточки на больших экранах */
.pricing-cards-wrapper {
    display: none;
}

.pricing-card-single {
    background: linear-gradient(135deg, rgba(55, 65, 81, 0.95) 0%, rgba(31, 41, 55, 0.95) 100%);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 20px;
    padding: 40px;
    max-width: 420px !important;
    width: 100%;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
    text-align: left;
    position: relative;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    transform: translateY(30px);
    opacity: 0;
    margin-top: 20px;
}

.pricing-card-single.animate-in {
    transform: translateY(0);
    opacity: 1;
}

.pricing-card-single:hover {
    transform: translateY(-8px);
    box-shadow: 0 32px 64px rgba(0, 0, 0, 0.4);
    border-color: rgba(255, 255, 255, 0.2);
}

/* Тег карточки */
.card-tag {
    background: rgba(255, 255, 255, 0.2);
    color: #FFFFFF;
    font-family: 'Unbounded', sans-serif;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 8px 16px;
    border-radius: 20px;
    display: inline-block;
    margin-bottom: 32px;
    backdrop-filter: blur(10px);
}

.pricing-section {
    margin-bottom: 32px;
}

.pricing-cta-button {
    background: #145BDE;
    color: #ffffff;
    border: none;
    padding: 16px 32px;
    font-size: 16px;
    font-weight: 600;
    font-family: 'Gilroy', sans-serif;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    letter-spacing: 0.5px;
    margin-top: 20px;
    box-shadow: 0 2px 8px rgba(20, 91, 222, 0.2);
    width: 100%;
}

.pricing-cta-button:hover {
    background: #0F4BC7;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(20, 91, 222, 0.4);
}

.pricing-cta-button:active {
    background: #0D3F9F;
    transform: translateY(0);
    box-shadow: 0 2px 6px rgba(20, 91, 222, 0.4);
}

.price-amount {
    font-family: 'Unbounded', sans-serif;
    font-size: 42px;
    font-weight: 600;
    color: #ffffff;
    margin-bottom: 8px;
    line-height: 1;
}

.price-period {
    font-size: 20px;
    font-weight: 400;
    opacity: 0.8;
}

.price-details {
    font-family: 'Gilroy', sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.8);
    margin-top: 8px;
}

.benefits-title {
    font-family: 'Unbounded', sans-serif;
    font-size: 20px;
    font-weight: 500;
    color: #ffffff;
    margin-bottom: 24px;
}

.benefits-grid {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-bottom: 32px;
}

.benefit-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.benefit-icon {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    color: #2563EB;
    margin-top: 2px;
    font-size: 18px;
    font-weight: bold;
    display: flex;
    align-items: flex-start;
    justify-content: center;
}

.benefit-text {
    font-family: 'Gilroy', sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.9);
    line-height: 1.4;
    margin: 0;
}

/* Новый блок - Готовы начать */
.ready-section {
    background: linear-gradient(135deg, #374151 0%, #111827 100%);
    padding: 120px 0;
    position: relative;
    overflow: hidden;
}

.ready-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(circle at 20% 20%, rgba(20, 91, 222, 0.05) 0%, transparent 50%),
        radial-gradient(circle at 80% 80%, rgba(59, 130, 246, 0.05) 0%, transparent 50%);
    pointer-events: none;
}

.ready-section-content {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-desktop);
    display: flex;
    flex-direction: column;
    position: relative;
}

.ready-header {
    margin-bottom: 60px;
}

.ready-content {
    display: grid;
    grid-template-columns: 1fr 420px;
    gap: 60px;
    align-items: start;
}

.ready-right {
    margin-top: -140px;
}

.ready-left {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding-right: 40px;
}

.ready-section .section-title {
    font-family: 'Unbounded', sans-serif;
    font-size: 56px;
    font-weight: 500;
    color: #ffffff;
    line-height: 1.1;
    margin: 0 0 24px 0;
    text-transform: uppercase;
    text-align: left;
    padding-left: 60px;
    white-space: nowrap;
}

.ready-description {
    font-family: 'Gilroy', sans-serif;
    font-size: 20px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.8);
    line-height: 1.5;
    margin: 0;
    padding-left: 60px;
}

.ready-subtitle {
    font-family: 'Gilroy', sans-serif;
    font-size: 24px;
    font-weight: 600;
    color: #ffffff;
    line-height: 1.3;
    margin: 30px 0 16px 0;
    padding-left: 60px;
}

.ready-experts {
    margin-top: 32px;
    padding-left: 60px;
}

.ready-experts-title {
    font-family: 'Unbounded', sans-serif;
    font-size: 20px;
    font-weight: 500;
    color: #ffffff;
    margin: 0 0 24px 0;
}

.ready-experts-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 24px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.ready-experts-list li {
    font-family: 'Gilroy', sans-serif;
    font-size: 15px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.8);
    line-height: 1.4;
    position: relative;
    padding-left: 16px;
}

.ready-experts-list li::before {
    content: '•';
    color: #2563EB;
    font-size: 18px;
    font-weight: bold;
    position: absolute;
    left: 0;
    top: 0;
}

.ready-right {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
}

/* Новая форма обратной связи */
.ready-form-container {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid transparent;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-radius: 24px;
    padding: 32px;
    width: 100%;
    max-width: 420px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    margin-top: 0;
}

.ready-form-tag {
    background: rgba(255, 255, 255, 0.15);
    color: rgba(255, 255, 255, 0.9);
    padding: 8px 16px;
    border-radius: 20px;
    font-weight: 600;
    font-size: 12px;
    white-space: nowrap;
    text-transform: uppercase;
    display: inline-block;
    margin-bottom: 24px;
    width: fit-content;
}

.ready-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.ready-form-group {
    margin: 0;
}

.ready-form-input {
    width: 100%;
    padding: 16px 20px;
    background: rgba(255, 255, 255, 0.08);
    border: none;
    border-radius: 12px;
    color: #ffffff;
    font-family: 'Gilroy', sans-serif;
    font-size: 16px;
    font-weight: 400;
    transition: all 0.3s ease;
    box-sizing: border-box;
    box-shadow: none;
    outline: none;
}

.ready-form-input::placeholder {
    color: rgba(255, 255, 255, 0.6);
}

.ready-form-input:focus {
    outline: none;
    background: rgba(255, 255, 255, 0.12);
    box-shadow: none;
}

.ready-form-submit {
    background: #2563EB;
    color: #ffffff;
    border: none;
    padding: 18px 32px;
    font-size: 16px;
    font-weight: 600;
    font-family: 'Gilroy', sans-serif;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    letter-spacing: 0.5px;
    box-shadow: 0 4px 20px rgba(37, 99, 235, 0.3);
    text-align: center;
    width: 100%;
}

.ready-form-submit:hover {
    background: #1D4ED8;
    transform: translateY(-2px);
    box-shadow: 0 6px 25px rgba(37, 99, 235, 0.4);
}

.ready-form-submit:active {
    background: #1E40AF;
    transform: translateY(0);
    box-shadow: 0 4px 20px rgba(37, 99, 235, 0.4);
}

.ready-privacy-text {
    font-family: 'Gilroy', sans-serif;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.6);
    text-align: left;
    margin: 0;
    line-height: 1.4;
}

.ready-privacy-link {
    color: #3B82F6;
    text-decoration: none;
    transition: color 0.3s ease;
}

.ready-privacy-link:hover {
    color: #2563EB;
    text-decoration: underline;
}

/* Анимации появления */
.pricing-card-single { animation-delay: 0.2s; }
.contact-form { animation-delay: 0.4s; }

/* Промежуточная адаптивность для экранов до 1400px */
@media (max-width: 1400px) {
    .ready-content {
        grid-template-columns: 1fr 380px;
        gap: 50px;
    }
    
    .ready-form-container {
        max-width: 380px;
    }
    
    .ready-right {
        margin-top: -120px;
    }
}

/* Специальный адаптив для диапазона 1034px-1200px */




/* Адаптивность для экранов до 1200px */






/* Адаптивность для планшетов в портретном режиме */
@media (max-width: 900px) {
    /* Стили для offer-section на планшетах */
    .offer-section .section-title {
        font-size: 44px;
    }
    
    .offer-section .section-subtitle {
        font-size: 22px;
    }
    
    .pricing-card-single {
        max-width: 420px;
        padding: 36px;
    }
    
    .ready-form-container {
        max-width: 450px;
        padding: 28px;
    }
    
    .ready-section .section-title {
        font-size: 40px;
    }
    
    .ready-description {
        font-size: 18px;
    }
}

@media (max-width: 768px) {
    .offer-section,
    .ready-section {
        padding: 80px 0;
    }
    
    .offer-content {
        padding: 0 var(--container-padding-mobile);
    }
    
    /* Дополнительная адаптивность для offer-section */
    .pricing-card-wrapper {
        margin-top: 40px;
    }
    
    .pricing-card-single {
        max-width: 100%;
        padding: 32px;
    }
    
    .offer-section .section-title {
        font-size: 40px;
    }
    
    .offer-section .section-subtitle {
        font-size: 20px;
    }
    
    .ready-section-content {
        padding: 0 var(--container-padding-mobile);
    }
    
    .ready-content {
        display: flex;
        flex-direction: column;
        gap: 30px;
    }
    
    .ready-right {
        margin-top: 0;
        order: 2;
    }
    
    .ready-left {
        order: 1;
        padding-right: 0;
        padding-left: 0;
    }
    
    .ready-section .section-title,
    .ready-description,
    .ready-subtitle,
    .ready-experts {
        padding-left: 0;
    }
    
    .ready-section .section-title {
        padding-left: 0;
    }
    
    .ready-description {
        padding-left: 0;
    }
    
    .ready-subtitle {
        padding-left: 0;
    }
    
    .ready-experts {
        padding-left: 0;
    }
    
    .ready-experts-list {
        grid-template-columns: 1fr;
        gap: 8px;
    }
    
    /* Обновляем отрицательные margin для mobile */
    .section-title,
    .section-header,
    .section-subtitle-wrapper,
    .bento-content .section-subtitle {
        margin-left: calc(-1 * var(--container-padding-mobile)) !important;
    }
    
    .offer-section .section-header {
        margin-bottom: 60px;
    }
    
    .offer-section .section-title,
    .ready-section .section-title {
        font-size: 52px;
    }
    
    .offer-section .section-subtitle {
        font-size: 20px;
    }
    
    .pricing-card-wrapper {
        margin-top: 60px;
    }
    
    .pricing-card-single {
        padding: 28px;
        max-width: none;
    }
    
    .offer-section .section-subtitle {
        width: 100%;
    }
    
    .price-amount {
        font-size: 36px;
    }
    
    .price-period {
        font-size: 18px;
    }
    
    .benefits-title {
        font-size: 18px;
        margin-bottom: 20px;
    }
    
    .benefits-grid {
        gap: 14px;
        margin-bottom: 24px;
    }
    
    .ready-section .section-title {
        font-size: 48px;
    }
    
    .ready-header {
        margin-bottom: 40px;
    }
    
    .ready-form-container {
        padding: 24px;
        max-width: none;
    }
}

@media (max-width: 480px) {
    .offer-section,
    .ready-section {
        padding: 60px 0;
    }
    
    .offer-section .section-title,
    .ready-section .section-title {
        font-size: 32px;
    }
    
    .offer-section .section-subtitle {
        font-size: 16px;
        line-height: 1.4;
    }
    
    .pricing-card-single {
        padding: 24px;
        margin: 0 10px;
    }
    
    .pricing-card-wrapper {
        margin-top: 30px;
        padding: 0 10px;
    }
    
    .offer-section .section-subtitle {
        width: 100%;
    }
    
    .price-amount {
        font-size: 32px;
    }
    
    .price-period {
        font-size: 16px;
    }
    
    .price-details {
        font-size: 14px;
    }
    
    .benefits-title {
        font-size: 16px;
        margin-bottom: 16px;
    }
    
        .benefit-text {
        font-size: 15px;
    }

    .ready-section .section-title {
        font-size: 28px;
    }
    
    .ready-header {
        margin-bottom: 32px;
    }
    
    .ready-form-container {
        padding: 24px;
    }
    
    .ready-form-input {
        padding: 14px 16px;
        font-size: 15px;
    }
    
    .ready-form-submit {
        padding: 16px 24px;
        font-size: 15px;
    }
    
    .ready-privacy-text {
        font-size: 13px;
    }
} 

/* CTA секция */
.offer-cta {
    margin-top: 20px;
}

.offer-cta .cta-button {
    background: #145BDE;
    color: #ffffff;
    border: none;
    padding: 18px 36px;
    font-size: 18px;
    font-weight: 600;
    font-family: 'Gilroy', sans-serif;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    letter-spacing: 0.5px;
    box-shadow: 0 2px 8px rgba(20, 91, 222, 0.2);
    min-width: 200px;
}

.offer-cta .cta-button:hover {
    background: #0F4BC7;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(20, 91, 222, 0.4);
}

.offer-cta .cta-button:active {
    background: #0D3F9F;
    transform: translateY(0);
    box-shadow: 0 2px 6px rgba(20, 91, 222, 0.4);
}

/* Анимации появления */

.third-section .section-title {
    padding-left: 120px;
}

/* Исправление для третьего блока на экранах 1200 и меньше в медиа-запросе выше */

.white-title {
    color: #FFFFFF !important;
}

/* Футер */
.footer-section {
    background: linear-gradient(135deg, #374151 0%, #111827 100%);
    padding: 40px 0;
    position: relative;
    overflow: hidden;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(circle at 20% 20%, rgba(20, 91, 222, 0.05) 0%, transparent 50%),
        radial-gradient(circle at 80% 80%, rgba(59, 130, 246, 0.05) 0%, transparent 50%);
    pointer-events: none;
}

.footer-content {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-desktop);
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 40px;
    position: relative;
}

.footer-left {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding-left: 60px;
    transform: translateY(-15px);
}

.footer-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 12px;
    justify-content: flex-end;
    transform: translateY(-15px);
}

.footer-company-name {
    font-family: 'Gilroy', sans-serif;
    font-size: 18px;
    font-weight: 600;
    color: #ffffff;
    line-height: 1.4;
    margin: -4px 0 8px 0;
    max-width: 400px;
}

.footer-details {
    display: flex;
    flex-direction: column;
    gap: 4px;
    transform: translateY(15px);
}

.footer-details p {
    font-family: 'Gilroy', sans-serif;
    font-size: 14px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.8) !important;
    line-height: 1.4;
    margin: 0;
}

/* Принудительно отключаем автоматическое распознавание ссылок */
.footer-details p *,
.footer-details p a,
.footer-details p span {
    color: rgba(255, 255, 255, 0.8) !important;
    text-decoration: none !important;
    border: none !important;
    background: none !important;
    pointer-events: none !important;
}

.footer-contact {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 12px;
}

.footer-phone {
    font-family: 'Gilroy', sans-serif;
    font-size: 28px;
    font-weight: 600;
    color: #ffffff;
    text-decoration: none;
    transition: all 0.3s ease;
    letter-spacing: 0.3px;
    margin-top: -6px;
    line-height: 1.2;
}

.footer-phone:hover {
    color: #2563EB;
}

.footer-links {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 4px;
}

.footer-link {
    font-family: 'Gilroy', sans-serif;
    font-size: 14px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    transition: all 0.3s ease;
    line-height: 1.4;
}

.footer-link:hover {
    color: #ffffff;
    text-decoration: underline;
}

.footer-link:first-child {
    margin-bottom: 4px;
    transform: translateY(19px);
}

.footer-link:last-child {
    margin-bottom: -2px;
    transform: translateY(15px);
}



@media (max-width: 768px) {
    .footer-section {
        padding: 60px 0 40px 0;
    }
    
    .footer-content {
        grid-template-columns: 1fr;
        gap: 40px;
        padding: 0 var(--container-padding-mobile);
    }
    
    .footer-right {
        align-items: flex-start;
        gap: 24px;
    }
    
    .footer-contact {
        align-items: flex-start;
        gap: 16px;
    }
    
    .footer-phone {
        font-size: 18px;
    }
    
    .footer-company-name {
        font-size: 16px;
    }
    
    .footer-links {
        align-items: flex-start;
    }
    
    .footer-details p {
        font-size: 15px;
    }
}

@media (max-width: 480px) {
    .footer-section {
        padding: 40px 0 32px 0;
    }
    
    .footer-content {
        gap: 32px;
    }
    
    .footer-left {
        gap: 16px;
    }
    
    .footer-right {
        gap: 20px;
    }
    
    .footer-phone {
        font-size: 17px;
    }
    
    .footer-company-name {
        font-size: 15px;
        line-height: 1.5;
    }
    
    .footer-details p {
        font-size: 14px;
    }
    
    .footer-link {
        font-size: 14px;
    }
}

/* Попап стили в стиле Liquid Glass */
.popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10000;
    opacity: 0;
    visibility: hidden;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

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

.popup-container {
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.25) 0%, 
        rgba(255, 255, 255, 0.15) 50%, 
        rgba(255, 255, 255, 0.1) 100%);
    border: 1px solid rgba(255, 255, 255, 0.3);
    backdrop-filter: blur(30px) saturate(180%);
    -webkit-backdrop-filter: blur(30px) saturate(180%);
    border-radius: 20px;
    box-shadow: 
        0 20px 40px rgba(0, 0, 0, 0.15),
        0 8px 32px rgba(0, 0, 0, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.4);
    max-width: 480px;
    width: 90%;
    max-height: 90vh;
    overflow-y: auto;
    position: relative;
    transform: scale(0.9) translateY(30px);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.popup-active .popup-container {
    transform: scale(1) translateY(0);
}

.popup-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 32px 32px 32px 32px;
    margin-bottom: 0;
}

.popup-title {
    font-family: 'Unbounded', sans-serif;
    font-size: 24px;
    font-weight: 600;
    color: #ffffff;
    margin: 0;
}

.popup-close {
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.15) 0%, 
        rgba(255, 255, 255, 0.1) 100%);
    border: 1px solid rgba(255, 255, 255, 0.2);
    cursor: pointer;
    padding: 8px;
    border-radius: 10px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    color: rgba(255, 255, 255, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 
        0 4px 12px rgba(0, 0, 0, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.popup-close:hover {
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.25) 0%, 
        rgba(255, 255, 255, 0.15) 100%);
    color: #ffffff;
    transform: translateY(-1px);
    box-shadow: 
        0 6px 16px rgba(0, 0, 0, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.4);
}

.popup-content {
    padding: 0 32px 32px 32px;
}

.popup-subtitle {
    font-family: 'Gilroy', sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.8);
    line-height: 1.5;
    margin: 0 0 32px 0;
    text-align: left;
}

.popup-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.popup-form-group {
    margin: 0;
}

.popup-form-input {
    width: 100%;
    padding: 16px 20px;
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.15) 0%, 
        rgba(255, 255, 255, 0.1) 100%);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 12px;
    color: #ffffff;
    font-family: 'Gilroy', sans-serif;
    font-size: 16px;
    font-weight: 400;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-sizing: border-box;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 
        0 4px 12px rgba(0, 0, 0, 0.05),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
    outline: none;
}

.popup-form-input::placeholder {
    color: rgba(255, 255, 255, 0.6);
}

.popup-form-input:focus {
    outline: none;
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.25) 0%, 
        rgba(255, 255, 255, 0.15) 100%);
    border: 1px solid rgba(37, 99, 235, 0.4);
    box-shadow: 
        0 6px 16px rgba(0, 0, 0, 0.1),
        0 0 0 3px rgba(37, 99, 235, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.4);
}

.popup-form-checkbox {
    margin: 8px 0;
}

.popup-checkbox-label {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    cursor: pointer;
    font-family: 'Gilroy', sans-serif;
    font-size: 14px;
    line-height: 1.4;
}

.popup-checkbox-input {
    display: none;
}

.popup-checkbox-custom {
    width: 20px;
    height: 20px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 6px;
    position: relative;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    margin-top: 2px;
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.1) 0%, 
        rgba(255, 255, 255, 0.05) 100%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 
        0 2px 8px rgba(0, 0, 0, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.popup-checkbox-input:checked + .popup-checkbox-custom {
    background: linear-gradient(135deg, #2563EB 0%, #145BDE 100%);
    border-color: #145BDE;
    box-shadow: 
        0 4px 12px rgba(37, 99, 235, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.popup-checkbox-input:checked + .popup-checkbox-custom::after {
    content: '✓';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #ffffff;
    font-size: 12px;
    font-weight: bold;
}

.popup-checkbox-text {
    color: rgba(255, 255, 255, 0.8);
    flex: 1;
}

.popup-privacy-link {
    color: #145BDE;
    text-decoration: none;
    transition: color 0.3s ease;
}

.popup-privacy-link:hover {
    color: #0F4BC7;
    text-decoration: underline;
}

.popup-form-submit {
    background: linear-gradient(135deg, #2563EB 0%, #145BDE 100%);
    color: #ffffff;
    border: none;
    padding: 18px 32px;
    font-size: 16px;
    font-weight: 600;
    font-family: 'Gilroy', sans-serif;
    border-radius: 12px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    letter-spacing: 0.5px;
    margin-top: 8px;
    box-shadow: 
        0 8px 32px rgba(37, 99, 235, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
    text-align: center;
    width: 100%;
}

.popup-form-submit::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, 
        transparent, 
        rgba(255, 255, 255, 0.2), 
        transparent);
    transition: left 0.6s ease;
    z-index: 1;
}

.popup-form-submit:hover {
    background: linear-gradient(135deg, #1D4ED8 0%, #1E40AF 100%);
    transform: translateY(-2px);
    box-shadow: 
        0 12px 40px rgba(37, 99, 235, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.popup-form-submit:hover::before {
    left: 100%;
}

.popup-form-submit:active {
    background: linear-gradient(135deg, #1E40AF 0%, #1E3A8A 100%);
    transform: translateY(0);
    box-shadow: 
        0 6px 24px rgba(37, 99, 235, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.popup-privacy-text {
    font-family: 'Gilroy', sans-serif;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.6);
    text-align: left;
    margin: 16px 0 0 0;
    line-height: 1.4;
}

.popup-privacy-link {
    color: #3B82F6;
    text-decoration: none;
    transition: color 0.3s ease;
}

.popup-privacy-link:hover {
    color: #60A5FA;
    text-decoration: underline;
}

/* Адаптивность попапа */
/* Адаптив для попапа на разрешениях 1080px и меньше */
@media (max-width: 1080px) {
    .popup-container {
        max-width: 380px;
        width: 80%;
        max-height: 70vh;
        margin: 15px auto;
    }
    
    .popup-header {
        padding: 20px 24px 16px 24px;
    }
    
    .popup-title {
        font-size: 20px;
        line-height: 1.2;
    }
    
    .popup-content {
        padding: 0 24px 24px 24px;
    }
    
    .popup-subtitle {
        font-size: 14px;
        margin-bottom: 20px;
        line-height: 1.4;
        text-wrap: balance;
        hyphens: auto;
        word-break: break-word;
        overflow-wrap: break-word;
    }
    
    .popup-form {
        gap: 16px;
    }
    
    .popup-form-input {
        padding: 12px 16px;
        font-size: 14px;
    }
    
    .popup-form-submit {
        padding: 14px 24px;
        font-size: 14px;
        margin-top: 8px;
    }
    
    .popup-privacy-text {
        font-size: 12px;
        margin-top: 12px;
        line-height: 1.3;
    }
}

@media (max-width: 768px) {
    .popup-container {
        max-width: 95%;
        margin: 20px;
    }
    
    .popup-header {
        padding: 24px 24px 0 24px;
        margin-bottom: 24px;
    }
    
    .popup-title {
        font-size: 20px;
    }
    
    .popup-content {
        padding: 0 24px 24px 24px;
    }
    
    .popup-subtitle {
        font-size: 15px;
        margin-bottom: 24px;
        text-wrap: balance;
        hyphens: auto;
        word-break: break-word;
        overflow-wrap: break-word;
    }
    
    .popup-form-input {
        padding: 14px 16px;
        font-size: 15px;
    }
    
    .popup-form-submit {
        padding: 16px 24px;
        font-size: 15px;
    }
}

/* Уведомление о куки в стиле Liquid Glass */
.cookie-notification {
    position: fixed;
    bottom: 20px;
    right: -400px;
    max-width: 380px;
    width: 380px;
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.25) 0%, 
        rgba(255, 255, 255, 0.15) 50%, 
        rgba(255, 255, 255, 0.1) 100%);
    border: 1px solid rgba(255, 255, 255, 0.3);
    backdrop-filter: blur(30px) saturate(180%);
    -webkit-backdrop-filter: blur(30px) saturate(180%);
    border-radius: 20px;
    z-index: 9999;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    opacity: 0;
    transform: translateX(100%);
    box-shadow: none;
}

.cookie-notification.cookie-show {
    right: 20px;
    opacity: 1;
    transform: translateX(0);
}

.cookie-content {
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.cookie-text p {
    font-family: 'Gilroy', sans-serif;
    font-size: 14px;
    font-weight: 400;
    color: #191925;
    line-height: 1.5;
    margin: 0;
}

.cookie-link {
    color: #2563EB;
    text-decoration: none;
    transition: all 0.3s ease;
}

.cookie-link:hover {
    color: #1d4ed8;
    text-decoration: underline;
}

.cookie-actions {
    display: flex;
    gap: 12px;
    align-items: center;
}

.cookie-accept {
    background: linear-gradient(135deg, #2563EB 0%, #145BDE 100%);
    color: #ffffff;
    border: none;
    padding: 12px 24px;
    border-radius: 12px;
    font-family: 'Gilroy', sans-serif;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    flex: 1;
    position: relative;
    overflow: hidden;
}

.cookie-accept::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, 
        transparent, 
        rgba(255, 255, 255, 0.2), 
        transparent);
    transition: left 0.6s ease;
    z-index: 1;
}

.cookie-accept:hover {
    background: linear-gradient(135deg, #1D4ED8 0%, #1E40AF 100%);
    transform: translateY(-2px);
}

.cookie-accept:hover::before {
    left: 100%;
}

.cookie-decline {
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.15) 0%, 
        rgba(255, 255, 255, 0.1) 100%);
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: #191925;
    padding: 12px 24px;
    border-radius: 12px;
    font-family: 'Gilroy', sans-serif;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    flex: 1;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.cookie-decline:hover {
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.25) 0%, 
        rgba(255, 255, 255, 0.15) 100%);
    color: #191925;
    border-color: rgba(255, 255, 255, 0.4);
    transform: translateY(-1px);
}

/* Кастомная валидация форм */
.form-field-error {
    position: relative;
}

.form-field-error input {
    border: 1px solid #ef4444 !important;
    background: rgba(239, 68, 68, 0.1) !important;
}

.custom-error-tooltip {
    position: absolute;
    top: -45px;
    left: 0;
    background: rgba(239, 68, 68, 0.95);
    color: #ffffff;
    padding: 8px 12px;
    border-radius: 8px;
    font-family: 'Gilroy', sans-serif;
    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;
    z-index: 1000;
    opacity: 0;
    transform: translateY(5px);
    transition: all 0.3s ease;
    pointer-events: none;
}

.custom-error-tooltip::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 12px;
    border: 5px solid transparent;
    border-top-color: rgba(239, 68, 68, 0.95);
}

.custom-error-tooltip.show {
    opacity: 1;
    transform: translateY(0);
}

@media (max-width: 768px) {
    .cookie-notification {
        bottom: 16px;
        right: -100%;
        left: 16px;
        width: auto;
        max-width: none;
    }
    
    .cookie-notification.cookie-show {
        right: 16px;
    }
    
    .cookie-content {
        padding: 20px;
        gap: 16px;
    }
    
    .cookie-actions {
        flex-direction: column;
        gap: 8px;
    }
    
    .cookie-accept,
    .cookie-decline {
        width: 100%;
        text-align: center;
    }
}

@media (max-width: 480px) {
    .cookie-notification {
        left: 12px;
        right: -100%;
        bottom: 12px;
        width: auto;
    }
    
    .cookie-notification.cookie-show {
        right: 12px;
    }
    
    .cookie-content {
        padding: 16px;
    }
    
    .cookie-text p {
        font-size: 13px;
    }
}





@media (max-width: 1024px) and (min-width: 769px) {
  /* Контейнер */
  .container {
    padding: 0 35px !important;
  }
  
  /* Блок готовы начать - выравнивание по левой направляющей (35px) */
  .ready-section-content {
    padding-left: 35px !important;
    margin-left: 0 !important;
    }

  .ready-header {
    padding-left: 0 !important;
    margin-left: 0 !important;
    }

  .ready-section .section-title {
    padding-left: 0 !important;
    margin-left: 0 !important;
    text-align: left !important;
}
  
  .ready-form-container {
    padding: 32px !important;
    margin-left: 0 !important;
  }
  
  /* Блок мы предлагаем - выравнивание по левой направляющей (35px) */
  .offer-content {
    padding-left: 35px !important;
    margin-left: 0 !important;
  }
  
  .offer-section .section-header {
    padding-left: 0 !important;
    margin-left: 0 !important;
}
  

  
.offer-section .section-subtitle {
    padding-left: 0 !important;
    margin-left: 0 !important;
    text-align: left !important;
    font-size: 18px !important;
}
  
  .pricing-card-wrapper {
    padding-left: 0 !important;
    margin-left: 0 !important;
  }
  
  .pricing-card-single {
        margin-left: 0 !important;
    padding: 24px !important;
    }
  
  /* Заголовок как работает AI-ассистент - выравнивание по линии с карточками (60px) */
  .how-it-works-section .section-title {
        padding-left: 60px !important;
        margin-left: 0 !important;
    }
  
  /* Восстановление отступов для содержимого timeline карточек */
  .timeline-container {
    padding: 0 35px !important;
    margin: 0 !important;
    }
  
  .timeline-content {
    padding: 30px !important;
    }
  
  .step-tag {
    margin-bottom: 20px !important;
    padding: 8px 16px !important;
    }
  
  .timeline-title {
    margin-bottom: 12px !important;
  }
  
  .timeline-description {
    margin: 0 !important;
  }
  
  /* Блок "Ключевые возможности" - полная адаптация для 769-1024px */
  .third-section {
    padding: 0 !important;
  }
  
  .capabilities-content {
    padding: 0 35px !important;
    max-width: none !important;
  }
  
  .capabilities-list {
    margin: 0 !important;
    padding: 0 35px !important;
  }
  
  .capability-item {
    margin: 0 0 24px 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 24px !important;
    box-sizing: border-box !important;
    background: rgba(255, 255, 255, 0.05) !important;
    border-radius: 16px !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    outline: none !important;
  }
  
  /* Убираем все возможные розовые линии и outline для плашек */
  .capability-item *,
  .capability-item::before,
  .capability-item::after {
    outline: none !important;
    border: none !important;
    box-shadow: none !important;
  }
  
  /* Дополнительное переопределение для устранения розовых пунктирных линий */
  .third-section .capability-item {
    outline: none !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
  }
  
  /* Блок виды ассистентов - карточки от направляющей до направляющей */
  .implementation-examples {
        margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  
  .implementation-title {
    padding-left: 35px !important;
    margin-left: 0 !important;
    font-size: 32px !important;
    }
  
  .examples-grid {
    margin-left: -35px !important;
    margin-right: -35px !important;
    width: calc(100% + 70px) !important;
    padding-left: 35px !important;
    padding-right: 35px !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 16px !important;
    justify-content: flex-start !important;
    box-sizing: border-box !important;
  }
  
  .example-card {
    margin-left: 0 !important;
    margin-right: 0 !important;
    flex: 1 1 calc(50% - 16px) !important;
    max-width: calc(50% - 16px) !important;
    min-width: 280px !important;
    padding: 20px !important;
    box-sizing: border-box !important;
    }
  
  .example-card:first-child {
    margin-left: 0 !important;
  }
  
  .example-card:last-child {
    margin-right: 0 !important;
  }
  
  .card-image {
    height: 160px !important;
    }
  
  .example-title {
    font-size: 18px !important;
  }
  
  .example-description {
    font-size: 16px !important;
  }
  
  .example-cta-button {
    padding: 12px 20px !important;
    font-size: 16px !important;
    }
  
  /* Красные направляющие линии для диапазона 769-1024px */
  body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 35px;
    width: 2px;
    height: 100vh;
    background: #ff0000;
    z-index: 9999;
    pointer-events: none;
  }
  
  body::after {
    content: '';
    position: fixed;
    top: 0;
    right: 35px;
    width: 2px;
    height: 100vh;
    background: #ff0000;
    z-index: 9999;
    pointer-events: none;
  }
}









@media (max-width: 1024px) and (min-width: 769px) {
    .offer-tasks-list {
        display: flex;
        flex-direction: column;
        gap: 40px;
        align-items: flex-start !important;
        width: 100%;
        margin: 0 !important;
        max-width: 700px;
        padding-left: 40px !important;
    }
    .offer-task-item {
        text-align: left !important;
        margin-left: 0 !important;
        padding-left: 0 !important;
    }
}

@media (max-width: 1024px) and (min-width: 769px) {
    .tasks-timeline {
        padding-left: 100px !important;
        padding-right: 100px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        max-width: 100% !important;
        text-align: left !important;
    }
    .tasks-section .section-title {
        padding-left: 30px !important;
        margin-left: 0 !important;
    }
    .task-item {
        padding: 0 0 32px 0 !important;
        margin: 0 !important;
        max-width: 100% !important;
        background: none !important;
        border: none !important;
        box-shadow: none !important;
        align-items: flex-start !important;
        text-align: left !important;
    }
    .task-tag {
        display: flex !important;
        align-items: center !important;
        background: #232b3a !important;
        border-radius: 16px !important;
        padding: 8px 24px !important;
        margin-bottom: 12px !important;
        gap: 16px !important;
        width: fit-content !important;
    }
    .task-number {
        color: #3A72E8 !important;
        font-size: 20px !important;
        font-weight: 700 !important;
        margin: 0 !important;
        background: none !important;
        padding: 0 !important;
    }
    .task-title {
        color: #fff !important;
        font-size: 20px !important;
        font-weight: 700 !important;
        margin: 0 !important;
        background: none !important;
        padding: 0 !important;
    }
    .task-description {
        color: #fff !important;
        font-size: 16px !important;
        margin: 0 !important;
        padding: 0 !important;
        max-width: 100% !important;
    }
    .task-item:not(:last-child)::after {
        content: '' !important;
        display: block !important;
        width: 100% !important;
        height: 1px !important;
        background: #3A72E8 !important;
        margin: 24px 0 0 0 !important;
        position: static !important;
    }
}

@media (max-width: 1024px) and (min-width: 769px) {
    /* Удаляю все старые стили для блока 'какие задачи решает' */
    .tasks-timeline, .task-item {
        all: unset !important;
        display: revert !important;
    }
}

@media (max-width: 1024px) and (min-width: 769px) {
    .task-description {
        color: #6B7280 !important;
    }
    .task-item:not(:last-child)::after {
        content: '' !important;
        display: block !important;
        width: 100% !important;
        height: 1px !important;
        background: #3A72E8 !important;
        margin: 24px 0 0 0 !important;
        position: static !important;
    }
}

@media (max-width: 1024px) and (min-width: 769px) {
    .task-title, .task-number, .task-description {
        color: #fff !important;
        background: none !important;
        opacity: 1 !important;
        filter: none !important;
    }
    .task-item:not(:last-child)::after {
        content: '' !important;
        display: block !important;
        width: 100% !important;
        height: 1px !important;
        background: #3A72E8 !important;
        background-image: none !important;
        position: static !important;
        left: auto !important;
        right: auto !important;
        transform: none !important;
        margin: 24px 0 0 0 !important;
    }
}



@media (max-width: 1024px) and (min-width: 769px) {
  /* Растягиваем плашки timeline на полную ширину без padding */
  .timeline-container {
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
    gap: 32px !important;
  }
  
  .timeline-content {
    padding: 24px 35px !important;
    max-width: 100% !important;
    text-align: left !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  
  .step-tag {
    margin-bottom: 20px !important;
    padding: 8px 16px !important;
  }
  
  .timeline-title {
    margin-bottom: 12px !important;
    max-width: 100% !important;
    text-align: left !important;
  }
  
  .timeline-description {
    margin: 0 !important;
    max-width: 100% !important;
    text-align: left !important;
    line-height: 1.5 !important;
  }
}

@media (max-width: 1024px) and (min-width: 769px) {
  /* Верхний padding для блоков с 3-го по последний */
  .third-section,
  .how-it-works-section,
  .tasks-section,
  .offer-section,
  .ready-section,
  .footer-section {
    padding-top: 80px !important;
  }
  
  /* Блок готовы начать - выравнивание по левой направляющей (35px) */
  .ready-section-content {
    padding-left: 35px !important;
    margin-left: 0 !important;
  }
  
  .ready-header {
    padding-left: 0 !important;
    margin-left: 0 !important;
  }
  
  .ready-section .section-title {
    padding-left: 0 !important;
    margin-left: 0 !important;
    text-align: left !important;
  }
  
  .ready-form-container {
    padding: 32px !important;
    margin-left: 0 !important;
  }
  
  /* Блок мы предлагаем - выравнивание по левой направляющей (35px) */
  .offer-content {
    padding-left: 35px !important;
    margin-left: 0 !important;
  }
  
  .offer-section .section-header {
    padding-left: 0 !important;
    margin-left: 0 !important;
  }
  
  .offer-section .section-title {
    padding-left: 0 !important;
    margin-left: 0 !important;
    margin-bottom: 0 !important;
    text-align: left !important;
  }
  
  .offer-section .section-subtitle {
    padding-left: 0 !important;
    margin-left: 0 !important;
    margin-top: 20px !important;
    text-align: left !important;
  }
  
    .pricing-card-wrapper {
    padding-left: 0 !important;
    margin-left: 0 !important;
    margin-top: -40px !important;
  }

  .pricing-card-single {
    margin-left: 0 !important;
  }
  
  /* Заголовок как работает AI-ассистент - выравнивание по линии с карточками (60px) */
  .how-it-works-section .section-title {
    padding-left: 60px !important;
    margin-left: 0 !important;
  }
  

  
  /* Блок ключевые возможности - выравнивание по направляющим */
  .third-section .section-title {
    padding-left: 30px !important;
    margin-left: 0 !important;
  }
  
  /* Исключение для диапазона 481-640px */
  @media (max-width: 640px) and (min-width: 481px) {
    .third-section .section-title {
      padding-left: 40px !important;
      font-size: 32px !important;
    }
    
    .implementation-title {
      padding-left: 40px !important;
      font-size: 32px !important;
    }
  }
  
  /* Стили для блока "Ключевые возможности" уже определены выше */
  
  .implementation-examples {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  
  .implementation-title {
    padding-left: 35px !important;
    margin-left: 0 !important;
  }
  
  .examples-grid {
    margin-left: -35px !important;
    margin-right: -35px !important;
    width: calc(100% + 70px) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    display: flex !important;
    flex-direction: row !important;
    gap: 24px !important;
    box-sizing: border-box !important;
  }
  
  .example-card {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: calc(50% - 12px) !important;
    max-width: none !important;
    flex: 1 !important;
  }
  
  .example-card:first-child {
    margin-left: 0 !important;
  }
  
  .example-card:last-child {
    margin-right: 0 !important;
  }
  
  /* Блок кому будет полезен - выравнивание по направляющим */
  .second-section {
    padding-left: 35px !important;
    padding-right: 35px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  
  .second-section .bento-content {
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: none !important;
  }
  
  .second-section .section-title {
    margin-left: 0 !important;
    padding-left: 25px !important;
    text-align: left !important;
  }
  
  .business-problems {
    margin-left: -35px !important;
    margin-right: -35px !important;
    width: calc(100% + 70px) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    grid-template-rows: 1fr 1fr !important;
    gap: 24px !important;
    box-sizing: border-box !important;
    margin-top: 50px !important;
  }
  
  .problem-solution-card:nth-child(1) {
    grid-column: 1 / 2 !important;
    grid-row: 1 / 2 !important;
  }
  
  .problem-solution-card:nth-child(2) {
    grid-column: 2 / 3 !important;
    grid-row: 1 / 2 !important;
  }
  
  .problem-solution-card:nth-child(3) {
    grid-column: 1 / 2 !important;
    grid-row: 2 / 3 !important;
  }
  
  .problem-solution-card:nth-child(4) {
    grid-column: 2 / 3 !important;
    grid-row: 2 / 3 !important;
  }
  
  .problem-solution-card {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
    padding: 32px 24px !important;
  }
  
  .problem-solution-card:nth-child(odd) {
    margin-left: 0 !important;
  }
  
  .problem-solution-card:nth-child(even) {
    margin-right: 35px !important;
  }
  
  /* Выравнивание текста в синей карточке по левой границе текста черной карточки */
  .problem-solution-card:nth-child(1) .problem-title {
    margin-left: 0 !important;
    padding-left: 0 !important;
  }
  
  .problem-solution-card:nth-child(1) .solution-text {
    margin-left: 0 !important;
    padding-left: 0 !important;
  }
  
  .problem-solution-card:nth-child(1) .problem-section {
    padding: 24px 24px 16px 0px !important;
  }
  
  .problem-solution-card:nth-child(1) .solution-section {
    padding: 16px 24px 24px 0px !important;
  }
  
  .problem-solution-card:nth-child(2) .problem-section {
    padding: 24px 24px 16px 0px !important;
  }
  
  .problem-solution-card:nth-child(2) .solution-section {
    padding: 16px 24px 24px 0px !important;
  }

}

/* ===============================================
   АДАПТИВ ДЛЯ ДИАПАЗОНА 375-640px
   =============================================== */

@media (max-width: 640px) and (min-width: 481px) {
    /* Красные направляющие линии по всему лендингу */
    body::before {
        content: '';
        position: fixed;
        top: 0;
        left: 20px;
        width: 2px;
        height: 100vh;
        background: red;
        z-index: 9999;
        pointer-events: none;
    }

    body::after {
        content: '';
        position: fixed;
        top: 0;
        right: 20px;
        width: 2px;
        height: 100vh;
        background: red;
        z-index: 9999;
        pointer-events: none;
    }

    /* Hero Section - первый блок */
    .hero-section {
        min-height: 400px !important;
        padding: 0 !important;
    }

    .hero-section .container {
        padding: 140px 20px 60px !important;
        margin-top: -100px !important;
        margin-bottom: -40px !important;
    }

    .hero-section .content {
        min-height: 320px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;
        gap: 0 !important;
        padding: 0 !important;
    }

    .hero-section .text-content {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
    }

    .hero-section .main-title {
        font-size: 48px !important;
        line-height: 1.1 !important;
        margin-bottom: 12px !important;
        white-space: nowrap !important;
    }

    .hero-section .subtitle {
        font-size: 14px;
        line-height: 1.4 !important;
        margin-bottom: 20px !important;
        max-width: 320px !important;
    }

    .hero-section .line-separator {
        width: 280px !important;
        margin: 12px 0 20px 0 !important;
    }

    .hero-section .cta-button {
        font-size: 16px !important;
        padding: 16px 32px !important;
        margin-bottom: 12px !important;
    }

    .hero-section .cta-subtitle {
        font-size: 13px !important;
        margin-top: 12px !important;
    }

    /* Видео-персонаж */
    .hero-section .fullscreen-video-background {
        position: absolute !important;
        top: 20px !important;
        z-index: 1 !important;
        width: 100% !important;
        height: 100% !important;
        margin-top: 0 !important;
    }

    /* Блок "Кому будет полезен" */
    .second-section {
        padding: 80px 0 !important;
    }

    .second-section .container {
        padding: 0 !important;
    }

    .bento-content {
        padding: 0 !important;
    }

    .second-section .section-title {
        font-size: 32px !important;
        line-height: 1.2 !important;
        margin: 0 0 48px 0 !important;
        padding: 0 0 0 40px !important;
        text-align: left !important;
        font-family: 'Unbounded', sans-serif !important;
        font-weight: 500 !important;
        text-transform: uppercase !important;
        width: 100% !important;
        display: block !important;
        position: relative !important;
    }

    .business-problems {
        padding: 0 !important;
        margin: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 20px !important;
    }

    .problem-solution-card {
        margin-left: 20px !important;
        margin-right: 20px !important;
        padding: 28px !important;
        width: calc(100% - 40px) !important;
        max-width: calc(100% - 40px) !important;
        box-sizing: border-box !important;
        border-radius: 20px !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 16px !important;
    }

    /* Оригинальные цвета фонов карточек */
    .problem-solution-card:nth-child(1) {
        background: linear-gradient(135deg, #145BDE 0%, #1E6FFF 100%) !important;
        box-shadow: 0 4px 20px rgba(20, 91, 222, 0.15) !important;
    }

    .problem-solution-card:nth-child(2) {
        background: linear-gradient(135deg, #6B7280 0%, #4B5563 100%) !important;
        box-shadow: 0 4px 20px rgba(107, 114, 128, 0.15) !important;
    }

    .problem-solution-card:nth-child(3) {
        background: linear-gradient(135deg, #374151 0%, #111827 100%) !important;
        box-shadow: 0 4px 20px rgba(31, 41, 55, 0.15) !important;
    }

    .problem-solution-card:nth-child(4) {
        background: linear-gradient(135deg, #F9FAFB 0%, #E5E7EB 100%) !important;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06) !important;
    }

    .problem-solution-card .problem-title {
        font-size: 18px !important;
        line-height: 1.3 !important;
        margin-bottom: 12px !important;
    }

    /* Цвета заголовков для разных карточек */
    .problem-solution-card:nth-child(1) .problem-title {
        color: #FFFFFF !important;
    }

    .problem-solution-card:nth-child(2) .problem-title {
        color: #FFFFFF !important;
    }

    .problem-solution-card:nth-child(3) .problem-title {
        color: #FFFFFF !important;
    }

    .problem-solution-card:nth-child(4) .problem-title {
        color: #1F2937 !important;
    }

    .problem-solution-card .solution-text {
        font-size: 16px !important;
        line-height: 1.4 !important;
        margin: 0 !important;
    }

    /* Цвета текста решений для разных карточек */
    .problem-solution-card:nth-child(1) .solution-text {
        color: rgba(255, 255, 255, 0.8) !important;
    }

    .problem-solution-card:nth-child(2) .solution-text {
        color: rgba(255, 255, 255, 0.8) !important;
    }

    .problem-solution-card:nth-child(3) .solution-text {
        color: rgba(255, 255, 255, 0.8) !important;
    }

    .problem-solution-card:nth-child(4) .solution-text {
        color: #1F2937 !important;
    }

    /* Блок "Ключевые возможности" */
    /* Блок "Ключевые возможности" - выравнивание по направляющим */
    .third-section {
        padding: 80px 0 !important;
    }

    .third-section .container {
        padding: 0 20px !important;
    }

    .third-section .section-title {
        font-size: 32px !important;
        line-height: 1.2 !important;
        margin: 0 0 48px 0 !important;
        padding-left: 40px !important;
        text-align: left !important;
    }

    .capabilities-list {
        padding: 0 !important;
        margin: 0 !important;
    }

    .capability-item {
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding: 20px !important;
        min-height: 140px !important;
        position: relative !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: space-between !important;
    }

    .capability-number {
        position: absolute !important;
        top: 20px !important;
        right: 20px !important;
        font-size: 48px !important;
        font-weight: 700 !important;
        color: rgba(255, 255, 255, 0.9) !important;
        line-height: 1 !important;
    }

    .capability-content {
        margin-top: auto !important;
        padding-top: 50px !important;
    }

    .capability-title {
        font-size: 18px !important;
        font-weight: 600 !important;
        color: #FFFFFF !important;
        margin-bottom: 8px !important;
        line-height: 1.3 !important;
    }

    .capability-description {
        font-size: 16px !important;
        color: rgba(255, 255, 255, 0.7) !important;
        margin-bottom: 0 !important;
        line-height: 1.4 !important;
    }

    .implementation-title {
        font-size: 32px !important;
        line-height: 1.2 !important;
        margin: 0 0 48px 0 !important;
        padding-left: 40px !important;
    }

    .example-card {
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding: 28px !important;
    }

    .example-description {
        font-size: 16px !important;
    }

    /* Блок "Как работает" */
    /* Блок "Как работает AI-ассистент" - выравнивание по направляющим */
    .how-it-works-section {
        padding: 80px 0 !important;
    }

    .how-it-works-section .container {
        padding: 0 20px !important;
    }

    .how-it-works-section .section-title {
        font-size: 32px !important;
        line-height: 1.2 !important;
        margin-bottom: 48px !important;
        margin-left: 0 !important;
        text-align: left !important;
        padding-left: 20px !important;
    }

    .timeline-description {
        font-size: 16px !important;
    }

    .how-it-works-section .section-title .ai-text {
        display: inline !important;
    }

    .how-it-works-section .section-title {
        white-space: pre-line !important;
    }

    .timeline-container {
        padding: 0 !important;
        margin: 0 !important;
    }

    .timeline-content {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* Блок "Какие задачи решает" */
    .tasks-section {
        padding: 80px 0 !important;
    }

    .tasks-section .container {
        padding: 0 !important;
    }

    .tasks-section .section-title {
        font-size: 32px !important;
        line-height: 1.2 !important;
        margin: 0 0 48px 0 !important;
        padding: 0 0 0 20px !important;
        text-align: left !important;
    }

    .task-description {
        font-size: 16px !important;
    }

    /* Блок "Готовы начать" */
    .ready-section {
        padding: 80px 0 !important;
    }

    .ready-section .section-title {
        padding-left: 20px !important;
        font-size: 32px !important;
        line-height: 1.2 !important;
        margin-bottom: 32px !important;
    }

    .ready-content {
        padding: 0 !important;
        gap: 40px !important;
    }

    .ready-form-container {
        padding: 28px !important;
        border-radius: 20px !important;
    }

    /* Футер - выравнивание по направляющим */
    .footer-section {
        padding: 60px 0 !important;
    }

    .footer-content {
        padding-left: 20px !important;
        padding-right: 20px !important;
        gap: 32px !important;
        margin: 0 auto !important;
        max-width: 100% !important;
        width: 100% !important;
        box-sizing: border-box !important;
        display: flex !important;
        flex-direction: column !important;
    }

    .footer-left,
    .footer-right {
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* Блок "Мы предлагаем" */
    .offer-section {
        background: #EBEBE9 !important;
        padding: 80px 0 !important;
    }

    .offer-video-background {
        display: none !important;
    }

    .offer-content {
        padding: 0 20px !important;
    }

    .offer-section .section-header {
        margin: 0 !important;
        padding: 0 !important;
        margin-bottom: 40px !important;
    }

    .offer-section .section-title {
        font-family: 'Unbounded', sans-serif !important;
        font-weight: 500 !important;
        color: #191925 !important;
        font-size: 32px !important;
        line-height: 1.2 !important;
        margin: 0 0 16px 0 !important;
        padding: 0 !important;
        text-transform: uppercase !important;
        width: 100% !important;
        display: block !important;
    }

    .offer-section .section-subtitle {
        font-family: 'Gilroy', sans-serif !important;
        font-size: 16px !important;
        font-weight: 400 !important;
        color: #4B5563 !important;
        line-height: 1.4 !important;
        margin: 0 0 40px 0 !important;
        padding: 0 !important;
        width: 100% !important;
        display: block !important;
    }

    .pricing-card-wrapper {
        display: none !important;
    }

    .pricing-cards-wrapper {
        display: flex !important;
        flex-direction: column !important;
        gap: 16px !important;
        margin-left: -20px !important;
        margin-right: -20px !important;
        width: calc(100% + 40px) !important;
    }

    .pricing-card-price,
    .pricing-card-benefits {
        background: linear-gradient(135deg, rgba(55, 65, 81, 0.95) 0%, rgba(31, 41, 55, 0.95) 100%) !important;
        backdrop-filter: blur(20px) !important;
        border: 1px solid rgba(255, 255, 255, 0.1) !important;
        border-radius: 20px !important;
        padding: 24px !important;
        width: calc(100% - 40px) !important;
        margin-left: 20px !important;
        margin-right: 20px !important;
    }

    .benefit-text {
        font-size: 16px !important;
    }

    .ready-experts-list li {
        font-size: 16px !important;
    }
}

@media (max-width: 480px) and (min-width: 375px) {
    /* Блок "Кому будет полезен" - убираем левый и правый padding */
    .second-section {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .second-section .container {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .bento-content {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Заголовок блока "Кому будет полезен" */
    .second-section .section-title {
        font-size: 28px !important;
        line-height: 1.2 !important;
        margin: 0 0 40px 0 !important;
        padding: 0 0 0 35px !important;
        text-align: left !important;
        font-family: 'Unbounded', sans-serif !important;
        font-weight: 500 !important;
        text-transform: uppercase !important;
        width: 100% !important;
        display: block !important;
        position: relative !important;
    }

    /* Карточки в блоке "Кому будет полезен" - внешние отступы */
    .problem-solution-card {
        margin-left: 16px !important;
        margin-right: 16px !important;
    }

    /* Размер шрифта для карточек "Кому будет полезен" - 14px */
    .problem-solution-card .solution-text {
        font-size: 14px !important;
    }

    /* Блок "Какие задачи решает" */
    .tasks-section {
        padding: 60px 0 !important;
    }

    .tasks-section .container {
        padding: 0 !important;
    }

    .tasks-section .section-title {
        font-size: 28px !important;
        line-height: 1.2 !important;
        margin: 0 0 40px 0 !important;
        padding: 0 0 0 16px !important;
        text-align: left !important;
        font-family: 'Unbounded', sans-serif !important;
        font-weight: 500 !important;
        text-transform: uppercase !important;
        width: 100% !important;
        display: block !important;
        position: relative !important;
    }

    /* Сброс возможных конфликтующих стилей */
    .tasks-section .section-title[class*="section-title"] {
        padding-left: 16px !important;
    }

    .task-description {
        font-size: 14px !important;
    }
    /* Блок "Готовы начать" - выравнивание по направляющим */
    .ready-section {
        padding: 60px 0 !important;
    }

    .ready-section-content {
        padding: 0 !important;
    }

    .ready-section .section-title {
        padding-left: 16px !important;
        margin-left: 0 !important;
        font-size: 28px !important;
        line-height: 1.2 !important;
        text-align: left !important;
        margin-bottom: 24px !important;
    }

    .ready-content {
        display: flex !important;
        flex-direction: column !important;
        gap: 32px !important;
        padding: 0 16px !important;
    }

    .ready-left {
        width: 100% !important;
        padding: 0 !important;
    }

    .ready-description {
        font-size: 15px !important;
        line-height: 1.4 !important;
        margin-bottom: 24px !important;
        color: rgba(255, 255, 255, 0.8) !important;
    }

    .ready-experts {
        margin-bottom: 32px !important;
    }

    .ready-experts-title {
        font-size: 18px !important;
        line-height: 1.3 !important;
        margin-bottom: 16px !important;
        color: #FFFFFF !important;
    }

    .ready-experts-list {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
    }

    .ready-experts-list li {
        font-size: 14px !important;
        line-height: 1.4 !important;
        color: rgba(255, 255, 255, 0.8) !important;
    }

    .ready-right {
        width: 100% !important;
    }

    .ready-form-container {
        padding: 24px !important;
        background: rgba(255, 255, 255, 0.05) !important;
        border-radius: 16px !important;
        border: 1px solid rgba(255, 255, 255, 0.1) !important;
    }

    .ready-form {
        display: flex !important;
        flex-direction: column !important;
        gap: 16px !important;
    }

    .ready-form-input {
        padding: 14px 16px !important;
        font-size: 15px !important;
        border-radius: 12px !important;
    }

    .ready-form-submit {
        padding: 16px 24px !important;
        font-size: 15px !important;
        border-radius: 12px !important;
    }

    .ready-privacy-text {
        font-size: 12px !important;
        line-height: 1.4 !important;
        color: rgba(255, 255, 255, 0.6) !important;
    }
    /* Футер - выравнивание по направляющим */
    .footer-section {
        padding: 40px 0 !important;
    }

    .footer-content {
        padding-left: 16px !important;
        padding-right: 16px !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 24px !important;
    }

    .footer-left,
    .footer-right {
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .footer-company-name {
        font-size: 14px !important;
        line-height: 1.4 !important;
        margin-bottom: 12px !important;
    }

    .footer-details p {
        font-size: 12px !important;
        line-height: 1.4 !important;
        margin-bottom: 8px !important;
    }

    .footer-phone {
        font-size: 16px !important;
        margin-bottom: 16px !important;
    }

    .footer-links {
        display: flex !important;
        flex-direction: column !important;
        gap: 8px !important;
    }

    .footer-link {
        font-size: 12px !important;
        line-height: 1.4 !important;
    }
    /* Первый блок - выравнивание по направляющим */
    .hero-section {
        padding: 0 !important;
        margin: 0 !important;
        background: none !important;
        position: relative !important;
        height: auto !important;
        min-height: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }

    .hero-section .container {
        padding: 150px 16px 60px !important;
        margin-top: -120px !important;
        margin-bottom: -50px !important;
        max-width: none !important;
        position: relative !important;
        z-index: 1 !important;
    }

    .hero-section .content {
        padding-left: 0 !important;
        padding-right: 0 !important;
        text-align: left !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        min-height: 350px !important;
        justify-content: center !important;
    }

    .hero-section .text-content {
        padding-left: 0 !important;
        padding-right: 0 !important;
        text-align: left !important;
        width: 100% !important;
    }

    .hero-section .main-title {
        text-align: left !important;
        margin-left: 0 !important;
        padding-left: 0 !important;
        width: 100% !important;
        white-space: nowrap !important;
    }

    .hero-section .subtitle {
        text-align: left !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        margin-top: -200px !important;
        padding-top: 40px !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        width: 100% !important;
        max-width: 300px !important;
        font-size: 14px !important;
        line-height: 1.4 !important;
        white-space: normal !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
        display: block !important;
    }

    /* Принудительное отображение br тегов в подзаголовке */
    .hero-section .subtitle br {
        display: block !important;
        content: "" !important;
        margin: 0 !important;
        line-height: 1.4 !important;
    }

    .hero-section .line-separator {
        margin-left: 0 !important;
    }

    .hero-section .cta-button {
        text-align: center !important;
        margin-left: 0 !important;
        align-self: stretch !important;
        width: 100% !important;
        min-width: auto !important;
        padding: 12px 24px !important;
        white-space: nowrap !important;
        display: block !important;
    }

    .hero-section .cta-subtitle {
        text-align: left !important;
        margin-left: 0 !important;
        width: 100% !important;
    }

    /* Красные направляющие по краям карточек */
    body::before {
        content: '' !important;
        position: fixed !important;
        top: 0 !important;
        left: 16px !important;
        width: 2px !important;
        height: 100vh !important;
        background: red !important;
        z-index: 9999 !important;
        pointer-events: none !important;
    }

    body::after {
        content: '' !important;
        position: fixed !important;
        top: 0 !important;
        right: 16px !important;
        width: 2px !important;
        height: 100% !important;
        background: red !important;
        z-index: 9999 !important;
        pointer-events: none !important;
    }

    /* Блок "Мы предлагаем" */
    .offer-section {
        background: #EBEBE9 !important;
        padding: 60px 0 !important;
    }

    .offer-video-background {
        display: none !important;
    }

    .offer-content {
        padding: 0 16px !important;
    }

    /* Сброс возможных конфликтующих стилей */
    .offer-section .highlight-text,
    .offer-section .section-subtitle span,
    .offer-section .section-subtitle br {
        font-size: inherit !important;
    }

    .offer-section .section-header {
        margin: 0 !important;
        padding: 0 !important;
        margin-bottom: 40px !important;
    }

    .offer-section .section-title {
        font-family: 'Unbounded', sans-serif !important;
        font-weight: 500 !important;
        color: #191925 !important;
        font-size: 32px !important;
        line-height: 1.2 !important;
        margin: 0 0 16px 0 !important;
        padding: 0 !important;
        text-transform: uppercase !important;
        width: 100% !important;
        display: block !important;
    }

    .offer-section .section-subtitle {
        font-family: 'Gilroy', sans-serif !important;
        font-size: 15px !important;
        font-weight: 400 !important;
        color: #4B5563 !important;
        line-height: 1.4 !important;
        margin: 0 0 40px 0 !important;
        padding: 0 !important;
        width: 100% !important;
        display: block !important;
    }

    .pricing-card-wrapper {
        display: none !important;
    }

    .pricing-cards-wrapper {
        display: flex !important;
        flex-direction: column !important;
        gap: 16px !important;
        margin-left: -16px !important;
        margin-right: -16px !important;
        width: calc(100% + 32px) !important;
    }

    .pricing-card-price,
    .pricing-card-benefits {
        background: linear-gradient(135deg, rgba(55, 65, 81, 0.95) 0%, rgba(31, 41, 55, 0.95) 100%) !important;
        backdrop-filter: blur(20px) !important;
        border: 1px solid rgba(255, 255, 255, 0.1) !important;
        border-radius: 20px !important;
        padding: 24px !important;
        width: calc(100% - 32px) !important;
        margin-left: 16px !important;
        margin-right: 16px !important;
    }

    .card-tag {
        display: inline-block !important;
        padding: 4px 12px !important;
        background: rgba(255, 255, 255, 0.1) !important;
        border-radius: 100px !important;
        font-family: 'Gilroy', sans-serif !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        color: rgba(255, 255, 255, 0.9) !important;
        text-transform: uppercase !important;
        letter-spacing: 0.5px !important;
        margin-bottom: 20px !important;
    }

    .price-amount {
        font-family: 'Unbounded', sans-serif !important;
        font-size: 32px !important;
        font-weight: 500 !important;
        color: #FFFFFF !important;
        margin-bottom: 4px !important;
    }

    .price-period {
        font-family: 'Gilroy', sans-serif !important;
        font-size: 16px !important;
        font-weight: 400 !important;
        color: rgba(255, 255, 255, 0.6) !important;
    }

    .price-details {
        font-family: 'Gilroy', sans-serif !important;
        font-size: 14px !important;
        font-weight: 400 !important;
        color: rgba(255, 255, 255, 0.6) !important;
        margin-bottom: 24px !important;
    }

    .pricing-cta-button {
        width: 100% !important;
        padding: 16px 24px !important;
        background: #145BDE !important;
        border-radius: 12px !important;
        font-family: 'Gilroy', sans-serif !important;
        font-size: 16px !important;
        font-weight: 600 !important;
        color: #FFFFFF !important;
        border: none !important;
        cursor: pointer !important;
        transition: all 0.3s ease !important;
    }

    .benefits-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
    }

    .benefit-item {
        display: flex !important;
        gap: 12px !important;
        align-items: flex-start !important;
    }

    .benefit-icon {
        color: #2563EB !important;
    }

    .benefit-text {
        font-family: 'Gilroy', sans-serif !important;
        font-size: 15px !important;
        font-weight: 400 !important;
        color: rgba(255, 255, 255, 0.9) !important;
        line-height: 1.4 !important;
    }
}

.tasks-section .section-header {
    padding-left: 20px;
}

.pricing-card-price .section-tag,
.pricing-card-benefits .section-tag {
    background: rgba(255, 255, 255, 0.2);
    color: #FFFFFF;
    font-family: 'Unbounded', sans-serif;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 8px 16px;
    border-radius: 20px;
    display: inline-block;
    width: fit-content;
    white-space: nowrap;
    backdrop-filter: blur(10px);
    margin-bottom: 20px;
}

@media (max-width: 480px) and (min-width: 375px) {
    /* Блок "Как работает AI-ассистент" */
    .how-it-works-section {
        padding: 60px 0 !important;
    }

    .how-it-works-section .container {
        padding: 0 !important;
    }

    .how-it-works-section .section-title {
        font-size: 28px !important;
        line-height: 1.2 !important;
        margin: 0 0 40px 0 !important;
        padding: 0 0 0 35px !important;
        text-align: left !important;
        font-family: 'Unbounded', sans-serif !important;
        font-weight: 500 !important;
        text-transform: uppercase !important;
        width: 100% !important;
        display: block !important;
        position: relative !important;
        white-space: normal !important;
    }
    
    /* Принудительный перенос для "Как работает AI-ассистент" */
    .how-it-works-section .section-title .ai-text::before {
        content: "\A" !important;
        white-space: pre !important;
    }

    .timeline-description {
        font-size: 14px !important;
    }
}

/* Принудительное отображение br тегов в подзаголовке */
.hero-section .subtitle br {
    display: block !important;
    content: "" !important;
    margin: 0 !important;
    line-height: 1.4 !important;
}

/* Дополнительный стиль с максимальной специфичностью для переопределения конфликтующих стилей */
.hero-section .content .text-content .subtitle {
    text-align: left !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100% !important;
    max-width: 300px !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    white-space: normal !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    display: block !important;
    margin-bottom: 24px !important;
}

.hero-section .line-separator {
    margin-left: 0 !important;
}

.benefit-text {
    font-family: 'Gilroy', sans-serif !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    color: rgba(255, 255, 255, 0.9) !important;
    line-height: 1.4 !important;
}

/* Дополнительный стиль с максимальной специфичностью для subtitle */
.hero-section .container .content .text-content .subtitle {
    text-align: left !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100% !important;
    max-width: 300px !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    white-space: normal !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    display: block !important;
    margin-bottom: 24px !important;
}

/* Принудительное отображение br тегов в подзаголовке */
.hero-section .container .content .text-content .subtitle br {
    display: block !important;
    content: "" !important;
    margin: 0 !important;
    line-height: 1.4 !important;
    height: auto !important;
}

/* Принудительное отображение br тегов в подзаголовке */
.hero-section .container .content .text-content .subtitle br {
    display: block !important;
    content: "" !important;
    margin: 0 !important;
    line-height: 1.4 !important;
    height: auto !important;
}

/* Блок "Ключевые возможности" - выравнивание по направляющим */
.third-section {
    padding: 60px 0 !important;
}

.third-section .container {
    padding: 0 !important;
}

.capabilities-content {
    padding: 0 !important;
}

.third-section .section-title {
    font-size: 28px !important;
    line-height: 1.2 !important;
    margin: 0 0 40px 0 !important;
    padding: 0 0 0 40px !important;
    text-align: left !important;
    font-family: 'Unbounded', sans-serif !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    width: 100% !important;
    display: block !important;
    position: relative !important;
}

.capabilities-list {
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
}

.capability-item {
    margin-left: 16px !important;
    margin-right: 16px !important;
    padding: 24px !important;
    width: calc(100% - 32px) !important;
    max-width: calc(100% - 32px) !important;
    box-sizing: border-box !important;
}

.implementation-examples {
    padding: 0 !important;
    margin-top: 60px !important;
}

.implementation-title {
    font-size: 28px !important;
    line-height: 1.2 !important;
    margin: 0 0 40px 0 !important;
    padding: 0 0 0 40px !important;
    text-align: left !important;
    font-family: 'Unbounded', sans-serif !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    width: 100% !important;
    display: block !important;
}

.examples-grid {
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
}

    .example-card {
        margin-left: 16px !important;
        margin-right: 16px !important;
        padding: 24px !important;
        width: calc(100% - 32px) !important;
        max-width: calc(100% - 32px) !important;
        box-sizing: border-box !important;
    }

    /* Размер шрифта для описаний - 14px */


/* Финальный медиа-запрос с максимальной специфичностью для подзаголовка */
@media (max-width: 480px) and (min-width: 375px) {
  /* Родительские элементы - убираем ограничения */
  .hero-section .container .content .text-content {
    width: 100% !important;
    max-width: 100% !important;
    height: 65vh !important;
    white-space: normal !important;
    overflow: visible !important;
  }

  .hero-section .container .content {
    white-space: normal !important;
    overflow: visible !important;
  }

  .hero-section .container {
    overflow: visible !important;
  }

  /* Подзаголовок с максимальной специфичностью */
  .hero-section .container .content .text-content .subtitle {
    font-size: 12px !important;
    line-height: 1.4 !important;
    display: block !important;
    white-space: normal !important;
    text-align: left !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100% !important;
    max-width: 300px !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
    overflow: visible !important;
    margin-bottom: 24px !important;
  }

  .hero-section .container .content .text-content .subtitle br {
    display: block !important;
    content: "" !important;
    margin: 0 !important;
    line-height: 1.4 !important;
    height: auto !important;
    white-space: normal !important;
  }

  /* Изменения в hero-section для улучшения компоновки */
  .hero-section .line-separator {
    display: none !important;
  }

  .hero-section .cta-button {
    margin-top: 16px !important;
    margin-bottom: 8px !important;
  }

  .hero-section .cta-subtitle {
    margin-top: 8px !important;
    margin-bottom: 8px !important;
    text-align: left !important;
  }

  .hero-section .fullscreen-video-background {
    margin-top: 60px !important;
    overflow: visible !important;
    transform: translateX(-50%) scale(2.55) !important;
    max-width: 140% !important;
  }

  .hero-section {
    overflow: visible !important;
    min-height: auto !important;
  }

  /* Карточки ключевых возможностей - новое расположение элементов */
  .capability-item {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    align-items: flex-start !important;
    padding: 20px !important;
    min-height: 200px !important;
  }

  .capability-number {
    position: absolute !important;
    top: 20px !important;
    right: 16px !important;
    margin: 0 !important;
    text-align: right !important;
  }

  .capability-content {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-end !important;
    width: 100% !important;
    margin-top: auto !important;
  }

  .capability-title {
    text-align: left !important;
    margin-bottom: 8px !important;
  }

  .capability-description {
    text-align: left !important;
    margin: 0 !important;
    font-size: 14px !important;
  }

  /* Обеспечиваем правильное наложение слоев */
  .hero-section {
    position: relative !important;
    background: transparent !important;
    z-index: 1 !important;
  }

  .hero-section .fullscreen-video-background {
    position: absolute !important;
    top: 180px !important;
    z-index: 1 !important;
    width: 100% !important;
    height: 100% !important;
    margin-top: 0 !important;
    transform: translateX(-50%) scale(2.55) !important;
    max-width: 140% !important;
  }

  .hero-section .fullscreen-video {
    transform: scale(2.55) !important;
  }

  /* Увеличиваем максимальную высоту блока с видео */
  .hero-section .content {
    min-height: 350px !important;
    max-height: 450px !important;
    background: transparent !important;
    z-index: 2 !important;
    position: relative !important;
  }
}

/* Медиа-запрос для адаптации карточек в диапазоне 769-1024px */
@media (min-width: 769px) and (max-width: 1024px) {
  /* Блок Ключевые возможности - выравнивание по левой направляющей */
  .capabilities-list {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 16px !important;
    justify-content: flex-start !important;
    padding-left: 35px !important;
    padding-right: 35px !important;
    margin: 0 !important;
  }

  .capabilities-list .example-card {
    flex: 1 1 calc(50% - 16px) !important;
    max-width: calc(50% - 16px) !important;
    min-width: 280px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
  }

  /* Переопределяем конфликтующие стили для capability-item */
  .capability-item {
    margin: 0 0 24px 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 24px !important;
    box-sizing: border-box !important;
  }

  /* Размер шрифта описаний в плашках Ключевые возможности - 16px */
  .capability-item .capability-description {
    font-size: 16px !important;
  }

  /* Блок Виды ассистентов - 2 карточки в ряд по направляющим */
  .third-section .implementation-examples .examples-grid {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 16px !important;
    padding: 0 35px !important;
    margin: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    justify-content: space-between !important;
  }

  .third-section .implementation-examples .example-card {
    flex: 1 1 calc(50% - 8px) !important;
    max-width: calc(50% - 8px) !important;
    min-width: 280px !important;
    margin: 0 !important;
    padding: 24px !important;
    box-sizing: border-box !important;
  }

  /* Заголовок блока Виды ассистентов - левый отступ 96px и размер 32px */
  .third-section .implementation-examples .implementation-title {
    padding-left: 96px !important;
    margin-left: 0 !important;
    font-size: 32px !important;
  }

  /* Заголовок блока Ключевые возможности - левый отступ 96px и размер 32px */
  .third-section .section-title {
    padding-left: 96px !important;
    margin-left: 0 !important;
    font-size: 32px !important;
  }

  /* Заголовки карточек - размер 16px */
  .third-section .implementation-examples .example-title {
    font-size: 16px !important;
  }

  .third-section .implementation-examples .example-description {
    font-size: 16px !important;
  }

  /* Размер шрифта для списка результатов в блоке "Мы предлагаем" - 16px */
  .benefit-text {
    font-size: 16px !important;
  }
}

/* Скрытие всех направляющих линий */
body::before,
body::after {
    display: none !important;
}

/* МЕДИА-ЗАПРОС ДЛЯ ДИАПАЗОНА 320-374px - ПОЛНАЯ АДАПТАЦИЯ */
@media (min-width: 320px) and (max-width: 374px) {
    /* ХЕДЕР - убираем кнопку связаться и выравниваем бургер по правой стороне */
    .header-contact-btn {
        display: none !important;
    }
    
    .header {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        padding: 0 20px !important;
        box-sizing: border-box !important;
    }
    
    .header-logo {
        margin: 0 !important;
        padding: 0 !important;
    }
    
    .burger-menu {
        margin-left: auto !important;
        margin-right: 0 !important;
    }
    
    /* Убираем padding у первого блока */
    .hero-section {
        padding: 0 !important;
    }
    
    .hero-section .container {
        padding: 0 20px !important;
        margin: 0 !important;
    }
    
    .hero-section .content {
        padding: 0 !important;
        margin: 0 !important;
    }
    
    /* Адаптация текста в первом блоке */
    .hero-section .main-title {
        font-size: 32px !important;
        line-height: 1.1 !important;
        white-space: nowrap !important;
    }
    
    /* Подзаголовок - правильная адаптация */
    .hero-section .subtitle {
        position: relative !important;
        font-size: 0 !important;
        line-height: 0 !important;
        color: transparent !important;
        text-indent: -9999px !important;
        overflow: hidden !important;
    }
    
    .hero-section .subtitle::before {
        content: "Автоматизация общения\A и процессов с ИИ" !important;
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        font-size: 16px !important;
        line-height: 1.3 !important;
        white-space: pre-line !important;
        display: block !important;
        color: #333 !important;
        text-indent: 0 !important;
        width: 100% !important;
    }
    
    /* Полностью скрываем оригинальный контент */
    .hero-section .subtitle * {
        display: none !important;
    }
    
    /* Кнопка - опущена вниз секции и растянута от края до края */
    .hero-section {
        display: flex !important;
        flex-direction: column !important;
        justify-content: space-between !important;
        min-height: 100vh !important;
        padding-bottom: 40px !important;
    }
    
    .hero-section .container {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 !important;
        justify-content: space-between !important;
    }
    
    .hero-section .content {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 !important;
        justify-content: space-between !important;
    }
    
    .hero-section .text-content {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 !important;
        justify-content: space-between !important;
    }
    
    .hero-section .cta-button {
        font-size: 14px !important;
        padding: 12px 20px !important;
        white-space: nowrap !important;
        width: 100% !important;
        margin-top: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        text-align: center !important;
        align-self: stretch !important;
        order: 999 !important;
        min-width: auto !important;
        box-sizing: border-box !important;
    }
    
    .hero-section .cta-subtitle {
        display: none !important;
    }
    
    /* КАРТОЧКИ ВОЗМОЖНОСТЕЙ - принудительное исправление с максимальной специфичностью */
    .third-section .capabilities-list .capability-item {
        position: relative !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: flex-end !important;
        align-items: flex-start !important;
        padding: 20px !important;
        gap: 8px !important;
        text-align: left !important;
        min-height: 140px !important;
        box-sizing: border-box !important;
    }
    
    /* Цифра в верхнем правом углу - крупная и заметная */
    .third-section .capabilities-list .capability-item .capability-number {
        position: absolute !important;
        top: 20px !important;
        right: 20px !important;
        font-size: 36px !important;
        font-weight: 800 !important;
        color: rgba(255, 255, 255, 0.6) !important;
        line-height: 1 !important;
        z-index: 10 !important;
        margin: 0 !important;
        display: block !important;
        text-align: right !important;
    }
    
    /* Контент карточки - прижат к низу */
    .third-section .capabilities-list .capability-item .capability-content {
        position: relative !important;
        z-index: 2 !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        margin-top: auto !important;
        align-self: flex-end !important;
        text-align: left !important;
    }
    
    /* Заголовок возможности */
    .third-section .capabilities-list .capability-item .capability-title {
        font-size: 18px !important;
        line-height: 1.2 !important;
        margin: 0 0 8px 0 !important;
        color: white !important;
        font-weight: 600 !important;
        text-align: left !important;
    }
    
    /* Описание возможности */
    .third-section .capabilities-list .capability-item .capability-description {
        font-size: 14px !important;
        line-height: 1.3 !important;
        color: rgba(255, 255, 255, 0.85) !important;
        margin: 0 !important;
        text-align: left !important;
    }
    
    /* Внешние отступы 20px для второго блока */
    .bento-content {
        padding: 0 20px !important;
        margin: 0 !important;
    }
    
    .second-section .container {
        padding: 0 !important;
        margin: 0 !important;
    }
    
    .second-section {
        padding-top: 0 !important;
    }
    
    /* Заголовок "Кому будет полезен?" */
    .second-section .section-title {
        font-size: 28px !important;
        padding-left: 20px !important;
        margin-left: 0 !important;
    }
    
    /* Скрываем видео в блоке "Мы предлагаем" для экономии трафика */
    .offer-video-background {
        display: none !important;
    }
    
    .offer-video {
        display: none !important;
    }
    
    /* Блок "Мы предлагаем" - убираем все margin и padding */
    .offer-section {
        margin: 0 !important;
        padding: 60px 0 !important;
    }
    
    .offer-content {
        margin: 0 !important;
        padding: 0 !important;
    }
    
    .pricing-card-wrapper {
        margin: 0 !important;
        padding: 0 !important;
    }
    
    .pricing-card-single {
        margin: 0 !important;
        padding: 24px 20px !important;
    }
    
    /* Заголовок "Мы предлагаем" */
    .offer-section .section-title {
        font-size: 28px !important;
        padding-left: 20px !important;
        margin-left: 0 !important;
    }
    
    /* Подзаголовок "Мы предлагаем" */
    .offer-section .section-subtitle {
        padding-left: 20px !important;
    }
    
    /* Блок "Как работает AI-ассистент?" */
    .how-it-works-section .section-title {
        font-size: 28px !important;
        padding-left: 20px !important;
        margin-left: 0 !important;
    }
    
    /* Убираем padding у плашек */
    .timeline-container {
        padding: 0 20px !important;
    }
    
    .timeline-content {
        position: relative !important;
        padding: 20px !important;
        margin: 0 !important;
    }
    
    .timeline-step {
        padding: 0 !important;
        margin: 0 !important;
    }
    
    /* Выравниваем контент внутри плашек - текст строго внизу */
    .timeline-content {
        position: relative !important;
        box-sizing: border-box !important;
        min-height: 200px !important;
        padding: 20px !important;
        margin: 0 !important;
    }
    
    .timeline-icon {
        position: absolute !important;
        top: 20px !important;
        left: 20px !important;
        margin: 0 !important;
        z-index: 1 !important;
    }
    
    /* Создаем абсолютно позиционированный блок для текста внизу */
    .step-tag,
    .timeline-title,
    .timeline-description {
        position: relative !important;
        z-index: 2 !important;
    }
    
    .step-tag {
        position: absolute !important;
        bottom: 60px !important;
        left: 20px !important;
        right: 20px !important;
        margin: 0 !important;
        text-align: left !important;
    }
    
    .timeline-title {
        position: absolute !important;
        bottom: 35px !important;
        left: 20px !important;
        right: 20px !important;
        margin: 0 !important;
        text-align: left !important;
        line-height: 1.2 !important;
    }
    
    .timeline-description {
        position: absolute !important;
        bottom: 20px !important;
        left: 20px !important;
        right: 20px !important;
        margin: 0 !important;
        text-align: left !important;
        line-height: 1.4 !important;
    }
    
    /* Блок "Какие задачи решает?" */
    .tasks-section .section-title {
        font-size: 28px !important;
        padding-left: 20px !important;
    }
    
    /* Блок "Готовы начать?" */
    .ready-section .section-title {
        padding-left: 20px !important;
    }
    
    /* Футер - убираем левые отступы */
    .footer-left {
        padding-left: 0 !important;
    }
    
    .footer-company {
        padding-left: 0 !important;
    }
    
    .footer-company-name {
        padding-left: 0 !important;
    }
    
    .footer-details {
        padding-left: 0 !important;
    }
    
    /* Карточка с предложением - выравниваем контент */
    .pricing-cards-wrapper {
        padding: 0 !important;
        margin: 0 !important;
    }
    
    .pricing-card-price,
    .pricing-card-benefits {
        padding: 20px !important;
        margin: 0 !important;
    }
    
    .pricing-card-single {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        gap: 20px !important;
        box-sizing: border-box !important;
    }
    
    .card-tag {
        margin: 0 !important;
        text-align: center !important;
    }
    
    .pricing-section {
        margin: 0 !important;
        text-align: center !important;
    }
    
    .price-amount {
        text-align: center !important;
        margin: 0 0 8px 0 !important;
    }
    
    .price-details {
        text-align: center !important;
        margin: 0 !important;
    }
    
    .benefits-section {
        margin: 0 !important;
        text-align: center !important;
    }
    
    .benefits-title {
        text-align: center !important;
        margin: 0 0 12px 0 !important;
    }
    
    .benefits-grid {
        text-align: left !important;
        margin: 0 !important;
    }
    
    .pricing-cta-button {
        width: 100% !important;
        text-align: center !important;
        margin: 0 !important;
    }

    /* Настройки видео фона - такие же как в успешном диапазоне 375-479px */
    .hero-section .fullscreen-video-background {
        margin-top: 60px !important;
        overflow: visible !important;
        transform: translateX(-50%) scale(2.55) !important;
        max-width: 140% !important;
        position: absolute !important;
        top: 180px !important;
        z-index: 1 !important;
        width: 100% !important;
        height: 100% !important;
    }

    .hero-section .fullscreen-video {
        transform: scale(2.55) !important;
    }
}

/* СПЕЦИАЛЬНЫЙ МЕДИАЗАПРОС ДЛЯ ДИАПАЗОНА 1200-2000px - ПРИНУДИТЕЛЬНАЯ ВЫСОТА HERO СЕКЦИИ 65vh */
@media (min-width: 1200px) and (max-width: 2000px) {
    .hero-section {
        height: 65vh !important;
    }
}

/* СПЕЦИАЛЬНЫЕ МЕДИАЗАПРОСЫ ДЛЯ МАЛЫХ ЭКРАНОВ - ФИКСАЦИЯ ПОЗИЦИИ ВИДЕО */
@media (width: 375px) {
    .hero-section .fullscreen-video-background {
        margin-top: 60px !important;
        overflow: visible !important;
        transform: translateX(-50%) scale(2.55) !important;
        max-width: 140% !important;
        position: absolute !important;
        top: 180px !important;
        z-index: 1 !important;
        width: 100% !important;
        height: 100% !important;
    }

    .hero-section .fullscreen-video {
        transform: scale(2.55) !important;
    }
}

@media (width: 374px) {
    .hero-section .fullscreen-video-background {
        margin-top: 60px !important;
        overflow: visible !important;
        transform: translateX(-50%) scale(2.55) !important;
        max-width: 140% !important;
        position: absolute !important;
        top: 180px !important;
        z-index: 1 !important;
        width: 100% !important;
        height: 100% !important;
    }

    .hero-section .fullscreen-video {
        transform: scale(2.55) !important;
    }
}

@media (width: 360px) {
    .hero-section .fullscreen-video-background {
        margin-top: 60px !important;
        overflow: visible !important;
        transform: translateX(-50%) scale(2.55) !important;
        max-width: 140% !important;
        position: absolute !important;
        top: 180px !important;
        z-index: 1 !important;
        width: 100% !important;
        height: 100% !important;
    }

    .hero-section .fullscreen-video {
        transform: scale(2.55) !important;
    }
}

@media (width: 320px) {
    .hero-section .fullscreen-video-background {
        margin-top: 60px !important;
        overflow: visible !important;
        transform: translateX(-50%) scale(2.55) !important;
        max-width: 140% !important;
        position: absolute !important;
        top: 180px !important;
        z-index: 1 !important;
        width: 100% !important;
        height: 100% !important;
    }

    .hero-section .fullscreen-video {
        transform: scale(2.55) !important;
    }
}

/* ГЛОБАЛЬНОЕ УСТРАНЕНИЕ ГОРИЗОНТАЛЬНОГО СКРОЛЛА */
html {
    overflow-x: hidden !important;
    max-width: 100vw !important;
}

body {
    overflow-x: hidden !important;
    max-width: 100vw !important;
}

* {
    max-width: 100vw !important;
    box-sizing: border-box !important;
}

.hero-section {
    overflow: hidden !important;
}

.fullscreen-video-background {
    max-width: 100% !important;
}