/* =========================================================================
   Self-hosted fonts — Space Grotesk (400–700) and Outfit (300–700).
   Replaces the render-blocking fonts.googleapis.com stylesheet that used to be
   linked from the tenant Chrome component: two extra DNS+TLS handshakes on the
   critical path, and every visitor IP handed to Google on every page load.
   Regenerate with scripts/fetch-fonts.mjs. latin + latin-ext are both kept —
   unicode-range means latin-ext only downloads if an extended glyph appears.
   ========================================================================= */
@font-face {
	font-family: 'Space Grotesk';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('/fonts/space-grotesk-400-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Space Grotesk';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('/fonts/space-grotesk-400-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: 'Space Grotesk';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url('/fonts/space-grotesk-500-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Space Grotesk';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url('/fonts/space-grotesk-500-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: 'Space Grotesk';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('/fonts/space-grotesk-600-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Space Grotesk';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('/fonts/space-grotesk-600-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: 'Space Grotesk';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('/fonts/space-grotesk-700-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Space Grotesk';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('/fonts/space-grotesk-700-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: 'Outfit';
	font-style: normal;
	font-weight: 300;
	font-display: swap;
	src: url('/fonts/outfit-300-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Outfit';
	font-style: normal;
	font-weight: 300;
	font-display: swap;
	src: url('/fonts/outfit-300-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: 'Outfit';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('/fonts/outfit-400-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Outfit';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('/fonts/outfit-400-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: 'Outfit';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url('/fonts/outfit-500-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Outfit';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url('/fonts/outfit-500-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: 'Outfit';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('/fonts/outfit-600-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Outfit';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('/fonts/outfit-600-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: 'Outfit';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('/fonts/outfit-700-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Outfit';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('/fonts/outfit-700-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* P1 Wraps — bespoke tenant stylesheet. Self-contained (loaded by P1Chrome), so it doesn't
   depend on the platform's Tailwind. Ported from the pixel-perfect rebuild. */

:root {
	/* Tokens ported VERBATIM from the local build (src/lib/styles/tokens.css). */
	--p1-teal: #58c3d6;
	--p1-teal-ink: #eaf8fa;
	--p1-magenta: #b300b3;
	--p1-magenta-dim: rgba(255, 0, 255, 0.2);

	--p1-bg: #111a27;
	--p1-bg-800: #131d2b;
	--p1-bg2: #131d2b; /* alias kept for existing tenant sections */
	--p1-surface: #1e2530;
	--p1-panel: #182231;
	--p1-panel-2: #1b2534;
	--p1-card: #242d3a;

	--p1-text: #eaf2f5;
	--p1-heading: #ffffff;
	--p1-muted: rgba(255, 255, 255, 0.62);
	--p1-line: rgba(255, 255, 255, 0.1);

	--p1-radius-btn: 4.4px;
	--p1-radius-card: 18px;

	--font-heading: 'Space Grotesk', system-ui, sans-serif;
	--font-body: 'Outfit', system-ui, sans-serif;
	--p1-head: var(--font-heading); /* aliases for existing tenant sections */
	--p1-body: var(--font-body);

	/* Signature dual glow behind hero imagery (teal-left / magenta-right). */
	--p1-glow-teal: rgba(88, 195, 214, 0.2) -25px 0 120px 0;
	--p1-glow-magenta: rgba(255, 0, 255, 0.2) 25px 0 120px 0;
	--p1-glow: var(--p1-glow-teal); /* alias */

	--p1-grad-hero:
		radial-gradient(circle at 70% 20%, #2d3545 0%, #1e2530 65%),
		radial-gradient(circle at 20% 80%, #171c24 0%, #1e2530 70%),
		radial-gradient(circle at 90% 80%, #262e3c 0%, #1e2530 75%);
	--p1-grad-diagonal: linear-gradient(225deg, #242d3a 0%, #2b3546 25%, #1f2733 50%, #1b222c 75%, #242d3a 100%);
	--p1-grad-fade-bottom: linear-gradient(rgba(255, 255, 255, 0) 0%, #131d2b 100%);
}

/* Scoped-ish reset for the tenant's own elements. */
.hdr *,
#main *,
.m-drawer *,
.ft * {
	box-sizing: border-box;
}

/* About embeds the testimonials switcher below its own .ab-tintro heading — render it bare
   (no duplicate trust line / heading) and pull it up tight against the intro. */
.tst--bare {
	padding-top: 0;
}
.tst--bare .tst-trust,
.tst--bare .tst-heading {
	display: none;
}
html {
	scroll-behavior: smooth;
}
body {
	margin: 0;
	background: var(--p1-bg);
	color: var(--p1-text);
	font-family: var(--p1-body);
	font-size: 17px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}
#main {
	display: block;
}
img {
	max-width: 100%;
}
a {
	color: inherit;
	text-decoration: none;
}
h1,
h2,
h3 {
	font-family: var(--p1-head);
	font-weight: 700;
	letter-spacing: -0.02em;
	line-height: 1.08;
	margin: 0;
}
p {
	margin: 0;
}
.wrap {
	width: 100%;
	max-width: 1280px;
	margin: 0 auto;
	padding-inline: 40px;
}
.eyebrow {
	font-family: var(--p1-head);
	font-weight: 600;
	font-size: 14px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--p1-teal);
	margin: 0 0 16px;
}
.lede {
	font-size: 17px;
	line-height: 1.7;
	color: var(--p1-muted);
}
.skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	background: var(--p1-teal);
	color: var(--p1-teal-ink);
	padding: 10px 16px;
	z-index: 200;
}
.skip-link:focus {
	left: 8px;
	top: 8px;
}

/* ── Buttons (verbatim from local tokens.css) ── */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	font-family: var(--font-body);
	font-weight: 600;
	font-size: 16px;
	line-height: 1;
	padding: 16px 26px;
	border-radius: var(--p1-radius-btn);
	border: 1.5px solid transparent;
	cursor: pointer;
	transition:
		transform 0.18s ease,
		background 0.18s ease,
		border-color 0.18s ease,
		box-shadow 0.18s ease;
}
.btn:hover {
	transform: translateY(-2px);
}
.btn-primary,
.btn-solid {
	background: var(--p1-teal);
	color: var(--p1-teal-ink);
	box-shadow: 0 12px 34px -14px rgba(88, 195, 214, 0.7);
}
.btn-ghost {
	background: transparent;
	color: var(--p1-text);
	border-color: rgba(255, 255, 255, 0.35);
}
.btn-ghost:hover {
	border-color: var(--p1-teal);
	color: var(--p1-teal);
}
.btn-white {
	background: #fff;
	color: #0a0f17;
}
.btn-white:hover {
	background: #eaf2f5;
}

/* ── Sections ── */
.section {
	padding: 100px 0;
}
.section-head {
	max-width: 760px;
	margin: 0 auto 48px;
	text-align: center;
}
.section-head h2 {
	font-size: clamp(30px, 3.4vw, 46px);
	color: #fff;
	margin: 0 0 16px;
}
.section-cta {
	display: flex;
	justify-content: center;
	margin-top: 44px;
}

/* ── Closing CTA (ported verbatim from local FinalCta.svelte) ── */
.cta {
	position: relative;
	background: #111a27;
	padding: 135px 60px;
	display: flex;
	justify-content: center;
	overflow: hidden;
}
.cta-bg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 50%;
	z-index: 0;
}
.cta::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 1;
	/* Consistent overlay at the top (image shows cleanly, text stays legible); fades to solid
	   only at the bottom so it blends into the footer. */
	background: linear-gradient(
		180deg,
		rgba(17, 26, 39, 0.45) 0%,
		rgba(17, 26, 39, 0.5) 55%,
		rgba(17, 26, 39, 0.88) 82%,
		#111a27 100%
	);
}
.cta-inner {
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: 820px;
	text-align: center;
}
.cta-inner h2 {
	font-size: 40px;
	line-height: 1.15;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: #fff;
	margin: 0 0 26px;
}
.cta-inner p {
	margin: 0 auto 18px;
	max-width: 62ch;
	font-size: 17px;
	line-height: 1.65;
	color: rgba(255, 255, 255, 0.85);
}
.cta-btn {
	margin-top: 20px;
	background: #fff;
	color: #000;
	padding: 15px 30px;
}
.cta-btn:hover {
	background: #eaf2f5;
}
@media (max-width: 1080px) {
	.cta {
		padding: 72px 24px;
	}
	.cta-inner h2 {
		font-size: clamp(26px, 6.5vw, 36px);
	}
}

/* ── Inner pages (service / about / contact / gallery / legal) ── */
.wrap-narrow {
	max-width: 900px;
}
.svc-hero {
	background: var(--p1-bg);
	padding: 76px 0 84px;
}
.svc-hero-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 48px;
	align-items: center;
}
.svc-crumb {
	display: flex;
	gap: 9px;
	font-size: 13px;
	color: var(--p1-muted);
	margin-bottom: 20px;
}
.svc-crumb a:hover {
	color: var(--p1-teal);
}
.svc-hero-copy h1 {
	font-size: clamp(34px, 4vw, 54px);
	color: #fff;
	margin: 0 0 20px;
}
.svc-hero-media img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 0;
	box-shadow: var(--p1-glow);
}

/* What is + features */
.svc-what {
	background: var(--p1-bg2);
}
.svc-features {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 22px;
	margin-top: 44px;
}
.svc-feature {
	display: flex;
	gap: 18px;
	background: rgba(255, 255, 255, 0.03);
	border: 1px solid var(--p1-line);
	border-radius: 14px;
	padding: 24px;
}
.svc-feature-ic {
	flex: none;
	width: 46px;
	height: 46px;
	display: grid;
	place-items: center;
	border-radius: 12px;
	background: color-mix(in srgb, var(--p1-teal) 16%, transparent);
	color: var(--p1-teal);
}
.svc-feature-ic svg {
	width: 24px;
	height: 24px;
}
.svc-feature h3 {
	font-size: 18px;
	color: #fff;
	margin: 2px 0 8px;
}
.svc-feature p {
	font-size: 14.5px;
	line-height: 1.55;
	color: var(--p1-muted);
	margin: 0;
}

/* Benefits */
.svc-benefits {
	background: var(--p1-bg2);
	padding-top: 0;
}
.svc-benefit-list {
	list-style: none;
	margin: 26px 0 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 16px 40px;
}
.svc-benefit-list li {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: 17px;
	color: var(--p1-text);
}
.svc-benefit-list svg {
	width: 22px;
	height: 22px;
	color: var(--p1-teal);
}

/* Service gallery */
.svc-gal-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 18px;
}
.svc-gal-cell {
	aspect-ratio: 1 / 1;
	overflow: hidden;
	border-radius: 0;
}
.svc-gal-cell img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
}
.svc-gal-cell:hover img {
	transform: scale(1.05);
}

/* FAQ */
.svc-faq {
	background: var(--p1-bg2);
}
.svc-faq-h {
	text-align: center;
	font-size: clamp(28px, 3.2vw, 42px);
	color: #fff;
	margin: 0 0 40px;
}
.svc-faq-list {
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.svc-faq-item {
	background: rgba(202, 214, 232, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 10px;
	padding: 0 26px;
}
.svc-faq-item summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	padding: 24px 0;
	cursor: pointer;
	list-style: none;
	font-family: var(--p1-head);
	font-weight: 700;
	font-size: 20px;
	color: #fff;
}
.svc-faq-item summary::-webkit-details-marker {
	display: none;
}
.svc-faq-plus {
	color: var(--p1-teal);
	font-size: 28px;
	line-height: 1;
	transition: transform 0.25s ease;
}
.svc-faq-item[open] .svc-faq-plus {
	transform: rotate(45deg);
}
.svc-faq-item p {
	margin: 0;
	padding: 0 0 24px;
	font-size: 16px;
	line-height: 1.7;
	color: var(--p1-muted);
}

/* Gallery masonry */
.gal-masonry {
	column-count: 4;
	column-gap: 16px;
}
.gal-item {
	break-inside: avoid;
	margin-bottom: 16px;
	border-radius: 10px;
	overflow: hidden;
}
.gal-item img {
	width: 100%;
	display: block;
}

/* Legal */
.legal-hero {
	padding-bottom: 40px;
}
.legal-back {
	display: inline-block;
	font-family: var(--p1-head);
	font-weight: 600;
	font-size: 13px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--p1-teal);
	margin-bottom: 20px;
}
.legal-hero h1 {
	font-size: clamp(32px, 4vw, 50px);
	color: #fff;
	margin: 0 0 12px;
}
.legal-updated {
	font-size: 14px;
	color: var(--p1-muted);
}
.legal-body {
	padding-top: 40px;
}
.legal-content h2 {
	font-size: 23px;
	color: #fff;
	margin: 40px 0 12px;
}
.legal-content h2:first-child {
	margin-top: 0;
}
.legal-content p {
	font-size: 16px;
	line-height: 1.75;
	color: var(--p1-muted);
	margin: 0 0 16px;
}
.legal-content ul {
	margin: 0 0 18px;
	padding-left: 22px;
	color: var(--p1-muted);
	line-height: 1.7;
}
.legal-content a {
	color: var(--p1-teal);
	text-decoration: underline;
}
.legal-content strong {
	color: var(--p1-text);
}
.legal-contact {
	background: rgba(255, 255, 255, 0.03);
	border: 1px solid var(--p1-line);
	border-radius: 12px;
	padding: 22px 24px;
	margin-top: 20px;
}
.legal-contact p {
	margin: 0 0 8px;
}

@media (max-width: 1000px) {
	.svc-hero-grid,
	.ct-hero-grid,
	.svc-features,
	.ab-exp-row {
		grid-template-columns: 1fr;
		gap: 30px;
	}
	.svc-hero-media {
		order: -1;
	}
	.ab-exp-row.flip .ab-exp-media {
		order: 0;
	}
	.svc-gal-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.ct-info-grid {
		grid-template-columns: 1fr;
	}
	.gal-masonry {
		column-count: 2;
	}
}
@media (max-width: 560px) {
	.svc-gal-grid {
		grid-template-columns: 1fr;
	}
	.gal-masonry {
		column-count: 1;
	}
}

/* ── Video hero facade + modal ── */
.svc-hero-media {
	position: relative;
}
.svc-hero-media.has-video::after {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: 0;
	background: linear-gradient(180deg, rgba(6, 10, 16, 0.12), rgba(6, 10, 16, 0.38));
	pointer-events: none;
}
.svc-play {
	position: absolute;
	inset: 0;
	margin: auto;
	width: 82px;
	height: 82px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: color-mix(in srgb, var(--p1-teal) 92%, transparent);
	color: var(--p1-teal-ink);
	box-shadow: 0 12px 40px -8px rgba(0, 0, 0, 0.6);
	z-index: 2;
	transition: transform 0.2s ease;
}
.svc-play::before {
	content: '';
	position: absolute;
	inset: -12px;
	border-radius: 50%;
	border: 2px solid color-mix(in srgb, var(--p1-teal) 55%, transparent);
	animation: p1-pulse 2s ease-out infinite;
}
@keyframes p1-pulse {
	0% {
		transform: scale(1);
		opacity: 0.7;
	}
	100% {
		transform: scale(1.45);
		opacity: 0;
	}
}
.svc-play:hover {
	transform: scale(1.06);
}
.svc-play svg {
	width: 34px;
	height: 34px;
	margin-left: 4px;
}
@media (prefers-reduced-motion: reduce) {
	.svc-play::before {
		animation: none;
	}
}
.p1-vm {
	position: fixed;
	inset: 0;
	z-index: 300;
	display: grid;
	place-items: center;
	padding: 24px;
	background: rgba(6, 10, 16, 0.9);
	backdrop-filter: blur(8px);
	animation: p1-vm-fade 0.2s ease;
}
@keyframes p1-vm-fade {
	from {
		opacity: 0;
	}
}
.p1-vm-frame {
	position: relative;
	width: min(1100px, 100%);
	aspect-ratio: 16 / 9;
	background: #000;
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 40px 120px -30px rgba(0, 0, 0, 0.85);
}
.p1-vm-frame iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}
.p1-vm-close {
	position: absolute;
	top: 18px;
	right: 22px;
	width: 44px;
	height: 44px;
	display: grid;
	place-items: center;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.12);
	color: #fff;
	font-size: 26px;
	line-height: 1;
	cursor: pointer;
}
.p1-vm-close:hover {
	background: rgba(255, 255, 255, 0.22);
}

/* ── Fleet ROI calculator (faithful port of local Calculator.svelte) ── */
.calc {
	position: relative;
	background: var(--p1-bg);
	padding: 135px 60px;
	display: flex;
	justify-content: center;
	overflow: hidden;
}
.calc .calc-bg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 50%;
	filter: brightness(0.3) saturate(0.8);
	z-index: 0;
}
.calc::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 0;
	background: linear-gradient(
		120deg,
		rgba(16, 24, 35, 0.98) 0%,
		rgba(16, 24, 35, 0.94) 50%,
		rgba(16, 24, 35, 0.97) 100%
	);
}
.calc .calc-inner {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: 1366px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 30px;
	align-items: start;
}
.calc .calc-eyebrow {
	margin: 0 0 22px;
	font-family: var(--font-heading);
	font-weight: 400;
	font-size: 16px;
	letter-spacing: 4px;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.8);
}
.calc .calc-heading {
	font-size: 49.5px;
	line-height: 60px;
	font-weight: 700;
	letter-spacing: -0.02em;
	margin: 0 0 26px;
}
.calc .calc-heading .accent {
	color: var(--p1-teal);
}
.calc .calc-lede {
	margin: 0 0 20px;
	max-width: 52ch;
	font-size: 17px;
	line-height: 1.65;
	color: var(--p1-muted);
}
.calc .calc-cta {
	margin-top: 10px;
	padding: 11px 30px;
	font-size: 16px;
}
.calc .calc-panel {
	background: #0f172a;
	border-radius: 6px;
	padding: 40px 32px;
	display: flex;
	flex-direction: column;
	gap: 28px;
}
.calc .roi-controls,
.calc .roi-results {
	display: flex;
	flex-direction: column;
	gap: 24px;
}
.calc .roi-label {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 12px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: color-mix(in srgb, var(--p1-teal) 72%, #fff);
	margin-bottom: 12px;
}
.calc .roi-count {
	font-family: var(--font-heading);
	font-size: 28px;
	font-weight: 700;
	color: var(--p1-teal);
	letter-spacing: -0.02em;
}
.calc .roi-slider {
	width: 100%;
	accent-color: var(--p1-teal);
	cursor: pointer;
}
.calc .roi-scale {
	display: flex;
	justify-content: space-between;
	font-size: 12px;
	color: var(--p1-muted);
	margin-top: 4px;
}
.calc .roi-coverage {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px;
}
.calc .roi-opt {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 14px 12px;
	border-radius: 12px;
	border: 1.5px solid rgba(255, 255, 255, 0.14);
	background: rgba(255, 255, 255, 0.04);
	cursor: pointer;
	text-align: left;
	transition:
		border-color 0.2s ease,
		background 0.2s ease,
		transform 0.2s ease,
		box-shadow 0.2s ease;
}
.calc .roi-opt:hover {
	border-color: var(--p1-teal);
	transform: translateY(-2px);
}
.calc .roi-opt b {
	font-size: 15px;
	color: var(--p1-text);
}
.calc .roi-opt span {
	font-size: 12.5px;
	color: var(--p1-muted);
}
.calc .roi-opt.active {
	border-color: var(--p1-teal);
	background: color-mix(in srgb, var(--p1-teal) 16%, transparent);
	box-shadow: 0 0 30px -8px color-mix(in srgb, var(--p1-teal) 60%, transparent);
}
.calc .roi-stat--big {
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.calc .roi-dt {
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: color-mix(in srgb, var(--p1-teal) 70%, #fff);
}
.calc .roi-dd {
	font-family: var(--font-heading);
	font-weight: 700;
	line-height: 1.05;
	letter-spacing: -0.03em;
	font-variant-numeric: tabular-nums;
	background: linear-gradient(120deg, #fff 15%, var(--p1-teal) 85%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.calc .roi-stat--big .roi-dd {
	font-size: clamp(52px, 6vw, 82px);
}
.calc .roi-verdict {
	margin: 0;
	font-size: 15px;
	line-height: 1.5;
	color: rgba(255, 255, 255, 0.72);
	max-width: 46ch;
}
.calc .roi-substats {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 18px;
}
.calc .roi-substats .roi-stat {
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.calc .roi-substats .roi-dd {
	font-size: clamp(24px, 2.6vw, 32px);
}
.calc .roi-compare {
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.calc .roi-bar {
	display: grid;
	grid-template-columns: 100px 1fr auto;
	align-items: center;
	gap: 12px;
	font-size: 12.5px;
	color: var(--p1-muted);
}
.calc .roi-bar-label {
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}
.calc .roi-bar-track {
	display: block;
	height: 10px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.1);
	overflow: hidden;
}
.calc .roi-bar-fill {
	display: block;
	height: 100%;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.28);
	transition: width 0.6s ease;
}
.calc .roi-bar-fill--wrap {
	background: linear-gradient(90deg, var(--p1-magenta), var(--p1-teal));
	box-shadow: 0 0 16px color-mix(in srgb, var(--p1-teal) 70%, transparent);
}
.calc .roi-bar-val {
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}
.calc .roi-quote {
	width: 100%;
}
.calc .roi-report {
	border-top: 1px solid rgba(255, 255, 255, 0.12);
	padding-top: 18px;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.calc .roi-report-title {
	margin: 0;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: color-mix(in srgb, var(--p1-teal) 70%, #fff);
}
.calc .roi-report-fields {
	display: grid;
	grid-template-columns: 1fr 1.3fr;
	gap: 10px;
}
.calc .roi-report input[type='text'],
.calc .roi-report input[type='email'] {
	width: 100%;
	padding: 11px 14px;
	border-radius: 10px;
	border: 1.5px solid rgba(255, 255, 255, 0.16);
	background: rgba(10, 14, 26, 0.6);
	font: inherit;
	font-size: 14.5px;
	color: var(--p1-text);
}
.calc .roi-report input:focus {
	outline: 2px solid var(--p1-teal);
	border-color: var(--p1-teal);
}
.calc .roi-report input[aria-invalid] {
	border-color: #e05666;
}
.calc .roi-consent {
	display: flex;
	align-items: flex-start;
	gap: 9px;
	font-size: 12.5px;
	line-height: 1.45;
	color: rgba(255, 255, 255, 0.65);
	cursor: pointer;
}
.calc .roi-consent input {
	margin-top: 2px;
	flex: none;
	width: 15px;
	height: 15px;
	accent-color: var(--p1-teal);
}
.calc .roi-report-btn {
	align-self: flex-start;
	padding: 11px 22px;
	font-size: 14px;
}
.calc .roi-report-err {
	margin: 0;
	font-size: 13px;
	font-weight: 600;
	color: #e05666;
}
.calc .roi-hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	opacity: 0;
	pointer-events: none;
}
.calc .roi-accordion {
	border-top: 1px solid rgba(255, 255, 255, 0.12);
	padding-top: 6px;
}
.calc .roi-acc-toggle {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 12px 2px;
	background: none;
	border: 0;
	cursor: pointer;
	list-style: none;
	font-family: var(--font-heading);
	font-weight: 600;
	font-size: 14px;
	letter-spacing: 0.02em;
	color: color-mix(in srgb, var(--p1-teal) 78%, #fff);
	transition: color 0.18s ease;
}
.calc .roi-acc-toggle::-webkit-details-marker {
	display: none;
}
.calc .roi-acc-toggle:hover {
	color: var(--p1-teal);
}
.calc .roi-acc-chev {
	width: 13px;
	height: 9px;
	flex: none;
	transition: transform 0.3s ease;
}
.calc .roi-accordion[open] .roi-acc-chev {
	transform: rotate(180deg);
}
.calc .roi-acc-inner {
	display: flex;
	flex-direction: column;
	gap: 22px;
	padding-top: 14px;
}
.calc .calc-note {
	margin: 4px 0 0;
	font-size: 11.5px;
	line-height: 1.55;
	color: rgba(255, 255, 255, 0.45);
}
/* Success state (after ?/roiReport round-trip) */
.calc .calc-done {
	align-items: flex-start;
	justify-content: center;
	text-align: left;
	gap: 14px;
}
.calc .calc-done-ic {
	width: 56px;
	height: 56px;
	display: inline-grid;
	place-items: center;
	border-radius: 50%;
	background: color-mix(in srgb, var(--p1-teal) 18%, transparent);
	color: var(--p1-teal);
}
.calc .calc-done-ic svg {
	width: 30px;
	height: 30px;
}
.calc .calc-done h3 {
	font-size: 32px;
	color: #fff;
	margin: 0;
}
.calc .calc-done p {
	font-size: 16px;
	line-height: 1.6;
	color: var(--p1-muted);
	margin: 0;
}
.calc .calc-done a {
	color: var(--p1-teal);
	text-decoration: underline;
}
@media (max-width: 1080px) {
	.calc {
		padding: 64px 24px;
	}
	.calc .calc-inner {
		grid-template-columns: 1fr;
		row-gap: 40px;
	}
	.calc .calc-heading {
		font-size: clamp(32px, 8vw, 44px);
		line-height: 1.1;
	}
}
@media (max-width: 560px) {
	.calc .roi-report-fields {
		grid-template-columns: 1fr;
	}
}

/* ══════════════════════════════════════════════════════════════════════
   FAITHFUL PORT from the local build — section CSS copied verbatim,
   scoped to each section root so nothing collides with earlier rules.
   ══════════════════════════════════════════════════════════════════════ */

/* ── Hero (local Hero.svelte) ── */
.hero {
	position: relative;
	background: #111a27;
	overflow: hidden;
	padding: 135px 60px;
	display: flex;
	justify-content: center;
}
.hero .hero-inner {
	width: 100%;
	max-width: 1366px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 30px;
	align-items: stretch;
}
.hero .eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 22px;
	font-family: var(--font-heading);
	font-weight: 600;
	font-size: 14px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--p1-muted);
	max-width: 34ch;
	line-height: 1.5;
}
.hero .star {
	color: #f5b301;
	font-size: 18px;
}
.hero h1 {
	font-size: clamp(46px, 6vw, 82px);
	font-weight: 700;
	letter-spacing: -0.03em;
	line-height: 1.02;
}
.hero .accent {
	color: var(--p1-teal);
	display: block;
}
.hero .lede {
	margin: 26px 0 0;
	max-width: 52ch;
	font-size: 17px;
	line-height: 1.65;
	color: var(--p1-muted);
}
.hero .rating {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-top: 28px;
}
.hero .hero-logos {
	display: inline-flex;
	align-items: center;
	gap: 16px;
}
.hero .hero-logos img {
	height: 24px;
	width: auto;
	filter: brightness(0) invert(1);
	opacity: 0.85;
}
.hero .rating-text {
	font-size: 15px;
	color: var(--p1-muted);
}
.hero .rating-text b {
	color: var(--p1-text);
}
.hero .stars {
	color: #f5b301;
	letter-spacing: 2px;
}
.hero .hero-cta {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	margin-top: 30px;
}
.hero .hero-media {
	position: relative;
	min-height: 0;
}
.hero .glow-wrap {
	position: relative;
	height: 100%;
	box-shadow: var(--p1-glow-teal);
}
.hero .glow-wrap img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 20% 50%;
	border-radius: 0;
}
@media (max-width: 1080px) {
	.hero {
		padding: 56px 24px 64px;
	}
	.hero .hero-inner {
		grid-template-columns: 1fr;
		row-gap: 36px;
	}
	.hero .glow-wrap {
		height: auto;
		aspect-ratio: 1 / 1;
	}
	.hero .accent {
		display: inline;
	}
}

/* ── About + The P1 Difference (local About.svelte) ── */
.au {
	background: #111a27;
	padding: 135px 60px;
	display: flex;
	justify-content: center;
}
.au .au-inner {
	width: 100%;
	max-width: 1366px;
	display: flex;
	flex-direction: column;
	gap: 96px;
}
.au .au-row {
	display: grid;
	grid-template-columns: 519fr 779fr;
	column-gap: 67.5px;
	align-items: center;
}
.au .au-copy h2 {
	font-size: 56.85px;
	line-height: 1.05;
	font-weight: 700;
	letter-spacing: 0.5px;
	color: #fff;
	margin: 0 0 22px;
}
.au .au-copy h2 .accent {
	color: var(--p1-teal);
}
.au .au-copy p {
	margin: 0 0 16px;
	font-size: 17px;
	line-height: 1.65;
	color: var(--p1-muted);
}
.au .au-lede {
	font-size: 20px !important;
	line-height: 1.5 !important;
	color: rgba(255, 255, 255, 0.8) !important;
}
.au .au-cta {
	margin-top: 12px;
	padding: 11px 30px;
	font-size: 16px;
}
.au .au-media img {
	width: 100%;
	aspect-ratio: 519 / 693;
	object-fit: cover;
	display: block;
}
.au .au-media--pair {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 30px;
}
.au .au-media--pair img {
	aspect-ratio: 374 / 724;
}
@media (max-width: 1080px) {
	.au {
		padding: 72px 24px;
	}
	.au .au-inner {
		gap: 56px;
	}
	.au .au-row,
	.au .au-row--diff {
		grid-template-columns: 1fr;
		row-gap: 32px;
	}
	.au .au-row--diff .au-copy {
		order: 2;
	}
	.au .au-row--diff .au-media {
		order: 1;
	}
	.au .au-copy h2 {
		font-size: clamp(32px, 8vw, 46px);
	}
	.au .au-media img {
		aspect-ratio: 16 / 10;
	}
	.au .au-media--pair img {
		aspect-ratio: 3 / 4;
	}
}

/* ── Materials marquee (local MaterialsMarquee.svelte) ── */
.mat {
	background: var(--p1-bg);
	padding: 135px 60px;
}
.mat .mat-head {
	max-width: 1000px;
	margin: 0 auto 64px;
	text-align: center;
}
.mat .mat-head h2 {
	font-size: 47.37px;
	line-height: 56.85px;
	font-weight: 700;
	letter-spacing: -0.02em;
	margin: 0 0 20px;
}
.mat .mat-head p {
	margin: 0 auto;
	max-width: 60ch;
	font-size: 20px;
	line-height: 1.5;
	color: rgba(255, 255, 255, 0.8);
}
.mat .marquee {
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.mat .track {
	display: flex;
	width: max-content;
	animation: mat-scroll-rtl 20s linear infinite;
}
.mat .logo {
	flex: 0 0 auto;
	width: 190px;
	display: grid;
	place-items: center;
}
.mat .logo img {
	width: 100px;
	height: auto;
}
@keyframes mat-scroll-rtl {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-50%);
	}
}
@media (prefers-reduced-motion: reduce) {
	.mat .track {
		animation: none;
		flex-wrap: wrap;
		justify-content: center;
		width: auto;
	}
}
@media (max-width: 1080px) {
	.mat {
		padding: 72px 24px;
	}
	.mat .mat-head {
		margin-bottom: 44px;
	}
	.mat .mat-head h2 {
		font-size: clamp(28px, 6.5vw, 40px);
		line-height: 1.2;
	}
}

/* ── Scroll reveal (local ScrollReveal.svelte) ── */
.reveal-section {
	position: relative;
	background: #101823;
	padding: 135px 60px;
	display: flex;
	justify-content: center;
	overflow: hidden;
}
.reveal-section .truck-art {
	position: absolute;
	inset: 0;
	z-index: 0;
	display: grid;
	place-items: center;
	opacity: 0.06;
	pointer-events: none;
	transform-origin: 60% 50%;
	will-change: transform;
}
.reveal-section .truck-art img {
	width: min(1287px, 92%);
	height: auto;
}
.reveal-section .reveal-inner {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: 1366px;
}
.reveal-section .reveal-eyebrow {
	margin: 0 0 30px;
	font-family: var(--font-heading);
	font-weight: 400;
	font-size: 16px;
	letter-spacing: 4px;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.8);
}
.reveal-section .reveal {
	margin: 0;
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 49.5px;
	line-height: 59.4px;
	letter-spacing: 0.5px;
	color: rgba(255, 0, 255, 0.2);
}
.reveal-section .reveal .w {
	color: inherit;
}
@media (max-width: 1080px) {
	.reveal-section {
		padding: 72px 24px;
	}
	.reveal-section .reveal {
		font-size: clamp(28px, 6.5vw, 40px);
		line-height: 1.25;
	}
}

/* ── Business testimonials (local Testimonials.svelte) ── */
.tst {
	background: var(--p1-bg);
	padding: 135px 60px;
	display: flex;
	justify-content: center;
}
.tst .tst-inner {
	width: 100%;
	max-width: 1366px;
}
.tst .tst-trust {
	text-align: center;
	margin-bottom: 18px;
}
.tst .tst-count {
	margin: 0 0 8px;
	font-family: var(--font-heading);
	font-weight: 600;
	font-size: 15px;
	color: var(--p1-text);
}
.tst .tst-stars {
	color: var(--p1-teal);
	letter-spacing: 6px;
	font-size: 22px;
}
.tst .tst-heading {
	text-align: center;
	font-size: 47.37px;
	line-height: 56.85px;
	font-weight: 700;
	letter-spacing: -0.02em;
	margin: 0 auto 48px;
	max-width: 20ch;
}
.tst .tst-heading .accent {
	color: var(--p1-teal);
}
.tst .tst-card {
	display: flex;
	gap: 40px;
	background: #242d3a;
	border-radius: 10px;
	padding: 45px;
}
.tst .tst-photo {
	flex: 0 0 42%;
	align-self: stretch;
}
.tst .tst-photo img {
	width: 100%;
	height: 100%;
	min-height: 360px;
	object-fit: cover;
	border-radius: 0;
}
.tst .tst-body {
	flex: 1;
	display: flex;
	flex-direction: column;
}
.tst .tst-mark {
	font-family: var(--font-heading);
	font-size: 64px;
	line-height: 0.7;
	color: var(--p1-teal);
}
.tst .tst-title {
	font-size: 35.54px;
	line-height: 1.15;
	font-weight: 700;
	color: #fff;
	margin: 14px 0 16px;
}
.tst .tst-quote {
	margin: 0;
	font-size: 16.5px;
	line-height: 1.62;
	color: var(--p1-muted);
}
.tst .tst-quote.clamped {
	display: -webkit-box;
	-webkit-line-clamp: 6;
	line-clamp: 6;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.tst .tst-more {
	align-self: flex-start;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 12px;
	padding: 6px 0;
	background: none;
	border: 0;
	cursor: pointer;
	font-family: var(--font-heading);
	font-weight: 600;
	font-size: 14px;
	color: var(--p1-teal);
}
.tst .tst-more svg {
	width: 12px;
	height: 8px;
	transition: transform 0.25s ease;
}
.tst .tst-more.open svg {
	transform: rotate(180deg);
}
.tst .tst-more:hover {
	color: #fff;
}
.tst .tst-attr {
	margin-top: auto;
	padding-top: 22px;
}
.tst .tst-name {
	margin: 0;
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 26.66px;
	color: var(--p1-teal);
}
.tst .tst-role {
	margin: 4px 0 0;
	font-size: 15px;
	color: var(--p1-muted);
}
.tst .tst-tabs {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	margin-top: 30px;
}
.tst .tst-tab {
	height: 153px;
	display: grid;
	place-items: center;
	padding: 24px;
	background: rgba(202, 214, 232, 0.1);
	border: 1px solid var(--p1-bg);
	border-radius: 10px;
	cursor: pointer;
	transition:
		border-color 0.2s ease,
		background 0.2s ease,
		transform 0.2s ease;
}
.tst .tst-tab img {
	max-width: 150px;
	max-height: 62px;
	width: auto;
	height: auto;
	object-fit: contain;
	opacity: 0.7;
	transition: opacity 0.2s ease;
}
.tst .tst-tab:hover {
	transform: translateY(-2px);
}
.tst .tst-tab:hover img {
	opacity: 1;
}
.tst .tst-tab.active {
	border-color: var(--p1-teal);
	background: color-mix(in srgb, var(--p1-teal) 12%, rgba(202, 214, 232, 0.1));
}
.tst .tst-tab.active img {
	opacity: 1;
}
@media (max-width: 1080px) {
	.tst {
		padding: 72px 24px;
	}
	.tst .tst-heading {
		font-size: clamp(28px, 6.5vw, 40px);
		line-height: 1.2;
	}
	.tst .tst-card {
		flex-direction: column;
		padding: 24px;
		gap: 24px;
	}
	.tst .tst-photo img {
		min-height: 260px;
	}
}
@media (max-width: 640px) {
	.tst .tst-tabs {
		gap: 12px;
	}
	.tst .tst-tab {
		height: 96px;
		padding: 14px;
	}
}

/* ── Gallery — "Wrapped for Business" (local Gallery.svelte) ── */
.gal {
	background: #131d2b;
	padding: 67.5px 60px 135px;
	display: flex;
	justify-content: center;
}
.gal .gal-inner {
	width: 100%;
	max-width: 1366px;
}
.gal .gal-head {
	max-width: 900px;
	margin: 0 auto 48px;
	text-align: center;
}
.gal .gal-head h2 {
	font-size: 47.37px;
	line-height: 56.85px;
	font-weight: 700;
	letter-spacing: -0.02em;
	margin: 0 0 18px;
}
.gal .gal-head p {
	margin: 0 auto;
	max-width: 66ch;
	font-size: 20px;
	line-height: 1.5;
	color: rgba(255, 255, 255, 0.8);
}
.gal .gal-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 30px;
}
.gal .gal-cell {
	aspect-ratio: 1 / 1;
	overflow: hidden;
	padding: 0;
	border: 0;
	background: none;
	cursor: pointer;
}
.gal .gal-cell img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.4s ease;
}
.gal .gal-cell:hover img {
	transform: scale(1.05);
}
.gal .gal-actions {
	display: flex;
	justify-content: center;
	margin-top: 48px;
}
@media (max-width: 1080px) {
	.gal {
		padding: 48px 24px 72px;
	}
	.gal .gal-grid {
		grid-template-columns: repeat(3, 1fr);
		gap: 16px;
	}
	.gal .gal-head h2 {
		font-size: clamp(28px, 6.5vw, 40px);
		line-height: 1.2;
	}
}
@media (max-width: 620px) {
	.gal .gal-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* ── Lightbox (built by interact.js; hidden until opened) ── */
.lb {
	position: fixed;
	inset: 0;
	z-index: 200;
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: 8px;
	padding: 24px;
	background: rgba(6, 10, 16, 0.92);
	backdrop-filter: blur(6px);
	animation: lb-fade 0.2s ease;
}
@keyframes lb-fade {
	from {
		opacity: 0;
	}
}
.lb .lb-stage {
	margin: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 14px;
	justify-self: center;
	max-width: 100%;
}
.lb .lb-stage img {
	max-width: min(1100px, 100%);
	max-height: 82vh;
	width: auto;
	height: auto;
	object-fit: contain;
	border-radius: 0;
	box-shadow: 0 40px 120px -30px rgba(0, 0, 0, 0.8);
}
.lb .lb-count {
	font-family: var(--font-heading);
	font-weight: 600;
	font-size: 15px;
	letter-spacing: 0.14em;
	color: var(--p1-teal);
	font-variant-numeric: tabular-nums;
}
.lb .lb-close {
	position: absolute;
	top: 20px;
	right: 24px;
	width: 44px;
	height: 44px;
	display: grid;
	place-items: center;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.08);
	color: #fff;
	cursor: pointer;
	transition: background 0.18s ease;
}
.lb .lb-close:hover {
	background: rgba(255, 255, 255, 0.16);
}
.lb .lb-close svg {
	width: 22px;
	height: 22px;
}
.lb .lb-nav {
	width: 52px;
	height: 52px;
	display: grid;
	place-items: center;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.08);
	color: #fff;
	cursor: pointer;
	flex: none;
	transition:
		background 0.18s ease,
		color 0.18s ease;
}
.lb .lb-nav:hover {
	background: var(--p1-teal);
	color: var(--p1-teal-ink);
}
.lb .lb-nav svg {
	width: 26px;
	height: 26px;
}
@media (max-width: 620px) {
	.lb {
		padding: 12px;
		gap: 2px;
	}
	.lb .lb-nav {
		width: 42px;
		height: 42px;
	}
}

