/*
 * Smooth scrolling for in-page anchor clicks (the .as-icons tiles
 * jump to #commissioning / #testing / #energy-audits / etc.). This
 * was Bootstrap's default :root rule and got dropped when the top
 * of this file was trimmed. scroll-behavior has to live on the
 * actual scrolling container (:root / html), not on .lp-frame, so
 * this rule is intentionally NOT scoped — lp-services.css only
 * loads on the LP page templates registered in
 * rev_lp_template_assets_map(), so the behavior is naturally
 * confined to those pages. The (prefers-reduced-motion) wrapper
 * respects users who have requested reduced motion in their OS.
 */
@media (prefers-reduced-motion: no-preference) {
	:root {
		scroll-behavior: smooth;
	}
}

.lp-frame .row {
	--bs-gutter-x: 0;
	--bs-gutter-y: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-top: calc(var(--bs-gutter-y) * -1);
	margin-right: calc(var(--bs-gutter-x) / -2);
	margin-left: calc(var(--bs-gutter-x) / -2);
}
.lp-frame .row > * {
	-ms-flex-negative: 0;
	flex-shrink: 0;
	width: 100%;
	max-width: 100%;
	padding-right: calc(var(--bs-gutter-x) / 2);
	padding-left: calc(var(--bs-gutter-x) / 2);
	margin-top: var(--bs-gutter-y);
}

.lp-frame .col {
	-webkit-box-flex: 1;
	-ms-flex: 1 0 0;
	flex: 1 0 0;
}

.lp-frame .col-12 {
	-webkit-box-flex: 0;
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	width: 100%;
}

@media (min-width: 768px) {
	.lp-frame .col-md-5 {
		-webkit-box-flex: 0;
		-ms-flex: 0 0 auto;
		flex: 0 0 auto;
		width: 41.6666666667%;
	}
	.lp-frame .col-md-6 {
		-webkit-box-flex: 0;
		-ms-flex: 0 0 auto;
		flex: 0 0 auto;
		width: 50%;
	}
	.lp-frame .col-md-7 {
		-webkit-box-flex: 0;
		-ms-flex: 0 0 auto;
		flex: 0 0 auto;
		width: 58.3333333333%;
	}
}

@media (min-width: 992px) {
	.lp-frame .col-lg-2 {
		-webkit-box-flex: 0;
		-ms-flex: 0 0 auto;
		flex: 0 0 auto;
		width: 16.6666666667%;
	}
	.lp-frame .col-lg-4 {
		-webkit-box-flex: 0;
		-ms-flex: 0 0 auto;
		flex: 0 0 auto;
		width: 33.3333333333%;
	}
	.lp-frame .col-lg-6 {
		-webkit-box-flex: 0;
		-ms-flex: 0 0 auto;
		flex: 0 0 auto;
		width: 50%;
	}
	.lp-frame .col-lg-8 {
		-webkit-box-flex: 0;
		-ms-flex: 0 0 auto;
		flex: 0 0 auto;
		width: 66.6666666667%;
	}
}

/* Buttons (base + .btn-green only — the only button color used on the page) */
.lp-frame .btn {
	display: inline-block;
	font-weight: 400;
	line-height: 1.5;
	color: #2d2e32;
	text-align: center;
	text-decoration: none;
	vertical-align: middle;
	cursor: pointer;
	-webkit-user-select: none;
	-ms-user-select: none;
	user-select: none;
	background-color: transparent;
	border: 1px solid transparent;
	padding: .375rem .75rem;
	font-size: 1rem;
	border-radius: .25rem;
	-webkit-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
	transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
	.lp-frame .btn {
		-webkit-transition: none;
		transition: none;
	}
}
.lp-frame .btn:hover {
	color: #2d2e32;
}
.lp-frame .btn:focus {
	outline: 0;
	box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .25);
}
.lp-frame .btn:disabled,
.lp-frame .btn.disabled {
	pointer-events: none;
	opacity: .65;
}

