/* ==========================================================
   contact.css - 고객문의 화면
   ========================================================== */
.contact { display: grid; grid-template-columns: 1.4fr 1fr; gap: 32px; align-items: start; }

/* 폼 / 정보 카드 공통 */
.contact__form,
.contact__info {
  padding: 40px;
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
}

.contact__info-title { font-size: var(--fs-lg); font-weight: 700; margin-bottom: 24px; }
.contact__dl { display: grid; grid-template-columns: 64px 1fr; gap: 14px 12px; }
.contact__dl dt { font-size: var(--fs-sm); font-weight: 700; color: var(--color-primary); }
.contact__dl dd { color: var(--color-text-sub); }

.contact__dl a:hover { color: var(--color-primary); }

.contact__map {
  height: 280px;
  margin-top: 32px;
  overflow: hidden;
  background: var(--color-bg-gray);
  border-radius: var(--radius);
}
.contact__map iframe { width: 100%; height: 100%; border: 0; }

.contact__map-links { display: flex; gap: 8px; margin-top: 12px; }
.contact__map-links a {
  flex: 1;
  padding: 10px 14px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  font-size: var(--fs-sm);
  font-weight: 600;
  text-align: center;
  transition: border-color var(--transition), color var(--transition), background var(--transition);
}
.contact__map-links a:hover { border-color: var(--color-primary); color: var(--color-primary); background: var(--color-primary-light); }

@media (max-width: 768px) {
  .contact { grid-template-columns: 1fr; gap: 24px; }
  .contact__form,
  .contact__info { padding: 28px 20px; }
}