/* ══ About page (faithful port of local about-us; scoped under .p1-about) ══ */
.p1-about .ab-wrap {
	width: 100%;
	max-width: 1366px;
	margin: 0 auto;
	padding-inline: 60px;
}
.p1-about .ab-center {
	text-align: center;
}
.p1-about section h2 {
	font-size: 49.5px;
	line-height: 1.1;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: #fff;
}
.p1-about .accent {
	color: var(--p1-teal);
}
.p1-about .ab-eyebrow {
	font-family: var(--font-heading);
	font-weight: 600;
	font-size: 14px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--p1-teal);
	margin: 0 0 18px;
}
.p1-about .ab-lede {
	font-size: 17px;
	line-height: 1.7;
	color: var(--p1-muted);
	margin: 0 auto;
	max-width: 68ch;
}

/* Hero */
.p1-about .ab-hero {
	background: #131d2b;
	padding: 150px 0 96px;
}
.p1-about .ab-hero-inner {
	text-align: center;
	max-width: 900px;
}
.p1-about .ab-hero h1 {
	font-size: clamp(38px, 4.8vw, 62px);
	line-height: 1.05;
	font-weight: 700;
	letter-spacing: -0.03em;
	color: #fff;
	margin: 0 0 24px;
}
.p1-about .ab-hero-intro {
	font-size: 18px;
	line-height: 1.7;
	color: var(--p1-muted);
	margin: 0 auto 40px;
	max-width: 70ch;
}
.p1-about .ab-stats {
	list-style: none;
	margin: 0 auto 28px;
	padding: 0;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 18px;
}
.p1-about .ab-stats li {
	flex: 1 1 180px;
	max-width: 220px;
	background: rgba(255, 255, 255, 0.03);
	border: 1px solid var(--p1-line);
	border-radius: 14px;
	padding: 24px 18px;
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.p1-about .ab-stat-big {
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 38px;
	line-height: 1;
	color: var(--p1-teal);
}
.p1-about .ab-stat-label {
	font-size: 14px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--p1-text);
}
.p1-about .ab-hero-serving {
	margin: 0;
	font-family: var(--font-heading);
	font-size: 14px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--p1-muted);
}