.lp-frame .btn-green {
	color: #000;
	background-color: #7dc371;
	border-color: #7dc371;
}
.lp-frame .btn-green:hover {
	color: #000;
	background-color: #91cc86;
	border-color: #8ac97f;
}
.lp-frame .btn-green:focus {
	color: #000;
	background-color: #91cc86;
	border-color: #8ac97f;
	box-shadow: 0 0 0 .25rem rgba(106, 166, 96, .5);
}
.lp-frame .btn-green:active,
.lp-frame .btn-green.active {
	color: #000;
	background-color: #97cf8d;
	border-color: #8ac97f;
}
.lp-frame .btn-green:active:focus,
.lp-frame .btn-green.active:focus {
	box-shadow: 0 0 0 .25rem rgba(106, 166, 96, .5);
}
.lp-frame .btn-green:disabled,
.lp-frame .btn-green.disabled {
	color: #000;
	background-color: #7dc371;
	border-color: #7dc371;
}

/* Utility classes */
.lp-frame .overflow-hidden {
	overflow: hidden !important;
}

.lp-frame .position-relative {
	position: relative !important;
}

.lp-frame .position-absolute {
	position: absolute !important;
}

.lp-frame .top-0 {
	top: 0 !important;
}

.lp-frame .start-0 {
	left: 0 !important;
}

.lp-frame .end-0 {
	right: 0 !important;
}

.lp-frame .w-100 {
	width: 100% !important;
}

.lp-frame .flex-wrap {
	-ms-flex-wrap: wrap !important;
	flex-wrap: wrap !important;
}

.lp-frame .flex-wrap-reverse {
	-ms-flex-wrap: wrap-reverse !important;
	flex-wrap: wrap-reverse !important;
}

.lp-frame .align-items-center {
	-webkit-box-align: center !important;
	-ms-flex-align: center !important;
	align-items: center !important;
}

@media (min-width: 768px) {
	.lp-frame .justify-content-md-center {
		-webkit-box-pack: center !important;
		-ms-flex-pack: center !important;
		justify-content: center !important;
	}
}

.lp-frame .mx-auto {
	margin-right: auto !important;
	margin-left: auto !important;
}

.lp-frame .my-10 {
	margin-top: 1rem !important;
	margin-bottom: 1rem !important;
}

.lp-frame .mb-0 {
	margin-bottom: 0 !important;
}

.lp-frame .mb-5 {
	margin-bottom: .5rem !important;
}

.lp-frame .mb-10 {
	margin-bottom: 1rem !important;
}

.lp-frame .mb-20 {
	margin-bottom: 2rem !important;
}

.lp-frame .mb-30 {
	margin-bottom: 3rem !important;
}

.lp-frame .py-20 {
	padding-top: 2rem !important;
	padding-bottom: 2rem !important;
}

.lp-frame .py-50 {
	padding-top: 5rem !important;
	padding-bottom: 5rem !important;
}
.lp-frame .py-30 {
	padding-top: 3rem !important;
	padding-bottom: 3rem !important;
}
.lp-frame .py-80 {
	padding-top: 8rem !important;
	padding-bottom: 8rem !important;
}
.lp-frame .py-100 {
	padding-top: 10rem !important;
	padding-bottom: 10rem !important;
}
.lp-frame .pt-20 {
	padding-top: 2rem !important;
}

.lp-frame .pt-30 {
	padding-top: 3rem !important;
}

.lp-frame .pt-80 {
	padding-top: 8rem !important;
}

.lp-frame .pb-0 {
	padding-bottom: 0 !important;
}

.lp-frame .pb-20 {
	padding-bottom: 2rem !important;
}

.lp-frame .pb-40 {
	padding-bottom: 4rem !important;
}

.lp-frame .pb-50 {
	padding-bottom: 5rem !important;
}

.lp-frame .pb-60 {
	padding-bottom: 6rem !important;
}

.lp-frame .text-center {
	text-align: center !important;
}

.lp-frame .text-white {
	color: #fff !important;
}

.lp-frame .rounded-pill {
	border-radius: 50rem !important;
}

