/* Contact page (page-contact.php): details on the left, the form in a card on the right, map below. */

.ct { padding: clamp(56px, 7vw, 96px) 0 0; }
.ct__grid { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 48px 72px; align-items: start; }
.ct__title { font-size: clamp(2rem, 1.3rem + 2.4vw, 3rem); line-height: 1.06; margin: 0 0 18px; max-width: 14ch; }
.ct__lead { font-size: 1.0625rem; color: var(--wb-text-soft); max-width: 46ch; margin: 0 0 36px; }
.ct__details { list-style: none; margin: 0; padding: 0; display: grid; gap: 22px; }
.ct__details li { display: grid; grid-template-columns: 52px 1fr; gap: 18px; align-items: start; }
.ct__icon { display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 16px; background: var(--wb-bg-soft); color: var(--wb-accent); }
.ct__icon .wb-icon { width: 24px; height: 24px; stroke-width: 1.75; }
.ct__label { display: block; font-size: 0.8125rem; font-weight: 600; color: var(--wb-text-soft); margin: 4px 0 2px; }
.ct__details a { color: var(--wb-ink); font-weight: 500; line-height: 1.5; }
.ct__details a:hover { color: var(--wb-accent); }

.ct__form { padding: clamp(24px, 3vw, 40px); border: 1px solid var(--wb-line); border-radius: var(--wb-radius-xl); background: #fff; box-shadow: var(--wb-shadow-md); }
.ct__form h3 { font-size: 1.375rem; margin: 0 0 6px; }
.ct__form-note { font-size: 0.875rem; color: var(--wb-text-soft); margin: 0 0 24px; }
.ct__form .xs-from .row { margin-left: -8px; margin-right: -8px; }
.ct__form .xs-from .row > [class*="col-"] { padding-left: 8px; padding-right: 8px; }
.ct__form .xs-from .form-group { margin-bottom: 16px; box-shadow: none; border-radius: 0; overflow: visible; }
.ct__form .xs-from .form-group p { margin: 0; }
.ct__form .xs-from .form-control { height: 50px; padding: 0 18px; }
.ct__form .xs-from textarea.form-control { height: 140px; padding: 14px 18px; }
.ct__form .text-center { text-align: left !important; } /* Bootstrap's .text-center is !important */
.ct__form .text-center p { margin: 4px 0 0; }
.ct__form .btn { padding: 0 34px; }

.ct-map { padding: clamp(40px, 5vw, 72px) 0 0; }
.ct-map__panel { overflow: hidden; border-radius: var(--wb-radius-xl); border: 1px solid var(--wb-line); line-height: 0; }
.ct-map__panel iframe { width: 100%; height: 420px; border: 0; filter: saturate(0.85); }

@media (max-width: 991px) {
	.ct__grid { grid-template-columns: 1fr; gap: 40px; }
	.ct__title { max-width: none; }
}
@media (max-width: 575px) {
	.ct__details li { grid-template-columns: 44px 1fr; gap: 14px; }
	.ct__icon { width: 44px; height: 44px; }
	.ct__icon .wb-icon { width: 20px; height: 20px; }
	.ct-map__panel iframe { height: 300px; }
}