/* Our Story */
.p1-about .ab-story {
	background: #111a27;
	padding: 120px 0;
}
.p1-about .ab-story-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 56px;
	align-items: center;
}
.p1-about .ab-story-media img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 0;
	box-shadow: var(--p1-glow-teal);
}
.p1-about .ab-story-copy h2 {
	margin: 0 0 22px;
}
.p1-about .ab-story-copy p {
	font-size: 16.5px;
	line-height: 1.75;
	color: var(--p1-muted);
	margin: 0 0 18px;
}
.p1-about .ab-story-copy .btn {
	margin-top: 12px;
}

/* Our Expertise */
.p1-about .ab-expertise {
	background: #131d2b;
	padding: 120px 0;
}
.p1-about .ab-exp-head {
	max-width: 780px;
	margin: 0 auto 72px;
}
.p1-about .ab-exp-head h2 {
	margin: 0 0 18px;
}
.p1-about .ab-exp-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 56px;
	align-items: center;
	margin-bottom: 64px;
}
.p1-about .ab-exp-row:last-child {
	margin-bottom: 0;
}
.p1-about .ab-exp-row.flip .ab-exp-media {
	order: 2;
}
.p1-about .ab-exp-media {
	display: block;
	border-radius: 0;
	overflow: hidden;
	aspect-ratio: 4 / 3;
}
.p1-about .ab-exp-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.4s ease;
}
.p1-about .ab-exp-media:hover img {
	transform: scale(1.04);
}
.p1-about .ab-exp-copy h3 {
	font-size: 28px;
	font-weight: 700;
	color: #fff;
	margin: 0 0 16px;
	letter-spacing: -0.01em;
}
.p1-about .ab-exp-copy > p {
	font-size: 16.5px;
	line-height: 1.75;
	color: var(--p1-muted);
	margin: 0 0 24px;
}
.p1-about .ab-inline-link {
	color: var(--p1-teal);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
}
.p1-about .ab-inline-link:hover {
	color: #fff;
}

