.elementor-17 .elementor-element.elementor-element-ced7bdb{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-17 .elementor-element.elementor-element-6700c8a{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Helvetica;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-17 .elementor-element.elementor-element-ada2f93{margin:-20px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;color:#102033;}:root{--page-title-display:none;}/* Start custom CSS for text-editor, class: .elementor-element-ada2f93 */:root {
--navy:#06182b;
--blue:#0c5f97;
--sky:#d9eef8;
--ice:#f3f8fb;
--ink:#102033;
--muted:#5c6a78;
--white:#fff;
--line:#d9e3ea;
--accent:#22a6d5
}
* {
	box-sizing: border-box
}
body {
	margin: 0;
	font-family: Arial, Helvetica, sans-serif;
	color: var(--ink);
	line-height: 1.65;
	background: #fff
}
a {
	color: inherit
}
.page-section h1, .page-section h2, .page-section h3, .page-section h4, .page-section h5{ font-weight:800 !important;
}
.wrap {
	width: min(1180px, calc(100% - 40px));
	margin: auto
}
.narrow {
	width: min(860px, calc(100% - 40px))
}
.hero {
	position: relative;
	min-height: 760px;
	background: url('https://testsitedemo3.website/wp-content/uploads/2026/08/south-shore-genesis-commercial-led-lighting-exterior.webp'), linear-gradient(125deg, #06182b 0%, #0b3555 60%, #0d5c88 100%);
	display: flex;
	align-items: center;
	color: white;
	overflow: hidden;
	background-repeat: none;
	background-position: center;
	background-size: cover;
}
.hero-overlay {
	content: "";
	position: absolute;
	width:100%;
	height:100%;
	background: linear-gradient(125deg, #06182b 0%, #0b3555 60%, #0d5c88 100%);
	opacity: 0.6;
}
.hero-grid {
	position: relative;
	z-index: 2;
	display: grid;
grid-template-columns:1.2fr .8fr;
	gap: 55px;
	align-items: center
}
.eyebrow, .kicker {
	font-size: 13px;
	letter-spacing: .14em;
	font-weight: 800;
	text-transform: uppercase;
	color: #78d6f6
}
.hero h1 {
	font-size: clamp(48px, 6vw, 78px);
	line-height: 1.02;
	margin: 16px 0 22px;
	letter-spacing: -.035em
}
.lead {
	font-size: 21px;
	max-width: 720px;
	color: #e6f3fa
}
.hero-actions, .cta-actions {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
	margin-top: 28px
}
.btn {
	display: inline-block;
	padding: 14px 20px;
	border-radius: 8px;
	text-decoration: none !important;
	font-weight: 800
}
.primary {
	background: #1f9fd0;
	color: #fff !important
}
.secondary {
	border: 1px solid rgba(255,255,255,.45) !important;
	color: #fff !important; 
	background: rgba(255,255,255,.06)
}
.ghost {
	border: 1px solid #a8cbdc !important;
	color: #dff5ff !important
}
.trust-row {
	display: flex;
	gap: 18px;
	flex-wrap: wrap;
	margin-top: 26px;
	font-size: 14px;
	color: #d4edf8
}
.placeholder {
	border: 1px dashed rgba(255,255,255,.55);
	background: rgba(255,255,255,.06);
	border-radius: 18px;


	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 12px;
	text-align: center
}
.placeholder img{ border-radius: 18px;}
.placeholder strong {
	font-size: 18px
}
.placeholder span {
	color: #d7ecf6
}
.placeholder small {
	opacity: .8
}
.proof-strip {
	background: #071d31;
	color: #fff;
	border-top: 1px solid rgba(255,255,255,.08)
}
.proof-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1px
}
.proof-grid div {
	padding: 20px;
	border-right: 1px solid rgba(255,255,255,.1)
}
.proof-grid b, .proof-grid span {
	display: block
}
.proof-grid span {
	color: #a9c3d4;
	font-size: 13px
}
.section {
	padding: 92px 0
}
.section h2 {
	font-size: clamp(34px, 4vw, 52px);
	line-height: 1.08;
	letter-spacing: -.025em;
	margin: 10px 0 24px
}
.section h3 {
	line-height: 1.2
}
.section p {
	font-size: 18px;
	color: #415366
}
.notice {
	margin-top: 32px;
	padding: 24px;
	border-left: 4px solid var(--accent);
	background: var(--ice);
	border-radius: 0 12px 12px 0
}
.notice p {
	margin-bottom: 0
}
.dark {
	background: var(--navy);
	color: white
}
.dark p {
	color: #c2d5df
}
.dark .kicker {
	color: #76d7f9
}
.intro {
	max-width: 850px
}
.cards {
	display: grid;
	gap: 18px;
	margin-top: 36px
}
.cards.three {
	grid-template-columns: repeat(3, 1fr)
}
.cards.four {
	grid-template-columns: repeat(4, 1fr)
}
.cards article {
	padding: 28px;
	border: 1px solid rgba(255,255,255,.12);
	border-radius: 14px;
	background: rgba(255,255,255,.035)
}
.cards article a {
	color: #6ad7ff;
	text-decoration: none;
	font-weight: 800
}
.cards.light article {
	border-color: var(--line);
	background: #fff
}
.cards.light article p {
	font-size: 16px
}
.split-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 64px;
	align-items: center
}
.split-grid.reverse>div:first-child {
	order: 1
}
.split-grid.reverse>.placeholder {
	order: 2
}
.split .placeholder {
	color: var(--ink);
	border-color: #8da9b8;
	background: linear-gradient(145deg, #edf5f8, #dcebf2)
}
.split .placeholder span {
	color: #4c6470
}
.tall {
	min-height: 560px
}
.text-link {
	font-weight: 800;
	color: var(--blue);
	text-decoration: none
}
.soft {
	background: var(--ice)
}
.steps {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 18px;
	margin-top: 35px
}
.steps article {
	background: white;
	border: 1px solid var(--line);
	border-radius: 14px;
	padding: 26px
}
.steps span {
	font-size: 34px;
	font-weight: 900;
	color: #9ecfe2
}
.steps p {
	font-size: 16px
}
.two-col {
	display: grid;
grid-template-columns:1.25fr .75fr;
	gap: 45px;
	align-items: start
}
.check-panel {
	background: var(--navy);
	color: white;
	border-radius: 16px;
	padding: 30px;
	position: sticky;
	top: 20px
}
.check-panel li {
	margin: 12px 0;
	color: #d0e0e8
}
.full {
	display: block;
	text-align: center;
	margin-top: 22px
}
.center {
	text-align: center
}
.cta-band {
	background: linear-gradient(120deg, #0a3858, #0b6b99);
	color: white
}
.cta-band p {
	color: #d8eef7
}
.cta-grid {
	display: grid;
grid-template-columns:1.25fr .75fr;
	gap: 45px;
	align-items: center
}
.cta-actions {
	flex-direction: column;
	margin: 0
}
.cta-actions .btn {
	text-align: center
}
.faq {
	border-top: 1px solid var(--line);
	margin-top: 34px
}
.faq details {
	border-bottom: 1px solid var(--line);
	padding: 20px 0
}
.faq summary {
	font-size: 19px;
	font-weight: 800;
	cursor: pointer
}
.faq details p {
	padding-right: 40px
}
.authority {
	background: #0a2035;
	color: #fff
}
.authority p {
	color: #bfd2de
}
.authority-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 55px
}
.resource-links {
	display: grid;
	gap: 12px
}
.resource-links a {
	display: flex;
	justify-content: space-between;
	gap: 18px;
	padding: 18px 20px;
	border: 1px solid rgba(255,255,255,.14);
	border-radius: 10px;
	text-decoration: none !important;
	background: rgba(255,255,255,.04);
	color:#fff !important;
}
.resource-links span {
	color: #a9c8d8
}
.final {
	background: #f5fafc
}
.final a {
	color: #0b6b99
}
.final .btn {
	color: white;
	margin-top: 12px
}
@media(max-width:900px) {
.hero {
	min-height: auto;
	padding: 90px 0
}
.hero-grid, .split-grid, .two-col, .cta-grid, .authority-grid {
	grid-template-columns: 1fr
}
.cards.three, .cards.four, .steps {
	grid-template-columns: 1fr 1fr
}
.proof-grid {
	grid-template-columns: 1fr 1fr
}
.check-panel {
	position: static
}
.split-grid.reverse>div:first-child, .split-grid.reverse>.placeholder {
	order: initial
}
}
@media(max-width:600px) {
.wrap, .narrow {
	width: min(100% - 28px, 1180px)
}
.section {
	padding: 68px 0
}
.hero h1 {
	font-size: 46px
}
.lead {
	font-size: 18px
}
.cards.three, .cards.four, .steps {
	grid-template-columns: 1fr
}
.proof-grid {
	grid-template-columns: 1fr 1fr
}
.hero-card {
	min-height: 330px
}
.section p {
	font-size: 17px
}
.resource-links a {
	display: block
}
.resource-links span {
	display: block;
	margin-top: 3px
}
.btn {
	width: 100%;
	text-align: center
}
}/* End custom CSS */