/* cosmopolis_site/css/lore-mobile.css */
/* Полная мобильная переверстка терминала ЦУС для смартфонов */

@media (max-width: 768px) {
    /* Перестраиваем сетку терминала в один вертикальный поток */
    .lore-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 15px !important;
        width: 100% !important;
        overflow-x: hidden !important;
    }
    
    /* ИСПРАВЛЕНО: Убираем неудобную горизонтальную строку и делаем красивую сетку в 2 колонки */
    .patent-sidebar {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        white-space: normal !important;
        overflow-x: hidden !important;
        padding: 12px !important;
        gap: 8px !important;
        background: rgba(11, 11, 22, 0.8) !important;
        border: 1px solid rgba(138, 149, 196, 0.25) !important;
        border-radius: 4px !important;
        box-sizing: border-box !important;
    }
    
    /* Скрываем громоздкие десктопные элементы */
    .patent-sidebar span[style*="[ ИНЖЕНЕРНЫЕ МАТРИЦЫ ]"],
    .patent-info-block {
        display: none !important;
    }

    /* Адаптивные мобильные плитки меню */
    .patent-tab {
        width: 100% !important;
        display: block !important;
        padding: 10px 8px !important;
        font-size: 11px !important;
        border: 1px solid rgba(202, 166, 132, 0.2) !important;
        border-radius: 4px !important;
        background: #020204 !important;
        text-align: center !important;
        box-sizing: border-box !important;
        line-height: 1.3 !important;
    }
    
    .patent-tab br {
        display: block !important; /* Разрешаем аккуратные переносы строк */
    }
    
    .patent-tab.active {
        border: 1px solid var(--accent-blue) !important;
        background: rgba(202, 166, 132, 0.08) !important;
    }

    /* ИСПРАВЛЕНО: Обеспечиваем принудительное открытие контента магнитометра при клике */
    .patent-content-block.active {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    .hero-epic-title {
        font-size: 22px !important;
        letter-spacing: 1px !important;
    }
}