/* Testimonials intro */
.p1-about .ab-tintro {
	background: #111a27;
	padding: 120px 0 60px;
}
.p1-about .ab-tintro h2 {
	margin: 0 0 22px;
}
.p1-about .ab-tstat {
	margin: 30px 0 0;
	font-family: var(--font-heading);
	font-weight: 600;
	font-size: 18px;
	color: var(--p1-text);
}

/* Short reviews grid */
.p1-about .ab-reviews {
	background: #111a27;
	padding: 20px 0 120px;
}
.p1-about .ab-reviews-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}
.p1-about .ab-review {
	margin: 0;
	background: rgba(255, 255, 255, 0.03);
	border: 1px solid var(--p1-line);
	border-radius: 14px;
	padding: 26px 24px;
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.p1-about .ab-review-stars {
	display: flex;
	gap: 3px;
	color: #f5b301;
}
.p1-about .ab-review-stars svg {
	width: 18px;
	height: 18px;
}
.p1-about .ab-review blockquote {
	margin: 0;
	font-size: 15.5px;
	line-height: 1.65;
	color: var(--p1-text);
}
.p1-about .ab-review figcaption {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin-top: auto;
}
.p1-about .ab-review-name {
	font-family: var(--font-heading);
	font-weight: 600;
	font-size: 15px;
	color: #fff;
}
.p1-about .ab-review-src {
	font-size: 13px;
	color: var(--p1-teal);
}

/* CTA */
.p1-about .ab-cta {
	position: relative;
	background: #111a27;
	padding: 135px 60px;
	display: flex;
	justify-content: center;
	overflow: hidden;
}
.p1-about .ab-cta-bg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: 0;
}
.p1-about .ab-cta::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(
		180deg,
		rgba(17, 26, 39, 0.45) 0%,
		rgba(17, 26, 39, 0.5) 55%,
		rgba(17, 26, 39, 0.88) 82%,
		#111a27 100%
	);
}
.p1-about .ab-cta-inner {
	position: relative;
	z-index: 2;
	max-width: 820px;
	text-align: center;
}
.p1-about .ab-cta-inner h2 {
	font-size: 40px;
	margin: 0 0 22px;
}
.p1-about .ab-cta-inner p {
	margin: 0 auto 28px;
	max-width: 64ch;
	font-size: 17px;
	line-height: 1.65;
	color: rgba(255, 255, 255, 0.85);
}
.p1-about .ab-cta-btns {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 16px;
}
.p1-about .ab-cta-btn {
	background: #fff;
	color: #000;
	padding: 15px 30px;
}
.p1-about .ab-cta-btn:hover {
	background: #eaf2f5;
}
.p1-about .ab-cta-ghost {
	border: 2px solid #fff;
	color: #fff;
	background: transparent;
	padding: 13px 30px;
}
.p1-about .ab-cta-ghost:hover {
	background: #fff;
	color: #111a27;
}

@media (max-width: 1080px) {
	.p1-about .ab-wrap {
		padding-inline: 24px;
	}
	.p1-about section h2 {
		font-size: clamp(30px, 6.5vw, 42px);
	}
	.p1-about .ab-hero {
		padding: 120px 0 64px;
	}
	.p1-about .ab-story,
	.p1-about .ab-expertise,
	.p1-about .ab-tintro {
		padding: 72px 0;
	}
	.p1-about .ab-story-grid,
	.p1-about .ab-exp-row {
		grid-template-columns: 1fr;
		gap: 32px;
	}
	.p1-about .ab-exp-row.flip .ab-exp-media {
		order: 0;
	}
	.p1-about .ab-reviews-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}
@media (max-width: 620px) {
	.p1-about .ab-reviews-grid {
		grid-template-columns: 1fr;
	}
	.p1-about .ab-stats li {
		flex-basis: 100%;
		max-width: none;
	}
}

/* ══ Contact page (faithful port of local contact; scoped under .p1-contact) ══ */
.p1-contact .ct-wrap {
	width: 100%;
	max-width: 1366px;
	margin: 0 auto;
	padding-inline: 60px;
}
.p1-contact .accent {
	color: var(--p1-teal);
}
.p1-contact .sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
.p1-contact .ct-eyebrow {
	font-family: var(--font-heading);
	font-weight: 600;
	font-size: 14px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--p1-teal);
	margin: 0 0 12px;
}
.p1-contact .ct-lede {
	font-size: 17px;
	line-height: 1.7;
	color: var(--p1-muted);
}

/* Hero */
.p1-contact .ct-hero {
	background: #131d2b;
	padding: 130px 0 110px;
}
.p1-contact .ct-hero-grid {
	display: grid;
	grid-template-columns: 1.05fr 0.95fr;
	gap: 40px;
	align-items: center;
	margin-bottom: 80px;
}
.p1-contact .ct-hero h1 {
	font-size: clamp(40px, 5vw, 66px);
	line-height: 1.02;
	font-weight: 700;
	letter-spacing: -0.03em;
	color: #fff;
	margin: 0 0 24px;
}
.p1-contact .ct-hero-intro {
	font-size: 17px;
	line-height: 1.7;
	color: var(--p1-muted);
	margin: 0;
	max-width: 44ch;
}
.p1-contact .ct-hero-logo {
	display: flex;
	justify-content: center;
}
.p1-contact .ct-hero-logo img {
	width: 100%;
	max-width: 360px;
	height: auto;
}

/* Info cards */
.p1-contact .ct-info-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 32px;
}
.p1-contact .ct-info-card {
	background: rgba(202, 214, 232, 0.1);
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 10px;
	padding: 32px 30px;
	display: flex;
	flex-direction: column;
}
.p1-contact .ct-info-ic {
	color: var(--p1-teal);
	margin-bottom: 26px;
}
.p1-contact .ct-info-ic svg {
	width: 30px;
	height: 30px;
}
.p1-contact .ct-info-card h2 {
	font-size: 22px;
	font-weight: 700;
	color: #fff;
	margin: 0 0 12px;
}
.p1-contact .ct-info-card p {
	font-size: 15px;
	line-height: 1.6;
	color: var(--p1-muted);
	margin: 0 0 22px;
}
.p1-contact .ct-info-value {
	margin-top: auto;
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 16px;
	color: var(--p1-teal);
	word-break: break-word;
}
.p1-contact .ct-info-value:hover {
	color: #fff;
}

/* Form section */
/* Post-submit PRG lands on #quote / #calculator — clear the fixed header so the
   thank-you heading isn't tucked underneath it. */
#quote,
#calculator {
	scroll-margin-top: 108px;
}
.p1-contact .ct-form-sec {
	background: #111a27;
	padding: 120px 0;
}
.p1-contact .ct-form-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 56px;
	align-items: stretch;
}
.p1-contact .ct-form-col h2 {
	font-size: clamp(34px, 3.6vw, 46px);
	line-height: 1.05;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: #fff;
	margin: 0 0 20px;
}
.p1-contact .ct-form-col .ct-lede {
	margin: 0 0 32px;
	max-width: 52ch;
}
.p1-contact .ct-form {
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.p1-contact .ct-field {
	display: block;
}
.p1-contact .ct-field input,
.p1-contact .ct-field textarea {
	width: 100%;
	background: #0f172a;
	border: 1px solid var(--p1-line);
	border-radius: 10px;
	padding: 15px 16px;
	font-family: inherit;
	font-size: 15px;
	color: #fff;
	transition:
		border-color 0.18s ease,
		box-shadow 0.18s ease;
}
.p1-contact .ct-field input::placeholder,
.p1-contact .ct-field textarea::placeholder {
	color: rgba(255, 255, 255, 0.42);
}
.p1-contact .ct-field input:focus,
.p1-contact .ct-field textarea:focus {
	outline: none;
	border-color: var(--p1-teal);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--p1-teal) 22%, transparent);
}
.p1-contact .ct-field input[aria-invalid],
.p1-contact .ct-field textarea[aria-invalid] {
	border-color: #ff6b6b;
}
.p1-contact .ct-field textarea {
	resize: vertical;
	min-height: 130px;
}
.p1-contact .ct-hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	opacity: 0;
}
.p1-contact .ct-check {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 14px;
	line-height: 1.5;
	color: var(--p1-muted);
}
.p1-contact .ct-check input {
	width: 18px;
	height: 18px;
	margin-top: 2px;
	accent-color: var(--p1-teal);
	flex: none;
}
.p1-contact .ct-check a {
	color: var(--p1-teal);
	text-decoration: underline;
	text-underline-offset: 2px;
}
.p1-contact .ct-error {
	margin: 0;
	font-size: 14px;
	color: #ff6b6b;
}
.p1-contact .ct-error a {
	color: #fff;
	text-decoration: underline;
}
.p1-contact .ct-submit {
	width: 100%;
	margin-top: 6px;
	padding: 15px 30px;
	font-size: 15px;
}
.p1-contact .ct-success {
	background: rgba(255, 255, 255, 0.03);
	border: 1px solid color-mix(in srgb, var(--p1-teal) 40%, transparent);
	border-radius: 16px;
	padding: 40px 32px;
	text-align: center;
}
.p1-contact .ct-success-ic {
	width: 56px;
	height: 56px;
	display: inline-grid;
	place-items: center;
	border-radius: 50%;
	background: color-mix(in srgb, var(--p1-teal) 18%, transparent);
	color: var(--p1-teal);
	margin-bottom: 18px;
}
.p1-contact .ct-success-ic svg {
	width: 30px;
	height: 30px;
}
.p1-contact .ct-success h3 {
	font-size: 24px;
	color: #fff;
	margin: 0 0 10px;
}
.p1-contact .ct-success p {
	font-size: 16px;
	line-height: 1.6;
	color: var(--p1-muted);
	margin: 0;
}
.p1-contact .ct-form-media {
	border-radius: 0;
	overflow: hidden;
	box-shadow: var(--p1-glow-teal);
}
.p1-contact .ct-form-media img {
	width: 100%;
	height: 100%;
	min-height: 100%;
	object-fit: cover;
	display: block;
	filter: grayscale(1);
}

@media (max-width: 1080px) {
	.p1-contact .ct-wrap {
		padding-inline: 24px;
	}
	.p1-contact .ct-hero {
		padding: 110px 0 72px;
	}
	.p1-contact .ct-form-sec {
		padding: 72px 0;
	}
	.p1-contact .ct-hero-grid {
		grid-template-columns: 1fr;
		gap: 32px;
		margin-bottom: 56px;
	}
	.p1-contact .ct-hero-logo {
		justify-content: flex-start;
	}
	.p1-contact .ct-hero-logo img {
		max-width: 260px;
	}
	.p1-contact .ct-info-grid {
		grid-template-columns: 1fr;
	}
	.p1-contact .ct-form-grid {
		grid-template-columns: 1fr;
		gap: 40px;
	}
	.p1-contact .ct-form-media {
		order: -1;
		max-height: 420px;
	}
}

/* ══ Service page (faithful port of local ServicePage; scoped under .p1-service).
      Reuses the global .lb lightbox and video.js's .p1-vm modal. ══ */
