/*! Cikret Industry Landing Pages | Corvane Heating & Air sample (fictional) | scoped to .ilp-demo--hvac */

@font-face {
	font-family: "ILP Manrope";
	src: url("../fonts/manrope-var.woff2") format("woff2");
	font-weight: 200 800;
	font-display: swap;
}

.ilp-demo--hvac {
	--hv-navy: #0d2742;
	--hv-navy-2: #143559;
	--hv-cobalt: #1f63b5;
	--hv-ice: #e8f1f9;
	--hv-frost: #cfe0f1;
	--hv-ember: #c2431a;
	--hv-ember-deep: #a1360f;
	--hv-warm: #fcebe3;
	--hv-ink: #10233a;
	--hv-slate: #4a5c6f;
	--hv-line: #d7e2ed;
	--hv-font: "ILP Manrope", "Segoe UI", Arial, sans-serif;
	background: #fff;
	color: var(--hv-ink);
	font-family: var(--hv-font);
}

.hv { font-size: 1.0625rem; line-height: 1.6; }
.hv-wrap { width: min(100% - 2 * var(--ilp-gutter), 1200px); margin-inline: auto; }
.hv-h3 { font: 800 clamp(1.75rem, 1.2rem + 2.2vw, 2.75rem)/1.08 var(--hv-font); letter-spacing: -0.03em; text-wrap: balance; }
.hv-visually-hidden {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}
.hv-section-head { display: grid; gap: 12px; max-width: 720px; margin-bottom: 32px; }
.hv-section-head p { color: var(--hv-slate); font-size: 1.125rem; }

