/* ==============================
     Map Section
     ============================== */
     .map-section {
        padding: 2rem 1.5rem;
      }
      
      .map-section h3 {
        margin-bottom: 1rem;
        text-align: center;
        font-weight: var(--font-weight-bold);
        font-size: var(--font-size-main-heading);
      }
      
      .map-section p {
        text-align: center;
        max-width: 40rem;
        margin: 0 auto 2rem auto;
        color: var(--text-color);
        font-size: var(--font-size-base);
      }
      
      /* The map container */
      #map iframe {
        width: 100%;
        border: none;
        border-radius: 1.2rem;
        box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
    }

      
  @media screen and (min-width: 1000px) {
    .contact-container {
      padding: 0 2.5rem;
    }
    .map-section {
      padding: 3rem 2.5rem;
    }
  }