/* /contact/ — builds on agency.css (hero, sections) and book-staff.css (form fields). Mobile first. */

/* Direct email and phone in the hero */
.c-direct { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 4px; }
.c-direct a {
	display: inline-flex; align-items: center; gap: 12px; min-height: 44px;
	font-size: 19px; font-weight: 500; text-decoration: none; overflow-wrap: anywhere;
}
.c-direct a:hover { text-decoration: underline; text-underline-offset: 4px; }
.c-direct .g-icon { flex: none; color: var(--g-muted); }

/* Message form: one column, readable width */
.g-contact .c-form, .g-contact .b-done { max-width: 720px; }
.c-form textarea { min-height: 160px; }
.c-form { gap: 20px; }
.c-form .b-field, .c-form .b-row .b-field { margin-bottom: 0; }
.c-form .b-row { gap: 20px 14px; }
.c-form .b-send { margin-top: 4px; }
.c-message__alt { margin: 16px 0 0; font-size: 17px; line-height: 1.5; color: var(--g-text); }
.c-message__alt a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 500; color: var(--g-ink); text-underline-offset: 4px; }

/* Desktop: intro on the left, form on the right (same 5/7 split as the hero) */
@media (min-width: 1024px) {
	.c-message { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: clamp(48px, 6vw, 112px); align-items: start; }
	.c-message .c-message__intro { grid-column: 1; grid-row: 1 / span 2; margin-bottom: 0; max-width: 460px; }
	.g-contact .c-form, .g-contact .b-done { grid-column: 2; grid-row: 1; max-width: none; }
}

/* Where to find us */
.c-places { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; }
.c-place { display: flex; flex-direction: column; background: var(--g-paper); border: 1px solid var(--g-line); }
.c-place__media { margin: 0; aspect-ratio: 3 / 2; overflow: hidden; background: var(--g-line); }
.c-place__media img { width: 100%; height: 100%; object-fit: cover; }
.c-place__body { padding: 26px 22px; border-top: 1px solid var(--g-gold); }
.c-place__addr { margin: 0 0 12px; font-size: 17px; line-height: 1.5; color: var(--g-text); }
.c-place__links { list-style: none; margin: 0; padding: 0; display: grid; }
.c-place__links a {
	display: inline-flex; align-items: center; gap: 10px; min-height: 44px;
	font-weight: 500; text-decoration: none; overflow-wrap: anywhere;
}
.c-place__links a:hover { text-decoration: underline; text-underline-offset: 4px; }
.c-place__links .g-icon { flex: none; color: var(--g-muted); }

@media (min-width: 768px) {
	.c-places { grid-template-columns: 1fr 1fr; gap: 24px; }
	.c-place__body { padding: 32px 30px; }
}
.g-contact .b-done { background: var(--g-mist); }

/* ---------- Phones and tablets (2026-11-11): less in the hero, like Book Staff.
   Title, email, phone and one button; "Book staff" is already in the top bar. ---------- */
@media (max-width: 1023px) {
	.g-contact .a-hero { min-height: max(440px, min(calc(100svh - var(--g-top-h) - var(--g-banner-h) - 56px), 720px)); }
	.g-contact .a-hero .g-eyebrow,
	.g-contact .a-hero .g-btn--outline,
	.g-contact .c-message__alt { display: none; }
	.g-contact .c-direct { margin-top: 14px; gap: 0; }
	.g-contact .c-direct a { font-size: 18px; }
	.g-contact .a-hero .g-actions { margin-top: 20px; }
}