/**
 * Shared component invariants that Elementor Atomic controls cannot express.
 */

/* News cards retain the full post title while limiting its visual summary. */
.elementor .cet-project-card-title[data-interaction-id="news-card-title"] {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
}

/* Project-story heroes omit the navigation CTA. Keep the shared component's
 * native action fields available to service, listing, and other site pages.
 */
.cet-project-story .elementor [data-cet-hero] [data-interaction-id="hero-actions"],
.elementor .cet-hero-without-actions [data-cet-hero] [data-interaction-id="hero-actions"] {
	display: none;
}

/* Classic Loop Grid does not expose its span control inside an Atomic grid.
 * The native three-track frame reserves one track for the heading and two
 * for the project pair. Native tablet/mobile frames stack these children.
 */
@media (min-width: 1201px) {
	.elementor .cet-project-snapshot-pair {
		grid-column: span 2;
	}
}

/* Reading measure for native paragraph content, including newly added widgets.
 * Narrower native component limits and page alignment remain authoritative.
 */
:where(main, .elementor) p:not(:where(header p, footer p)) {
	max-inline-size: 65ch;
	text-wrap: pretty;
}

/* Request-form pattern: both contact forms share a deliberate reading measure.
 * Elementor owns section spacing/content; Gravity Forms owns fields and logic.
 * Scoped presentation leaves hidden fields and native field spans untouched.
 */
.elementor #request-form > .e-con-inner {
	max-inline-size: 820px;
	gap: 32px;
}

.elementor #request-form > .e-con-inner > h2 {
	font-size: 36px;
	line-height: 1.15;
	overflow-wrap: anywhere;
}

.elementor #request-form .gform_wrapper {
	padding: 32px;
	background: var(--color-surface-canvas, #f5f5f5);
	border-block-start: 4px solid var(--color-brand-accent, #0295c4);
	color: var(--color-brand-primary, #0c1622);
	font-family: var(--font-primary, "IBM Plex Sans", sans-serif);
}

/* Inquiry panel has a wider inset within its native split-page layout. */
.elementor #request-form #gform_wrapper_1 {
	padding: 48px;
}

.elementor #request-form .gform_fields {
	row-gap: 24px;
	column-gap: 24px;
}

/* Keep paired inputs aligned when a longer native label wraps. */
@media (min-width: 768px) {
	.elementor #request-form .gfield--width-half {
		display: flex;
		flex-direction: column;
	}

	.elementor #request-form .gfield--width-half .ginput_container {
		margin-block-start: auto;
	}
}

.elementor #request-form .gfield_label {
	color: var(--color-brand-primary, #0c1622);
	font-size: 18px;
	font-weight: 600;
	line-height: 1.4;
	margin-block-end: 8px;
}

.elementor #request-form .ginput_container :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea) {
	inline-size: 100%;
	min-inline-size: 0;
	min-block-size: 52px;
	padding: 12px 16px;
	border: 1px solid #686e77;
	border-radius: 0;
	background-color: #fff;
	box-shadow: none;
	color: var(--color-brand-primary, #0c1622);
	font-family: inherit;
	font-size: 18px;
	line-height: 1.4;
}

.elementor #request-form .ginput_container select {
	padding-inline-end: 40px;
}

.elementor #request-form .ginput_container textarea {
	block-size: 180px;
	resize: vertical;
}

.elementor #request-form .gform_wrapper.gform-theme :is(input, select, textarea, button):focus-visible {
	outline: 3px solid var(--color-brand-accent, #0295c4);
	outline-offset: 3px;
}

.elementor #request-form .gform_wrapper.gform-theme .ginput_container [aria-invalid="true"] {
	border-color: #a12a26;
}

.elementor #request-form .gform_footer {
	margin-block-start: 32px;
}

