/* SONARIA — contact form */
.contact-tel { display: grid; grid-template-columns: 240px 1fr; border: 1px solid var(--navy); border-radius: var(--radius); overflow: hidden; }
.contact-tel__head { display: flex; align-items: center; gap: 10px; padding: 18px 22px; background: var(--navy); color: #fff; font-weight: 700; }
.contact-tel__head .icon { width: 24px; height: 24px; color: var(--orange); }
.contact-tel__body { padding: 14px 24px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 20px; }
.contact-tel__num { font: 600 28px var(--font-en); letter-spacing: .06em; color: var(--navy); }
.contact-tel__hours { font-size: 13px; color: var(--ink-2); }
.text-link { color: var(--navy); text-decoration: underline; text-underline-offset: 3px; }

.contact-form, .contact-confirm { position: relative; }
.form-error-summary { margin-bottom: 24px; padding: 16px 20px; border: 1px solid var(--red); border-left-width: 4px; border-radius: var(--radius); background: #fff7f6; color: var(--red); font-size: 14px; }
.form-error-summary:focus { outline: none; }
.form-error-summary ul { margin-top: 6px; padding-left: 1.2em; list-style: disc; }
.form-error-summary a { color: var(--red); text-decoration: underline; }
.form-agree .field-error { margin-top: 8px; }
.form-agree a { color: var(--navy); }

.contact-confirm .table-info td { white-space: pre-wrap; word-break: break-word; }
.contact-confirm .h-line:focus { outline: none; }
.contact-confirm [data-send][aria-busy="true"] { opacity: .6; pointer-events: none; }
.contact-confirm .note--warn { display: block; color: var(--ink); }
.contact-confirm .note--warn a { color: var(--navy); text-decoration: underline; }

.contact-done { display: flex; gap: 20px; align-items: flex-start; padding: 32px; border: 1px solid var(--line); border-radius: var(--radius-lg); }
.contact-done__icon { width: 40px; height: 40px; padding: 8px; border-radius: 50%; background: var(--orange); color: #fff; }
.contact-done p { font-size: 15.5px; line-height: 2; }

@media (max-width: 860px) {
  .contact-tel { grid-template-columns: 1fr; }
  .contact-tel__head { padding: 12px 16px; }
  .contact-tel__body { padding: 12px 16px; }
  .contact-tel__num { font-size: 24px; }
  .contact-done { padding: 22px 18px; gap: 14px; }
  .contact-confirm .form-actions { flex-direction: column-reverse; }
}
