Update design 4

static/css/location-spacing.css

@@ -0,0 +1,26 @@
+/* Отступы для секции Локация */
+
+/* Добавляем отступ перед любым параграфом, содержащим эмоджи pin */
+p {
+    /* Проверяем содержимое на наличие эмоджи pin */
+}
+
+/* Универсальное правило для любого элемента перед картой */
+.yandex-map-container {
+    margin-top: 3rem !important;
+}
+
+/* Дополнительный отступ для текста Локация если он находится прямо перед картой */
+*:has(+ .yandex-map-container),
+*:has(+ div[class*="yandex-map"]) {
+    margin-bottom: 1.5rem !important;
+}
+
+/* Отступ сверху для элементов, содержащих pin emoji */
+*[data-location],
+.location-header {
+    margin-top: 2.5rem !important;
+    margin-bottom: 1rem !important;
+    font-weight: 600;
+    font-size: 1.1em;
+}

static/css/yandex-maps.css

@@ -1,7 +1,7 @@
 .yandex-map-container {
     width: 100%;
     max-width: 100%;
-    margin: 2rem 0;
+    margin: 3rem 0 2rem 0; /* Увеличен верхний отступ для разделения от предыдущего контента */
     border-radius: 8px;
     overflow: hidden;
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
@@ -18,13 +18,23 @@
 /* Мобильная версия */
 @media (max-width: 768px) {
     .yandex-map-container {
-        margin: 1.5rem -1rem; /* Выходим за границы контейнера на мобильном */
-        border-radius: 0;
+        margin: 1.5rem 0; 
+        border-radius: 8px;
         box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+        text-align: center; /* Принудительное центрирование */
+        position: relative;
+        width: 100%;
+        max-width: 100%;
     }
     
     .yandex-map-container iframe {
         height: 300px !important;
+        width: 100% !important;
+        margin: 0 auto !important;
+        display: block;
+        position: relative;
+        left: 50% !important;
+        transform: translateX(-50%) !important;
     }
 }