/*
* landscape-fix.css v10 FINAL
* — после
*
* ВАЖНО: overflow-x:hidden на html/body ЛОМАЕТ position:sticky шапки.
* Поэтому глобально ничего не ставим — только внутри медиа-запросов.
*/
/* ═══════════════════════════════════════════════════════════════════
LANDSCAPE — телефон горизонтально (высота ≤ 500px)
═══════════════════════════════════════════════════════════════════ */
@media screen and (max-height: 500px) and (orientation: landscape) {
/* Белая полоса — только в landscape, только на body (не html!) */
body { overflow-x: hidden !important; }
/* Шапка */
.header-top { padding: 0.15rem 0 !important; }
.header-title h1 { font-size: 0.95rem !important; }
.header-subtitle { font-size: 0.7rem !important; opacity: 0.85 !important; }
.header-title > img { width: 36px !important; height: 36px !important;
margin-right: 0.5rem !important; }
.mobile-menu-toggle { display: block !important; font-size: 1.3rem !important; }
/* Меню */
.nav-menu {
display: none !important;
flex-direction: column !important;
width: 100% !important;
max-height: 60vh !important;
overflow-y: auto !important;
overflow-x: hidden !important;
}
.nav-menu.active { display: flex !important; }
.nav-menu > li > a { padding: 0.45rem 0.85rem !important;
font-size: 0.85rem !important; }
/* Подменю */
.submenu {
position: static !important;
box-shadow: none !important;
border-radius: 0 !important;
border-top: none !important;
border-left: 3px solid #E53935 !important;
max-height: 0 !important;
overflow: hidden !important;
opacity: 1 !important;
visibility: visible !important;
transform: none !important;
transition: max-height 0.3s ease !important;
min-width: unset !important;
width: 100% !important;
background-color: rgba(0, 29, 58, 0.97) !important;
padding: 0 !important;
}
.nav-menu > li.has-submenu.open > .submenu {
max-height: 400px !important;
overflow-y: auto !important;
padding: 0.5rem 0 !important;
}
.submenu li { background-color: transparent !important; }
.submenu a { color: rgba(255,255,255,0.92) !important;
padding: 0.4rem 0.75rem 0.4rem 2rem !important;
font-size: 0.82rem !important;
background-color: transparent !important; }
.submenu a:hover { background-color: rgba(255,255,255,0.1) !important;
color: white !important;
padding-left: 2rem !important; }
.submenu a::before { display: none !important; }
/* Lightbox эмблемы */
#emblem-lightbox img { max-width: 85vw !important;
max-height: 80vh !important;
width: auto !important;
height: auto !important; }
/* QR кнопка */
#qrFloatingButton { width: 42px !important;
height: 42px !important;
bottom: 8px !important;
right: 8px !important; }
#floatingMiniPlayer { width: 190px !important;
bottom: 8px !important;
left: 8px !important;
padding: 6px 8px !important; }
/* Hero */
.hero { padding: 1rem !important; }
.hero h2 { font-size: 1.2rem !important;
margin-bottom: 0.3rem !important; }
.hero p { font-size: 0.83rem !important;
margin-bottom: 0.55rem !important;
line-height: 1.4 !important; }
.hero-buttons { flex-direction: row !important;
justify-content: center !important;
gap: 0.6rem !important; }
.btn { padding: 0.4rem 0.9rem !important;
font-size: 0.8rem !important; }
/* Разделы */
section { margin-bottom: 1.5rem !important; }
section h2,
.page-title { font-size: 1.4rem !important;
margin-bottom: 0.7rem !important; }
main { padding-top: 0.5rem !important; }
.obzr-blue-box { padding: 1rem !important;
margin-bottom: 1rem !important; }
.obzr-blue-box h3 { font-size: 1.05rem !important; }
.obzr-blue-box p,
.obzr-blue-box li { font-size: 0.86rem !important;
line-height: 1.4 !important; }
/* Статистика */
.obzr-stats { grid-template-columns: repeat(4, 1fr) !important;
gap: 0.45rem !important; }
.stat-card { padding: 0.55rem 0.35rem !important; }
.stat-icon { font-size: 1.3rem !important;
margin-bottom: 0.15rem !important; }
.stat-number { font-size: 1.4rem !important; }
.stat-label { font-size: 0.68rem !important;
line-height: 1.2 !important; }
/* Карточки */
.info-blocks-grid { grid-template-columns: repeat(3, 1fr) !important;
gap: 0.65rem !important; }
.info-block { min-height: auto !important;
padding: 0.9rem !important; }
.info-block h3 { font-size: 0.95rem !important;
margin-bottom: 0.35rem !important; }
.info-block p { font-size: 0.8rem !important;
margin-bottom: 0.45rem !important; }
.info-block li { font-size: 0.75rem !important;
margin-bottom: 0.2rem !important; }
.info-block-button { padding: 0.4rem 0.75rem !important;
font-size: 0.75rem !important; }
/* Новости */
.news-summary { padding: 1rem !important; }
.news-summary h3 { font-size: 1.15rem !important;
margin-bottom: 0.65rem !important; }
.news-summary h3::before { font-size: 1.9rem !important; }
/* Аккордеон */
.accordion-header { padding: 0.5rem 0.85rem !important;
font-size: 0.83rem !important; }
/* Footer */
footer { margin-top: 1.5rem !important;
padding: 1rem !important; }
.footer-content { grid-template-columns: repeat(3, 1fr) !important;
gap: 0.65rem !important; }
.footer-section h3 { font-size: 0.9rem !important;
margin-bottom: 0.35rem !important; }
.footer-section li { font-size: 0.78rem !important;
margin-bottom: 0.2rem !important; }
.footer-bottom { font-size: 0.72rem !important;
margin-top: 0.65rem !important; }
/* Другие страницы */
.about-grid,
.education-grid,
.portfolio-grid,
.achievements-grid { grid-template-columns: repeat(2,1fr) !important;
gap: 0.65rem !important; }
.contacts-grid { grid-template-columns: repeat(2,1fr) !important; }
.ai-cards-grid,
.tools-grid { grid-template-columns: repeat(3,1fr) !important;
gap: 0.6rem !important; }
.activities-grid,
.events-grid,
.parents-grid,
.faq-grid { grid-template-columns: repeat(2,1fr) !important;
gap: 0.6rem !important; }
}
/* ═══════════════════════════════════════════════════════════════════
ПЛАНШЕТЫ (600–1024px)
═══════════════════════════════════════════════════════════════════ */
@media screen and (min-width: 600px) and (max-width: 1024px) {
.obzr-stats { grid-template-columns: repeat(2, 1fr); }
.info-blocks-grid { grid-template-columns: repeat(2, 1fr); }
.footer-content { grid-template-columns: repeat(2, 1fr); }
.hero h2 { font-size: 2rem; }
}