@media (min-width: 768px) {
	.lp-frame .me-md-auto {
		margin-right: auto !important;
	}
	.lp-frame .ms-md-0 {
		margin-left: 0 !important;
	}
	.lp-frame .mb-md-0 {
		margin-bottom: 0 !important;
	}
	.lp-frame .mb-md-45 {
		margin-bottom: 4.5rem !important;
	}
	.lp-frame .my-md-5 {
		margin-top: .5rem !important;
		margin-bottom: .5rem !important;
	}
	.lp-frame .py-md-20 {
		padding-top: 2rem !important;
		padding-bottom: 2rem !important;
	}
	.lp-frame .py-md-30 {
		padding-top: 3rem !important;
		padding-bottom: 3rem !important;
	}
	.lp-frame .pt-md-30 {
		padding-top: 3rem !important;
	}
	.lp-frame .pt-md-100 {
		padding-top: 10rem !important;
	}
	.lp-frame .pt-md-150 {
		padding-top: 15rem !important;
	}
}

@media (min-width: 992px) {
	.lp-frame .pb-lg-25 {
		padding-bottom: 2.5rem !important;
	}
}

@media (min-width: 1200px) {
	.lp-frame .pt-xl-20 {
		padding-top: 2rem !important;
	}
	.lp-frame .pt-xl-117 {
		padding-top: 11.7rem !important;
	}
}

/* Heading overrides from main.css */
.lp-frame h1,
.lp-frame .h1 {
	font-family: 'Bitter', serif !important;
	font-weight: bold !important;
	font-size: 57px !important;
	line-height: 65px !important;
}

.lp-frame h2,
.lp-frame .h2 {
	font-size: 39px !important;
	margin-bottom:20px !important;
}

.lp-frame .fancybox-active {
	height: auto;
}

.lp-frame .fancybox-is-hidden {
	left: -9999px;
	margin: 0;
	position: absolute !important;
	top: -9999px;
	visibility: hidden;
}

.lp-frame .fancybox-container {
	-webkit-backface-visibility: hidden;
	height: 100%;
	left: 0;
	outline: none;
	position: fixed;
	-webkit-tap-highlight-color: transparent;
	top: 0;
	-ms-touch-action: manipulation;
	touch-action: manipulation;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	width: 100%;
	z-index: 99992;
}

.lp-frame .fancybox-container * {
	box-sizing: border-box;
}

.lp-frame .fancybox-outer,
.lp-frame .fancybox-inner,
.lp-frame .fancybox-bg,
.lp-frame .fancybox-stage {
	bottom: 0;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
}

.lp-frame .fancybox-outer {
	-webkit-overflow-scrolling: touch;
	overflow-y: auto;
}

.lp-frame .fancybox-bg {
	background: #1e1e1e;
	opacity: 0;
	-webkit-transition-duration: inherit;
	transition-duration: inherit;
	-webkit-transition-property: opacity;
	transition-property: opacity;
	-webkit-transition-timing-function: cubic-bezier(.47, 0, .74, .71);
	transition-timing-function: cubic-bezier(.47, 0, .74, .71);
}

.lp-frame .fancybox-is-open .fancybox-bg {
	opacity: .9;
	-webkit-transition-timing-function: cubic-bezier(.22, .61, .36, 1);
	transition-timing-function: cubic-bezier(.22, .61, .36, 1);
}

.lp-frame .fancybox-stage {
	direction: ltr;
	overflow: visible;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	z-index: 99994;
}

.lp-frame .fancybox-is-open .fancybox-stage {
	overflow: hidden;
}

.lp-frame .fancybox-slide {
	-webkit-backface-visibility: hidden;
	display: none;
	height: 100%;
	left: 0;
	outline: none;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	padding: 30px;
	position: absolute;
	text-align: center;
	top: 0;
	-webkit-transition-property: opacity, -webkit-transform;
	transition-property: opacity, -webkit-transform;
	transition-property: transform, opacity;
	transition-property: transform, opacity, -webkit-transform;
	white-space: normal;
	width: 100%;
	z-index: 99994;
}

.lp-frame .fancybox-slide::before {
	content: "";
	display: inline-block;
	font-size: 0;
	height: 100%;
	vertical-align: middle;
	width: 0;
}

