/* Улучшенное размещение текста на баннерах */

/* Полноширинные баннеры */
.full-width-banner {
    width: 100% !important;
    margin-bottom: 20px !important;
    display: block !important;
}

.promo-section {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
}

/* Основные стили для контента баннеров */
.banner-content {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: flex-start !important;
    z-index: 10 !important;
    position: relative !important;
    height: 100% !important;
}

/* Оптимальные переносы текста */
.banner-title,
.banner-subtitle {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* Разрешить естественные переносы для описательного текста */
.banner-description,
.crypto-title,
.bonus-text,
.banner-details,
.crypto-benefits,
.secondary-banner p {
    white-space: normal !important;
    word-wrap: break-word !important;
    hyphens: none !important;
    max-width: 100% !important;
}

/* Главный баннер - текст на полную ширину без блюра */
.main-banner .banner-content {
    padding: 40px 40px 40px 40px !important;
    max-width: 100% !important;
    width: 100% !important;
    background: transparent !important;
    backdrop-filter: none !important;
}

.main-banner .banner-title {
    font-size: 28px !important;
    font-weight: 700 !important;
    margin-bottom: 8px !important;
    line-height: 1.2 !important;
    text-align: left !important;
}

.main-banner .banner-description {
    font-size: 14px !important;
    font-weight: 400 !important;
    margin-bottom: 15px !important;
    opacity: 0.9 !important;
    text-align: left !important;
    color: #D4AF37 !important;
}

.main-banner p {
    font-size: 48px !important;
    font-weight: 800 !important;
    margin: 10px 0 8px 0 !important;
    color: #D4AF37 !important;
    text-align: left !important;
}

.main-banner .bonus-text {
    font-size: 13px !important;
    font-weight: 500 !important;
    margin-bottom: 8px !important;
    opacity: 0.9 !important;
    text-align: left !important;
}

.main-banner .banner-details {
    font-size: 11px !important;
    font-weight: 400 !important;
    margin-bottom: 20px !important;
    opacity: 0.8 !important;
    text-align: left !important;
    color: #9ca3af !important;
}

.main-banner .cta-button {
    padding: 15px 35px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    align-self: flex-start !important;
}

/* Вторичный баннер - текст на полную ширину без блюра */
.secondary-banner .banner-content {
    padding: 30px 30px 30px 30px !important;
    max-width: 100% !important;
    width: 100% !important;
    background: transparent !important;
    backdrop-filter: none !important;
}

.secondary-banner .banner-subtitle {
    font-size: 28px !important;
    font-weight: 700 !important;
    margin-bottom: 8px !important;
    line-height: 1.2 !important;
    text-align: left !important;
}

.secondary-banner .crypto-title {
    font-size: 14px !important;
    font-weight: 400 !important;
    margin-bottom: 15px !important;
    color: #D4AF37 !important;
    text-align: left !important;
}

.secondary-banner p {
    font-size: 48px !important;
    font-weight: 800 !important;
    margin: 10px 0 8px 0 !important;
    color: #D4AF37 !important;
    text-align: left !important;
}

.secondary-banner .crypto-benefits {
    font-size: 11px !important;
    font-weight: 400 !important;
    margin-bottom: 20px !important;
    opacity: 0.8 !important;
    text-align: left !important;
    color: #9ca3af !important;
}

.secondary-banner .cta-button-small {
    padding: 15px 35px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    align-self: flex-start !important;
}

/* Планшеты */
@media (max-width: 1024px) {
    .main-banner .banner-content {
        padding: 35px 35px 35px 35px !important;
        background: transparent !important;
    }
    
    .main-banner .banner-title {
        font-size: 24px !important;
        margin-bottom: 6px !important;
    }
    
    .main-banner .banner-description {
        font-size: 12px !important;
        margin-bottom: 12px !important;
    }
    
    .main-banner p {
        font-size: 38px !important;
    }
    
    .main-banner .banner-details {
        font-size: 10px !important;
        margin-bottom: 15px !important;
    }
    
    .secondary-banner .banner-content {
        padding: 25px 25px 25px 25px !important;
        background: transparent !important;
    }
    
    .secondary-banner .banner-subtitle {
        font-size: 24px !important;
    }
    
    .secondary-banner .crypto-title {
        font-size: 12px !important;
    }
    
    .secondary-banner p {
        font-size: 38px !important;
    }
    
    .secondary-banner .crypto-benefits {
        font-size: 10px !important;
    }
    
    .secondary-banner .cta-button-small {
        padding: 15px 35px !important;
        font-size: 16px !important;
    }
}

@media (max-width: 768px) {
    .main-banner .banner-content {
        padding: 30px 30px 30px 30px !important;
        background: transparent !important;
    }
    
    .main-banner .banner-title {
        font-size: 20px !important;
        margin-bottom: 5px !important;
    }
    
    .main-banner .banner-description {
        font-size: 10px !important;
        margin-bottom: 10px !important;
    }
    
    .main-banner p {
        font-size: 32px !important;
    }
    
    .main-banner .bonus-text {
        font-size: 11px !important;
        margin-bottom: 5px !important;
    }
    
    .main-banner .banner-details {
        font-size: 9px !important;
        margin-bottom: 15px !important;
    }
    
    .secondary-banner .banner-content {
        padding: 20px 20px 20px 20px !important;
        background: transparent !important;
    }
    
    .secondary-banner .banner-subtitle {
        font-size: 20px !important;
        margin-bottom: 5px !important;
    }
    
    .secondary-banner .crypto-title {
        font-size: 10px !important;
        margin-bottom: 10px !important;
    }
    
    .secondary-banner p {
        font-size: 32px !important;
        margin: 8px 0 6px 0 !important;
    }
    
    .secondary-banner .crypto-benefits {
        font-size: 9px !important;
        margin-bottom: 15px !important;
    }
    
    .secondary-banner .cta-button-small {
        padding: 12px 30px !important;
        font-size: 14px !important;
    }
}

/* Мобильные устройства - текст сверху, персонаж снизу */
@media (max-width: 480px) {
    .banner-content {
        align-items: center !important;
        text-align: center !important;
    }
    
    .main-banner .banner-content,
    .secondary-banner .banner-content {
        padding: 25px 20px 15px 20px !important;
        background: transparent !important;
        backdrop-filter: none !important;
    }
    
    /* Разрешить переносы на мобильных для лучшего отображения */
    .banner-title,
    .banner-subtitle,
    .banner-description,
    .crypto-title {
        white-space: normal !important;
    }
    
    .main-banner .banner-title {
        font-size: 18px !important;
        text-align: center !important;
        margin-bottom: 6px !important;
    }
    
    .main-banner .banner-description {
        font-size: 10px !important;
        text-align: center !important;
        margin-bottom: 8px !important;
    }
    
    .main-banner p {
        font-size: 28px !important;
        text-align: center !important;
        margin: 8px 0 6px 0 !important;
    }
    
    .main-banner .bonus-text {
        text-align: center !important;
        font-size: 10px !important;
        margin-bottom: 4px !important;
    }
    
    .main-banner .banner-details {
        text-align: center !important;
        font-size: 8px !important;
        margin-bottom: 15px !important;
    }
    
    .main-banner .cta-button {
        align-self: center !important;
        padding: 12px 30px !important;
        font-size: 14px !important;
    }
    
    .secondary-banner .banner-subtitle {
        font-size: 18px !important;
        text-align: center !important;
        margin-bottom: 6px !important;
    }
    
    .secondary-banner .crypto-title {
        font-size: 10px !important;
        text-align: center !important;
        margin-bottom: 8px !important;
    }
    
    .secondary-banner p {
        text-align: center !important;
        font-size: 28px !important;
        margin: 8px 0 6px 0 !important;
    }
    
    .secondary-banner .crypto-benefits {
        text-align: center !important;
        font-size: 8px !important;
        margin-bottom: 15px !important;
    }
    
    .secondary-banner .cta-button-small {
        align-self: center !important;
        padding: 12px 30px !important;
        font-size: 14px !important;
    }
}

/* Дополнительные улучшения для очень маленьких экранов */
@media (max-width: 360px) {
    .main-banner .banner-title {
        font-size: 16px !important;
    }
    
    .main-banner .banner-description {
        font-size: 9px !important;
    }
    
    .main-banner p {
        font-size: 24px !important;
    }
    
    .main-banner .bonus-text {
        font-size: 9px !important;
    }
    
    .main-banner .banner-details {
        font-size: 7px !important;
    }
    
    .secondary-banner .banner-subtitle {
        font-size: 16px !important;
    }
    
    .secondary-banner .crypto-title {
        font-size: 9px !important;
    }
    
    .secondary-banner p {
        font-size: 24px !important;
    }
    
    .secondary-banner .crypto-benefits {
        font-size: 7px !important;
    }
    
    .secondary-banner .cta-button-small {
        padding: 10px 25px !important;
        font-size: 12px !important;
    }
    
    .banner-content {
        padding: 20px 15px 10px 15px !important;
        background: transparent !important;
    }
}