/* ==========================================================================
   Let's Connect page — template-contact.php
   Built from the Let's Connect reference. Every section sits in the site
   .container, like the other pages, and the banner takes the About banner's
   heights and title scale so the two read as one family. Follows the SIZING
   RULE in theme.css: fixed px tokens on the body class, swapped at
   600 · 768 · 1080 · 1280 · 1536, no vw / vh.
   ========================================================================== */

.page-template-template-contact,
.ct-partner {
	--ct-serif: "Source Serif 4", var(--display);
	--ct-ink: #0f2548;
	--ct-navy: #0b2a4e;
	--ct-text: #3b4658;
	--ct-muted: #6f7682;
	--ct-link: #1d3b73;
	--ct-gold: #d4a64d;
	--ct-button: #d2a656;
	--ct-button-hover: #c39445;
	--ct-field-line: #c9d2df;
	--ct-placeholder: #8b95a5;
	--ct-cream: #f7f5f1;
	--ct-card: #faf9f6;
	--ct-card-line: #e5e1da;
	--ct-band: #efefee;
	--ct-band-line: #cfd3d9;

	/* Base (< 600px) */
	--ct-hero-min: 0px;
	--ct-hero-pad: 48px;
	--ct-eyebrow: 11px;
	--ct-eyebrow-rule: 32px;
	--ct-hero-title: 38px;
	--ct-hero-lede: 17px;
	--ct-hero-lede-lh: 26px;
	--ct-tagline: 10px;

	--ct-sec-y: 40px;
	--ct-grid-gap: 24px;
	--ct-form-pad: 32px 20px 28px;
	--ct-form-title: 30px;
	--ct-form-lede: 17px;
	--ct-label: 14px;
	--ct-input-h: 44px;
	--ct-input: 15px;
	--ct-submit-h: 48px;
	--ct-submit: 19px;

	--ct-card-pad: 36px 24px 36px 44px;
	--ct-card-rule-x: 22px;
	--ct-card-title: 34px;
	--ct-card-title-sm: 30px;
	--ct-card-icon: 40px;
	--ct-card-text: 17px;
	--ct-card-text-lh: 27px;

	--ct-partner-title: 28px;
	--ct-partner-text: 16px;
	--ct-map-title: 20px;
}

@media (min-width: 600px) {
	.page-template-template-contact,
	.ct-partner {
		--ct-form-pad: 40px 36px 32px;
		--ct-card-pad: 40px 36px 40px 60px;
		--ct-card-rule-x: 30px;
		--ct-partner-title: 32px;
	}
}

@media (min-width: 768px) {
	.page-template-template-contact,
	.ct-partner {
		--ct-hero-title: 46px;
		--ct-hero-lede: 19px;
		--ct-hero-lede-lh: 28px;

		--ct-sec-y: 56px;
	}
}

@media (min-width: 1080px) {
	.page-template-template-contact,
	.ct-partner {
		--ct-hero-min: 380px;
		--ct-hero-pad: 56px;
		--ct-eyebrow: 12px;
		--ct-eyebrow-rule: 40px;
		--ct-hero-title: 52px;
		--ct-tagline: 11px;

		--ct-sec-y: 72px;
		--ct-grid-gap: 40px;
		--ct-form-pad: 44px 48px 40px;
		--ct-form-title: 34px;
		--ct-form-lede: 17px;
		--ct-input-h: 48px;
		--ct-input: 15px;
		--ct-submit-h: 52px;

		--ct-card-pad: 44px 44px 40px 72px;
		--ct-card-rule-x: 34px;
		--ct-card-title: 38px;
		--ct-card-title-sm: 32px;
		--ct-card-text: 18px;
		--ct-card-text-lh: 29px;

		--ct-partner-title: 30px;
		--ct-partner-text: 15.5px;
		--ct-map-title: 19px;
	}
}

