/* ===========================================================================
   Helios — Contact slide widget
   Form field styling itself lives in hl-core (.hl-form / .hl-field).
   ======================================================================== */

/* 1 : 1.15 — the form gets slightly more room than the info column, because a
   cramped seven-field form is what actually loses submissions. */
.hl-contact {
	display: grid;
	grid-template-columns: 1fr 1.15fr;
	gap: clamp(34px, 6vw, 90px);
	align-items: start;
	width: 100%;
	max-width: var(--hl-wrap);
	margin-inline: auto;
}

.hl-contact__info dl {
	display: grid;
	gap: 22px;
	margin: 34px 0 0;
}
.hl-contact__info dt {
	margin-bottom: 5px;
	font-size: .62rem;
	letter-spacing: .24em;
	text-transform: uppercase;
}
.hl-contact__info dd {
	margin: 0;
	font-size: 1rem;
	line-height: 1.6;
}

/* The hotline is the loudest thing on the slide after the heading: in this
   market the phone call is the conversion, not the form. */
.hl-contact__tel a {
	font-family: var(--hl-f-display);
	font-size: clamp(1.7rem, 3vw, 2.5rem);
	line-height: 1.1;
	color: var(--hl-w-accent, var(--hl-sun));
}

.hl-form__status:empty { display: none; }
.hl-form__status {
	margin: 0;
	font-size: .78rem;
	line-height: 1.6;
	color: var(--hl-error) !important;
}

.hl-contact__credit {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	justify-content: space-between;
	width: 100%;
	max-width: var(--hl-wrap);
	margin: clamp(28px, 4vw, 44px) auto 0;
}

@media (max-width: 1080px) {
	.hl-contact {
		grid-template-columns: 1fr;
		gap: 38px;
	}
}

@media (max-width: 720px) {
	.hl-contact__info dl { margin-top: 24px; }
	.hl-contact__credit { margin-top: 34px; }
}