/* Дополнительные стили для мобильной оптимизации */

/* Улучшаем отступы на мобильных */
@media (max-width: 768px) {
    /* ГЕРОЙ СЕКЦИЯ - ВЕРХНЯЯ ЧАСТЬ */
    .hero {
        padding-top: calc(var(--header-height) + 40px);
        padding-bottom: 60px;
        min-height: auto !important;
        overflow: hidden !important;
        position: relative;
    }
    
    .hero-container {
        display: flex !important;
        flex-direction: column !important;
        gap: 40px !important;
        grid-template-columns: 1fr !important;
    }
    
    /* КОНТЕНТ ГЕРОЯ - всегда сверху */
    .hero-content {
        order: 1 !important;
        width: 100% !important;
        z-index: 3 !important;
        position: relative !important;
        text-align: center !important;
    }
    
    /* ИЗОБРАЖЕНИЕ КОМПЬЮТЕРА - всегда снизу */
    .hero-image {
        order: 2 !important;
        width: 100% !important;
        margin-top: 0 !important;
        z-index: 2 !important;
        position: relative !important;
    }
    
    /* Текст героя */
    .hero-title {
        font-size: 2.2rem !important;
        line-height: 1.1 !important;
        margin-bottom: 20px !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 8px !important;
        text-align: center !important;
    }
    
    .hero-title-line {
        display: block !important;
        line-height: 1.1 !important;
    }
    
    .hero-description {
        font-size: 1.1rem !important;
        line-height: 1.5 !important;
        margin-bottom: 30px !important;
        margin-top: 15px !important;
        max-width: 100% !important;
        text-align: center !important;
    }
    
    .hero-actions {
        flex-direction: column !important;
        align-items: center !important;
        gap: 15px !important;
        justify-content: center !important;
    }
    
    .hero-badge {
        justify-content: center !important;
        margin-bottom: 20px !important;
    }
    
    .badge {
        padding: 6px 14px !important;
        font-size: 0.8rem !important;
    }
    
    /* КОМПЬЮТЕР - АДАПТИВНАЯ ВЕРСИЯ */
    .computer-container {
        max-width: 90% !important;
        margin: 0 auto !important;
        transform: none !important;
    }
    
    .computer-screen {
        padding-top: 60% !important; /* Изменяем соотношение */
    }
    
    .screen-content {
        padding: 20px !important;
        justify-content: flex-start !important;
        overflow: hidden !important;
    }
    
    .screen-content h2 {
        font-size: 1.5rem !important;
        margin-bottom: 12px !important;
        line-height: 1.2 !important;
        text-align: center !important;
    }
    
    .screen-content p {
        font-size: 0.95rem !important;
        margin-bottom: 20px !important;
        line-height: 1.4 !important;
        text-align: center !important;
    }
    
    .screen-features {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
        margin-top: 15px !important;
    }
    
    .feature {
        flex-direction: row !important;
        justify-content: center !important;
        gap: 10px !important;
        font-size: 0.85rem !important;
    }
    
    .feature i {
        margin-bottom: 0 !important;
        font-size: 1rem !important;
    }
    
    .computer-base {
        width: 60% !important;
        height: 18px !important;
    }
    
    .computer-stand {
        width: 25% !important;
        height: 25px !important;
    }
    
    .hero-scroll-indicator {
        display: none !important; /* Скрываем на мобильных */
    }
    
    /* ОСТАЛЬНЫЕ СЕКЦИИ */
    .section-header {
        margin-bottom: 40px !important;
    }
    
    .section-title {
        font-size: 2rem !important;
        margin-bottom: 12px !important;
        text-align: center !important;
    }
    
    .section-subtitle {
        font-size: 1.1rem !important;
        text-align: center !important;
    }
    
    /* Карточки продуктов */
    .products-grid {
        grid-template-columns: 1fr !important;
        gap: 25px !important;
    }
    
    .product-card {
        padding: 25px !important;
    }
    
    .product-title {
        min-height: auto !important;
    }
    
    .product-description {
        min-height: auto !important;
    }
    
    .product-features {
        min-height: auto !important;
    }
    
    /* О компании */
    .about-content {
        grid-template-columns: 1fr !important;
        gap: 40px !important;
    }
    
    .features-grid {
        grid-template-columns: 1fr !important;
    }
    
    .about-stats {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 20px !important;
    }
    
    .stat-item {
        padding: 20px 15px !important;
    }
    
    .stat-number {
        font-size: 2rem !important;
    }
    
    /* Преимущества */
    .advantages-grid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }
    
    /* Партнеры */
    .partners-section {
        padding: 40px 20px !important;
    }
    
    .partners-logos {
        gap: 20px !important;
        justify-content: center !important;
    }
    
    .partner-logo i {
        font-size: 2rem !important;
    }
    
    /* Контакты */
    .contact-content {
        grid-template-columns: 1fr !important;
        gap: 40px !important;
    }
    
    .contact-card {
        flex-direction: column !important;
        text-align: center !important;
        padding: 20px !important;
    }
    
    .contact-icon {
        margin: 0 auto 15px auto !important;
    }
    
    /* Форма */
    .contact-form-container {
        padding: 30px 20px !important;
    }
    
    /* Футер */
    .footer-content {
        grid-template-columns: 1fr !important;
        gap: 30px !important;
        margin-bottom: 40px !important;
    }
    
    .footer-bottom {
        flex-direction: column !important;
        gap: 20px !important;
        text-align: center !important;
    }
    
    .footer-legal {
        flex-direction: column !important;
        gap: 10px !important;
    }
}