.lp-frame .fancybox-is-sliding .fancybox-slide,
.lp-frame .fancybox-slide--previous,
.lp-frame .fancybox-slide--current,
.lp-frame .fancybox-slide--next {
	display: block;
}

.lp-frame .fancybox-slide--html {
	padding: 6px;
}

.lp-frame .fancybox-content {
	background: #fff;
	display: inline-block;
	margin: 0;
	max-width: 100%;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	padding: 44px;
	position: relative;
	text-align: left;
	vertical-align: middle;
}

.lp-frame .fancybox-container [data-selectable="true"] {
	cursor: text;
}

.lp-frame .fancybox-error {
	background: #fff;
	cursor: default;
	max-width: 400px;
	padding: 40px;
	width: 100%;
}

.lp-frame .fancybox-error p {
	color: #444;
	font-size: 16px;
	line-height: 20px;
	margin: 0;
	padding: 0;
}

.lp-frame .fancybox-close-small {
	background: transparent;
	border: 0;
	border-radius: 0;
	color: #ccc;
	cursor: pointer;
	opacity: .8;
	padding: 8px;
	position: absolute;
	right: -12px;
	top: -44px;
	z-index: 401;
}

.lp-frame .fancybox-close-small:hover {
	color: #fff;
	opacity: 1;
}

.lp-frame .fancybox-slide--html .fancybox-close-small {
	color: currentColor;
	padding: 10px;
	right: 0;
	top: 0;
}

.lp-frame .fancybox-button {
	display: none;
}

/* Loading indicator */
.lp-frame .fancybox-loading {
	-webkit-animation: fancybox-rotate 1s linear infinite;
	animation: fancybox-rotate 1s linear infinite;
	background: transparent;
	border: 4px solid #888;
	border-bottom-color: #fff;
	border-radius: 50%;
	height: 50px;
	left: 50%;
	margin: -25px 0 0 -25px;
	opacity: .7;
	padding: 0;
	position: absolute;
	top: 50%;
	width: 50px;
	z-index: 99999;
}

/* Transition effects */
.lp-frame .fancybox-animated {
	-webkit-transition-timing-function: cubic-bezier(0, 0, .25, 1);
	transition-timing-function: cubic-bezier(0, 0, .25, 1);
}

.lp-frame .fancybox-fx-fade.fancybox-slide--previous,
.lp-frame .fancybox-fx-fade.fancybox-slide--next {
	opacity: 0;
	-webkit-transition-timing-function: cubic-bezier(.19, 1, .22, 1);
	transition-timing-function: cubic-bezier(.19, 1, .22, 1);
}

.lp-frame .fancybox-fx-fade.fancybox-slide--current {
	opacity: 1;
}

@-webkit-keyframes fancybox-rotate {
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

@keyframes fancybox-rotate {
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

.lp-frame img {
	max-width: 100%;
	height: auto;
	max-height: 100%;
}

.lp-frame .btn {
	font-size: 1.6rem;
	padding: 1rem 1.5rem;
	color: #fff;
	font-weight: 700;
	width: 100%;
}

.lp-frame .btn.btn-green {
	font-size: 22px !important;
	line-height: 1.5 !important;
	padding: 10px 20px !important;
}
.lp-frame .btn.btn-green:hover,
.lp-frame .btn.btn-green:active,
.lp-frame .btn.btn-green:focus {
	background: #6eac64;
	border-color: #6eac64;
	box-shadow: none;
	color: #fff;
}

.lp-frame h1,
.lp-frame .h1 {
	color: #ffffff !important;
	font-weight: bold;
	font-size: 3.2rem;
	line-height: 1.17;
}

.lp-frame h2,
.lp-frame .h2 {
	font-size: 2.5rem;
	margin-bottom: 1rem;
	line-height: 1.1;
}

.lp-frame .bg-stretch {
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: cover;
}

.lp-frame a {
	color: #7dc371;
}

.lp-frame a:hover {
	color: #7dc371;
	text-decoration: none;
}

/* Form inputs (Gravity Forms inside the .lightbox modals) */
.lp-frame input[type="text"],
.lp-frame input[type="email"],
.lp-frame input[type="tel"] {
	border: 2px solid #ededed !important;
	padding: 13px 20px !important;
	font-size: 1.6rem !important;
	color: #2d2e32 !important;
}
.lp-frame .input-placeholder-text {
	color: #2d2e32 !important;
	padding: 13px 20px;
	line-height: 1.7;
}
.lp-frame .parent-focus .input-placeholder-text,
.lp-frame .parent-focus .input-placeholder-text:after {
	display: none;
}
.lp-frame .gfield_contains_required .input-placeholder-text:after {
	content: " *";
	color: #c81616;
}

/* Header */
.lp-frame #header {
	z-index: 1000;
}

.lp-frame #header .logo {
	max-width: 230px;
}