@media (min-width: 1280px) {
	.page-template-template-contact,
	.ct-partner {
		--ct-hero-min: 400px;
		--ct-hero-title: var(--hero-title);
		--ct-hero-lede: 21px;
		--ct-hero-lede-lh: 30px;

		--ct-sec-y: 88px;
		--ct-grid-gap: 48px;
		--ct-form-pad: 52px 60px 48px;
		--ct-form-title: 36px;
		--ct-form-lede: 18px;

		--ct-card-pad: 52px 52px 48px 84px;
		--ct-card-rule-x: 40px;
		--ct-card-title: 40px;
		--ct-card-title-sm: 34px;
		--ct-card-text: 19px;

		--ct-partner-title: 35px;
		--ct-partner-text: 16.5px;
		--ct-map-title: 20px;
	}
}

@media (min-width: 1536px) {
	.page-template-template-contact,
	.ct-partner {
		/* The About banner renders at 423 here (its copy outgrows 411). */
		--ct-hero-min: 423px;
		--ct-hero-lede: 23px;
		--ct-hero-lede-lh: 31px;
	}
}

/* --- Shared ------------------------------------------------------------------ */

.ct-eyebrow {
	display: flex;
	align-items: center;
	gap: 13px;
	margin: 0;
	font-family: var(--sans);
	font-size: var(--ct-eyebrow);
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: var(--ct-muted);
}

.ct-eyebrow::before {
	content: "";
	flex: none;
	width: var(--ct-eyebrow-rule);
	height: 2px;
	background: var(--ct-gold);
}

.ct-eyebrow--light {
	color: #fff;
}

.ct-rule {
	display: block;
	width: 32px;
	height: 3px;
	background: var(--ct-gold);
}

/* --- Banner ------------------------------------------------------------------ */

/* Same frame as the About banner: copy on the site container, vertically
   centred in a fixed minimum height, the tagline pinned bottom-right to the
   container's right edge. */
.ct-hero {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: var(--ct-hero-min);
	overflow: hidden;
	background: #0d2146;
	color: #fff;
}

.ct-hero__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 62% 31%;
}

/* Small screens: the whole photo sits under an even wash. */
.ct-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(180deg, rgba(8, 22, 50, 0.74) 0%, rgba(8, 22, 50, 0.62) 100%);
}

.ct-hero__inner,
.ct-hero__tagline {
	position: relative;
	z-index: 2;
}

.ct-hero__inner {
	padding-block: var(--ct-hero-pad);
}

.ct-hero__title {
	margin: 22px 0 0;
	font-family: var(--ct-serif);
	font-size: var(--ct-hero-title);
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: -0.012em;
	color: #fff;
	text-wrap: balance;
}

.ct-hero__lede {
	max-width: 650px;
	margin: 20px 0 0;
	font-size: var(--ct-hero-lede);
	line-height: var(--ct-hero-lede-lh);
	color: rgba(255, 255, 255, 0.94);
	text-wrap: pretty;
}

.ct-hero__tagline {
	margin: calc(var(--ct-hero-pad) * -0.5) 0 0;
	padding: 0 var(--gutter) var(--ct-hero-pad);
	font-size: var(--ct-tagline);
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.92);
	text-shadow: 0 1px 6px rgba(8, 22, 50, 0.85);
}

@media (min-width: 768px) {
	.ct-hero__title span,
	.ct-hero__lede span {
		display: block;
	}

	.ct-hero__lede {
		max-width: none;
	}
}

@media (min-width: 1080px) {
	/* Navy holds the copy on the left, then gives way to the photograph. */
	.ct-hero::before {
		background:
			linear-gradient(90deg, rgba(8, 22, 50, 0.84) 0%, rgba(8, 22, 50, 0.72) 34%, rgba(8, 22, 50, 0.42) 47%, rgba(8, 22, 50, 0) 62%),
			linear-gradient(0deg, rgba(8, 22, 50, 0.45) 0%, rgba(8, 22, 50, 0) 26%);
	}

	.ct-hero__tagline {
		position: absolute;
		right: max(var(--gutter), calc(50% - var(--container) / 2 + var(--gutter)));
		bottom: 26px;
		margin: 0;
		padding: 0;
	}
}

/* --- Message form + Call or Text --------------------------------------------- */

.ct-connect {
	padding-block: var(--ct-sec-y);
	background: var(--ct-cream);
	scroll-margin-top: var(--header-h);
}