.elementor #request-form .gform_footer :is(button, input[type="submit"]) {
	min-block-size: 52px;
	max-inline-size: 100%;
	padding: 14px 24px;
	border: 2px solid var(--color-brand-accent, #0295c4);
	border-radius: 0;
	background: var(--color-brand-primary, #0c1622);
	box-shadow: none;
	color: #fff;
	font: 600 18px/1.4 var(--font-primary, "IBM Plex Sans", sans-serif);
	white-space: normal;
	cursor: pointer;
}

.elementor #request-form .gform_footer :is(button, input[type="submit"]):hover {
	background: var(--color-text-secondary, #3b3d48);
}

@media (max-width: 767px) {
	.elementor #request-form .gform_fields .gfield--width-half {
		grid-column: 1 / -1;
	}

	.elementor #request-form > .e-con-inner > h2 {
		font-size: 28px;
	}

	.elementor #request-form .gform_wrapper {
		padding: 24px 16px;
	}

	.elementor #request-form #gform_wrapper_1 {
		padding: 32px 24px;
	}

	/* Stacked fields do not need gaps between the twelve native grid tracks. */
	.elementor #request-form :is(#gform_wrapper_1, #gform_wrapper_2) .gform_fields {
		column-gap: 0;
	}

	.elementor #request-form .gform_footer :is(button, input[type="submit"]) {
		inline-size: 100%;
	}
}

/* CTA links are optional. Empty actions must not leave focus targets or gaps. */
.elementor [data-cet-cta] [data-cet-cta-action]:not([href]),
.elementor [data-cet-cta] [data-cet-cta-action][href=""],
.elementor [data-cet-cta] [data-cet-cta-actions]:not(:has([data-cet-cta-action][href]:not([href=""]))) {
	display: none;
}

/* Clear the second button link to omit the optional action and its layout space. */
.elementor [data-cet-hero] [data-cet-hero-secondary]:not([href]),
.elementor [data-cet-hero] [data-cet-hero-secondary][href=""] {
	display: none;
}