/* Hero section */
/*
 * The empty :before overlay (left over from the original main.css —
 * no background, no visual effect) used to be confined to the hero
 * because the section was position:relative. Now that the section is
 * position:static (so it doesn't compete with the theme nav), an
 * untamed position:absolute child would escape and cover the whole
 * viewport, blocking clicks on the header/nav. Disable hit-testing so
 * the rule stays inert.
 */
.lp-frame .hero-section:before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	pointer-events: none;
}
.lp-frame .hero-section {
	background-color: #255c83;
}

/*
 * Drop the hero's positioning context at every viewport so it can't
 * sit above the theme's main nav (desktop) or #mobile-menu-button
 * (mobile). The .position-relative utility on the section and the
 * inner .container is overridden, and the inner container's z-index
 * is reset.
 */
.lp-frame .hero-section.position-relative {
	position: static !important;
}
.lp-frame .hero-section .container.position-relative {
	position: static !important;
}
.lp-frame .hero-section .container {
	z-index: auto;
}

.lp-frame .hero-section.bg-stretch {
	background-position: 30% 50%;
}

.lp-frame .hero-section .hero-txt {
	font-size: 1.8rem;
	line-height: 1.4;
}
.lp-frame .hero-txt p {
	color: #ffffff;
	font-size: 20px;
	line-height: 1.45;
}

/* Footer */
.lp-frame #footer .container {
	z-index: 1;
}

.lp-frame #footer .copyright {
	font-size: 14px;
	color: #fff;
}

/* Section background colors used on the page */
.lp-frame .bg-e3f3fd {
	background-color: #e3f3fd;
}

.lp-frame .bg-163851 {
	background-color: #163851;
}

.lp-frame .bg-255c83 {
	background-color: #255c83;
}

.lp-frame .hp-list {
	list-style: none;
	text-align: left;
}
.lp-frame .hp-list li {
	background-image: url('./compliance/images/check.png');
	background-size: 19px 15px;
	background-position: 4px 6px;
	background-repeat: no-repeat;
	padding-left: 30px;
	margin-bottom: 10px;
	font-size: 18px;
}

/* Custom right padding utility (used in .hero-txt.pr-md-40) */
.lp-frame .pr-md-40 {
	padding-right: 40px;
}

/* Leed-benefits / "Our Services" section */
.lp-frame .leed-benefits p {
	color: #404040;
	font-size: 17px;
	margin-top: 20px;
}
.lp-frame .leed-benefits a {
	text-decoration: underline;
	color: #7cc370;
}
.lp-frame .leed-benefits a:hover {
	text-decoration: none;
	color: #7cc370;
}
.lp-frame .leed-benefits h2 {
	color: #19374f;
}

/* Help section paragraphs / lists */
.lp-frame .help-section p,
.lp-frame .help-section ul {
	font-size: 18px;
	line-height: 1.5;
	color: #2d2e32;
}

/* Service icon circles ("Our Services") */
.lp-frame .service-icon {
	display: flex;
	align-items: center;
	width: 118px;
	height: 118px;
	border-radius: 50%;
	background-color: #d7e5ee;
}

/* Location section blocks */
.lp-frame .location-section .energy-code {
	width: 100%;
	padding-top: 59.5%;
	margin-bottom: 30px;
	background-position: center bottom;
}
.lp-frame .ec-ot {
	background-image: url('./compliance/images/energy-code-other-v2.jpg');
}
.lp-frame .location-section h2,
.lp-frame .location-section p {
	color: #fff;
}
.lp-frame .location-section p {
	font-size: 19px;
}
.lp-frame .location-section .col-md-6,
.lp-frame #our-services .col-md-4 {
	padding-left: 15px !important;
	padding-right: 15px !important;
}

