/* =========================================================
   Contacts — Mobile-only polish (SAFE)
   Loaded ONLY on mobile via media attr in contacts.php
   Desktop is untouched.
   ========================================================= */

/* 1) Address icon aligned to the first line (like the other icons) */
body.cnc-contacts-page .cnc-contact-link--address{
  align-items: flex-start;
}
body.cnc-contacts-page .cnc-contact-link--address .cnc-contact-icon{
  margin-top: 2px;
  flex: 0 0 auto;
}

/* 2) Make the watercolor/map block visually larger on mobile */
@media (max-width: 768px){
  body.cnc-contacts-page .cnc-contact-art{
    height: clamp(240px, 48vw, 360px);
  }
  body.cnc-contacts-page .cnc-contact-art picture,
  body.cnc-contacts-page .cnc-contact-art img{
    height: 100%;
  }
  body.cnc-contacts-page .cnc-contact-art img{
    width: 100%;
    object-fit: cover;
    object-position: 50% 50%;
  }
}

/* 3) RESTORE the glass band + icons overlay ON MOBILE
      (style.css hides it under 680px; we override here, mobile-only)
      - Band is NOT clickable (blocks map clicks under it)
      - Links/text remain clickable above the band
*/
@media (max-width: 768px){
  body.cnc-contacts-page .cnc-contact-veil,
  body.cnc-contacts-page .cnc-veil-click-blocker{
    display: block !important;
  }

  body.cnc-contacts-page .cnc-contact-veil{
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: min(92%, 560px) !important;
    height: clamp(138px, 25vw, 188px) !important;
    border-radius: 6px !important;
    background: linear-gradient(180deg, rgba(247,242,236,0.56), rgba(247,242,236,0.34)) !important;
    border: 1px solid rgba(220, 194, 179, 0.30) !important;
    box-shadow: 0 14px 34px rgba(72, 52, 40, 0.06) !important;
    backdrop-filter: blur(16px) saturate(1.05) !important;
    -webkit-backdrop-filter: blur(16px) saturate(1.05) !important;
    pointer-events: none !important;
    z-index: 2 !important;
  }

  /* blocker sits above the map, below the text */
  body.cnc-contacts-page .cnc-veil-click-blocker{
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: min(92%, 560px) !important;
    height: clamp(138px, 25vw, 188px) !important;
    border-radius: 6px !important;
    background: transparent !important;
    pointer-events: auto !important;
    z-index: 3 !important;
  }

  /* bring the overlay back ON TOP of the band */
  body.cnc-contacts-page .cnc-contact-overlay{
    position: absolute !important;
    inset: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    padding: 14px 14px !important;
    text-align: center !important;
    pointer-events: none !important;
    z-index: 4 !important;
  }

  body.cnc-contacts-page .cnc-contact-inline{
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
  }

  body.cnc-contacts-page .cnc-contact-link{
    width: auto !important;
    justify-content: center !important;
  }

  /* keep map clickable elsewhere */
  body.cnc-contacts-page .cnc-map-hitarea{
    z-index: 1 !important;
  }
}

/* FINAL FIX 2026-04-25 — center the Maps arch on mobile */
@media (max-width: 768px){
  body.cnc-contacts-page .cnc-sheet-intro-grid{
    display: grid !important;
    grid-template-columns: 1fr !important;
    justify-items: center !important;
  }

  body.cnc-contacts-page .cnc-sheet-map-wrap{
    width: min(78vw, 470px) !important;
    max-width: 100% !important;
    margin: 34px auto 0 !important;
    justify-self: center !important;
    align-self: center !important;
    transform: none !important;
  }

  body.cnc-contacts-page .cnc-sheet-map-arch{
    width: 100% !important;
    margin: 0 auto !important;
  }

  body.cnc-contacts-page .cnc-sheet-map-link{
    width: 100% !important;
    justify-content: center !important;
    text-align: center !important;
  }
}