.ct-connect__grid {
	display: grid;
	gap: var(--ct-grid-gap);
}

@media (min-width: 1080px) {
	.ct-connect__grid {
		grid-template-columns: minmax(0, 762fr) minmax(0, 539fr);
		align-items: stretch;
	}
}

.ct-form-card {
	padding: var(--ct-form-pad);
	background: var(--ct-card);
	border: 1px solid var(--ct-card-line);
	border-radius: 6px;
}

.ct-form-card .ct-rule {
	margin-left: -8px;
}

.ct-form-card__title {
	margin: 14px 0 0;
	font-family: var(--ct-serif);
	font-size: var(--ct-form-title);
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: var(--ct-ink);
}

.ct-form-card__lede {
	margin: 8px 0 0;
	font-size: var(--ct-form-lede);
	line-height: 1.4;
	color: var(--ct-text);
}

.ct-notice {
	margin: 14px 0 0;
	padding: 12px 16px;
	border-radius: 4px;
	font-size: 15px;
	line-height: 1.45;
}

.ct-notice--ok {
	background: #eef5ef;
	border: 1px solid #b9d4bf;
	color: #24503a;
}

.ct-notice--bad {
	background: #fbeeee;
	border: 1px solid #e4b9b9;
	color: #7a2323;
}

.ct-form {
	position: relative;
	display: grid;
	gap: 20px 24px;
	margin-top: 28px;
}

@media (min-width: 600px) {
	.ct-form {
		grid-template-columns: 1fr 1fr;
	}

	.ct-field--full,
	.ct-submit,
	.ct-form__note {
		grid-column: 1 / -1;
	}
}

@media (min-width: 1080px) {
	.ct-form {
		gap: 24px 28px;
		margin-top: 32px;
	}
}

.ct-field {
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-width: 0;
}

.ct-field label {
	font-size: var(--ct-label);
	font-weight: 700;
	line-height: 1.3;
	color: var(--ct-ink);
}

.ct-field input,
.ct-field textarea {
	width: 100%;
	min-height: var(--ct-input-h);
	padding: 0 15px;
	font: inherit;
	font-size: var(--ct-input);
	color: var(--ct-ink);
	background: #fff;
	border: 1px solid var(--ct-field-line);
	border-radius: 4px;
	transition: border-color 0.2s var(--ease), box-shadow 0.2s var(--ease);
}

.ct-field textarea {
	display: block;
	height: 132px;
	min-height: 96px;
	padding-block: 12px;
	line-height: 1.45;
	resize: vertical;
}

.ct-field input::placeholder,
.ct-field textarea::placeholder {
	color: var(--ct-placeholder);
	opacity: 1;
}

.ct-field input:focus,
.ct-field textarea:focus {
	outline: none;
	border-color: var(--ct-gold);
	box-shadow: 0 0 0 3px rgba(212, 166, 77, 0.25);
}

.ct-submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 14px;
	width: 100%;
	min-height: var(--ct-submit-h);
	margin-top: 8px;
	padding: 0 24px;
	font-family: var(--ct-serif);
	font-size: var(--ct-submit);
	font-weight: 600;
	color: var(--ct-ink);
	background: var(--ct-button);
	border: 0;
	border-radius: 3px;
	cursor: pointer;
	transition: background-color 0.2s var(--ease);
}

.ct-submit:hover {
	background: var(--ct-button-hover);
}

.ct-submit:focus-visible {
	outline: 2px solid var(--ct-ink);
	outline-offset: 2px;
}