/*
 * Restore the standard Bootstrap gutter on the help-section row.
 * Globally we set --bs-gutter-x to 0, but the original benchmarks /
 * compliance designs assumed the default 3rem gutter here: it gives
 * each col 24px padding on each side (so ~48px between cols), and
 * extends the row 24px beyond the container's padded edge so cols
 * sit flush with that edge. That extra inner width is what lets
 * "Benchmarking Regulations" stay on a single line, and what creates
 * the visible gap between the image and its sibling text col.
 */
.lp-frame .help-section .row {
	--bs-gutter-x: 3rem;
}

/*
 * "Additional Services" page — sections that don't exist on the
 * compliance / benchmarking pages. The original
 * assets/lp/additional-services/css/main.css supplied these and we
 * carry the same rules over.
 */

/* The 6-tile shortcut nav at the top of the page. */
.lp-frame .as-icons a {
	text-decoration: none;
}
.lp-frame .as-icons a:hover .service-icon {
	opacity: .75;
}
/*
 * The base .service-icon (used on the compliance LP) is 118px and
 * light-blue (#d7e5ee). For the additional-services tiles we want the
 * larger 135px white circles the original CSS used — gives the icons
 * more visual padding and matches the original page.
 */
.lp-frame .as-icons .service-icon {
	width: 135px;
	height: 135px;
	background-color: #ffffff;
	-webkit-transition: all .3s ease;
	transition: all .3s ease;
}
/*
 * Bold the label under each circle (e.g. "Testing, Adjusting, and
 * Balancing"). The original additional-services CSS achieved this via
 * a global `.leed-benefits p { font-weight: bold }`, but that would
 * also bold the intro paragraph on the compliance "Our Services"
 * section, so we scope it to .as-icons only.
 */
.lp-frame .as-icons .service-txt p {
	font-weight: bold;
}
/*
 * Restore the standard Bootstrap gutter on the as-icons row so its
 * cols match the original page's width (~196px each at 1100+, vs
 * ~188px without the gutter). The 1100px+ override below replaces
 * the gutter padding with a tighter 10px each side, while keeping
 * the row's negative margin so the cols extend flush with the
 * container edges.
 */
.lp-frame .as-icons {
	--bs-gutter-x: 3rem;
}

/* The "Energy Audits" section sits on the dark blue (#255c83) panel. */
.lp-frame #energy-audits h2,
.lp-frame #energy-audits p {
	color: #fff;
}
.lp-frame #energy-audits p,
.lp-frame #utility p {
	font-size: 19px;
	line-height: 28px;
}
.lp-frame #energy-audits p:last-child {
	margin-bottom: 0;
}

/* The bottom "EV / Renewable" two-up section. */
.lp-frame .vehicle-section .row {
	--bs-gutter-x: 3rem;
}
.lp-frame .vehicle-section h2 {
	margin-top: 25px;
	margin-bottom: 20px;
}
.lp-frame .vehicle-section p {
	font-size: 19px;
	line-height: 28px;
}
.lp-frame .vehicle-section h2 {font-size:35px !important;}
/*
 * "Renewable Energy Consulting" is wide. At 992-1199px the bootstrap
 * container caps at 960px, which leaves each col-md-6 with only
 * ~432px of inner content area — not enough room for the heading at
 * its default 34px size, so it wraps to two lines. Cap the size in
 * that window so it fits on a single line. At 1200+ the container
 * grows to 1177px (~540px col content) and the default 34px fits.
 */
@media (min-width: 992px) and (max-width: 1199px) {
	.lp-frame .vehicle-section h2 {
		font-size: 28px !important;
	}
}

/*
 * The 6 service-icon tiles at the top of "Additional Services" wrap
 * differently than the bootstrap col-lg-2 / col-md-6 alone would
 * suggest:
 *   - 1100px+: 6-up, with 10px L/R padding tightening the row
 *   - 768-1099px: 3-up (overrides the col-md-6 50% width)
 *   - <768px: 1-up (default col-12 stack)
 */
