/* ===== style-fixes.css: мобильные исправления ===== */
@media (max-width: 768px) {
    /* Сетки в одну колонку */
    .docs-list, .bento-grid, .topics-grid, .principles, .how-steps__grid, .about-grid, .info-grid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
        width: 100% !important;
    }

    /* Карточки: ширина 100%, перенос слов */
    .docs-list > *, .bento-grid > *, .topics-grid > *, .principles > *, .how-steps__grid > *, .about-grid > *, .info-grid > *,
    .doc-card, .bento-card, .test-card {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        overflow-wrap: break-word !important;
        word-break: normal !important;
    }

    /* Фото: убираем жесткую высоту и растяжение */
    .hero-photo,
    .photo-frame,
    .about-photo {
        height: auto !important;
        max-height: none !important;
        aspect-ratio: auto !important;
        margin-top: 30px !important;
        margin-bottom: 30px !important;
    }
    
    .hero-photo img,
    .photo-frame img,
    .about-photo img {
        width: 100% !important;
        height: auto !important;
        object-fit: cover !important;
        object-position: center top !important;
    }

    /* Центрируем только заголовки */
    h1, h2, h3, h4, h5, h6 {
        text-align: center !important;
    }

    /* Меню: аккуратный перенос */
    .main-bar__nav {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        gap: 8px 16px !important;
    }
}

/* ===== ИСПРАВЛЕНИЕ БЛОКА "ГДЕ Я ПРИНИМАЮ" (КАРТА И КАРТОЧКИ) ===== */
@media (max-width: 768px) {
    /* 1. Принудительно делаем контейнеры одноколоночными */
    .place__grid,
    .info-grid,
    .contact-options,
    .place__inner,
    .place {
        display: flex !important;
        flex-direction: column !important;
        grid-template-columns: 1fr !important;
        gap: 20px !important;
        width: 100% !important;
    }

    /* 2. Карточки и контейнер карты на всю ширину */
    .place__grid > *,
    .info-grid > *,
    .contact-options > *,
    .place__inner > *,
    .place__map,
    .map-container,
    .info-card {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
    }

    /* 3. Задаем карте фиксированную высоту, чтобы она не сплющилась в 0px */
    .place__map,
    .map-container,
    iframe[src*="yandex"] {
        height: 350px !important;
        min-height: 350px !important;
        border-radius: 12px !important; /* Для красоты */
    }
}