/* =================================
   МОБИЛЬНЫЕ СТИЛИ ДЛЯ ГЛАВНОЙ СТРАНИЦЫ
   Специальные стили для мобильной версии
   ================================= */

/* Базовые мобильные стили */
@media (max-width: 768px) {
    
    /* === ГЛАВНАЯ СТРАНИЦА - ОБЩИЕ СТИЛИ === */
    .container-fluid {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
    
    /* === HERO СЕКЦИЯ === */
    .display-4 {
        font-size: 1.8rem !important;
    }
    
    .lead {
        font-size: 1rem !important;
    }
    
    .btn-lg {
        padding: 10px 20px !important;
        font-size: 14px !important;
    }
    
    /* === БЛОКИ WHY CHOOSE US - КОМПАКТНЫЕ === */
    .feature-card {
        margin-bottom: 8px !important;
        border-radius: 8px !important;
    }
    
    .feature-card .card-body {
        padding: 12px !important;
    }
    
    .feature-icon {
        width: 45px !important;
        height: 45px !important;
        margin-bottom: 8px !important;
    }
    
    .feature-card h5 {
        font-size: 0.85rem !important;
        margin-bottom: 6px !important;
        line-height: 1.2 !important;
    }
    
    .feature-card p {
        font-size: 0.75rem !important;
        margin-bottom: 0 !important;
        line-height: 1.3 !important;
    }
    
    /* === ТЕСТЫ - КОМПАКТНЫЕ === */
    .test-card-home {
        margin-bottom: 10px !important;
        border-radius: 8px !important;
    }
    
    .test-card-home .card-body {
        padding: 10px !important;
    }
    
    .test-card-home .card-header {
        padding: 8px 12px !important;
    }
    
    .test-card-home .card-header h6 {
        font-size: 0.9rem !important;
        margin-bottom: 2px !important;
    }
    
    .test-card-home .card-header small {
        font-size: 0.7rem !important;
    }
    
    .test-icon-home {
        width: 30px !important;
        height: 30px !important;
        font-size: 0.9rem !important;
    }
    
    .test-info-home {
        padding: 8px !important;
        border-radius: 6px !important;
    }
    
    .test-info-home .d-flex {
        margin-bottom: 4px !important;
        font-size: 0.75rem !important;
    }
    
    .test-info-home .d-flex i {
        font-size: 0.7rem !important;
    }
    
    .test-btn {
        padding: 6px 10px !important;
        font-size: 12px !important;
        border-radius: 6px !important;
    }
    
    /* === РЕЙТИНГИ - КОМПАКТНЫЕ === */
    .card-body.text-center.p-4 {
        padding: 12px !important;
    }
    
    .card-body.text-center.p-4 img,
    .card-body.text-center.p-4 div {
        width: 50px !important;
        height: 50px !important;
    }
    
    .card-body.text-center.p-4 h6 {
        font-size: 0.8rem !important;
        margin-bottom: 4px !important;
    }
    
    .card-body.text-center.p-4 p {
        font-size: 0.7rem !important;
        margin-bottom: 6px !important;
    }
    
    .card-body.text-center.p-4 .badge {
        font-size: 0.65rem !important;
        padding: 3px 6px !important;
    }
    
    /* === ЗАГОЛОВКИ === */
    h2 {
        font-size: 1.2rem !important;
        margin-bottom: 0.8rem !important;
    }
    
    h3 {
        font-size: 1.1rem !important;
    }
    
    /* === ОТСТУПЫ === */
    .row.mb-5 {
        margin-bottom: 1.5rem !important;
    }
    
    .mb-4 {
        margin-bottom: 1rem !important;
    }
    
    .mb-3 {
        margin-bottom: 0.8rem !important;
    }
    
    /* === CTA СЕКЦИИ === */
    .card-body.text-center.p-5 {
        padding: 20px !important;
    }
    
    .card-body.text-center.p-5 h3 {
        font-size: 1.1rem !important;
        margin-bottom: 8px !important;
    }
    
    .card-body.text-center.p-5 p {
        font-size: 0.9rem !important;
        margin-bottom: 12px !important;
    }
    
    /* === АЛЕРТЫ === */
    .alert {
        padding: 8px 12px !important;
        font-size: 0.8rem !important;
        margin-bottom: 8px !important;
    }
    
    /* === МОДАЛЬНЫЕ ОКНА === */
    .modal-dialog {
        margin: 5px !important;
    }
    
    .modal-content {
        border-radius: 8px !important;
    }
    
    .modal-header {
        padding: 10px 15px !important;
    }
    
    .modal-body {
        padding: 15px !important;
    }
    
    .modal-body h6 {
        font-size: 0.9rem !important;
    }
    
    .modal-body .card-title {
        font-size: 1rem !important;
    }
    
    .modal-body .card-text {
        font-size: 0.85rem !important;
    }
    
    .modal-body .btn-lg {
        padding: 8px 16px !important;
        font-size: 14px !important;
    }
}

/* =================================
   ОЧЕНЬ МАЛЕНЬКИЕ ЭКРАНЫ (< 576px)
   ================================= */
@media (max-width: 576px) {
    
    /* === ЕЩЕ БОЛЕЕ КОМПАКТНЫЕ СТИЛИ === */
    .container-fluid {
        padding-left: 5px !important;
        padding-right: 5px !important;
    }
    
    .display-4 {
        font-size: 1.5rem !important;
    }
    
    .lead {
        font-size: 0.9rem !important;
    }
    
    .btn-lg {
        padding: 8px 16px !important;
        font-size: 13px !important;
    }
    
    /* === FEATURE CARDS - СУПЕР КОМПАКТНЫЕ === */
    .feature-card .card-body {
        padding: 8px !important;
    }
    
    .feature-icon {
        width: 35px !important;
        height: 35px !important;
        margin-bottom: 6px !important;
    }
    
    .feature-card h5 {
        font-size: 0.75rem !important;
        margin-bottom: 4px !important;
    }
    
    .feature-card p {
        font-size: 0.65rem !important;
    }
    
    /* === TEST CARDS - СУПЕР КОМПАКТНЫЕ === */
    .test-card-home .card-body {
        padding: 8px !important;
    }
    
    .test-card-home .card-header {
        padding: 6px 10px !important;
    }
    
    .test-card-home .card-header h6 {
        font-size: 0.8rem !important;
    }
    
    .test-card-home .card-header small {
        font-size: 0.65rem !important;
    }
    
    .test-icon-home {
        width: 25px !important;
        height: 25px !important;
        font-size: 0.8rem !important;
    }
    
    .test-info-home {
        padding: 6px !important;
    }
    
    .test-info-home .d-flex {
        font-size: 0.7rem !important;
        margin-bottom: 3px !important;
    }
    
    .test-btn {
        padding: 5px 8px !important;
        font-size: 11px !important;
    }
    
    /* === РЕЙТИНГИ - СУПЕР КОМПАКТНЫЕ === */
    .card-body.text-center.p-4 {
        padding: 8px !important;
    }
    
    .card-body.text-center.p-4 img,
    .card-body.text-center.p-4 div {
        width: 40px !important;
        height: 40px !important;
    }
    
    .card-body.text-center.p-4 h6 {
        font-size: 0.75rem !important;
    }
    
    .card-body.text-center.p-4 p {
        font-size: 0.65rem !important;
    }
    
    .card-body.text-center.p-4 .badge {
        font-size: 0.6rem !important;
        padding: 2px 5px !important;
    }
    
    /* === ЗАГОЛОВКИ === */
    h2 {
        font-size: 1.1rem !important;
        margin-bottom: 0.6rem !important;
    }
    
    h3 {
        font-size: 1rem !important;
    }
    
    /* === ОТСТУПЫ === */
    .row.mb-5 {
        margin-bottom: 1rem !important;
    }
    
    .mb-4 {
        margin-bottom: 0.8rem !important;
    }
    
    .mb-3 {
        margin-bottom: 0.6rem !important;
    }
}

/* =================================
   ЛАНДШАФТНАЯ ОРИЕНТАЦИЯ
   ================================= */
@media (max-width: 768px) and (orientation: landscape) {
    
    .display-4 {
        font-size: 1.4rem !important;
    }
    
    .feature-card .card-body {
        padding: 6px !important;
    }
    
    .feature-icon {
        width: 30px !important;
        height: 30px !important;
    }
    
    .test-card-home .card-body {
        padding: 6px !important;
    }
    
    .test-info-home {
        padding: 4px !important;
    }
}

/* =================================
   TOUCH УСТРОЙСТВА
   ================================= */
@media (hover: none) and (pointer: coarse) {
    
    /* Увеличиваем области нажатия для мобильных */
    .test-btn,
    .btn {
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
    
    /* Убираем hover эффекты */
    .test-card-home:hover,
    .feature-card:hover {
        transform: none !important;
    }
}

/* =================================
   ДОПОЛНИТЕЛЬНЫЕ УТИЛИТЫ
   ================================= */
@media (max-width: 768px) {
    
    /* Скрываем элементы на мобилке */
    .hide-mobile {
        display: none !important;
    }
    
    /* Показываем только на мобилке */
    .show-mobile {
        display: block !important;
    }
    
    /* Компактные иконки */
    .fa-2x {
        font-size: 1.2em !important;
    }
    
    .fa-3x {
        font-size: 1.5em !important;
    }
    
    .fa-4x {
        font-size: 2em !important;
    }
    
    /* Компактные бейджи */
    .badge {
        font-size: 0.7rem !important;
        padding: 3px 6px !important;
    }
    
    /* Компактные карточки */
    .card {
        border-radius: 8px !important;
    }
    
    /* Компактные тени */
    .shadow-sm {
        box-shadow: 0 1px 3px rgba(0,0,0,0.1) !important;
    }
}