.ct-submit svg {
	width: 18px;
	height: 14px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.6;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.ct-form__note {
	margin: 0;
	font-size: 12.5px;
	line-height: 16px;
	color: var(--ct-text);
}

/* Navy card */

.ct-card {
	position: relative;
	padding: var(--ct-card-pad);
	color: #fff;
	background: var(--ct-navy);
	border-radius: 6px;
}

.ct-card::before {
	content: "";
	position: absolute;
	top: 36px;
	bottom: 36px;
	left: var(--ct-card-rule-x);
	width: 1px;
	background: rgba(255, 255, 255, 0.38);
}

.ct-card .ct-eyebrow {
	gap: 10px;
	font-size: 11px;
	letter-spacing: 0.2em;
}

.ct-card .ct-eyebrow::before {
	width: 28px;
}

.ct-card__title {
	margin: 12px 0 0;
	font-family: var(--ct-serif);
	font-size: var(--ct-card-title);
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: #fff;
}

.ct-card__title--sm {
	font-size: var(--ct-card-title-sm);
}

.ct-card__list {
	display: grid;
	gap: 16px;
	margin: 28px 0 0;
	padding: 0;
	list-style: none;
}

.ct-card__list li {
	display: flex;
	align-items: center;
	gap: 20px;
	font-size: var(--ct-card-text);
	line-height: var(--ct-card-text-lh);
}

.ct-card__list a {
	color: #fff;
	text-decoration: none;
	overflow-wrap: anywhere;
}

.ct-card__list a:hover,
.ct-card__list a:focus-visible {
	color: var(--ct-gold);
}

.ct-card__icon {
	display: grid;
	flex: none;
	place-items: center;
	width: var(--ct-card-icon);
	height: var(--ct-card-icon);
	color: var(--ct-gold);
	border: 1.5px solid currentColor;
	border-radius: 50%;
}

.ct-card__icon svg {
	width: 20px;
	height: 20px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.6;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.ct-card__icon--solid svg {
	fill: currentColor;
	stroke: none;
}

.ct-card__icon--pin svg circle {
	fill: var(--ct-navy);
}

.ct-card__address {
	display: flex;
	flex-direction: column;
	font-style: normal;
}

.ct-card__divider {
	height: 1px;
	margin: 36px 0 32px;
	background: rgba(255, 255, 255, 0.35);
	border: 0;
}

.ct-card__list:last-child {
	margin-top: 28px;
}

.ct-schedule {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 52px;
	margin-top: 32px;
	padding: 0 18px;
	font-family: var(--ct-serif);
	font-size: 16px;
	white-space: nowrap;
	font-weight: 600;
	color: var(--ct-ink);
	text-decoration: none;
	background: var(--ct-button);
	border-radius: 3px;
	transition: background-color 0.2s var(--ease);
}

@media (min-width: 600px) {
	.ct-schedule {
		gap: 12px;
		padding: 0 28px;
		font-size: 18px;
	}
}

.ct-schedule:hover {
	background: var(--ct-button-hover);
}

.ct-schedule:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 3px;
}

.ct-schedule svg {
	flex: none;
	width: 20px;
	height: 20px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.6;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* --- Lending partner + licensed states ---------------------------------------- */

.ct-partner {
	padding: 26px 0 28px;
	background: var(--ct-band);
	border-bottom: 2px solid var(--ct-ink);
}

.ct-partner__grid {
	display: grid;
	gap: 28px;
}

.ct-partner__title {
	margin: 8px 0 0;
	font-family: var(--ct-serif);
	font-size: var(--ct-partner-title);
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: -0.012em;
	color: var(--ct-ink);
}

@media (max-width: 599px) {
	html[data-lang="en"] .ct-partner__title {
		font-size: 24px;
		white-space: nowrap;
	}
}

@media (max-width: 359px) {
	html[data-lang="en"] .ct-partner__title {
		font-size: 20px;
	}
}

.ct-partner__lede {
	margin: 10px 0 0;
	font-size: var(--ct-partner-text);
	line-height: 1.3;
	color: #4b5563;
}

.ct-partner__nmls {
	display: flex;
	flex-direction: column;
	margin: 12px 0 0;
	font-size: var(--ct-partner-text);
	line-height: 23px;
	color: var(--ct-link);
}

.ct-partner__brand {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 18px 36px;
	padding-block: 22px;
	border-block: 1px solid var(--ct-band-line);
}

.ct-partner__logo {
	display: block;
	width: 150px;
	height: auto;
}

.ct-partner__links {
	display: grid;
	gap: 14px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ct-partner__links a {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	font-size: 13px;
	line-height: 1.3;
	color: var(--ct-link);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.ct-partner__links a:hover,
.ct-partner__links a:focus-visible {
	color: var(--ct-ink);
}

.ct-partner__links svg {
	flex: none;
	width: 20px;
	height: 20px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.ct-partner__map {
	margin: 0;
	min-width: 0;
}

.ct-map__title {
	margin: 0;
	font-family: var(--ct-serif);
	font-size: var(--ct-map-title);
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: -0.01em;
	color: var(--ct-ink);
}

.ct-map {
	position: relative;
	margin-top: 8px;
	aspect-ratio: 1160 / 640;
}

.ct-map svg {
	display: block;
	width: 100%;
	height: 100%;
	font-family: var(--sans);
}

.ct-map__state {
	fill: url(#ct-gray);
	stroke: #fff;
	stroke-width: 1.5;
	vector-effect: non-scaling-stroke;
	transition: filter 0.15s ease;
}

.ct-map__state.is-active,
.ct-map__box.is-active {
	fill: url(#ct-gold);
}

.ct-map__state:hover {
	filter: brightness(1.06);
}

.ct-map__label,
.ct-map__box-label {
	fill: #fff;
	font-weight: 700;
	text-anchor: middle;
	dominant-baseline: middle;
	pointer-events: none;
}

/* Sizes are in viewBox units: the column shows the 1160-unit map at about
   460 px, so these land near the reference's 8 px labels. */
.ct-map__label {
	font-size: 19px;
}

.ct-map__box-label {
	font-size: 17px;
}

.ct-map__line {
	fill: none;
	stroke: #a8aaad;
	stroke-width: 1.2;
	vector-effect: non-scaling-stroke;
}

.ct-map__box {
	fill: url(#ct-gray);
	stroke: #fff;
	stroke-width: 1;
}

.ct-map__tooltip {
	position: absolute;
	z-index: 3;
	padding: 7px 10px;
	font-size: 12px;
	line-height: 1.35;
	white-space: nowrap;
	color: #fff;
	background: var(--ct-navy);
	border-radius: 7px;
	box-shadow: 0 5px 18px rgba(0, 0, 0, 0.18);
	opacity: 0;
	pointer-events: none;
	transform: translate(-50%, -115%);
}

.ct-map__tooltip.is-shown {
	opacity: 1;
}

.ct-map__status {
	position: absolute;
	inset: 0;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	padding: 20px;
	font-size: 13px;
	text-align: center;
	color: var(--ct-muted);
}

.ct-map__status[hidden] {
	display: none;
}

.ct-map__caption {
	max-width: 430px;
	margin-top: 6px;
	font-size: 11px;
	line-height: 14px;
	color: var(--ct-muted);
}

@media (min-width: 1080px) {
	.ct-partner {
		padding: 10px 0 14px;
	}

	.ct-partner__grid {
		grid-template-columns: minmax(0, 556fr) 244px minmax(0, 520fr);
		gap: 0;
	}

	/* The map (Alaska and Hawaii included) sets the band's height; the copy
	   and logo columns sit centred against it. */
	.ct-partner__copy {
		align-self: center;
		padding: 0 20px 0 0;
	}

	.ct-partner__brand {
		flex-direction: column;
		flex-wrap: nowrap;
		align-items: flex-start;
		justify-content: center;
		gap: 0;
		margin-block: 15px;
		padding: 0 20px 0 22px;
		border-block: 0;
		border-inline: 1px solid var(--ct-band-line);
	}

	.ct-partner__links {
		gap: 0;
		margin-top: 22px;
	}

	.ct-partner__links li {
		padding-left: 16px;
	}

	.ct-partner__links li + li {
		margin-top: 13px;
	}

	.ct-partner__map {
		padding-left: 63px;
	}
}

@media (min-width: 1280px) {
	.ct-partner__lede span {
		display: block;
	}
}

/* On a phone the map is ~350 px wide; larger viewBox type keeps labels legible. */
@media (max-width: 599px) {
	.ct-map__label {
		font-size: 24px;
	}

	.ct-map__box-label {
		font-size: 19px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ct-field input,
	.ct-field textarea,
	.ct-submit,
	.ct-schedule,
	.ct-map__state {
		transition: none;
	}
}