/* Buttons */
.hv-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 50px;
	padding: 12px 24px;
	border: 2px solid transparent;
	border-radius: 999px;
	font: 750 1rem/1.15 var(--hv-font);
	text-decoration: none;
	cursor: pointer;
	white-space: nowrap;
	transition: background-color .15s ease, border-color .15s ease;
}
.hv-btn--ember { background: var(--hv-ember); color: #fff; }
.hv-btn--ember:hover { background: var(--hv-ember-deep); }
.hv-btn--navy { background: var(--hv-navy); color: #fff; }
.hv-btn--navy:hover { background: #061727; }
.hv-btn--ghost { color: #fff; border-color: rgba(255, 255, 255, .45); }
.hv-btn--ghost:hover { border-color: #fff; }
.hv-btn--sm { min-height: 42px; padding: 8px 18px; font-size: .9375rem; }
.hv-btn--block { width: 100%; }

/* Header */
.hv-head { background: #fff; border-bottom: 1px solid var(--hv-line); }
.hv-head__row { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 8px 24px; padding-block: 14px; }
.hv-brand { display: inline-flex; align-items: center; gap: 10px; color: var(--hv-navy); text-decoration: none; }
.hv-brand__mark { color: var(--hv-cobalt); }
.hv-brand__name { display: grid; font: 800 1.3125rem/1 var(--hv-font); letter-spacing: -0.02em; }
.hv-brand__name span { margin-top: 3px; font-size: .8125rem; font-weight: 600; letter-spacing: 0; color: var(--hv-slate); }
.hv-nav {
	grid-column: 1 / -1;
	grid-row: 2;
	display: flex;
	gap: 22px;
	overflow-x: auto;
	scrollbar-width: none;
	white-space: nowrap;
	font-weight: 650;
	font-size: .9375rem;
}
.hv-nav::-webkit-scrollbar { display: none; }
.hv-nav a { color: var(--hv-slate); text-decoration: none; padding-block: 4px; }
.hv-nav a:hover { color: var(--hv-navy); text-decoration: underline; }
.hv-head__cta { justify-self: end; display: flex; align-items: center; gap: 16px; }
.hv-phone { color: var(--hv-navy); font-weight: 800; text-decoration: none; white-space: nowrap; }
.hv-phone:hover { text-decoration: underline; }
@media (max-width: 979px) {
	.hv-nav { -webkit-mask-image: linear-gradient(to right, #000 85%, transparent); mask-image: linear-gradient(to right, #000 85%, transparent); padding-right: 32px; }
}
@media (max-width: 560px) {
	.hv-phone { display: none; }
}
@media (min-width: 980px) {
	.hv-head__row { grid-template-columns: auto 1fr auto; }
	.hv-nav { grid-column: auto; grid-row: auto; justify-content: center; }
}

/* Hero: split panel */
.hv-hero { display: grid; background: var(--hv-navy); color: #fff; }
.hv-hero__media { order: -1; position: relative; min-height: 240px; }
.hv-hero__img { width: 100%; height: 100%; aspect-ratio: 16 / 10; object-fit: cover; object-position: 35% 50%; }
.hv-hero__copy {
	padding: clamp(28px, 5vw, 72px) var(--ilp-gutter) clamp(36px, 5vw, 72px);
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.hv-hero__kicker { font-weight: 700; font-size: .9688rem; color: #9cc4ef; margin-bottom: 12px; }
.hv-hero__title { font: 800 clamp(2.2rem, 1.3rem + 2.9vw, 3.75rem)/1.04 var(--hv-font); letter-spacing: -0.035em; max-width: 15ch; text-wrap: balance; }
.hv-hero__lead { margin-top: 18px; max-width: 48ch; color: #d6e3f1; font-size: clamp(1.0625rem, 1rem + .3vw, 1.1875rem); }
.hv-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.hv-hero__facts { list-style: none; display: grid; gap: 10px; margin-top: 30px; padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, .16); color: #d6e3f1; font-size: .9688rem; }
.hv-hero__facts strong { color: #fff; }
@media (max-width: 560px) { .hv-hero__actions .hv-btn { flex: 1 1 100%; } }
@media (min-width: 960px) {
	.hv-hero { grid-template-columns: 48fr 52fr; min-height: clamp(560px, 78vh, 720px); }
	.hv-hero__media { order: 0; }
	.hv-hero__img { position: absolute; inset: 0; aspect-ratio: auto; }
	.hv-hero__copy { padding-left: max(var(--ilp-gutter), calc((100vw - 1200px) / 2)); padding-right: clamp(32px, 4vw, 64px); }
}

/* Cool / warm triage strip */
.hv-triage { display: grid; }
.hv-triage__half { padding-block: clamp(28px, 4vw, 44px); }
.hv-triage__inner { width: min(100% - 2 * var(--ilp-gutter), 560px); margin-inline: auto; }
.hv-triage__half--cool { background: var(--hv-ice); --hv-tone: var(--hv-cobalt); --hv-tone-line: #b9d2ec; }
.hv-triage__half--warm { background: var(--hv-warm); --hv-tone: var(--hv-ember-deep); --hv-tone-line: #f1c9b7; }
.hv-triage__label { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; font-weight: 800; font-size: 1.125rem; color: var(--hv-tone); }
.hv-triage ul { list-style: none; display: grid; gap: 8px; }
.hv-triage li a {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 52px;
	padding: 12px 44px 12px 16px;
	border: 1px solid var(--hv-tone-line);
	border-radius: 12px;
	background: #fff;
	color: var(--hv-ink);
	font-weight: 650;
	text-decoration: none;
}
.hv-triage li a::after {
	content: "";
	position: absolute;
	right: 18px;
	top: 50%;
	width: 8px;
	height: 8px;
	margin-top: -5px;
	border-top: 2px solid var(--hv-tone);
	border-right: 2px solid var(--hv-tone);
	transform: rotate(45deg);
}
.hv-triage li a:hover { border-color: var(--hv-tone); }
@media (min-width: 760px) {
	.hv-triage { grid-template-columns: 1fr 1fr; }
	.hv-triage__half--cool .hv-triage__inner { margin-right: clamp(20px, 3vw, 44px); }
	.hv-triage__half--warm .hv-triage__inner { margin-left: clamp(20px, 3vw, 44px); }
}

/* Services + tabs */
.hv-services { padding-block: clamp(64px, 9vw, 112px); }
.hv-tabs__list {
	display: inline-flex;
	flex-wrap: wrap;
	gap: 4px;
	margin-bottom: 28px;
	padding: 5px;
	border-radius: 999px;
	background: var(--hv-ice);
}
.hv-tabs__list[hidden] { display: none; }
.hv-tabs__list button {
	min-height: 44px;
	padding: 8px 20px;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: var(--hv-navy);
	font: 700 1rem/1 var(--hv-font);
	cursor: pointer;
}
.hv-tabs__list button:hover { background: rgba(255, 255, 255, .7); }
.hv-tabs__list button[aria-selected="true"] { background: var(--hv-navy); color: #fff; }
@media (max-width: 559px) {
	.hv-tabs__list { display: flex; flex-wrap: nowrap; width: 100%; }
	.hv-tabs__list button { flex: 1 1 auto; min-width: 0; padding: 8px 6px; font-size: .9063rem; }
}
.hv-panel { display: grid; gap: 28px; align-items: center; }
.hv-panel + .hv-panel { margin-top: 56px; }
.hv-tabs.is-tabs .hv-panel + .hv-panel { margin-top: 0; }
.hv-panel__media { position: relative; }
.hv-panel__media img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 18px; background: var(--hv-ice); }
.hv-tag {
	position: absolute;
	left: 14px;
	bottom: 14px;
	padding: 3px 9px;
	border-radius: 999px;
	background: rgba(13, 39, 66, .85);
	color: #fff;
	font-size: .75rem;
	font-weight: 700;
}
.hv-tag--static { position: static; display: inline-block; margin-right: 6px; vertical-align: 1px; }
.hv-panel__copy h4 { font: 800 1.75rem/1.1 var(--hv-font); letter-spacing: -0.02em; margin-bottom: 10px; }
.hv-panel__copy > p { color: var(--hv-slate); max-width: 52ch; }
.hv-checks { list-style: none; display: grid; gap: 8px; margin: 18px 0 26px; }
.hv-checks li { position: relative; padding-left: 28px; font-weight: 600; }
.hv-checks li::before {
	content: "";
	position: absolute;
	left: 2px;
	top: .45em;
	width: 12px;
	height: 7px;
	border-left: 2.5px solid var(--hv-cobalt);
	border-bottom: 2.5px solid var(--hv-cobalt);
	transform: rotate(-45deg);
}
@media (min-width: 900px) {
	.hv-panel { grid-template-columns: 11fr 9fr; gap: 56px; }
}

/* Comfort plan */
.hv-plan { background: var(--hv-ice); padding-block: clamp(64px, 9vw, 112px); }
.hv-plan__grid { display: grid; gap: 32px; align-items: center; }
.hv-plan__copy p { margin-top: 14px; max-width: 40ch; color: var(--hv-slate); font-size: 1.125rem; }
.hv-plan__card {
	padding: clamp(22px, 3vw, 34px);
	border-radius: 22px;
	background: var(--hv-navy);
	color: #fff;
	box-shadow: 0 28px 50px -30px rgba(13, 39, 66, .7);
}
.hv-plan__name { font: 800 1.5rem/1 var(--hv-font); letter-spacing: -0.02em; padding-bottom: 16px; border-bottom: 1px solid rgba(255, 255, 255, .16); }
.hv-plan__list { list-style: none; margin: 4px 0 22px; }
.hv-plan__list li { display: grid; gap: 2px; padding-block: 14px; border-bottom: 1px solid rgba(255, 255, 255, .12); }
.hv-plan__list li span:first-child { font-weight: 750; }
.hv-plan__list li span:last-child { color: #b9cde3; font-size: .9688rem; }
.hv-plan__fine { margin-top: 12px; font-size: .8438rem; color: #9fb5cc; }
@media (min-width: 640px) {
	.hv-plan__list li { grid-template-columns: 1fr 1fr; gap: 16px; }
}
@media (min-width: 900px) {
	.hv-plan__grid { grid-template-columns: 5fr 6fr; gap: 64px; }
}

/* Sizing */
.hv-sizing { padding-block: clamp(64px, 9vw, 112px); }
.hv-sizing__grid { display: grid; gap: 36px; align-items: center; }
.hv-sizing__fig { margin: 0; }
.hv-sizing__fig img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 18px; background: var(--hv-ice); }
.hv-sizing__fig figcaption { margin-top: 10px; font-size: .9375rem; color: var(--hv-slate); }
.hv-sizing__copy > p { margin-top: 14px; color: var(--hv-slate); max-width: 54ch; }
.hv-factors { display: grid; gap: 0; margin: 24px 0 28px; }
.hv-factors div { padding: 14px 0; border-top: 1px solid var(--hv-line); }
.hv-factors dt { font-weight: 750; }
.hv-factors dd { color: var(--hv-slate); font-size: .9688rem; }
@media (min-width: 640px) {
	.hv-factors { grid-template-columns: 1fr 1fr; column-gap: 28px; }
	.hv-factors div { border-top: 3px solid var(--hv-frost); }
}
@media (min-width: 960px) {
	.hv-sizing__grid { grid-template-columns: 1fr 1fr; gap: 64px; }
}

/* Process */
.hv-process { background: #f6f9fc; padding-block: clamp(64px, 9vw, 112px); border-top: 1px solid var(--hv-line); }
.hv-steps { list-style: none; counter-reset: hv-step; display: grid; gap: 28px; margin-top: 36px; }
.hv-steps li { counter-increment: hv-step; position: relative; padding-left: 64px; }
.hv-steps li::before {
	content: counter(hv-step);
	position: absolute;
	left: 0;
	top: -4px;
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: #fff;
	border: 2px solid var(--hv-cobalt);
	color: var(--hv-cobalt);
	font: 800 1.125rem/1 var(--hv-font);
}
.hv-steps li:last-child::before { border-color: var(--hv-ember); color: var(--hv-ember); }
.hv-steps h4 { font: 800 1.25rem/1.2 var(--hv-font); margin-bottom: 4px; }
.hv-steps p { color: var(--hv-slate); font-size: 1rem; }
@media (min-width: 900px) {
	.hv-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; }
	.hv-steps li { padding-left: 0; padding-top: 64px; }
	.hv-steps li::after {
		content: "";
		position: absolute;
		top: 21px;
		left: 54px;
		right: -18px;
		height: 2px;
		background: linear-gradient(to right, var(--hv-frost), var(--hv-frost));
	}
	.hv-steps li:last-child::after { display: none; }
	.hv-steps li::before { top: 0; }
}

/* CTA + footer */
.hv-cta { position: relative; background: var(--hv-navy); color: #fff; padding-block: clamp(44px, 6vw, 72px); }
.hv-cta::before { content: ""; position: absolute; inset: 0 0 auto; height: 5px; background: linear-gradient(to right, #5aa2ea, var(--hv-cobalt) 35%, var(--hv-ember) 65%, #f08a5d); }
.hv-cta__row { display: grid; gap: 22px; align-items: center; }
.hv-cta__title { font: 800 clamp(1.75rem, 1.2rem + 2.2vw, 2.75rem)/1.05 var(--hv-font); letter-spacing: -0.03em; }
.hv-cta__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; }
.hv-cta__phone { color: #fff; font-weight: 800; font-size: 1.125rem; }
@media (min-width: 900px) { .hv-cta__row { grid-template-columns: 1fr auto; } }

.hv-foot { background: #071a2e; color: #a8bccf; padding-block: 28px; font-size: .9375rem; }
.hv-foot__row { display: flex; flex-wrap: wrap; gap: 8px 28px; align-items: baseline; }
.hv-foot__brand { font-weight: 800; color: #fff; }
.hv-foot__note { flex-basis: 100%; font-size: .8438rem; color: #8399ae; }