.p1-service .sv-wrap {
	width: 100%;
	max-width: 1366px;
	margin: 0 auto;
	padding-inline: 60px;
}
.p1-service .sv-wrap--narrow {
	max-width: 1080px;
}
.p1-service .sv-center {
	text-align: center;
}
.p1-service .sv-center h2,
.p1-service .sv-center-text {
	text-align: center;
}
.p1-service section h2 {
	font-size: 49.5px;
	line-height: 1.1;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: #fff;
}
.p1-service .accent {
	color: var(--p1-teal);
}
.p1-service .sv-eyebrow {
	font-family: var(--font-heading);
	font-weight: 600;
	font-size: 14px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--p1-teal);
	margin: 0 0 18px;
}
.p1-service .sv-lede {
	font-size: 17px;
	line-height: 1.7;
	color: var(--p1-muted);
}
.p1-service .sv-lede--center {
	margin: 0 auto;
	max-width: 70ch;
}

/* Hero */
.p1-service .sv-hero {
	background: #111a27;
	padding: 150px 0 96px;
}
.p1-service .sv-hero-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 56px;
	align-items: center;
}
.p1-service .sv-crumb {
	display: flex;
	gap: 10px;
	font-size: 14px;
	color: var(--p1-muted);
	margin-bottom: 22px;
}
.p1-service .sv-crumb a:hover {
	color: var(--p1-teal);
}
.p1-service .sv-hero h1 {
	font-size: clamp(38px, 4.6vw, 64px);
	line-height: 1.04;
	font-weight: 700;
	letter-spacing: -0.03em;
	color: #fff;
	margin: 0 0 22px;
}
.p1-service .sv-hero-intro {
	font-size: 17px;
	line-height: 1.65;
	color: var(--p1-muted);
	max-width: 52ch;
	margin: 0 0 30px;
}
.p1-service .sv-hero-media {
	position: relative;
}
.p1-service .sv-hero-media img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 0;
	box-shadow: var(--p1-glow-teal);
}
.p1-service .sv-hero-media.has-video::after {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: 0;
	background: linear-gradient(180deg, rgba(6, 10, 16, 0.1), rgba(6, 10, 16, 0.35));
	pointer-events: none;
}
.p1-service .sv-hero-play {
	position: absolute;
	inset: 0;
	margin: auto;
	width: 84px;
	height: 84px;
	display: grid;
	place-items: center;
	border: 0;
	border-radius: 50%;
	background: color-mix(in srgb, var(--p1-teal) 92%, transparent);
	color: var(--p1-teal-ink);
	cursor: pointer;
	z-index: 2;
	box-shadow: 0 12px 44px -8px rgba(0, 0, 0, 0.6);
	transition:
		transform 0.2s ease,
		background 0.2s ease;
}
.p1-service .sv-hero-play::before {
	content: '';
	position: absolute;
	inset: -12px;
	border-radius: 50%;
	border: 2px solid color-mix(in srgb, var(--p1-teal) 55%, transparent);
	animation: sv-pulse 2s ease-out infinite;
}
@keyframes sv-pulse {
	0% {
		transform: scale(1);
		opacity: 0.7;
	}
	100% {
		transform: scale(1.45);
		opacity: 0;
	}
}
.p1-service .sv-hero-play:hover {
	transform: scale(1.06);
	background: var(--p1-teal);
}
.p1-service .sv-hero-play svg {
	width: 34px;
	height: 34px;
	margin-left: 4px;
}
@media (prefers-reduced-motion: reduce) {
	.p1-service .sv-hero-play::before {
		animation: none;
	}
}

/* What is + features */
.p1-service .sv-what {
	background: #131d2b;
	padding: 135px 0;
}
.p1-service .sv-what h2 {
	margin: 0 0 20px;
}
.p1-service .sv-features {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
	margin-top: 56px;
}
.p1-service .sv-feature {
	display: flex;
	gap: 18px;
	background: rgba(255, 255, 255, 0.03);
	border: 1px solid var(--p1-line);
	border-radius: 14px;
	padding: 26px 24px;
}
.p1-service .sv-feature-ic {
	flex: none;
	width: 46px;
	height: 46px;
	display: grid;
	place-items: center;
	border-radius: 12px;
	background: color-mix(in srgb, var(--p1-teal) 16%, transparent);
	color: var(--p1-teal);
}
.p1-service .sv-feature-ic svg {
	width: 24px;
	height: 24px;
}
.p1-service .sv-feature h3 {
	font-size: 18px;
	font-weight: 700;
	color: #fff;
	margin: 2px 0 8px;
}
.p1-service .sv-feature p {
	font-size: 14.5px;
	line-height: 1.55;
	color: var(--p1-muted);
	margin: 0;
}

/* Benefits */
.p1-service .sv-benefits {
	background: #131d2b;
	padding: 0 0 135px;
}
.p1-service .sv-benefits h2 {
	margin: 0 0 30px;
}
.p1-service .sv-benefit-list {
	list-style: none;
	margin: 0 0 30px;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 16px 42px;
}
.p1-service .sv-benefit-list li {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: 17px;
	color: var(--p1-text);
}
.p1-service .sv-benefit-list li svg {
	width: 22px;
	height: 22px;
	color: var(--p1-teal);
}
.p1-service .sv-benefit-cta {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 14px;
}

/* Pillar sub-sections (folded services rendered as anchored blocks) */
.p1-service .sv-sections {
	background: #111a27;
	padding: 40px 0 0;
}
.p1-service .sv-section {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 48px;
	align-items: center;
	max-width: 1152px;
	margin: 0 auto 64px;
	padding: 0 24px;
	scroll-margin-top: 110px;
}
.p1-service .sv-section--flip .sv-section-media {
	order: 2;
}
.p1-service .sv-section-media img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	display: block;
	border-radius: 0;
}
.p1-service .sv-section-body h2 {
	margin: 0 0 16px;
}
.p1-service .sv-section-body p {
	font-size: 16.5px;
	line-height: 1.75;
	color: var(--p1-muted);
	margin: 0 0 20px;
}
.p1-service .sv-section-benefits {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
}
.p1-service .sv-section-benefits li {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 15px;
	color: var(--p1-text);
}
.p1-service .sv-section-benefits svg {
	width: 18px;
	height: 18px;
	color: var(--p1-teal);
	flex: none;
}
@media (max-width: 860px) {
	.p1-service .sv-section {
		grid-template-columns: 1fr;
		gap: 24px;
	}
	.p1-service .sv-section--flip .sv-section-media {
		order: 0;
	}
}

/* Showcase */
.p1-service .sv-showcase {
	background: #111a27;
	padding: 128px 56px;
	display: flex;
	justify-content: center;
}
.p1-service .sv-showcase-card {
	width: 100%;
	max-width: 1152px;
	display: grid;
	grid-template-columns: 2fr 3fr;
	gap: 30px;
	padding: 48px 48px 60px;
	background:
		radial-gradient(circle at 70% 20%, rgba(35, 43, 57, 0.85) 0%, rgba(0, 0, 0, 0) 65%),
		radial-gradient(circle at 20% 80%, rgba(19, 24, 32, 0.8) 0%, rgba(0, 0, 0, 0) 70%),
		radial-gradient(circle at 90% 80%, rgba(27, 34, 44, 0.85) 0%, rgba(0, 0, 0, 0) 60%),
		linear-gradient(
			#1e2530 0%,
			#1e2530 75%,
			rgba(30, 37, 48, 0.95) 85%,
			rgba(17, 26, 38, 0.8) 90%,
			rgba(17, 26, 38, 0.6) 95%,
			rgba(17, 26, 38, 0) 100%
		);
}
.p1-service .sv-showcase-info {
	position: sticky;
	top: 120px;
	align-self: start;
	min-width: 0;
	display: flex;
	flex-direction: column;
}
.p1-service .sv-showcase-tag {
	font-family: var(--font-heading);
	font-weight: 400;
	font-size: 16px;
	letter-spacing: 4px;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.8);
	margin: 0 0 14px;
}
.p1-service .sv-showcase-h {
	font-size: 45.7px;
	line-height: 54.8px;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: #fff;
	margin: 0 0 29px;
}
.p1-service .sv-showcase-desc {
	font-size: 20px;
	line-height: 28px;
	color: rgba(255, 255, 255, 0.8);
	margin: 0 0 32px;
}
.p1-service .sv-marquee {
	overflow: hidden;
	min-width: 0;
	margin: 0 0 40px;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
}
.p1-service .sv-marquee-track {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	width: max-content;
	animation: sv-scroll-rtl 20s linear infinite;
}
.p1-service .sv-marquee-track li {
	flex: none;
	margin: 0 30px;
	display: flex;
	align-items: center;
}
.p1-service .sv-marquee-track img {
	height: 43px;
	width: auto;
	display: block;
}
@keyframes sv-scroll-rtl {
	to {
		transform: translateX(-50%);
	}
}
@media (prefers-reduced-motion: reduce) {
	.p1-service .sv-marquee-track {
		animation: none;
	}
}
.p1-service .sv-showcase-cta {
	display: flex;
	gap: 20px;
	flex-wrap: wrap;
}
.p1-service .sv-btn-outline {
	border: 2px solid #fff;
	color: #fff;
	background: transparent;
}
.p1-service .sv-btn-outline:hover {
	background: #fff;
	color: #111a27;
}
.p1-service .sv-showcase-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	min-width: 0;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 30px;
	align-content: start;
}
.p1-service .sv-showcase-grid li {
	margin: 0;
}
.p1-service .sv-showcase-grid li:nth-child(even) {
	transform: translateY(44px);
}
.p1-service .sv-gal-cell {
	width: 100%;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	border-radius: 0;
	padding: 0;
	border: 0;
	background: none;
	cursor: pointer;
	display: block;
}
.p1-service .sv-gal-cell img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.4s ease;
}
.p1-service .sv-gal-cell:hover img {
	transform: scale(1.05);
}

/* FAQ */
.p1-service .sv-faq {
	background: #131d2b;
	padding: 135px 0;
}
.p1-service .sv-faq h2 {
	margin: 0 0 48px;
}
.p1-service .sv-faq-list {
	display: flex;
	flex-direction: column;
	gap: 30px;
}
.p1-service .sv-faq-item {
	background: rgba(202, 214, 232, 0.1);
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 10px;
	padding: 0 30px;
}
.p1-service .sv-faq-item summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	padding: 28px 0;
	cursor: pointer;
	list-style: none;
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 24px;
	line-height: 1.25;
	color: #fff;
}
.p1-service .sv-faq-item summary::-webkit-details-marker {
	display: none;
}
.p1-service .sv-faq-plus {
	width: 34px;
	height: 34px;
	flex: none;
	color: var(--p1-teal);
	transition: transform 0.3s ease;
}
.p1-service .sv-faq-item[open] .sv-faq-plus {
	transform: rotate(45deg);
}
.p1-service .sv-faq-item p {
	margin: 0;
	padding: 0 0 30px;
	font-size: 16.5px;
	line-height: 1.7;
	color: var(--p1-muted);
	max-width: 82ch;
}
.p1-service .sv-faq-link {
	color: var(--p1-teal);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
	transition: color 0.15s ease;
}
.p1-service .sv-faq-link:hover {
	color: #fff;
}

/* More ways — slider */
.p1-service .sv-more {
	background: #111a27;
	padding: 135px 0;
}
.p1-service .sv-more-head {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 44px;
	margin: 0 0 48px;
}
.p1-service .sv-more-headtext {
	max-width: 640px;
}
.p1-service .sv-more-head h2 {
	text-align: left;
	margin: 0 0 16px;
}
.p1-service .sv-more-headtext .sv-lede {
	margin: 0;
}
.p1-service .sv-more-arrows {
	display: flex;
	gap: 14px;
	flex: none;
}
.p1-service .sv-more-arrow {
	width: 46px;
	height: 48px;
	display: grid;
	place-items: center;
	border: 1px solid var(--p1-line);
	border-radius: 6px;
	background: transparent;
	color: #fff;
	cursor: pointer;
	transition:
		background 0.18s ease,
		border-color 0.18s ease,
		color 0.18s ease;
}
.p1-service .sv-more-arrow:hover {
	background: var(--p1-teal);
	border-color: var(--p1-teal);
	color: var(--p1-teal-ink);
}
.p1-service .sv-more-arrow svg {
	width: 18px;
	height: 18px;
}
.p1-service .sv-more-viewport {
	overflow: hidden;
}
.p1-service .sv-more-track {
	display: flex;
	gap: 30px;
	transition: transform 0.45s ease;
	will-change: transform;
}
.p1-service .sv-more-card {
	flex: 0 0 calc((100% - 3 * 30px) / 4);
	position: relative;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	isolation: isolate;
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	box-shadow: 0 0 25px 0 rgba(0, 0, 0, 0.5);
	transition: opacity 0.3s ease;
}
.p1-service .sv-more-img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: -2;
	transition: transform 0.3s ease;
}
.p1-service .sv-more-overlay {
	position: absolute;
	inset: 0;
	z-index: -1;
	background: rgba(17, 26, 39, 0.4);
	transition: background 0.3s ease;
}
.p1-service .sv-more-card:hover {
	opacity: 0.95;
}
.p1-service .sv-more-card:hover .sv-more-img {
	transform: scale(1.05);
}
.p1-service .sv-more-label {
	position: relative;
	z-index: 1;
	padding: 0 16px;
	text-align: center;
	font-family: var(--font-heading);
	font-weight: 600;
	font-size: 16px;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: #fff;
}
.p1-service .sv-more-card::before,
.p1-service .sv-more-card::after {
	content: '';
	position: absolute;
	width: 0;
	height: 0;
	border: 4px solid transparent;
	box-sizing: border-box;
	z-index: 2;
	pointer-events: none;
}
.p1-service .sv-more-card::before {
	top: 0;
	left: 0;
}
.p1-service .sv-more-card::after {
	bottom: 0;
	right: 0;
}
.p1-service .sv-more-card:hover::before {
	width: 100%;
	height: 100%;
	border-top-color: var(--p1-teal);
	border-right-color: var(--p1-teal);
	transition:
		width 0.2s ease-out,
		height 0.2s ease-out 0.2s;
}
.p1-service .sv-more-card:hover::after {
	width: 100%;
	height: 100%;
	border-bottom-color: var(--p1-teal);
	border-left-color: var(--p1-teal);
	transition:
		width 0.2s ease-out 0.4s,
		height 0.2s ease-out 0.6s;
}