@media (min-width: 1100px) {
	.lp-frame .as-icons .col-12 {
		padding-left: 10px !important;
		padding-right: 10px !important;
	}
}
@media (max-width: 1099px) and (min-width: 768px) {
	.lp-frame .as-icons .col-12 {
		width: 33.333% !important;
	}
}

/*
 * Clip horizontal overflow on the LP wrapper itself.
 *
 * Several LP rows use Bootstrap's standard `--bs-gutter-x: 3rem`,
 * which gives the row negative `-1.5rem` left/right margins so its
 * cols line up flush with the container's outer edge. On narrow
 * viewports those negative margins can extend a single pixel or two
 * past the container box, producing a body-level horizontal scrollbar
 * on mobile. The original LP page templates (e.g. lp-benchmarks.php)
 * wrapped their content in `<div id="wrapper" class="overflow-hidden">`
 * which absorbed that overflow; the new page templates use
 * `<div class="lp-frame">` and lost that containment. Restore it here.
 */
.lp-frame {
	overflow-x: hidden;
}

/*
 * Lead form lightbox modals.
 *
 * IMPORTANT: these rules are intentionally NOT scoped to .lp-frame.
 * fancyBox is initialised with `parentEl: 'body'` (see lp-services.js),
 * which means when the modal opens it detaches #lead_form / #lead_form2
 * from inside .lp-frame and re-attaches it to <body>. Any rule that
 * starts with `.lp-frame` would stop matching the moment the modal
 * opens.
 *
 * The base .fancybox-content rule (which we trimmed in earlier and is
 * also defined unscoped in the global assets/css/main.css) provides
 * background:#fff and padding:44px — that's what gives the modal its
 * white "breathing room" around the Gravity Form. The global site CSS
 * has an unscoped `#lead_form.fancybox-content {background:transparent
 * !important}` override that strips the white for #lead_form (and
 * #lead_form_2 — note the underscore — but NOT #lead_form2, no
 * underscore, which is why the compliance page wasn't affected). We
 * forcibly restore the white here. The 44px padding from the global
 * base rule is preserved on desktop, and the global mobile media rule
 * (`@media (max-width: 767px) { .fancybox-content { padding: 0
 * !important } }`) still handles padding for narrow viewports.
 *
 * Since lp-services.css only loads on the page templates registered in
 * rev_lp_template_assets_map(), the unscoped override is confined to
 * those pages and won't leak into the rest of the site.
 */
#lead_form.fancybox-content,
#lead_form2.fancybox-content {
	width: 600px;
	background: #fff !important;
}
.lp-frame .gform_required_legend {
	display: none;
}
.lp-frame .gform_wrapper .gform_validation_errors {
	display: none;
}
.c-bar .large-text {
    font-size: 22px;
    line-height: 34px;
}
.c-bar h2 {
	color:#fff;
}
.lp-frame .fancybox-content input[type="text"],
.lp-frame .fancybox-content input[type="email"],
.lp-frame .fancybox-content input[type="tel"] {
	border: 2px solid #ededed !important;
	padding: 13px 20px !important;
	font-size: 15px !important;
	color: #2d2e32 !important;
}

.lp-frame .fancybox-content .gform_wrapper .gform_footer input.button,
.lp-frame .fancybox-content .gform_wrapper .gform_footer input[type=submit],
.lp-frame .fancybox-content .gform_wrapper .gform_page_footer input.button,
.lp-frame .fancybox-content .gform_wrapper .gform_page_footer input[type=submit] {
	width: 100% !important;
	border-radius: 50rem !important;
	line-height: 1.5 !important;
	text-align: center;
	text-decoration: none;
	text-transform: none !important;
	vertical-align: middle;
	background-color: #7dc371;
	border-color: #7dc371;
	font-size: 20px !important;
	padding: 10px 20px !important;
	-webkit-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
	transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
	border: 1px solid transparent;
}

