/*!
 * Contact Visit Us — 1:2819 - 1:2843, the details rows and the bleeding map.
 *
 * Figma 1:2769 in the Monal-Pages file AlYDxKHhVoiNp5UI47BElc.
 *
 * Split from design/contact.css, which stays the source of truth. Mobile first;
 * desktop values are the frame's, as --monal-u units (1u == 1 Figma px / 10).
 */



/* ==========================================================================
   3. VISIT US  1:2819 - 1:2843
   ========================================================================== */
.monal-contact-visit { position: relative; padding: var(--monal-page-gap) 0 0; }

.monal-contact-visit .monal-contact-visit__title { color: var(--monal-c-ink); }

.monal-contact-visit__lead { margin: calc(var(--monal-u) * 1.6) 0 0; max-width: calc(var(--monal-u) * 52); }

.monal-contact-lines { margin: calc(var(--monal-u) * 3.2) 0 0; padding: 0; list-style: none; display: grid; gap: calc(var(--monal-u) * 2); }

.monal-contact-line { display: flex; align-items: center; gap: calc(var(--monal-u) * 1.8); }

/* 1:2828 — a 70 #FFE5D7 disc with the Phosphor glyph in black, 32 box. */
.monal-contact-line__disc {
  flex: none; display: grid; place-items: center;
  width: calc(var(--monal-u) * 5.2); height: calc(var(--monal-u) * 5.2);
  border-radius: 50%; background: #ffe5d7;
}

.monal-contact-line__disc .monal-i { width: 45.7%; height: 45.7%; background: var(--monal-c-black); }

/* 1:2827 — Poppins Regular 30/34 at 70%, black. */
.monal-contact-line__text {
  min-width: 0; font-size: max(calc(var(--monal-u) * 1.8), 16px); line-height: 1.35;
  color: rgba(0, 0, 0, .7); overflow-wrap: anywhere;
}

a.monal-contact-line__text:hover { color: var(--monal-c-orange); }

/* 1:2820 — the map, 1084 x 725.468: a live Google Maps embed with the
   frame's rounded left corners and thin orange outline (the right edge runs
   off the page, so it has neither). It sits outside the container, so below
   desktop it starts at the gutter and bleeds off the right edge. */
.monal-contact-visit__map {
  display: block; position: relative;
  margin: calc(var(--monal-u) * 3.2) 0 0 var(--monal-gutter);
  aspect-ratio: 1084 / 725.468;
}

.monal-contact-visit__map {
  overflow: hidden; background: #e8eaed;
  border: 1px solid var(--monal-c-orange); border-right: 0;
  border-radius: calc(var(--monal-u) * 2) 0 0 calc(var(--monal-u) * 2);
}

.monal-contact-visit__map iframe { display: block; width: 100%; height: 100%; border: 0; }

/* The image fallback carries its own corners and outline. */
.monal-contact-visit__map--image { overflow: visible; background: none; border: 0; border-radius: 0; }

.monal-contact-visit__map img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: left center; }

@media (min-width: 1200px) {
  
  
    /* --- visit us -------------------------------------------------------- */
    /* 1:2820 at y1577.42. The form section closes on the right column's last
       line (1277.2 + 53 + 72 = 1402.2), so 175.22 sits here; the section runs
       to the map's foot (2302.89). The map bleeds off the right edge (x836 ->
       1920). */
    .monal-contact-visit { padding-top: calc(var(--monal-u) * 17.522); min-height: calc(var(--monal-u) * 90.069); }
  
    .monal-contact-visit__map {
      position: absolute; top: calc(var(--monal-u) * 17.522); left: 50%;
      margin: 0 0 0 calc(var(--monal-u) * -12.4);
      width: calc(var(--monal-u) * 108.4); height: calc(var(--monal-u) * 72.547);
      aspect-ratio: auto;
    }
  
    /* 1:2823 at y1663.16 — 85.74 under the map's top. */
    .monal-contact-visit__copy { padding-top: calc(var(--monal-u) * 8.574); }
  
    .monal-contact-visit .monal-contact-visit__title {
      font-size: calc(var(--monal-u) * 6.6); line-height: calc(var(--monal-u) * 7.2);
      letter-spacing: calc(var(--monal-u) * -.264);
    }
  
    /* 1:2824 — 30 under the title, 22/36, w519.16. */
    .monal-contact-visit__lead { margin-top: calc(var(--monal-u) * 3); width: calc(var(--monal-u) * 51.92); max-width: none; font-size: calc(var(--monal-u) * 2.2); line-height: calc(var(--monal-u) * 3.6); }
  
    /* 1:2828 at y1907.16 — 70 under the two-line lead; rows on a 120 pitch. */
    .monal-contact-lines { margin-top: calc(var(--monal-u) * 7); gap: calc(var(--monal-u) * 5); }
  
    .monal-contact-line { gap: calc(var(--monal-u) * 3.4); }
  
    .monal-contact-line__disc { width: calc(var(--monal-u) * 7); height: calc(var(--monal-u) * 7); }
  
    /* 1:2839 — the address wraps at w389.797. */
    /* The 24px floor keeps the phone and email links a full tap target where
       the unit shrinks (1200-1410). */
    .monal-contact-line__text { max-width: calc(var(--monal-u) * 39); font-size: calc(var(--monal-u) * 3); line-height: max(calc(var(--monal-u) * 3.4), 24px); }
  
    /* 1:2969 / 1:2968 — the 6% ring (flourish-a, 357 square) centred on the
       left edge at y1660.5, turned -34.77deg, and at y3397.5, turned -15.23deg. */
    .monal-contact-visit::before,
    .monal-contact-faq::after {
      content: ""; position: absolute; z-index: -1; pointer-events: none;
      left: 50%; margin-left: calc(var(--monal-u) * -113.85);
      width: calc(var(--monal-u) * 35.7); height: calc(var(--monal-u) * 35.7);
      background: url(../../assets/monal/img/pages/flourish-a.svg) center / 100% 100% no-repeat;
    }
  
    /* The visit section starts at y1402.2. */
    .monal-contact-visit::before { top: calc(var(--monal-u) * 7.98); transform: rotate(-34.77deg); }
}