/* Final CTA */
.p1-service .sv-cta {
	position: relative;
	background: #111a27;
	padding: 135px 60px;
	display: flex;
	justify-content: center;
	overflow: hidden;
}
.p1-service .sv-cta-bg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: 0;
}
.p1-service .sv-cta::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(
		180deg,
		rgba(17, 26, 39, 0.45) 0%,
		rgba(17, 26, 39, 0.5) 55%,
		rgba(17, 26, 39, 0.88) 82%,
		#111a27 100%
	);
}
.p1-service .sv-cta-inner {
	position: relative;
	z-index: 2;
	max-width: 820px;
	text-align: center;
}
.p1-service .sv-cta-inner h2 {
	font-size: 40px;
	margin: 0 0 22px;
}
.p1-service .sv-cta-inner p {
	margin: 0 auto 26px;
	max-width: 62ch;
	font-size: 17px;
	line-height: 1.65;
	color: rgba(255, 255, 255, 0.85);
}
.p1-service .sv-cta-btn {
	background: #fff;
	color: #000;
	padding: 15px 30px;
}
.p1-service .sv-cta-btn:hover {
	background: #eaf2f5;
}

@media (max-width: 1080px) {
	.p1-service .sv-wrap {
		padding-inline: 24px;
	}
	.p1-service section h2 {
		font-size: clamp(30px, 6.5vw, 42px);
	}
	.p1-service .sv-hero {
		padding: 120px 0 64px;
	}
	.p1-service .sv-hero-grid {
		grid-template-columns: 1fr;
		gap: 36px;
	}
	.p1-service .sv-what,
	.p1-service .sv-faq,
	.p1-service .sv-more {
		padding: 72px 0;
	}
	.p1-service .sv-benefits {
		padding-bottom: 72px;
	}
	.p1-service .sv-features {
		grid-template-columns: 1fr;
	}
	.p1-service .sv-more-card {
		flex-basis: calc((100% - 30px) / 2);
	}
	.p1-service .sv-more-head {
		flex-wrap: wrap;
		align-items: flex-start;
	}
	.p1-service .sv-showcase {
		padding: 72px 24px;
	}
	.p1-service .sv-showcase-card {
		grid-template-columns: 1fr;
		gap: 40px;
		padding-bottom: 0;
	}
	.p1-service .sv-showcase-info {
		position: static;
		top: auto;
	}
	.p1-service .sv-showcase-h {
		font-size: clamp(30px, 6.5vw, 42px);
		line-height: 1.15;
	}
}
@media (max-width: 560px) {
	.p1-service .sv-more-card {
		flex-basis: 80%;
	}
	.p1-service .sv-faq-item summary {
		font-size: 20px;
	}
	.p1-service .sv-showcase-grid li:nth-child(even) {
		transform: none;
	}
}

/* ══ Gallery page (faithful port of local /gallery; scoped under .p1-gallery).
      Reuses the global .lb lightbox. Filter + lightbox via interact.js. ══ */
.p1-gallery .g {
	background: var(--p1-bg);
	padding: 150px 0 135px;
	display: flex;
	justify-content: center;
}
.p1-gallery .g-inner {
	width: 100%;
	max-width: 1366px;
	padding-inline: 60px;
}
.p1-gallery .g-head {
	text-align: center;
	max-width: 760px;
	margin: 0 auto 40px;
}
.p1-gallery .g-eyebrow {
	font-family: var(--font-heading);
	font-weight: 600;
	font-size: 14px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--p1-teal);
	margin: 0 0 16px;
}
.p1-gallery .g-head h1 {
	font-size: clamp(40px, 6vw, 68px);
	line-height: 1.03;
	font-weight: 700;
	letter-spacing: -0.03em;
	color: #fff;
	margin: 0 0 18px;
}
.p1-gallery .g-lede {
	font-size: 17px;
	line-height: 1.65;
	color: var(--p1-muted);
	margin: 0;
}
.p1-gallery .g-filters {
	position: sticky;
	top: 92px; /* sits just below the sticky header */
	z-index: 20;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
	margin-bottom: 30px;
	padding: 16px 0;
	background: var(--p1-bg);
	border-bottom: 1px solid var(--p1-line);
}
.p1-gallery .g-filter {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 18px;
	border-radius: 999px;
	border: 1px solid var(--p1-line);
	background: rgba(255, 255, 255, 0.03);
	color: var(--p1-text);
	font-family: var(--font-heading);
	font-weight: 600;
	font-size: 14px;
	cursor: pointer;
	transition:
		background 0.18s ease,
		border-color 0.18s ease,
		color 0.18s ease;
}
.p1-gallery .g-filter:hover {
	border-color: color-mix(in srgb, var(--p1-teal) 50%, transparent);
}
.p1-gallery .g-filter.active {
	background: var(--p1-teal);
	border-color: var(--p1-teal);
	color: var(--p1-teal-ink);
}
.p1-gallery .g-count {
	font-size: 12px;
	opacity: 0.65;
	font-variant-numeric: tabular-nums;
}
.p1-gallery .g-grid {
	column-count: 4;
	column-gap: 16px;
	animation: g-fade 0.3s ease;
}
@keyframes g-fade {
	from {
		opacity: 0;
		transform: translateY(6px);
	}
}
.p1-gallery .g-cell {
	display: block;
	width: 100%;
	margin: 0 0 16px;
	padding: 0;
	border: 0;
	background: none;
	border-radius: 0;
	overflow: hidden;
	cursor: pointer;
	break-inside: avoid;
}
.p1-gallery .g-cell img {
	width: 100%;
	height: auto;
	display: block;
	transition: transform 0.4s ease;
}
.p1-gallery .g-cell:hover img {
	transform: scale(1.04);
}
@media (max-width: 1080px) {
	.p1-gallery .g {
		padding: 120px 0 72px;
	}
	.p1-gallery .g-inner {
		padding-inline: 24px;
	}
	.p1-gallery .g-grid {
		column-count: 3;
	}
}
@media (max-width: 720px) {
	.p1-gallery .g-grid {
		column-count: 2;
		column-gap: 12px;
	}
	.p1-gallery .g-cell {
		margin-bottom: 12px;
	}
}

/* ══ Policy pages (faithful port of local PolicyLayout; scoped under .p1-legal) ══ */
.p1-legal .pol-wrap {
	width: 100%;
	max-width: 860px;
	margin: 0 auto;
	padding-inline: 40px;
}
.p1-legal .pol-hero {
	background: #131d2b;
	padding: 140px 0 56px;
}
.p1-legal .pol-back {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--font-heading);
	font-weight: 600;
	font-size: 13px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--p1-teal);
	margin-bottom: 24px;
}
.p1-legal .pol-back svg {
	width: 16px;
	height: 16px;
}
.p1-legal .pol-back:hover {
	color: #fff;
}
.p1-legal .pol-hero h1 {
	font-size: clamp(36px, 4.6vw, 56px);
	line-height: 1.05;
	font-weight: 700;
	letter-spacing: -0.03em;
	color: #fff;
	margin: 0 0 14px;
}
.p1-legal .pol-updated {
	margin: 0;
	font-size: 14px;
	color: var(--p1-muted);
}
.p1-legal .pol-body {
	background: #111a27;
	padding: 56px 0 120px;
}
.p1-legal .pol-content h2 {
	font-size: 24px;
	font-weight: 700;
	color: #fff;
	letter-spacing: -0.01em;
	margin: 44px 0 14px;
}
.p1-legal .pol-content h2:first-child {
	margin-top: 0;
}
.p1-legal .pol-content h3 {
	font-size: 18px;
	font-weight: 700;
	color: var(--p1-teal);
	margin: 26px 0 10px;
}
.p1-legal .pol-content p {
	font-size: 16px;
	line-height: 1.75;
	color: var(--p1-muted);
	margin: 0 0 16px;
}
.p1-legal .pol-content ul {
	margin: 0 0 20px;
	padding-left: 4px;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.p1-legal .pol-content li {
	position: relative;
	padding-left: 26px;
	font-size: 16px;
	line-height: 1.65;
	color: var(--p1-muted);
}
.p1-legal .pol-content li::before {
	content: '';
	position: absolute;
	left: 4px;
	top: 10px;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--p1-teal);
}
.p1-legal .pol-content li strong,
.p1-legal .pol-content p strong {
	color: var(--p1-text);
	font-weight: 700;
}
.p1-legal .pol-content a {
	color: var(--p1-teal);
	text-decoration: underline;
	text-underline-offset: 2px;
}
.p1-legal .pol-content a:hover {
	color: #fff;
}
.p1-legal .pol-content .pol-contact {
	margin-top: 24px;
	background: rgba(255, 255, 255, 0.03);
	border: 1px solid var(--p1-line);
	border-radius: 12px;
	padding: 24px 26px;
}
.p1-legal .pol-content .pol-contact p {
	margin: 0 0 8px;
}
.p1-legal .pol-content .pol-contact p:last-child {
	margin-bottom: 0;
}
@media (max-width: 720px) {
	.p1-legal .pol-wrap {
		padding-inline: 24px;
	}
	.p1-legal .pol-hero {
		padding: 116px 0 44px;
	}
}

/* ══════════════════════════════════════════════════════════════════════
   CHROME — header, mega-menu, mobile drawer, footer. Faithful port of the
   local Header.svelte + Footer.svelte. Mega opens on hover via CSS :has();
   the mobile drawer is checkbox-driven; the services accordion is <details>.
   Footer bg is #111a27 so the closing CTA's gradient fades into it.
   ══════════════════════════════════════════════════════════════════════ */

/* ── Header ── */
.hdr {
	position: sticky;
	top: 0;
	z-index: 50;
	background: color-mix(in srgb, var(--p1-bg) 82%, transparent);
	backdrop-filter: blur(10px);
	border-bottom: 1px solid transparent;
	transition:
		background 0.25s ease,
		border-color 0.25s ease;
}
.hdr.scrolled {
	background: color-mix(in srgb, var(--p1-bg) 94%, transparent);
	border-bottom-color: var(--p1-line);
}
.hdr-inner {
	width: 100%;
	max-width: 1200px;
	margin-inline: auto;
	padding-inline: 24px;
	display: flex;
	align-items: center;
	gap: 28px;
	height: 92px;
}
.brand img {
	height: 46px;
	width: auto;
	display: block;
}
.nav {
	display: flex;
	align-items: center;
	gap: 34px;
	margin-left: 18px;
}
.nav-link {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-family: var(--font-heading);
	font-weight: 500;
	font-size: 15px;
	letter-spacing: 0.13em;
	text-transform: uppercase;
	color: var(--p1-text);
	transition: color 0.18s ease;
}
.nav-link:hover,
.nav-link.is-active {
	color: var(--p1-teal);
}
.chev {
	width: 11px;
	height: 7px;
	transition: transform 0.2s ease;
}
.nav-mega:hover .chev {
	transform: rotate(180deg);
}
.hdr-right {
	margin-left: auto;
	display: flex;
	align-items: center;
	gap: 22px;
}
.phone-link {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 9px 24px;
	border-radius: 6.6667px;
	font-family: var(--font-heading);
	font-weight: 400;
	font-size: 20px;
	color: #edf1f7;
	background: transparent;
	transition:
		background 0.3s ease-in-out,
		color 0.3s ease-in-out;
}
.phone-link:hover {
	color: #cad6e8;
	background: rgba(202, 214, 232, 0.1);
}
.phone-ic {
	width: 22px;
	height: 22px;
	flex: none;
	display: block;
}
.contact-btn {
	padding: 13px 24px;
	font-size: 15px;
}
.burger {
	display: none;
	flex-direction: column;
	gap: 6px;
	align-items: flex-end;
	background: none;
	border: 0;
	cursor: pointer;
	padding: 6px;
}
.burger span {
	width: 32px;
	height: 3.5px;
	background: #fff;
	border-radius: 3px;
}

/* ── Mega-menu (full-width panel; opens on hover via :has) ── */
.mega {
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	/* Solid subtle gradient (matches the footer card); no outline. */
	background: linear-gradient(145deg, #1e2836 0%, #182029 52%, #131a24 100%);
	border: 0;
	box-shadow: 0 40px 80px -30px rgba(0, 0, 0, 0.6);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-8px);
	transition:
		opacity 0.2s ease,
		transform 0.2s ease,
		visibility 0.2s;
}
.hdr:has(.nav-mega:hover) .mega,
.hdr:has(.nav-mega:focus-within) .mega,
.mega:hover {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}
.mega-inner {
	width: 100%;
	max-width: 1200px;
	margin-inline: auto;
	padding-inline: 24px;
	display: flex;
	flex-direction: column;
	gap: 22px;
	padding-block: 28px;
}
.mega-row {
	display: grid;
	grid-template-columns: 190px 1fr;
	gap: 18px;
	align-items: start;
}
.mega-pill {
	display: block;
	font-family: var(--font-heading);
	font-weight: 600;
	font-size: 16px;
	text-align: left;
	color: var(--p1-teal-ink);
	background: var(--p1-teal);
	border: 1px solid var(--p1-teal);
	border-radius: 10px;
	padding: 14px 16px;
}
.mega-items {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 10px;
}
.mega-item {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px;
	border-radius: 10px;
	border: 1px solid transparent;
	font-family: var(--font-heading);
	font-weight: 600;
	font-size: 12px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	line-height: 1.25;
	color: var(--p1-text);
	background: rgba(255, 255, 255, 0.02);
	transition:
		background 0.16s ease,
		border-color 0.16s ease,
		transform 0.16s ease;
}
.mega-item:hover {
	background: rgba(255, 255, 255, 0.06);
	border-color: color-mix(in srgb, var(--p1-teal) 45%, transparent);
	transform: translateY(-2px);
}
.mega-thumb {
	width: 46px;
	height: 46px;
	border-radius: 50%;
	object-fit: cover;
	flex: none;
}

