/* Contact page. Form controls come from quote.css (#quote-form scope). */

.ts-ct-hero {
	position: relative; overflow: hidden;
	background:
		radial-gradient(900px 420px at 85% 0%, rgba(47, 143, 196, .16), transparent 60%),
		var(--ts-deep);
	color: rgba(255, 255, 255, .75);
	padding-block: clamp(56px, 7vw, 96px) clamp(64px, 8vw, 112px);
}
.ts-ct-hero__title { font-family: var(--ts-font-display); font-weight: 800; font-size: clamp(44px, 5.4vw, 76px); line-height: 1; letter-spacing: -0.035em; color: #fff; }
.ts-ct-hero__lead { margin-top: 18px; font-size: 19px; line-height: 1.6; max-width: 52ch; color: rgba(255, 255, 255, .72); }

.ts-ct-body { padding-block: 0 var(--ts-section); }
.ts-ct-grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 28px; align-items: start; margin-top: -56px; position: relative; }
.ts-ct-main #quote-form .ts-q-form { max-width: none; }
.ts-ct-main #quote-form .ts-q-section { box-shadow: 0 30px 60px -40px rgba(15, 42, 30, .45); }
.ts-ct-main .ts-c-sent { max-width: none; background: var(--ts-surface); }

.ts-ct-side { display: grid; gap: 16px; position: sticky; top: calc(var(--ts-header-h) + 52px); }
.ts-ct-card { padding: 24px; border: 1px solid var(--ts-line); border-radius: var(--ts-r-md); background: var(--ts-surface); color: var(--ts-ink); }
.ts-ct-card p { margin: 8px 0 14px; font-size: 15px; color: var(--ts-muted); }
.ts-ct-card__title { font-family: var(--ts-font-display); font-weight: 800; font-size: 20px; line-height: 1.2; color: var(--ts-ink); }
.ts-ct-card--dark { background: radial-gradient(400px 200px at 100% 0%, rgba(47, 143, 196, .2), transparent 70%), var(--ts-deep); border-color: var(--ts-deep); color: #fff; }
.ts-ct-card--dark .ts-icon { width: 28px; height: 28px; color: var(--ts-frost); margin-bottom: 14px; }
.ts-ct-card--dark .ts-ct-card__title { color: #fff; }
.ts-ct-card--dark p { color: rgba(255, 255, 255, .68); }
.ts-ct-card__email { display: inline-block; font-weight: 600; font-size: 17px; color: #fff; text-decoration: underline; text-underline-offset: 4px; text-decoration-color: rgba(255, 255, 255, .4); word-break: break-all; }
.ts-ct-card__email:hover { text-decoration-color: #fff; }

@media (max-width: 960px) {
	.ts-ct-grid { grid-template-columns: 1fr; margin-top: -40px; }
	.ts-ct-side { position: static; }
}