.page-contact .contact-layout { display: grid; grid-template-columns: .7fr 1fr; gap: 8vw; }
.page-contact .contact-panel { background: var(--ink); color: #fff; border-radius: 28px; padding: 40px; }
.page-contact .contact-panel p { color: rgba(255,255,255,.65); }
.page-contact .contact-details { display: grid; gap: 25px; margin-top: 50px; }
.page-contact .contact-details div { border-top: 1px solid rgba(255,255,255,.16); padding-top: 15px; }
.page-contact .contact-details span { display: block; color: var(--accent); font-size: .78rem; font-weight: 720; }
.page-contact .contact-details p { margin: 0; }
.page-contact .contact-details a { display: inline-flex; align-items: center; min-height: 44px; }
.page-contact .map-section { background: var(--ink); color: #fff; padding: 50px 0; }
.page-contact .map-placeholder { min-height: 440px; display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; }
.page-contact .map-lines { position: relative; height: 350px; border: 1px solid rgba(255,255,255,.12); border-radius: 30px; overflow: hidden; background: #1b1e21; }
.page-contact .map-lines span { position: absolute; width: 130%; height: 2px; background: rgba(255,255,255,.12); transform: rotate(-25deg); left: -10%; }
.page-contact .map-lines span:nth-child(1) { top: 25%; }
.page-contact .map-lines span:nth-child(2) { top: 55%; transform: rotate(18deg); }
.page-contact .map-lines span:nth-child(3) { top: 75%; transform: rotate(-8deg); }
.page-contact .map-lines b { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); background: var(--accent); color: var(--ink); border-radius: 99px; padding: 12px 17px; }

@media (max-width: 760px) {
  .page-contact .contact-layout, .page-contact .map-placeholder { grid-template-columns: 1fr; }
}
@media (max-width: 430px) {
  .page-contact .contact-panel { border-radius: 18px; padding: 22px; }
  .page-contact .map-lines { height: 250px; }
}