/* ── Mobile drawer (checkbox-driven; slides in from the left) ── */
.m-overlay {
	position: fixed;
	inset: 0;
	z-index: 90;
	background: rgba(6, 10, 16, 0.6);
	backdrop-filter: blur(2px);
	opacity: 0;
	visibility: hidden;
	transition:
		opacity 0.3s ease,
		visibility 0.3s;
}
#navToggle:checked ~ .m-overlay {
	opacity: 1;
	visibility: visible;
}
.m-drawer {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 100;
	width: min(400px, 90vw);
	height: 100vh;
	height: 100dvh;
	display: flex;
	flex-direction: column;
	padding: 22px 24px 26px;
	background: #131d2b;
	box-shadow: 24px 0 70px -24px rgba(0, 0, 0, 0.7);
	overflow-y: auto;
	transform: translateX(-100%);
	transition: transform 0.34s cubic-bezier(0.4, 0, 0.2, 1);
	visibility: hidden;
}
#navToggle:checked ~ .m-drawer {
	transform: translateX(0);
	visibility: visible;
}
.m-top {
	position: relative;
	display: flex;
	justify-content: center;
	padding: 6px 0 26px;
}
.m-logo {
	width: 200px;
	max-width: 60%;
	height: auto;
}
.m-close {
	position: absolute;
	top: -2px;
	right: -4px;
	width: 42px;
	height: 42px;
	display: grid;
	place-items: center;
	background: none;
	border: 0;
	color: #fff;
	cursor: pointer;
}
.m-close svg {
	width: 26px;
	height: 26px;
}
.m-nav {
	display: flex;
	flex-direction: column;
}
.m-details {
	display: flex;
	flex-direction: column;
}
.m-link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
	padding: 18px 2px;
	background: none;
	border: 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.07);
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 21px;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: #fff;
	text-align: left;
	cursor: pointer;
	list-style: none;
}
.m-link::-webkit-details-marker {
	display: none;
}
.m-chev {
	width: 18px;
	height: 12px;
	flex: none;
	color: var(--p1-teal);
	transition: transform 0.25s ease;
}
.m-details[open] .m-chev {
	transform: rotate(180deg);
}
.m-services {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 16px 0 20px;
}
.m-pill {
	background: var(--p1-teal);
	color: var(--p1-teal-ink);
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 16px;
	padding: 15px 18px;
	border-radius: 10px;
}
.m-pill:not(:first-child) {
	margin-top: 8px;
}
.m-svc {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 12px 14px;
	border-radius: 10px;
	background: rgba(255, 255, 255, 0.03);
	border: 1px solid var(--p1-line);
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 13px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	line-height: 1.25;
	color: #fff;
}
.m-svc-thumb {
	width: 42px;
	height: 42px;
	border-radius: 50%;
	object-fit: cover;
	flex: none;
}
.m-contact {
	margin-top: auto;
	width: 100%;
	padding: 16px;
	font-size: 16px;
}

@media (max-width: 1080px) {
	.nav,
	.phone-link,
	.contact-btn,
	.mega {
		display: none;
	}
	.burger {
		display: flex;
	}
}
@media (min-width: 1081px) {
	.m-overlay,
	.m-drawer {
		display: none;
	}
}

/* ── Footer (bg #111a27 → the closing CTA fades seamlessly into it) ── */
.ft {
	background: #111a27;
	color: var(--p1-text);
	padding: 96px 60px 40px;
}
.ft-main {
	max-width: 1366px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1fr 260px 340px;
	gap: 60px;
	align-items: start;
}
.ft-logo {
	height: 58px;
	width: auto;
}
.ft-tagline {
	margin: 24px 0 0;
	max-width: 42ch;
	font-size: 15px;
	line-height: 1.7;
	color: var(--p1-muted);
}
.ft-socials {
	display: flex;
	gap: 14px;
	margin-top: 26px;
}
.ft-socials a {
	width: 40px;
	height: 40px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.06);
	color: var(--p1-text);
	transition:
		background 0.18s ease,
		color 0.18s ease;
}
.ft-socials a:hover {
	background: var(--p1-teal);
	color: var(--p1-teal-ink);
}
.ft-socials svg {
	width: 20px;
	height: 20px;
}
.ft-services h3,
.ft-contact h3 {
	font-family: var(--font-heading);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--p1-muted);
	margin: 0 0 22px;
}
.ft-services ul,
.ft-contact ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 14px;
}
.ft-services a {
	font-size: 15px;
	color: var(--p1-teal);
	transition: color 0.18s ease;
}
.ft-services a:hover {
	color: #fff;
}
.ft-contact li {
	font-size: 15px;
	line-height: 1.5;
	color: var(--p1-muted);
}
.ft-contact a {
	color: var(--p1-text);
	transition: color 0.18s ease;
}
.ft-contact a:hover {
	color: var(--p1-teal);
}
.ft-addr {
	color: var(--p1-muted);
}
.ft-directions {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 20px;
	font-family: var(--font-heading);
	font-weight: 600;
	font-size: 14px;
	color: var(--p1-teal) !important;
}
.ft-directions svg {
	width: 18px;
	height: 18px;
	transition: transform 0.18s ease;
}
.ft-directions:hover svg {
	transform: translateX(3px);
}
.ft-serving {
	max-width: 1366px;
	margin: 72px auto 0;
	padding-top: 40px;
	border-top: 1px solid var(--p1-line);
	text-align: center;
}
.ft-serving-h {
	margin: 0 0 10px;
	font-family: var(--font-heading);
	font-weight: 600;
	font-size: 16px;
	color: #fff;
}
.ft-serving-sub {
	margin: 0 auto;
	max-width: 90ch;
	font-size: 14.5px;
	line-height: 1.6;
	color: var(--p1-muted);
}
.ft-bottom {
	max-width: 1366px;
	margin: 40px auto 0;
	padding-top: 24px;
	border-top: 1px solid var(--p1-line);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	flex-wrap: wrap;
	font-size: 13.5px;
	color: var(--p1-muted);
}
.ft-legal {
	display: flex;
	gap: 26px;
}
.ft-legal a {
	color: var(--p1-muted);
	transition: color 0.18s ease;
}
.ft-legal a:hover {
	color: var(--p1-teal);
}
.ft-credit {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 7px 12px;
	background: transparent;
	color: rgba(202, 214, 232, 0.7);
	font-size: 13px;
}
.ft-credit b {
	font-weight: 700;
	color: rgba(202, 214, 232, 1);
}
.ft-credit-ic {
	width: 17px;
	height: 19px;
	flex: none;
	color: rgba(255, 255, 255, 0.8);
}
@media (max-width: 1080px) {
	.ft {
		padding: 64px 24px 32px;
	}
	.ft-main {
		grid-template-columns: 1fr;
		gap: 44px;
	}
	.ft-bottom {
		justify-content: center;
		text-align: center;
	}
}

/* ── Service page: customer reviews grid (non-commercial services) ── */
.p1-service .sv-reviews {
	background: #131d2b;
	padding: 135px 0;
}
.p1-service .sv-reviews .sv-center {
	margin: 0 0 56px;
}
.p1-service .sv-reviews-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}
.p1-service .sv-review {
	margin: 0;
	background: rgba(255, 255, 255, 0.03);
	border: 1px solid var(--p1-line);
	border-radius: 14px;
	padding: 26px 24px;
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.p1-service .sv-review-stars {
	display: flex;
	gap: 3px;
	color: #f5b301;
}
.p1-service .sv-review-stars svg {
	width: 18px;
	height: 18px;
}
.p1-service .sv-review blockquote {
	margin: 0;
	font-size: 15.5px;
	line-height: 1.65;
	color: var(--p1-text);
}
.p1-service .sv-review figcaption {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin-top: auto;
}
.p1-service .sv-review-name {
	font-family: var(--font-heading);
	font-weight: 600;
	font-size: 15px;
	color: #fff;
}
.p1-service .sv-review-src {
	font-size: 13px;
	color: var(--p1-teal);
}
@media (max-width: 1080px) {
	.p1-service .sv-reviews {
		padding: 72px 0;
	}
	.p1-service .sv-reviews-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}
@media (max-width: 620px) {
	.p1-service .sv-reviews-grid {
		grid-template-columns: 1fr;
	}
}

/* ── Footer card panel + map + back-to-top (match live site) ── */
.ft-card {
	max-width: 1366px;
	margin: 0 auto;
	background: rgba(255, 255, 255, 0.025);
	border: 1px solid var(--p1-line);
	border-radius: 20px;
	padding: 48px;
}
.ft-card .ft-main {
	max-width: none;
	grid-template-columns: 1fr 240px 400px;
	gap: 56px;
}
.ft-map {
	display: flex;
	flex-direction: column;
	gap: 14px;
}
.ft-map iframe {
	width: 100%;
	height: 260px;
	border: 0;
	border-radius: 12px;
	display: block;
	filter: grayscale(0.1);
}
.ft-map .ft-directions {
	margin-top: 0;
}
@media (max-width: 1080px) {
	.ft-card {
		padding: 32px 22px;
	}
	.ft-card .ft-main {
		grid-template-columns: 1fr;
		gap: 40px;
	}
	.ft-map iframe {
		height: 220px;
	}
}

/* Back-to-top — teal progress ring + white chevron (local BackToTop.svelte) */
.btt {
	position: fixed;
	right: 26px;
	bottom: 26px;
	z-index: 120;
	width: 54px;
	height: 54px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	border: 0;
	background: color-mix(in srgb, var(--p1-bg) 70%, transparent);
	backdrop-filter: blur(6px);
	cursor: pointer;
	opacity: 0;
	transform: translateY(12px);
	pointer-events: none;
	transition:
		opacity 0.25s ease,
		transform 0.25s ease,
		box-shadow 0.2s ease;
}
.btt.show {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}
.btt:hover {
	box-shadow: 0 0 24px -6px color-mix(in srgb, var(--p1-teal) 70%, transparent);
}
.btt-ring {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	transform: rotate(-90deg);
	overflow: visible;
}
.btt-track {
	fill: none;
	stroke: color-mix(in srgb, var(--p1-teal) 22%, transparent);
	stroke-width: 2;
}
.btt-prog {
	fill: none;
	stroke: var(--p1-teal);
	stroke-width: 3;
	stroke-linecap: round;
	transition: stroke-dashoffset 0.1s linear;
}
.btt-chev {
	position: relative;
	width: 22px;
	height: 22px;
}

/* Gallery filters: horizontal scroll strip on mobile (instead of wrapping to many rows) */
@media (max-width: 768px) {
	.p1-gallery .g-filters {
		flex-wrap: nowrap;
		justify-content: flex-start;
		overflow-x: auto;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
		margin-inline: -24px; /* bleed to the screen edges within the padded inner */
		padding-inline: 24px;
	}
	.p1-gallery .g-filters::-webkit-scrollbar {
		display: none;
	}
	.p1-gallery .g-filter {
		flex: 0 0 auto; /* chips keep their size and scroll rather than wrap */
	}
}

/* ── Footer refinements (match live: gradient card, no outline, Pages column) ── */
.ft-card {
	background: linear-gradient(145deg, #1e2836 0%, #182029 52%, #131a24 100%);
	border: 0;
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.05),
		0 34px 70px -46px rgba(0, 0, 0, 0.75);
}
.ft-card .ft-main {
	grid-template-columns: minmax(0, 1fr) 180px 150px 360px;
	gap: 48px;
}
.ft-pages h3 {
	font-family: var(--font-heading);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--p1-muted);
	margin: 0 0 22px;
}
.ft-pages ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 14px;
}
.ft-pages a {
	font-size: 15px;
	color: var(--p1-teal);
	transition: color 0.18s ease;
}
.ft-pages a:hover {
	color: #fff;
}
@media (max-width: 1080px) {
	.ft-card .ft-main {
		grid-template-columns: 1fr;
		gap: 40px;
	}
}

/* ══ Services hub (/services/) — scoped under .p1-serviceshub ══ */
.p1-serviceshub .sh-wrap {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding-inline: 40px;
}
.p1-serviceshub .accent {
	color: var(--p1-teal);
}
.p1-serviceshub .sh-hero {
	background: #131d2b;
	padding: 140px 0 72px;
	text-align: center;
}
.p1-serviceshub .sh-eyebrow {
	font-family: var(--font-heading);
	font-weight: 600;
	font-size: 14px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--p1-teal);
	margin: 0 0 16px;
}
.p1-serviceshub .sh-hero h1 {
	font-size: clamp(38px, 4.8vw, 60px);
	line-height: 1.05;
	font-weight: 700;
	letter-spacing: -0.03em;
	color: #fff;
	margin: 0 0 20px;
}
.p1-serviceshub .sh-lede {
	max-width: 68ch;
	margin: 0 auto;
	font-size: 17px;
	line-height: 1.7;
	color: var(--p1-muted);
}
.p1-serviceshub .sh-list {
	background: #111a27;
	padding: 80px 0 120px;
}
.p1-serviceshub .sh-grid {
	display: flex;
	flex-direction: column;
	gap: 24px;
}
.p1-serviceshub .sh-card {
	display: grid;
	grid-template-columns: 1fr 420px;
	align-items: stretch;
	gap: 0;
	background: linear-gradient(145deg, #1e2836 0%, #182029 55%, #131a24 100%);
	border-radius: 0;
	overflow: hidden;
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.04),
		0 30px 60px -44px rgba(0, 0, 0, 0.7);
	transition:
		transform 0.2s ease,
		box-shadow 0.2s ease;
}
.p1-serviceshub .sh-card:hover {
	transform: translateY(-3px);
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.06),
		0 40px 70px -40px rgba(0, 0, 0, 0.8);
}
.p1-serviceshub .sh-card-body {
	padding: 40px 44px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
}
.p1-serviceshub .sh-tag {
	font-family: var(--font-heading);
	font-weight: 600;
	font-size: 11.5px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--p1-teal-ink);
	background: var(--p1-teal);
	border-radius: 999px;
	padding: 5px 12px;
	margin-bottom: 18px;
}
.p1-serviceshub .sh-card-body h2 {
	font-size: 28px;
	line-height: 1.15;
	font-weight: 700;
	color: #fff;
	margin: 0 0 14px;
	letter-spacing: -0.01em;
}
.p1-serviceshub .sh-card-body p {
	font-size: 15.5px;
	line-height: 1.65;
	color: var(--p1-muted);
	margin: 0 0 22px;
	max-width: 60ch;
}
.p1-serviceshub .sh-more {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	font-family: var(--font-heading);
	font-weight: 600;
	font-size: 14px;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: var(--p1-teal);
}
.p1-serviceshub .sh-more svg {
	width: 18px;
	height: 18px;
	transition: transform 0.18s ease;
}
.p1-serviceshub .sh-card:hover .sh-more svg {
	transform: translateX(4px);
}
.p1-serviceshub .sh-card-media {
	overflow: hidden;
}
.p1-serviceshub .sh-card-media img {
	width: 100%;
	height: 100%;
	min-height: 240px;
	object-fit: cover;
	display: block;
	transition: transform 0.5s ease;
}
.p1-serviceshub .sh-card:hover .sh-card-media img {
	transform: scale(1.05);
}
.p1-serviceshub .sh-cta {
	background: #131d2b;
	padding: 96px 0;
	text-align: center;
}
.p1-serviceshub .sh-cta-inner h2 {
	font-size: clamp(30px, 3.4vw, 42px);
	color: #fff;
	margin: 0 0 14px;
}
.p1-serviceshub .sh-cta-inner p {
	font-size: 17px;
	color: var(--p1-muted);
	margin: 0 auto 30px;
	max-width: 52ch;
}
.p1-serviceshub .sh-cta-btns {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 16px;
}
@media (max-width: 900px) {
	.p1-serviceshub .sh-wrap {
		padding-inline: 24px;
	}
	.p1-serviceshub .sh-hero {
		padding: 116px 0 56px;
	}
	.p1-serviceshub .sh-list {
		padding: 56px 0 72px;
	}
	.p1-serviceshub .sh-card {
		grid-template-columns: 1fr;
	}
	.p1-serviceshub .sh-card-media {
		order: -1;
	}
	.p1-serviceshub .sh-card-media img {
		min-height: 200px;
		aspect-ratio: 16 / 9;
	}
	.p1-serviceshub .sh-card-body {
		padding: 28px 24px;
	}
}

