/* Contact page (src/pages/Contact.jsx). Prefix: m2-contact-. */

/* ---------- form card ---------- */
.m2-contact-card { padding: clamp(24px, 3vw, 40px); }
/* .m2-form sets display:grid, which would beat the UA [hidden] rule; keep the hidden form hidden. */
.m2-form[hidden] { display: none; }

/* ---------- aside: details card + map ---------- */
.m2-contact-aside { display: flex; flex-direction: column; gap: 20px; }
.m2-contact-info { background: #020617; color: #fff; border-radius: 12px; padding: 28px; }
.m2-contact-info__logo { height: 28px; width: auto; display: block; margin-bottom: 22px; }
.m2-contact-info__list { margin: 0; display: grid; gap: 18px; }
.m2-contact-info__dt { font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #7aa8e6; margin-bottom: 6px; }
.m2-contact-info__dt--connect { margin-bottom: 8px; }
.m2-contact-info__dd { margin: 0; font-size: 16px; color: #e2e8f0; }
.m2-contact-info__link { color: #fff; font-weight: 600; font-size: 16px; text-decoration: none; }
.m2-contact-info__link:hover { color: #a8c7ef; }
.m2-contact-info__social { margin: 0; display: flex; gap: 10px; }
.m2-contact-info__in { width: 44px; height: 44px; border: 1px solid #334155; border-radius: 8px; display: grid; place-items: center; color: #fff; text-decoration: none; font-weight: 700; font-size: 14px; }
.m2-contact-info__in:hover { border-color: #4a86d8; color: #a8c7ef; }
.m2-contact-map { width: 100%; height: 260px; border: 1px solid #e2e8f0; border-radius: 12px; display: block; background: #e2e8f0; }