/* Улучшаем тач-интерфейс */
@media (hover: none) and (pointer: coarse) {
    .btn {
        min-height: 48px;
        padding: 14px 28px;
    }
    
    .nav-link {
        padding: 15px 0;
        min-height: 44px;
        display: flex;
        align-items: center;
    }
    
    /* Увеличиваем зону клика для мобильных */
    input, 
    textarea, 
    select, 
    button {
        min-height: 44px;
    }
}

/* Оптимизация для очень маленьких экранов */
@media (max-width: 375px) {
    .hero-title {
        font-size: 1.8rem !important;
    }
    
    .hero-description {
        font-size: 1rem !important;
    }
    
    .badge {
        padding: 5px 10px !important;
        font-size: 0.75rem !important;
    }
    
    .computer-container {
        max-width: 95% !important;
    }
    
    .computer-screen {
        padding-top: 65% !important;
    }
    
    .screen-content {
        padding: 15px !important;
    }
    
    .screen-content h2 {
        font-size: 1.3rem !important;
    }
    
    .screen-content p {
        font-size: 0.85rem !important;
    }
    
    .feature {
        font-size: 0.75rem !important;
    }
    
    .feature i {
        font-size: 0.9rem !important;
    }
}

/* Для высоких мобильных экранов (высота > 800px) */
@media (max-width: 768px) and (min-height: 700px) {
    .hero {
        min-height: 100vh !important;
        padding-bottom: 80px !important;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .hero-container {
        gap: 50px !important;
    }
    
    .computer-container {
        max-width: 350px !important;
    }
}

/* Для планшетов (768px - 1024px) */
@media (min-width: 769px) and (max-width: 1024px) {
    .hero-container {
        grid-template-columns: 1fr !important;
        gap: 50px !important;
    }
    
    .hero-content {
        text-align: center !important;
        max-width: 700px !important;
        margin: 0 auto !important;
    }
    
    .hero-badge {
        justify-content: center !important;
    }
    
    .hero-actions {
        justify-content: center !important;
    }
    
    .hero-image {
        max-width: 550px !important;
        margin: 0 auto !important;
    }
    
    .computer-container {
        max-width: 100% !important;
    }
    
    .screen-content h2 {
        font-size: 1.8rem !important;
    }
    
    .screen-content p {
        font-size: 1rem !important;
    }
}

/* Предотвращение переполнения текста */
.text-overflow-prevention {
    overflow-wrap: break-word;
    word-wrap: break-word;
    hyphens: auto;
}

/* Улучшение читаемости на мобильных */
@media (max-width: 768px) {
    p, li, a {
        font-size: 1rem;
        line-height: 1.6;
    }
    
    h1, h2, h3 {
        line-height: 1.1;
    }
}

/* Отключаем анимации на медленных устройствах */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    
    .floating,
    .pulse-animation,
    .floating {
        animation: none !important;
    }
}