/* ═══ Ad landing pages (P1Landing + P1Chrome bare mode) ═══════════════════════════════════ */
.hdr--bare {
	position: sticky;
	top: 0;
	z-index: 50;
	background: #111a27;
	border-bottom: 1px solid var(--p1-line);
}
.hdr--bare .hdr-inner {
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 12px 24px;
}
.hdr--bare .brand img { height: 42px; width: auto; display: block; }
.hdr--bare .contact-btn { display: inline-flex; align-items: center; gap: 8px; }
.hdr--bare .phone-ic { width: 18px; height: 18px; }
.ft--bare { background: #0d141e; padding: 24px; }
.ft--bare .ft-bottom {
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	font-size: 13px;
	color: var(--p1-muted);
}
.ft--bare .ft-legal { display: flex; gap: 16px; }
.ft--bare a { color: var(--p1-muted); text-decoration: none; }
.ft--bare a:hover { color: var(--p1-teal); }
.ft--bare .ft-credit b { color: var(--p1-teal); }

.p1-landing { background: var(--p1-bg); color: var(--p1-text); }
.p1-landing .lp-wrap { max-width: 1120px; margin: 0 auto; padding: 0 24px; }

/* Hero */
.lp-hero { position: relative; overflow: hidden; padding: 56px 0 64px; }
.lp-hero-bg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 40%;
	opacity: 0.28;
	z-index: 0;
}
.lp-hero::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(13, 20, 30, 0.65), rgba(17, 26, 39, 0.92));
	z-index: 1;
}
.lp-hero-grid {
	position: relative;
	z-index: 2;
	display: grid;
	grid-template-columns: 1.15fr 0.85fr;
	gap: 48px;
	align-items: center;
}
.lp-eyebrow {
	font-family: var(--font-heading);
	font-size: 13px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--p1-teal);
	margin: 0 0 14px;
}
.lp-hero-copy h1 {
	font-family: var(--font-heading);
	font-size: clamp(34px, 5vw, 52px);
	line-height: 1.05;
	font-weight: 700;
	margin: 0 0 18px;
	color: #fff;
}
.lp-sub { font-size: 18px; line-height: 1.55; color: rgba(255, 255, 255, 0.85); margin: 0 0 22px; max-width: 46ch; }
.lp-bullets { list-style: none; margin: 0 0 26px; padding: 0; display: grid; gap: 10px; }
.lp-bullets li { display: flex; align-items: center; gap: 10px; font-size: 16px; color: #fff; }
.lp-bullets svg { width: 20px; height: 20px; color: var(--p1-teal); flex: none; }
.lp-call {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	background: transparent;
	border: 2px solid var(--p1-teal);
	color: var(--p1-teal);
	padding: 12px 24px;
	font-weight: 700;
}
.lp-call .phone-ic { width: 18px; height: 18px; }
.lp-call:hover { background: var(--p1-teal); color: var(--p1-teal-ink); }

/* Form card */
.lp-form-card {
	background: #0f1a28;
	border: 1px solid var(--p1-line);
	border-radius: 14px;
	padding: 28px;
	box-shadow: 0 30px 60px -30px rgba(0, 0, 0, 0.7);
}
.lp-form-card h2 { font-family: var(--font-heading); font-size: 24px; margin: 0 0 16px; color: #fff; }
.lp-form { display: grid; gap: 12px; }
.lp-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.lp-field input, .lp-field select, .lp-field textarea {
	width: 100%;
	background: #0a121c;
	border: 1px solid var(--p1-line);
	border-radius: 8px;
	padding: 12px 14px;
	color: #fff;
	font-size: 15px;
	font-family: inherit;
}
.lp-field textarea { resize: vertical; }
.lp-field input::placeholder, .lp-field textarea::placeholder { color: rgba(255, 255, 255, 0.4); }
.lp-field input:focus, .lp-field select:focus, .lp-field textarea:focus {
	outline: none; border-color: var(--p1-teal);
}
.lp-hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.lp-check { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; color: var(--p1-muted); }
.lp-check a { color: var(--p1-teal); }
.lp-submit { width: 100%; padding: 14px; font-size: 16px; }
.lp-orcall { text-align: center; font-size: 14px; color: var(--p1-muted); margin: 4px 0 0; }
.lp-orcall a { color: var(--p1-teal); font-weight: 600; }
.lp-error { color: #ff8f8f; font-size: 13px; margin: 0; }
.lp-error a { color: #fff; }
.lp-success { text-align: center; padding: 24px 8px; }
.lp-success svg { width: 44px; height: 44px; color: var(--p1-teal); }
.lp-success h3 { font-family: var(--font-heading); font-size: 22px; margin: 10px 0 6px; color: #fff; }
.lp-success p { color: var(--p1-muted); margin: 0; }

/* Trust strip */
.lp-trust { background: #0d141e; padding: 18px 0; text-align: center; }
.lp-trust p { margin: 0; font-size: 15px; color: rgba(255, 255, 255, 0.85); }
.lp-trust strong { color: var(--p1-teal); }

/* How it works */
.lp-how { padding: 64px 0; }
.lp-how h2, .lp-reviews h2, .lp-gallery h2, .lp-cta h2 {
	font-family: var(--font-heading); font-size: 32px; text-align: center; margin: 0 0 40px; color: #fff;
}
.lp-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.lp-steps li { text-align: center; }
.lp-step-n {
	display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
	background: color-mix(in srgb, var(--p1-teal) 18%, transparent); color: var(--p1-teal);
	font-family: var(--font-heading); font-weight: 700; font-size: 20px; margin: 0 0 14px;
}
.lp-steps h3 { font-family: var(--font-heading); font-size: 20px; margin: 0 0 8px; color: #fff; }
.lp-steps p { color: var(--p1-muted); font-size: 15px; line-height: 1.6; margin: 0; }

/* Reviews */
.lp-reviews { padding: 64px 0; background: #0d141e; }
.lp-reviews-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.lp-review { margin: 0; background: rgba(255, 255, 255, 0.03); border: 1px solid var(--p1-line); border-radius: 12px; padding: 24px; }
.lp-stars { color: #f5b301; letter-spacing: 3px; font-size: 16px; margin: 0 0 12px; }
.lp-review blockquote { margin: 0 0 14px; font-size: 15.5px; line-height: 1.6; color: rgba(255, 255, 255, 0.9); }
.lp-review figcaption { font-family: var(--font-heading); font-weight: 600; color: var(--p1-teal); }

/* Gallery */
.lp-gallery { padding: 64px 0; }
.lp-gallery-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.lp-gallery-grid img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; border-radius: 0; }

/* Final CTA */
.lp-cta { padding: 72px 0; text-align: center; background: linear-gradient(180deg, #111a27, #0d141e); }
.lp-cta p { color: rgba(255, 255, 255, 0.85); font-size: 18px; margin: 0 0 26px; }
.lp-cta-btns { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }

@media (max-width: 860px) {
	.lp-hero-grid { grid-template-columns: 1fr; gap: 32px; }
	.lp-steps, .lp-reviews-grid { grid-template-columns: 1fr; }
	.lp-gallery-grid { grid-template-columns: repeat(2, 1fr); }
	.lp-row { grid-template-columns: 1fr; }
}

/* ── Landing polish (CRO pass) ─────────────────────────────────────────────────────────── */
.p1-landing .lp-proof { display: flex; align-items: center; gap: 8px; margin: 0 0 16px; font-size: 14px; color: rgba(255,255,255,0.85); }
.p1-landing .lp-proof .lp-stars { color: #f5b301; letter-spacing: 2px; font-size: 15px; }
.lp-form-sub { font-size: 14px; color: var(--p1-muted); margin: 0 0 16px; }
.lp-label { display: block; font-size: 13px; font-weight: 600; color: rgba(255,255,255,0.85); margin: 0 0 5px; }
.lp-field { display: block; }
.lp-field + .lp-field { margin-top: 12px; }
.lp-field input, .lp-field select { min-height: 48px; padding: 13px 14px; }
.lp-reassure { text-align: center; font-size: 12.5px; color: var(--p1-muted); margin: 4px 0 0; line-height: 1.5; }

/* Trusted-by logo strip — normalise mixed colour/black/white logos to one clean monochrome. */
.lp-logos { background: #0d141e; padding: 28px 0; text-align: center; }
.lp-logos-h { font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--p1-muted); margin: 0 0 18px; }
.lp-logos-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 48px; }
.lp-logos-row img { height: 56px; width: auto; filter: brightness(0) invert(1); opacity: 0.85; }
@media (max-width: 860px) { .lp-logos-row img { height: 44px; } .lp-logos-row { gap: 32px; } }

.lp-mid-cta { text-align: center; margin-top: 40px; }

/* FAQ */
.lp-faq { padding: 64px 0; background: #0d141e; }
.lp-faq-wrap { max-width: 780px; }
.lp-faq-item { border: 1px solid var(--p1-line); border-radius: 10px; background: rgba(255,255,255,0.03); margin-bottom: 12px; padding: 0 20px; }
.lp-faq-item summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 0; cursor: pointer; list-style: none; font-family: var(--font-heading); font-weight: 600; font-size: 17px; color: #fff; }
.lp-faq-item summary::-webkit-details-marker { display: none; }
.lp-faq-item summary svg { width: 22px; height: 22px; color: var(--p1-teal); flex: none; transition: transform 0.2s ease; }
.lp-faq-item[open] summary svg { transform: rotate(45deg); }
.lp-faq-item p { margin: 0; padding: 0 0 18px; color: var(--p1-muted); font-size: 15px; line-height: 1.65; }

/* Sticky mobile call/quote bar */
.lp-sticky { display: none; }
@media (max-width: 860px) {
	.lp-sticky {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 8px;
		position: fixed;
		left: 0; right: 0; bottom: 0;
		z-index: 60;
		padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
		background: rgba(13,20,30,0.96);
		backdrop-filter: blur(8px);
		border-top: 1px solid var(--p1-line);
	}
	.lp-sticky a {
		display: flex; align-items: center; justify-content: center; gap: 8px;
		min-height: 52px; border-radius: 8px; font-weight: 700; font-size: 16px; text-decoration: none;
	}
	.lp-sticky-call { background: var(--p1-teal); color: var(--p1-teal-ink); }
	.lp-sticky-call .phone-ic { width: 18px; height: 18px; }
	.lp-sticky-quote { border: 2px solid var(--p1-teal); color: var(--p1-teal); }
	/* Keep the final CTA clear of the fixed bar. */
	.p1-landing { padding-bottom: 76px; }
}

/* Landing gallery lightbox (zero-JS :target; rule 20). z-index beats the bare header (60). */
.lp-gallery-cell { display: block; overflow: hidden; cursor: pointer; }
.lp-gallery-cell img { transition: transform 0.3s ease; }
.lp-gallery-cell:hover img { transform: scale(1.05); }
.lp-lb {
	position: fixed;
	inset: 0;
	z-index: 200;
	display: none;
	align-items: center;
	justify-content: center;
	padding: 24px;
	background: rgba(6, 10, 16, 0.93);
	backdrop-filter: blur(4px);
}
.lp-lb:target { display: flex; }
.lp-lb img {
	max-width: min(1100px, 100%);
	max-height: 86vh;
	width: auto;
	height: auto;
	object-fit: contain;
	border-radius: 0;
	box-shadow: 0 40px 120px -30px rgba(0, 0, 0, 0.8);
	position: relative;
	z-index: 1;
}
.lp-lb-scrim { position: absolute; inset: 0; z-index: 0; }
.lp-lb-x {
	position: absolute;
	top: 18px;
	right: 22px;
	z-index: 2;
	width: 44px;
	height: 44px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.12);
	color: #fff;
	font-size: 30px;
	line-height: 1;
	text-decoration: none;
}
.lp-lb-x:hover { background: rgba(255, 255, 255, 0.22); }