.lp-frame .fancybox-content .gform_wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]),
.lp-frame .fancybox-content .gform_wrapper textarea {
	padding: 13px 20px !important;
	font-size: 15px !important;
	font-weight: 400 !important;
	border: 2px solid #ededed !important;
}

.lp-frame .fancybox-content .gform_wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file])::-webkit-input-placeholder {
	font-size: 15px !important;
	font-weight: 400 !important;
	color: #2d2e32 !important;
}
.lp-frame .fancybox-content .gform_wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file])::-moz-placeholder {
	font-size: 15px !important;
	font-weight: 400 !important;
	color: #2d2e32 !important;
}
.lp-frame .fancybox-content .gform_wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]):-ms-input-placeholder {
	font-size: 15px !important;
	font-weight: 400 !important;
	color: #2d2e32 !important;
}
.lp-frame .fancybox-content .gform_wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]):-moz-placeholder {
	font-size: 15px !important;
	font-weight: 400 !important;
	color: #2d2e32 !important;
}

/* Inline override for #our-services links from the page template <style> tag */
.lp-frame #our-services a {
	text-decoration: none;
}
.lp-frame #our-services a:hover {
	color: #404040;
	text-decoration: underline;
}

/* ===========================================================
 * 3. Responsive overrides from main.css
 * =========================================================== */
@media screen and (min-width: 576px) {
	.lp-frame .btn {
		font-size: 1.8rem;
		padding: 1rem 2rem;
	}

	.lp-frame h1,
	.lp-frame .h1 {
		font-size: 3.6rem;
	}

	.lp-frame #header .logo {
		max-width: 18rem;
	}

	.lp-frame .hero-section.bg-stretch {
		background-position: 20% 50%;
	}
}

@media screen and (min-width: 768px) {
	.lp-frame .btn {
		font-size: 2rem;
		width: auto;
	}

	.lp-frame h1,
	.lp-frame .h1 {
		font-size: 4.6rem;
	}

	.lp-frame h2,
	.lp-frame .h2 {
		font-size: 3rem;
	}

	.lp-frame #header .logo {
		max-width: 20rem;
	}

	.lp-frame .hero-section.bg-stretch {
		background-position: 50% 0%;
	}

	.lp-frame body {
		font-size: 1.8rem;
	}
}

@media screen and (min-width: 992px) {
	.lp-frame h1,
	.lp-frame .h1 {
		font-size: 5rem;
	}

	.lp-frame h2,
	.lp-frame .h2 {
		font-size: 3.4rem;
	}

	.lp-frame #header .logo {
		max-width: 230px;
	}

	.lp-frame .hero-section .hero-txt {
		font-size: 2rem;
	}
}

@media screen and (min-width: 1200px) {
	.lp-frame h1,
	.lp-frame .h1 {
		font-size: 60px;
		margin-bottom: 2.5rem;
	}
}

@media (max-width: 1199px) {
	.lp-frame h1,
	.lp-frame .h1 {
		font-size: 54px !important;
	}
	/*
	.lp-frame h2,
	.lp-frame .h2 {
		font-size: 34px !important;
	}*/
}

@media (max-width: 991px) {
	.lp-frame .hp-list li {
		font-size: 16px;
	}
}

@media (max-width: 767px) {
	.lp-frame .hero-section.bg-stretch {
		background-image: none !important;
	}
	.lp-frame .pr-md-40 {
		padding-right: 0px;
	}
	.lp-frame .py-md-40 {		
    padding-top: 4rem !important;
    padding-bottom: 4rem !important;
	}
	
	.lp-frame .sm-center {text-align:center;}
	.lp-frame .input-placeholder-text {
		padding: 13px 20px;
		line-height: 2.2;
	}
	.lp-frame .btn.btn-green {
		font-size: 20px !important;
	}
	.lp-frame .location-section .col-md-6,
	.lp-frame #our-services .col-md-4 {
		padding-left: 30px !important;
		padding-right: 30px !important;
	}
	.lp-frame .energy-code h4 {
		font-size: 22px;
	}
	.lp-frame #lead_form.fancybox-content,
	.lp-frame #lead_form2.fancybox-content {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
	.lp-frame .form-heading p {
		font-size: 17px !important;
	}
}