/* Native video layers retain the Hero treatment and expose controls only when usable. */
.elementor [data-cet-hero-video] {
	pointer-events: none;
}
.elementor [data-cet-hero-video] .e-background-video__media {
	opacity: 0.251;
	mix-blend-mode: luminosity;
	filter: grayscale(1);
	visibility: hidden;
}
/* Home footage keeps its color; the native hero gradient owns the fade. */
.elementor [data-cet-hero="home"] [data-cet-hero-video] .e-background-video__media,
.elementor-editor-active .elementor [data-id="homepage-hero"] [data-cet-hero-video] .e-background-video__media {
	opacity: 1;
	mix-blend-mode: normal;
	filter: none;
}
.elementor [data-cet-hero-video] .e-background-video__controls {
	visibility: hidden;
	pointer-events: auto;
}
.elementor [data-cet-hero-video][data-cet-video-available="true"] .e-background-video__controls {
	visibility: visible;
}
.elementor [data-cet-hero-video] button {
	color: #fff;
	background: color-mix(in srgb, var(--color-brand-primary, #0c1622) 65%, transparent);
	border: 0;
	padding: 0;
	width: 44px;
	height: 44px;
	min-width: 44px;
	min-height: 44px;
	align-items: center;
	justify-content: center;
}
.elementor [data-cet-hero-video] button:is(:hover, :focus, :focus-visible, :active) {
	color: #fff;
	background: var(--color-brand-primary, #0c1622);
}
.elementor [data-cet-hero-video] button::before {
	content: "";
	display: block;
	width: 12px;
	height: 14px;
}
.elementor [data-cet-hero-video] .e-background-video__pause::before {
	background: linear-gradient(to right, currentColor 0 4px, transparent 4px 8px, currentColor 8px 12px);
}
.elementor [data-cet-hero-video] .e-background-video__play::before {
	background: currentColor;
	clip-path: polygon(0 0, 100% 50%, 0 100%);
}
.elementor [data-cet-hero-video] button:focus-visible {
	outline: 3px solid var(--color-brand-accent, #0295c4);
	outline-offset: 3px;
}
.elementor [data-cet-hero-video] button .e-paragraph-base {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}
.elementor [data-cet-hero][data-cet-hero-video-ready="true"] [data-cet-hero-image] {
	visibility: hidden;
}
.elementor [data-cet-hero][data-cet-hero-video-ready="true"] .e-background-video__media {
	visibility: visible;
}
.elementor [data-cet-hero][data-cet-hero-video-ready="true"] [data-cet-hero-video] {
	background-color: var(--color-brand-primary, #0c1622);
}
@media (prefers-reduced-motion: reduce) {
	.elementor [data-cet-hero][data-cet-hero-video-ready="true"] [data-cet-hero-video] {
		background-color: transparent;
	}
	.elementor [data-cet-hero-video] .e-background-video__media,
	.elementor [data-cet-hero-video] .e-background-video__controls {
		visibility: hidden;
	}
	.elementor [data-cet-hero][data-cet-hero-video-ready="true"] [data-cet-hero-image] {
		visibility: visible;
	}
}

/* Preserve the approved two-action Hero heading within the single component. */
.elementor [data-cet-hero]:has([data-cet-hero-secondary][href]:not([href=""])) [data-cet-hero-heading] {
	max-width: 24ch;
}

@media (max-width: 767px) {
	.elementor [data-cet-hero]:has([data-cet-hero-secondary][href]:not([href=""])) [data-cet-hero-heading] {
		font-size: 42px;
		line-height: 50px;
	}
}

/* Native Component controls own the image, crop, layers, and tile geometry. */
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
	.cet-navigation-tile .cet-navigation-tile-image {
		transition: transform 550ms ease;
	}

	.cet-navigation-tile:hover .cet-navigation-tile-image {
		transform: scale(1.06);
	}

	.cet-navigation-tile .cet-navigation-tile-arrow {
		transition: background-color 180ms ease;
	}
}

/* The tile's state also highlights its native arrow, including keyboard focus. */
.elementor .cet-navigation-tile:is(:hover, :focus-visible) .cet-navigation-tile-arrow {
	background-color: var(--color-brand-accent, #0295c4);
}

/*
 * Service-card geometry is owned by its native Elementor Global Classes.
 * Keep only SVG descendant rendering and long-string wrapping here.
 */

.elementor [data-interaction-id="service-card-icon"] svg,
.elementor [data-interaction-id="service-card-icon"] img {
	display: block;
	inline-size: 100%;
	block-size: 100%;
}

.elementor [data-interaction-id="service-card-icon"] svg {
	fill: none;
}

.elementor [data-interaction-id="service-card-summary"] {
	min-inline-size: 0;
	overflow-wrap: anywhere;
}

/* Keep long shared card titles inside their native padding without shrinking type. */
.cet-difference-card-title {
	max-inline-size: 100%;
	min-inline-size: 0;
	overflow-wrap: anywhere;
	hyphens: auto;
}

/**
 * Buttons never underline on hover. Scoped hover selectors take precedence
 * over Site Settings' anchor decoration without changing ordinary text links.
 * The other states retain the existing theme underline fallback.
 */
.e-button-base,
.elementor .e-button-base:hover,
.e-button-base:focus,
.e-button-base:active,
.elementor-button,
.elementor .elementor-button:hover,
.elementor-button:focus,
.elementor-button:active {
	text-decoration: none;
}

/*
 * Legacy FAQ Accordion alignment. Elementor retains ownership of typography,
 * padding, icon size, spacing, colors, and open/closed state visibility.
 */
.cet-faq-accordion .elementor-tab-title {
	display: flex;
	align-items: center;
}

.cet-faq-accordion .elementor-tab-title .elementor-accordion-icon {
	flex-shrink: 0;
}

.cet-faq-accordion .elementor-accordion-title {
	flex: 1;
	min-inline-size: 0;
}

.cet-faq-accordion .elementor-accordion-icon svg {
	display: block;
}

/* Keep the native End alignment option usable after replacing floated layout. */
.cet-faq-accordion .elementor-accordion-icon-right {
	order: 1;
}

.cet-faq-accordion .elementor-accordion-icon-right svg {
	margin-inline-start: auto;
}

/*
 * FAQ items use bottom dividers, not boxes. Native Accordion Border controls
 * still own their width/color. The open question receives its own top rule.
 */
.elementor .cet-faq-accordion .elementor-accordion-item {
	border-inline-style: none;
	border-block-start-style: none;
}

.elementor .cet-faq-accordion .elementor-tab-content {
	border-block-start-style: none;
}

/* An inset rule follows Elementor's open state without changing row height. */
.cet-faq-accordion .elementor-tab-title.elementor-active {
	box-shadow: inset 0 3px 0 #0c1622;
}

/* Native Counter content owns the value. This alternate is static, not animated. */
.cet-stat-counter .cet-counter-final {
	display: none;
}

/* Native hover values stay editable. Touch and Reduce Motion never lift tiles. */
@media (hover: none), (pointer: coarse), (prefers-reduced-motion: reduce) {
	.elementor .cet-contact-action-tile,
	.elementor .cet-project-card-motion,
	.elementor .cet-service-card-surface {
		transform: none !important;
	}
}

/* A service with no link is informational, not an interactive card. */
.elementor .cet-service-card-surface:not(a[href]):hover {
	transform: none !important;
	outline-style: none !important;
}

/* The native surface owns its background. Its state also recolors child content. */
.cet-service-card-surface :is(.cet-service-card-title, [data-interaction-id="service-card-summary"]) {
	transition: color 200ms;
}

.cet-service-card-surface .cet-service-card-icon {
	transition: filter 200ms;
}

.elementor .cet-service-card-surface:is(:hover, :focus) :is(.cet-service-card-title, [data-interaction-id="service-card-summary"]) {
	color: var(--color-text-inverse, #fff);
}

/* Preserve the transparent, outlined artwork; works for inline SVG and image icons. */
.elementor .cet-service-card-surface:is(:hover, :focus) .cet-service-card-icon {
	filter: brightness(0) invert(1);
}

.cet-service-card-surface:focus :is(.cet-service-card-title, [data-interaction-id="service-card-summary"], .cet-service-card-icon) {
	transition-duration: 0s;
}

.elementor .cet-project-card-motion:focus-within,
.elementor .cet-contact-action-tile:focus-visible,
.elementor .cet-service-card-surface:focus-visible {
	transform: none !important;
	transition-duration: 0s !important;
}

/* Clearance for the native 4px lift, with no change to resting card geometry. */
.elementor-widget-loop-carousel:has(.cet-project-card-motion) .elementor-loop-container.swiper {
	padding-block-start: 4px;
	margin-block-start: -4px;
}

/*
 * Home's fixed-width project track previews toward the page edge. Elementor
 * owns its width and offset; the section clips the right edge. Keep preceding
 * slides clipped on the left, with vertical clearance for hover and focus.
 * Apply at every width: the native card cap must not hide the next project
 * when a wide mobile viewport has room for a preview.
 */
.elementor-element-homepage-projects-loop-carousel .elementor-loop-container.swiper {
	overflow: visible;
	clip-path: inset(-8px -100vw -8px 0);
}

/* Default timing only. Native per-widget styles can still override it. */
.elementor .elementor-button {
	transition: background-color 180ms, color 180ms, border-color 180ms;
}

/* Keep the native inverse paragraph color when global link states apply. */
.elementor :is([data-interaction-id="battery-operations-maintenance"], [data-interaction-id="battery-service-5"]) a:is(:hover, :focus, :active) {
	color: inherit;
	text-decoration: underline;
}

.elementor :is([data-interaction-id="battery-operations-maintenance"], [data-interaction-id="battery-service-5"]) a:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 3px;
}

.elementor :is(.elementor-button, .e-button-base):focus-visible {
	transition-duration: 0s !important;
}

@media (prefers-reduced-motion: reduce) {
	.cet-service-card-surface :is(.cet-service-card-title, [data-interaction-id="service-card-summary"], .cet-service-card-icon) {
		transition-duration: 0s;
	}

	.elementor .cet-contact-action-tile,
	.elementor .cet-project-card-motion,
	.elementor .cet-service-card-surface,
	.elementor .elementor-button,
	.elementor .e-button-base {
		transition-duration: 0s !important;
	}

	/* Native entrance owners only, not decorative layers. */
	.elementor :is(
		[data-interaction-id="homepage-hero-copy"],
		[data-interaction-id="homepage-services-intro-frame"],
		[data-interaction-id="homepage-services-cta"],
		[data-interaction-id="homepage-proof-frame"],
		[data-interaction-id="homepage-difference-cta-frame"],
		[data-interaction-id="homepage-projects-frame"],
		[data-interaction-id="homepage-testimonial-frame"],
		[data-interaction-id="homepage-closing-cta-panel"],
		[data-interaction-id="efficiency-hero-frame"],
		[data-interaction-id="f5a7129"],
		[data-interaction-id="efficiency-rebates-frame"],
		[data-interaction-id="efficiency-deliverables-frame"],
		[data-interaction-id="efficiency-projects-frame"],
		[data-interaction-id="efficiency-faq-frame"],
		[data-interaction-id="efficiency-contact-panel"]
	) {
		opacity: 1 !important;
		transform: none !important;
		animation: none !important;
	}
	.cet-stat-counter .elementor-counter-number:has(+ .cet-counter-final) {
		display: none;
	}
	.cet-stat-counter .cet-counter-final {
		display: inline;
	}
}