Отзывы и карта Яндекс на Тильда в одном блоке autoscale

<!-- Отзывы и карта Яндекс на Тильда в одном блоке с autoscale | youx.agency -->
<!-- https://youx.agency/otzyvy-i-karta-yandeks-na-tilda -->

<div style="padding: 0 20px; width: 100%; box-sizing: border-box;" class="yandex-maps-wrapper">
  
  <div style="display: flex; flex-wrap: wrap; gap: 15px; width: 100%;">

    <!-- Блок отзывов -->
    <div style="flex: 1; min-width: 320px; height: 600px; position: relative; overflow: hidden; border: 1px solid #e6e6e6; border-radius: 8px;">
      <iframe style="width: 100%; height: 100%; border: none;" 
              src="https://yandex.ru/maps-reviews-widget/ID_Организации?comments">
      </iframe>
      <a href="https://yandex.ru/maps/org/any/ID_Организации/" target="_blank"
         style="position:absolute; bottom:8px; left:0; right:0; text-align:center; color:#b3b3b3; font-size:10px; text-decoration:none; font-family:YS Text,sans-serif;">
        Организация на карте — Яндекс Карты
      </a>
    </div>

    <!-- Блок карты -->
    <div style="flex: 1; min-width: 320px; height: 600px; border: 1px solid #e6e6e6; border-radius: 8px; overflow: hidden;">
      <iframe 
        src="https://yandex.ru/map-widget/v1/?mode=search&oid=ID_Организации&ol=biz&z=16" 
        width="100%" 
        height="100%" 
        frameborder="0" 
        allowfullscreen="true" 
        style="border:none;">
      </iframe>
    </div>

  </div>
</div>

<!-- Мобильная адаптация -->
<style>
@media (max-width: 768px) {
  .yandex-maps-wrapper {
    padding: 10px !important;
  }
  
  .yandex-maps-wrapper > div > div {
    height: 500px !important;   /* уменьшаем высоту отзывов и карты на телефоне */
  }
}
</style>