.contact-details { display: grid; grid-template-columns: minmax(0, 1fr) minmax(340px, .85fr); gap: clamp(32px, 6vw, 90px); align-items: start; padding-block: 20px 85px; }
.contact-details-copy { padding-top: 16px; }
.contact-details-copy h2 { font-size: clamp(2rem, 4vw, 3.1rem); line-height: 1.12; margin-top: 20px; max-width: 15ch; }
.contact-details-intro { color: var(--muted); line-height: 1.8; margin-top: 24px; max-width: 48ch; }
.contact-direct-links { display: grid; gap: 24px; margin-top: 32px; }
.contact-direct-link { display: flex; align-items: flex-start; gap: 16px; }
.contact-detail-icon { display: grid; place-items: center; width: 46px; height: 46px; flex: 0 0 46px; border-radius: 13px; background: #fbe9dc; color: #bf6525; }
.contact-detail-icon svg { width: 23px; height: 23px; }
.contact-direct-link small { display: block; color: var(--muted); font-size: .76rem; line-height: 1.5; margin-bottom: 5px; }
.contact-direct-link strong { display: block; font-size: 1.05rem; line-height: 1.6; overflow-wrap: anywhere; }
a.contact-direct-link:hover strong { color: var(--accent-2); }
.contact-availability { padding: clamp(24px, 3vw, 36px); background: white; border: 1px solid var(--line); border-radius: 22px; box-shadow: 0 16px 50px #17191b05; min-width: 0; }
.contact-availability > header { display: flex; align-items: center; gap: 16px; margin-bottom: 26px; }
.contact-availability h3 { font-size: 1.35rem; line-height: 1.35; letter-spacing: -.025em; }
.contact-availability header p { margin-top: 6px; color: var(--muted); font-size: .8rem; line-height: 1.6; }
.contact-hours-list { margin: 0; }
.contact-hours-row { display: flex; align-items: start; justify-content: space-between; gap: 20px; padding: 14px 0; border-bottom: 1px solid var(--line); font-size: .86rem; line-height: 1.6; }
.contact-hours-row:last-child { border-bottom: 0; }
.contact-hours-row dt { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.contact-hours-row dd { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px 12px; margin: 0; font-weight: 600; text-align: right; font-variant-numeric: tabular-nums; }
.contact-hours-row dd span { white-space: nowrap; }
.contact-hours-row.is-closed { color: var(--muted); }
.contact-hours-row.is-today { color: #a54c13; font-weight: 700; }
.contact-hours-today { font-size: .62rem; line-height: 1.5; padding: 2px 7px; border-radius: 999px; background: #fff0e4; font-weight: 700; }
.contact-hours-timezone { margin-top: 14px; color: var(--muted); font-size: .68rem; line-height: 1.7; }
.contact-availability-note { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--line); font-size: .85rem; line-height: 1.8; color: #525c66; overflow-wrap: anywhere; }
.contact-appointment-title { color: var(--accent-2); font-size: 1.4rem; font-weight: 800; margin-bottom: 14px; }
.contact-availability-description { font-size: .9rem; line-height: 1.8; color: var(--muted); }
.contact-details-without-hours { grid-template-columns: minmax(0, 1fr); }
.contact-details-without-hours .contact-details-copy { max-width: 850px; }
.contact-details-without-hours .contact-direct-links { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
@media (max-width: 850px) { .contact-details { grid-template-columns: minmax(0, 1fr); gap: 36px; padding-bottom: 55px; } .contact-details-copy h2 { max-width: none; } }
@media (max-width: 420px) { .contact-availability { padding: 22px 18px; } .contact-hours-row { font-size: .8rem; gap: 12px; } .contact-hours-row dd { max-width: 155px; } }

.contact-submit-row { display: flex; flex-wrap: wrap; gap: 12px; }
.contact-submit-row .button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; }
.contact-submit-row .button:disabled { cursor: wait; opacity: .8; }
.contact-send-spinner { width: 18px; height: 18px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: contact-send-spin .8s linear infinite; }
.contact-send-spinner[hidden], [data-contact-errors][hidden] { display: none; }
.contact-send-status { margin: 0; color: #62675f; font-size: 14px; line-height: 1.6; }
.contact-send-status:empty { display: none; }
.contact-send-status.is-success { color: #26744d; }
.contact-send-status.is-error { color: #a52d2d; }
[data-contact-form] [aria-invalid="true"] { border-color: #bb3535; }
@keyframes contact-send-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .contact-send-spinner { animation: none; } }