/* Блок "Как купить" */
.how-to-buy-section {
    padding: 0px 0 40px 0;
    background-color: #fff;
    position: relative;
}

.how-to-buy-container {
    display: flex;
    gap: 40px;
    max-width: 1240px;
    margin: 0 auto;
    padding: 0 20px;
    position: relative;
}

/* Левая часть - фиксированная */
.how-to-buy-left {
    flex: 0 0 295px;
    position: sticky;
    top: 100px; /* Отступ от верхнего края при прокрутке */
    align-self: flex-start;
    height: auto;
}

.how-to-buy-left-title {
    width: 295px;
    color: #1481DB;
    font-size: 48px;
    font-family: 'Bebas Neue Cyrillic', 'Bebas Neue', sans-serif;
    font-weight: 400;
    text-transform: uppercase;
    line-height: 1.2;
    margin: 0 0 24px 0;
    word-wrap: break-word;
}

.how-to-buy-left-text {
    width: 293px;
    color: #8AC0ED;
    font-size: 16px;
    font-family: 'Inter Tight', 'Inter', sans-serif;
    font-weight: 400;
    line-height: 1.5;
    word-wrap: break-word;
}

/* Правая часть - прокручиваемая */
.how-to-buy-right {
    flex: 1;
    min-width: 0;
    max-height: 700px; /* Ограничиваем высоту для прокрутки */
    overflow-y: auto;
    padding-right: 20px; /* Место для скролла */
}

/* Стилизация скролла */
.how-to-buy-right::-webkit-scrollbar {
    width: 4px;
}

.how-to-buy-right::-webkit-scrollbar-track {
    background: #f2f3f5;
}

.how-to-buy-right::-webkit-scrollbar-thumb {
    background: #E1E1E1;
    border-radius: 4px;
}

.how-to-buy-right-content {
    display: flex;
    flex-direction: column;
    gap: 32px;
    align-items: flex-start;
    justify-content: flex-start;
}

.how-to-buy-block {
    display: flex;
    flex-direction: column;
    gap: 32px;
    align-items: flex-start;
    justify-content: flex-start;
    align-self: stretch;
    width: 100%;
}

.how-to-buy-block-title {
    color: #303030;
    text-align: left;
    font-family: 'Bebas Neue Cyrillic', 'Bebas Neue', sans-serif;
    font-size: 36px;
    font-weight: 400;
    text-transform: uppercase;
    position: relative;
    align-self: stretch;
    margin: 0;
    line-height: 1.3;
    max-width: 451px;
}

.how-to-buy-block-text {
    color: #818084;
    text-align: left;
    font-family: 'Inter Tight', 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    position: relative;
    align-self: stretch;
    line-height: 1.5;
    margin: 0;
}

.how-to-buy-divider {
    border-top: 1px solid #818084;
    align-self: stretch;
    width: 100%;
    height: 0;
    margin: 0;
}

/* Медиа-запросы для мобильных */
@media (max-width: 1024px) {
    .how-to-buy-container {
        flex-direction: column;
        gap: 24px;
    }
    
    .how-to-buy-left {
        position: static; /* На мобильных не фиксируем */
        flex: 1 1 auto;
        width: 100%;
        max-width: 100%;
    }
    
    .how-to-buy-left-title,
    .how-to-buy-left-text {
        width: 100%;
        max-width: 100%;
    }
    
    .how-to-buy-right {
        max-height: none;
        overflow-y: visible;
        padding-right: 0;
    }
}

@media (max-width: 768px) {
    .how-to-buy-left-title {
        font-size: 24px;
    }

.how-to-buy-section {
		padding: 0px 0 0px 0;
}

    .how-to-buy-left-text {
        font-size: 13px;
    }
    
    .how-to-buy-block-title {
        font-size: 24px;
    }
    
    .how-to-buy-block-text {
        font-size: 13px;
    }
    
    .how-to-buy-block {
        gap: 24px;
    }
    
    .how-to-buy-right-content {
        gap: 24px;
    }
}

@media (max-width: 480px) {
    .how-to-buy-left-title {
        font-size: 24px;
    }
    
    .how-to-buy-block-title {
        font-size: 24px;
    }
}