/*	Gas Guys Plumbing & Heating — Pilot Light
	---------------------------------------------------------
	GENERATED by tools/build-css.php. Do not edit.
	Sources: assets/css/src/_base.css + assets/css/src/tokens-pilot.css
*/

/*	Pilot Light — tokens
	---------------------------------------------------------
	Bricolage Grotesque over Figtree. Graphite grounds for the
	head, hero and dark bands; cool white for reading. The brand
	is a blue gas flame — cyan into indigo — used as a gradient on
	the pipe runs and the mark, and as indigo for links. Flame
	orange is reserved for one job only: the call to action.

	Kept clear of every sibling: no royal blue (Lanier #0149af),
	no red, no warm paper (UUL), no heavy-equipment amber (CHV).
*/
:root {
	/* Grounds + ink */
	--c-bg: #f5f7fa;
	--c-bg-alt: #eaeef4;
	--c-surface: #ffffff;
	--c-ink: #121620;
	--c-ink-soft: #3b4352;
	--c-ink-mute: #687183;
	--c-line: #dde2ea;
	--c-line-strong: #b6bfcc;

	/* Brand: the blue flame */
	--c-brand: #4338ca;
	--c-brand-ink: #ffffff;
	--c-brand-on-dark: #67e8f9;
	--c-link: #3b32b8;
	--c-link-hover: #1e1880;
	--c-eyebrow: #4338ca;

	/* The call to action, and nothing else */
	--c-accent: #ff6b1a;
	--c-accent-hover: #ff8540;
	--c-accent-ink: #1a0b02;
	--c-accent-text: #d4500b;
	--c-ghost-hover: rgba(127, 140, 160, .14);

	/* Service groups */
	--c-gas: #4f46e5;
	--c-water: #0e7490;
	--c-plumbing: #334155;
	--c-run-icon-ink: #ffffff;
	--run-color: var(--c-brand);
	--fit-color: var(--c-brand);

	/* Head, rail, hero */
	--c-rail-bg: #07090d;
	--c-rail-ink: #c9d1dd;
	--c-rail-strong: #ffb27e;
	--c-head-bg: #0f1218;
	--c-head-ink: #f3f5f8;
	--c-head-soft: #8e98aa;
	--c-head-line: #222a37;
	--c-head-hover: #67e8f9;
	--c-head-hover-bg: rgba(255, 255, 255, .06);
	--head-h: 4.5rem;

	--c-hero-bg: #0f1218;
	--c-hero-ink: #f5f7fa;
	--c-hero-soft: #aeb7c6;
	--c-hero-eyebrow: #67e8f9;
	--c-hero-line: rgba(255, 255, 255, .14);
	--c-hero-panel: rgba(255, 255, 255, .04);
	--hero-glow: radial-gradient(60rem 30rem at 88% 0%, rgba(79, 70, 229, .38), transparent 60%), radial-gradient(40rem 22rem at 70% 110%, rgba(34, 211, 238, .16), transparent 60%);
	--hero-glow-gas: radial-gradient(60rem 30rem at 90% 0%, rgba(99, 102, 241, .45), transparent 60%), radial-gradient(36rem 20rem at 75% 120%, rgba(34, 211, 238, .22), transparent 60%);
	--hero-glow-water: radial-gradient(60rem 30rem at 90% 0%, rgba(14, 116, 144, .45), transparent 60%);
	--c-dispatch-bg: #ffffff;
	--c-dispatch-line: rgba(255, 255, 255, .0);

	/* Dark bands */
	--c-dark-bg: #131823;
	--c-dark-card: #1b2230;
	--c-dark-line: #2a3345;
	--c-dark-ink: #f3f5f8;
	--c-dark-soft: #a9b2c3;
	--gasband-glow: radial-gradient(50rem 26rem at 100% 100%, rgba(79, 70, 229, .3), transparent 60%), radial-gradient(30rem 18rem at 0% 0%, rgba(34, 211, 238, .1), transparent 60%);

	/* Footer */
	--c-foot-bg: #0a0d13;
	--c-foot-ink: #dfe4ec;
	--c-foot-soft: #8f99ab;
	--c-foot-line: #1f2633;
	--c-foot-call-bg: linear-gradient(90deg, #312e81, #155e75);
	--c-foot-call-ink: #ffffff;
	--c-foot-call-soft: #a5f3fc;

	/* Components */
	--c-note-bg: #ffffff;
	--c-note-line: #dde2ea;
	--c-note-perf: #b6bfcc;
	--c-node-bg: #0f1218;
	--c-node-ink: #67e8f9;
	--c-node-line: #0f1218;
	--c-tag-bg: #ecebfc;
	--c-tag-ink: #2f2899;
	--c-take-bg: #eefaff;
	--c-take-line: #b9e8f5;
	--c-alert-bg: #fff3ea;
	--c-alert-ink: #4f1f05;
	--c-alert-line: #ffc7a3;
	--c-alert-icon: #e8590c;
	--c-input-bg: #ffffff;
	--c-input-line: #c8cfda;
	--c-focus: #4f46e5;
	--c-focus-ring: rgba(79, 70, 229, .22);
	--c-ok-bg: #e6f7ee;
	--c-ok-ink: #0f5f36;
	--c-error: #c02626;
	--c-star: #ffb020;
	--c-live: #22c55e;
	--c-live-glow: rgba(34, 197, 94, .55);

	/* The mark */
	--mark-pipe: #e6eaf0;
	--mark-flame-1: #4f46e5;
	--mark-flame-2: #22d3ee;

	/* Pipe motif */
	--pipe-w: 6px;
	--pipe-fill: linear-gradient(90deg, #22d3ee, #6366f1 55%, #4338ca);
	--pipe-union: #4338ca;
	--r-union: 3px;

	/* Type */
	--f-display: "Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
	--f-body: "Figtree", "Segoe UI", system-ui, sans-serif;
	--f-eyebrow: "Figtree", "Segoe UI", system-ui, sans-serif;
	--f-mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
	--fw-display: 700;
	--fw-display-heavy: 800;
	--lh-display: 1.06;
	--ls-display: -.025em;
	--tt-display: none;
	--tt-brand: none;
	--ls-brand: -.03em;
	--tt-eyebrow: uppercase;
	--ls-eyebrow: .12em;
	--fs-h1: clamp(2.35rem, 5.2vw, 4rem);
	--fs-h1-page: clamp(2.05rem, 4.4vw, 3.25rem);
	--fs-h2: clamp(1.75rem, 3.2vw, 2.55rem);
	--fs-h3: clamp(1.3rem, 2vw, 1.6rem);
	--fs-body: 1.0625rem;
	--fs-eyebrow: .76rem;

	/* Shape */
	--bw: 1px;
	--r-sm: 8px;
	--r-md: 14px;
	--r-lg: 20px;
	--r-pill: 999px;
	--r-btn: 999px;
	--r-check: 6px;
	--r-node: 50%;
	--r-note: 14px;
	--shadow-1: 0 1px 2px rgba(18, 22, 32, .06), 0 6px 18px rgba(18, 22, 32, .06);
	--shadow-2: 0 18px 50px rgba(8, 10, 16, .28);
	--shadow-btn: 0 6px 18px rgba(255, 107, 26, .28);

	/* Rhythm */
	--wrap: 76rem;
	--gutter: clamp(1rem, 4vw, 2rem);
	--sec-pad: clamp(3.5rem, 7vw, 6rem);
}

/*	Gas Guys Plumbing & Heating :: structure + components
	===========================================================
	100% token-driven. Every color, face, radius and rhythm comes
	from a tokens-<look>.css file; tools/build-css.php fails the
	build if a look leaves any var() below undefined.

	THE MOTIF IS PIPE. Section dividers are pipe runs with unions
	on them; the service columns are risers with branch fittings;
	process steps hang off a vertical line like valves. None of the
	three sibling sites uses anything like it, which is the point.
	=========================================================== */


/* ---------- Reset + base ----------------------------------- */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 6rem; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; animation: none !important; } }
body {
	margin: 0;
	background: var(--c-bg);
	color: var(--c-ink);
	font-family: var(--f-body);
	font-size: var(--fs-body);
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}
html.navOpen body { overflow: hidden; }
img, svg { display: block; max-width: 100%; }
img { height: auto; }
a { color: var(--c-link); text-underline-offset: .18em; text-decoration-thickness: 1px; }
a:hover { color: var(--c-link-hover); }
:focus-visible { outline: 3px solid var(--c-focus); outline-offset: 2px; border-radius: 2px; }
h1, h2, h3, h4 { font-family: var(--f-display); font-weight: var(--fw-display); line-height: var(--lh-display); letter-spacing: var(--ls-display); text-transform: var(--tt-display); margin: 0; text-wrap: balance; }
p { margin: 0 0 1em; }
p:last-child { margin-bottom: 0; }
ul, ol { margin: 0; padding: 0; }
button { font: inherit; cursor: pointer; }
table { border-collapse: collapse; }

.srOnly { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skipLink { position: absolute; left: 1rem; top: -4rem; z-index: 100; padding: .6rem 1rem; background: var(--c-accent); color: var(--c-accent-ink); font-weight: 700; border-radius: var(--r-sm); }
.skipLink:focus { top: 1rem; }

.wrap { width: 100%; max-width: var(--wrap); margin-inline: auto; padding-inline: var(--gutter); }
.wrap--narrow { max-width: 46rem; }

.section { padding-block: var(--sec-pad); }
.section--reviews, .section--faqs, .gasBand, .section--areas, .proseAside { padding-top: var(--sec-pad) !important; }
.section--reviews { background: var(--c-bg-alt); }
.section--faqs { background: var(--c-bg); }

.eyebrow {
	display: inline-flex; align-items: center; gap: .5rem;
	margin: 0 0 .9rem;
	font-family: var(--f-eyebrow);
	font-size: var(--fs-eyebrow);
	font-weight: 700;
	letter-spacing: var(--ls-eyebrow);
	text-transform: var(--tt-eyebrow);
	color: var(--c-eyebrow);
}

.sectionHead { max-width: 48rem; margin-bottom: clamp(1.75rem, 3vw, 2.75rem); }
.sectionHead__title { font-size: var(--fs-h2); color: var(--c-ink); }
.sectionHead__intro { margin-top: 1rem; font-size: 1.08rem; color: var(--c-ink-soft); }
.sectionFoot { display: flex; flex-wrap: wrap; gap: 1rem 2rem; margin-top: 2rem; }

.textLink { display: inline-flex; align-items: center; gap: .4rem; font-weight: 700; text-decoration: none; color: var(--c-link); }
.textLink:hover { gap: .6rem; }

.prose { max-width: 44rem; }
.prose p, .prose li { font-size: 1.04rem; color: var(--c-ink-soft); }
.prose ul { margin: 0 0 1em; padding-left: 1.25rem; }
.prose li { margin-bottom: .55em; padding-left: .25rem; }
.prose li::marker { color: var(--c-brand); }
.prose h2 { font-size: var(--fs-h3); margin: 2rem 0 .75rem; }
.prose--legal h2 { font-size: 1.3rem; }


/* ---------- Buttons ---------------------------------------- */

.btn {
	display: inline-flex; align-items: center; justify-content: center; gap: .55rem;
	min-height: 3rem; padding: .7rem 1.25rem;
	border: var(--bw) solid transparent; border-radius: var(--r-btn);
	font-family: var(--f-body); font-weight: 800; font-size: 1rem; line-height: 1.15;
	text-decoration: none; white-space: nowrap;
	transition: background .15s, color .15s, border-color .15s, transform .15s;
}
.btn:active { transform: translateY(1px); }
.btn--call, .btn--primary { background: var(--c-accent); color: var(--c-accent-ink); box-shadow: var(--shadow-btn); }
.btn--call:hover, .btn--primary:hover { background: var(--c-accent-hover); color: var(--c-accent-ink); }
.btn--ghost { background: transparent; color: inherit; border-color: currentColor; }
.btn--ghost:hover { background: var(--c-ghost-hover); color: inherit; }
.btn--lg { min-height: 3.5rem; padding-inline: 1.6rem; font-size: 1.08rem; }
.btn--block { width: 100%; }
.btn__stack { display: flex; flex-direction: column; text-align: left; }
.btn__small { font-size: .7rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; opacity: .85; }
.btn__big { font-size: 1.05rem; }


/* ---------- The 24/7 rail ---------------------------------- */

.rail { background: var(--c-rail-bg); color: var(--c-rail-ink); font-size: .84rem; }
.rail__inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 2.4rem; }
.rail p { margin: 0; }
.rail__live { display: inline-flex; align-items: center; gap: .5rem; font-weight: 700; }
.rail__dot { width: .55rem; height: .55rem; border-radius: 50%; background: var(--c-live); box-shadow: 0 0 0 0 var(--c-live); animation: ggPulse 2.4s infinite; flex: none; }
@keyframes ggPulse { 0% { box-shadow: 0 0 0 0 var(--c-live-glow); } 70% { box-shadow: 0 0 0 .5rem transparent; } 100% { box-shadow: 0 0 0 0 transparent; } }
.rail__gas { display: inline-flex; align-items: center; gap: .4rem; }
.rail__gas strong { color: var(--c-rail-strong); }
.rail__icon { color: var(--c-rail-strong); }
.rail__phone { color: var(--c-rail-ink); font-weight: 800; text-decoration: none; }
@media (max-width: 54rem) { .rail__gas { display: none; } }


/* ---------- Masthead + navigation -------------------------- */

.masthead { position: sticky; top: 0; z-index: 50; background: var(--c-head-bg); color: var(--c-head-ink); border-bottom: var(--bw) solid var(--c-head-line); }
.masthead__inner { display: flex; align-items: center; gap: 1.5rem; min-height: 4.5rem; }
.brand { color: inherit; text-decoration: none; margin-right: auto; }
.brand:hover { color: inherit; }

.brandMark { display: inline-flex; align-items: center; gap: .65rem; }
.brandMark__svg { width: 2.6rem; height: 2.6rem; flex: none; }
.brandMark__pipe { fill: none; stroke: var(--mark-pipe); stroke-width: 6; }
.brandMark__fit { fill: var(--mark-pipe); }
.brandMark__stop1 { stop-color: var(--mark-flame-1); }
.brandMark__stop2 { stop-color: var(--mark-flame-2); }
.brandMark__words { display: flex; flex-direction: column; line-height: 1; }
.brandMark__name { font-family: var(--f-display); font-weight: var(--fw-display-heavy); font-size: 1.45rem; letter-spacing: var(--ls-brand); text-transform: var(--tt-brand); }
.brandMark__trade { margin-top: .22rem; font-size: .68rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--c-head-soft); }

.navToggle { display: none; align-items: center; justify-content: center; width: 3rem; height: 3rem; border: var(--bw) solid var(--c-head-line); border-radius: var(--r-sm); background: transparent; color: inherit; }
.navToggle__close { display: none; }
.navToggle[aria-expanded="true"] .navToggle__open { display: none; }
.navToggle[aria-expanded="true"] .navToggle__close { display: block; }

.siteNav { display: flex; align-items: center; gap: 1.25rem; }
.siteNav__list { display: flex; align-items: center; list-style: none; gap: .25rem; }
.siteNav__item { position: static; }
.siteNav__link { display: inline-flex; align-items: center; gap: .25rem; padding: .6rem .7rem; color: inherit; font-weight: 700; font-size: .96rem; text-decoration: none; border-radius: var(--r-sm); }
.siteNav__link:hover { color: var(--c-head-hover); background: var(--c-head-hover-bg); }
.siteNav__chev { transition: transform .2s; }

.mega {
	position: absolute; left: 0; right: 0; top: 100%;
	visibility: hidden; opacity: 0; transform: translateY(-.4rem);
	transition: opacity .15s, transform .15s, visibility 0s .15s;
	background: var(--c-surface); color: var(--c-ink);
	border-bottom: var(--bw) solid var(--c-line); box-shadow: var(--shadow-2);
}
.mega__inner { max-width: var(--wrap); margin-inline: auto; padding: 1.75rem var(--gutter); display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; }
.mega__head { display: flex; align-items: center; gap: .5rem; margin: 0 0 .75rem; padding-bottom: .6rem; border-bottom: var(--bw) solid var(--c-line); font-family: var(--f-display); font-weight: var(--fw-display); text-transform: var(--tt-display); letter-spacing: var(--ls-display); font-size: 1.1rem; }
.mega__col--gas .mega__icon { color: var(--c-gas); }
.mega__col--water .mega__icon { color: var(--c-water); }
.mega__col--plumbing .mega__icon { color: var(--c-plumbing); }
.mega__list { list-style: none; }
.mega__list a { display: block; padding: .32rem 0; color: var(--c-ink); text-decoration: none; font-weight: 600; font-size: .95rem; }
.mega__list a:hover { color: var(--c-link); }
.mega__child a { padding-left: 1rem; font-weight: 500; color: var(--c-ink-soft); position: relative; }
.mega__child a::before { content: ""; position: absolute; left: .2rem; top: 50%; width: .5rem; border-top: 2px solid var(--c-line-strong); }
.mega__foot { grid-column: 1 / -1; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; padding-top: 1rem; border-top: var(--bw) solid var(--c-line); font-size: .92rem; color: var(--c-ink-soft); }

@media (min-width: 64rem) and (hover: hover) {
	.siteNav__item--mega:hover .mega, .siteNav__item--mega:focus-within .mega { visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }
	.siteNav__item--mega:hover .siteNav__chev { transform: rotate(180deg); }
}
.siteNav__item--mega.is-open .mega { visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }

@media (max-width: 63.99rem) {
	.navToggle { display: inline-flex; }
	.siteNav {
		position: fixed; inset: 0; top: var(--head-h, 4.5rem); z-index: 49;
		flex-direction: column; align-items: stretch; gap: 0;
		padding: 1rem var(--gutter) 7rem; overflow-y: auto;
		background: var(--c-surface); color: var(--c-ink);
		transform: translateX(100%); transition: transform .2s;
	}
	.siteNav.is-open { transform: none; }
	.siteNav__list { flex-direction: column; align-items: stretch; }
	.siteNav__link { width: 100%; justify-content: space-between; padding: .9rem .25rem; font-size: 1.1rem; border-bottom: 1px solid var(--c-line); border-radius: 0; }
	.mega { position: static; visibility: visible; opacity: 1; transform: none; display: none; box-shadow: none; border: 0; background: transparent; }
	.siteNav__item--mega.is-open .mega { display: block; }
	.mega__inner { grid-template-columns: minmax(0, 1fr); padding: .5rem 0 1rem; gap: 1.25rem; }
	.siteNav__cta { padding-top: 1.25rem; }
	.siteNav__cta .btn { width: 100%; }
}


/* ---------- Pipe dividers ---------------------------------- */

/*	A pipe run across the foot of each hero, with two unions on it.
	Drawn in CSS so it costs no requests and recolors per look. */
.hero__pipe, .pageHero__pipe {
	position: absolute; left: 0; right: 0; bottom: 0;
	height: var(--pipe-w);
	background: var(--pipe-fill);
}
.hero__pipe::before, .hero__pipe::after, .pageHero__pipe::before, .pageHero__pipe::after {
	content: ""; position: absolute; top: 50%;
	width: calc(var(--pipe-w) * 2.2); height: calc(var(--pipe-w) * 2.4);
	transform: translateY(-50%);
	background: var(--pipe-union);
	border-radius: var(--r-union);
}
.hero__pipe::before, .pageHero__pipe::before { left: 18%; }
.hero__pipe::after, .pageHero__pipe::after { right: 22%; }


/* ---------- Home hero + dispatch --------------------------- */

.hero { position: relative; background: var(--c-hero-bg); color: var(--c-hero-ink); overflow: hidden; }
.hero::before { content: ""; position: absolute; inset: 0; background: var(--hero-glow); pointer-events: none; }
.hero__inner { position: relative; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center; padding-block: clamp(2.5rem, 6vw, 5.5rem); }
.hero__eyebrow { color: var(--c-hero-eyebrow); }
.hero__title { font-size: var(--fs-h1); color: var(--c-hero-ink); }
.hero__sub { margin-top: 1.25rem; max-width: 36rem; font-size: 1.15rem; color: var(--c-hero-soft); }
.hero__trust { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; list-style: none; margin-top: 1.5rem; font-size: .92rem; font-weight: 600; color: var(--c-hero-soft); }
.hero__trust li { display: inline-flex; align-items: center; gap: .35rem; }
.hero__trust .icon { color: var(--c-brand-on-dark); }

.score { display: inline-flex; align-items: center; gap: .65rem; text-decoration: none; color: inherit; }
.score:hover { color: inherit; }
.score__stars { display: inline-flex; gap: .1rem; color: var(--c-star); }
.score__star { fill: currentColor; }
.score__text { font-size: .92rem; }
.score--hero { margin-top: 1.5rem; color: var(--c-hero-soft); }

.dispatch {
	position: relative;
	padding: clamp(1.25rem, 3vw, 2rem);
	background: var(--c-dispatch-bg); color: var(--c-ink);
	border: var(--bw) solid var(--c-dispatch-line); border-radius: var(--r-lg);
	box-shadow: var(--shadow-2);
}
.dispatch__head { display: flex; align-items: center; gap: .5rem; margin: 0 0 .5rem; font-family: var(--f-eyebrow); font-size: var(--fs-eyebrow); font-weight: 700; letter-spacing: var(--ls-eyebrow); text-transform: uppercase; color: var(--c-ink-soft); }
.dispatch__phone { display: flex; align-items: center; gap: .6rem; font-family: var(--f-display); font-weight: var(--fw-display-heavy); font-size: clamp(1.8rem, 3.4vw, 2.5rem); letter-spacing: -.01em; color: var(--c-ink); text-decoration: none; line-height: 1.1; }
.dispatch__phone .icon { color: var(--c-accent); flex: none; }
.dispatch__phone:hover { color: var(--c-link); }
.dispatch__note { margin: .4rem 0 0; color: var(--c-ink-soft); font-size: .95rem; }
.dispatch__or { display: flex; align-items: center; gap: .75rem; margin: 1.25rem 0 1rem; font-size: .8rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--c-ink-mute); }
.dispatch__or::before, .dispatch__or::after { content: ""; flex: 1; border-top: 1px dashed var(--c-line-strong); }

@media (max-width: 54rem) { .hero__inner { grid-template-columns: minmax(0, 1fr); } }


/* ---------- Interior hero ---------------------------------- */

.pageHero { position: relative; background: var(--c-hero-bg); color: var(--c-hero-ink); overflow: hidden; }
.pageHero::before { content: ""; position: absolute; inset: 0; background: var(--hero-glow); pointer-events: none; }
.pageHero--gas::before { background: var(--hero-glow-gas); }
.pageHero--water::before { background: var(--hero-glow-water); }
.pageHero__inner { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2rem 3rem; align-items: end; padding-block: clamp(2.25rem, 5vw, 4rem) clamp(2.5rem, 5vw, 4.25rem); }
.pageHero__eyebrow { color: var(--c-hero-eyebrow); }
.pageHero__icon { color: var(--c-brand-on-dark); }
.pageHero__title { font-size: var(--fs-h1-page); color: var(--c-hero-ink); max-width: 22ch; }
.pageHero__sub { margin-top: 1rem; max-width: 40rem; font-size: 1.12rem; color: var(--c-hero-soft); }
.pageHero__actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.5rem; }
.pageHero__actions .btn--ghost { color: var(--c-hero-ink); }
.pageHero__meta { list-style: none; display: grid; gap: .55rem; padding: 1.1rem 1.25rem; min-width: 15rem; border: var(--bw) solid var(--c-hero-line); border-radius: var(--r-md); font-size: .92rem; font-weight: 600; color: var(--c-hero-soft); background: var(--c-hero-panel); }
.pageHero__meta li { display: flex; align-items: center; gap: .5rem; }
.pageHero__meta .icon { color: var(--c-brand-on-dark); flex: none; }
@media (max-width: 54rem) { .pageHero__inner { grid-template-columns: minmax(0, 1fr); align-items: start; } .pageHero__meta { min-width: 0; } }

.crumbs { background: var(--c-bg-alt); border-bottom: 1px solid var(--c-line); font-size: .86rem; }
.crumbs__list { display: flex; flex-wrap: wrap; list-style: none; gap: .25rem; padding-block: .7rem; }
.crumbs__list li { display: inline-flex; align-items: center; gap: .25rem; color: var(--c-ink-soft); }
.crumbs__list li + li::before { content: "/"; margin-right: .25rem; color: var(--c-line-strong); }
.crumbs a { color: var(--c-ink-soft); text-decoration: none; }
.crumbs a:hover { color: var(--c-link); text-decoration: underline; }


/* ---------- Long-page body + aside ------------------------- */

.pageBody { padding-block: clamp(2rem, 5vw, 3.75rem); }
.pageBody__grid { display: grid; grid-template-columns: minmax(0, 1fr) 19rem; gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.pageBody__main > * + * { margin-top: clamp(2.25rem, 4vw, 3.25rem); }


.lede { max-width: 44rem; }
.lede p { font-size: 1.08rem; color: var(--c-ink-soft); }
.lede__first { font-size: 1.24rem !important; line-height: 1.55; color: var(--c-ink) !important; }
.pull { margin: 1.75rem 0 0; padding: 0 0 0 1.25rem; border-left: var(--pipe-w) solid var(--c-brand); }
.pull p { font-family: var(--f-display); font-size: 1.35rem; line-height: 1.3; color: var(--c-ink); font-weight: var(--fw-display); }

.pageAside { position: sticky; top: 6.5rem; display: grid; gap: 1.25rem; }
.toc { background: var(--c-surface); border: var(--bw) solid var(--c-line); border-radius: var(--r-md); padding: 1rem 1.15rem; }
.toc__title { cursor: pointer; font-family: var(--f-eyebrow); font-size: var(--fs-eyebrow); font-weight: 700; letter-spacing: var(--ls-eyebrow); text-transform: uppercase; color: var(--c-ink-mute); list-style: none; }
.toc__title::-webkit-details-marker { display: none; }
.toc__list { list-style: none; margin-top: .6rem; border-left: 2px solid var(--c-line); }
.toc__list a { display: block; padding: .3rem 0 .3rem .85rem; margin-left: -2px; border-left: 2px solid transparent; color: var(--c-ink-soft); text-decoration: none; font-size: .9rem; line-height: 1.35; }
.toc__list a:hover, .toc__list a.is-current { color: var(--c-ink); border-left-color: var(--c-brand); font-weight: 600; }

.callCard { padding: 1.25rem; background: var(--c-dark-bg); color: var(--c-dark-ink); border-radius: var(--r-md); display: grid; gap: .65rem; }
@media (max-width: 62rem) {
	.pageBody__grid { grid-template-columns: minmax(0, 1fr); }
	.pageBody .pageAside { order: -1; position: static; }
	.pageBody .callCard { display: none; }
	.toc:not([open]) { padding-block: .85rem; }
}
.callCard__live { display: flex; align-items: center; gap: .5rem; margin: 0; font-size: .8rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--c-dark-soft); }
.callCard__title { margin: 0 0 .25rem; font-family: var(--f-display); font-weight: var(--fw-display); text-transform: var(--tt-display); font-size: 1.25rem; line-height: 1.2; }
.callCard .btn--ghost { color: var(--c-dark-ink); }
.callCard__facts { list-style: none; display: grid; gap: .35rem; margin-top: .4rem; font-size: .84rem; color: var(--c-dark-soft); }
.callCard__facts li { display: flex; gap: .4rem; align-items: center; }
.callCard__more { display: inline-flex; align-items: center; gap: .35rem; margin-top: .25rem; font-size: .86rem; font-weight: 700; color: var(--c-brand-on-dark); text-decoration: none; }
.callCard__more:hover { color: var(--c-dark-ink); }
.callCard__facts .icon { color: var(--c-brand-on-dark); flex: none; }


/* ---------- Body blocks ------------------------------------ */

.block__title { display: flex; align-items: center; gap: .6rem; font-size: var(--fs-h3); margin-bottom: 1rem; }
.block__icon { color: var(--c-brand); flex: none; }
.block__note { color: var(--c-ink-soft); max-width: 42rem; }
.block__fine { margin-top: .75rem; font-size: .85rem; color: var(--c-ink-mute); }

.safety {
	display: grid; grid-template-columns: auto 1fr auto; gap: 1rem; align-items: center;
	padding: 1.1rem 1.25rem;
	background: var(--c-alert-bg); color: var(--c-alert-ink);
	border: var(--bw) solid var(--c-alert-line); border-left-width: var(--pipe-w);
	border-radius: var(--r-md);
}
.safety__icon { color: var(--c-alert-icon); }
.safety__title { margin: 0 0 .25rem; font-weight: 800; font-size: 1.05rem; }
.safety__text p { font-size: .95rem; }
.safety__btn { align-self: center; padding: .55rem 1rem; border: var(--bw) solid currentColor; border-radius: var(--r-btn); color: inherit; font-weight: 800; text-decoration: none; white-space: nowrap; }
@media (max-width: 40rem) { .safety { grid-template-columns: auto 1fr; } .safety__btn { grid-column: 1 / -1; justify-self: start; } }

.checklist { list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: .65rem 1.5rem; }
.checklist li { display: flex; gap: .7rem; align-items: flex-start; padding: .75rem .9rem; background: var(--c-surface); border: 1px solid var(--c-line); border-radius: var(--r-sm); font-weight: 600; line-height: 1.4; }
.checklist__box { display: inline-grid; place-items: center; width: 1.5rem; height: 1.5rem; flex: none; border: 2px solid var(--c-brand); border-radius: var(--r-check); color: var(--c-brand); }

.tagList { list-style: none; display: flex; flex-wrap: wrap; gap: .5rem; }
.tagList li { padding: .45rem .85rem; background: var(--c-tag-bg); color: var(--c-tag-ink); border-radius: var(--r-pill); font-size: .92rem; font-weight: 600; }

.pipeSteps { list-style: none; position: relative; display: grid; gap: 1.25rem; }
.pipeSteps::before { content: ""; position: absolute; left: calc(1.25rem - var(--pipe-w) / 2); top: .75rem; bottom: .75rem; width: var(--pipe-w); background: var(--pipe-fill); }
.pipeSteps__item { position: relative; display: grid; grid-template-columns: 2.5rem 1fr; gap: 1rem; align-items: start; align-content: start; }
.pipeSteps__n { position: relative; z-index: 1; display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: var(--r-node); background: var(--c-node-bg); color: var(--c-node-ink); border: var(--bw) solid var(--c-node-line); font-family: var(--f-display); font-weight: var(--fw-display-heavy); font-size: 1.05rem; }
.pipeSteps__title { font-size: 1.12rem; margin: .45rem 0 .35rem; font-family: var(--f-body); font-weight: 800; text-transform: none; letter-spacing: 0; }
.pipeSteps__item p { color: var(--c-ink-soft); }
.pipeSteps--row { grid-template-columns: repeat(4, 1fr); gap: 1.5rem; }
.pipeSteps--row::before { left: 1.25rem; right: 1.25rem; top: calc(1.25rem - var(--pipe-w) / 2); bottom: auto; width: auto; height: var(--pipe-w); }
.pipeSteps--row .pipeSteps__item { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 54rem) { .pipeSteps--row { grid-template-columns: minmax(0, 1fr); } .pipeSteps--row::before { left: calc(1.25rem - var(--pipe-w) / 2); right: auto; top: .75rem; bottom: .75rem; width: var(--pipe-w); height: auto; } .pipeSteps--row .pipeSteps__item { grid-template-columns: 2.5rem 1fr; } }

.callStrip { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.15rem 1.35rem; background: var(--c-bg-alt); border: var(--bw) dashed var(--c-line-strong); border-radius: var(--r-md); }
.callStrip__text { margin: 0; font-weight: 700; }

.factorList { display: grid; gap: 0; border-top: var(--bw) solid var(--c-line); }
.factorList__row { display: grid; grid-template-columns: 14rem 1fr; gap: 1.5rem; padding: .95rem 0; border-bottom: 1px solid var(--c-line); }
.factorList dt { font-weight: 800; }
.factorList dd { margin: 0; color: var(--c-ink-soft); }
@media (max-width: 40rem) { .factorList__row { grid-template-columns: minmax(0, 1fr); gap: .25rem; } }

.fitCards { display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: 1rem; }
.fitCard { padding: 1.25rem; background: var(--c-surface); border: var(--bw) solid var(--c-line); border-top: var(--pipe-w) solid var(--c-brand); border-radius: var(--r-md); }
.fitCard__title { font-family: var(--f-body); text-transform: none; letter-spacing: 0; font-weight: 800; font-size: 1.08rem; margin-bottom: .45rem; }
.fitCard p { color: var(--c-ink-soft); font-size: .97rem; }

.tableScroll { overflow-x: auto; border: var(--bw) solid var(--c-line); border-radius: var(--r-md); }
.utilTable { width: 100%; min-width: 34rem; font-size: .93rem; }
.utilTable th, .utilTable td { padding: .65rem .9rem; text-align: left; border-bottom: 1px solid var(--c-line); vertical-align: top; }
.utilTable thead th { background: var(--c-bg-alt); font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; color: var(--c-ink-soft); }
.utilTable tbody th a { font-weight: 700; text-decoration: none; }
.utilTable tbody tr:last-child > * { border-bottom: 0; }
.utilTable td { color: var(--c-ink-soft); }

.factSheet { display: grid; border: var(--bw) solid var(--c-line); border-radius: var(--r-md); overflow: hidden; }
.factSheet__row { display: grid; grid-template-columns: 9rem 1fr; gap: 1rem; padding: .8rem 1.1rem; border-bottom: 1px solid var(--c-line); background: var(--c-surface); }
.factSheet__row:last-child { border-bottom: 0; }
.factSheet dt { font-size: .78rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--c-ink-mute); padding-top: .15rem; }
.factSheet dd { margin: 0; color: var(--c-ink); }
@media (max-width: 40rem) { .factSheet__row { grid-template-columns: minmax(0, 1fr); gap: .2rem; } }

.jobPhoto { margin: 0; }
.jobPhoto img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; object-position: center 40%; border-radius: var(--r-md); border: var(--bw) solid var(--c-line); }
.jobPhoto figcaption { display: flex; align-items: center; gap: .4rem; margin-top: .55rem; font-size: .86rem; color: var(--c-ink-mute); }
.jobStrip { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.jobStrip a { display: block; }
.jobStrip img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: var(--r-md); }
@media (max-width: 54rem) { .jobStrip { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.homeBase { padding: 1.4rem; background: var(--c-take-bg); border: var(--bw) solid var(--c-take-line); border-radius: var(--r-md); display: grid; gap: .75rem; }
.homeBase .block__title { margin-bottom: 0; }
.homeBase__addr { margin: 0; font-family: var(--f-display); font-weight: var(--fw-display); font-size: 1.25rem; }
.homeBase .mapFrame { aspect-ratio: 16 / 7; }
.deeper { padding: 1rem 1.2rem; background: var(--c-bg-alt); border-radius: var(--r-md); color: var(--c-ink-soft); }

.byline { font-size: .9rem; color: var(--c-ink-mute); }
.takeaways { padding: 1.25rem 1.4rem; background: var(--c-take-bg); border: var(--bw) solid var(--c-take-line); border-radius: var(--r-md); }
.takeaways__title { font-family: var(--f-eyebrow); font-size: var(--fs-eyebrow); font-weight: 700; letter-spacing: var(--ls-eyebrow); text-transform: uppercase; color: var(--c-eyebrow); margin-bottom: .6rem; }
.takeaways ul { padding-left: 1.2rem; display: grid; gap: .4rem; }
.takeaways li { font-weight: 600; }
.block--whenCall { padding: 1.5rem; background: var(--c-bg-alt); border-radius: var(--r-md); }
.block--whenCall .btn { margin-top: 1rem; }


/* ---------- Credentials + team ----------------------------- */

.creds { list-style: none; display: flex; flex-wrap: wrap; gap: .6rem; }
.cred { display: inline-flex; align-items: center; gap: .55rem; padding: .55rem .85rem; background: var(--c-surface); border: var(--bw) solid var(--c-line); border-radius: var(--r-pill); }
.cred__icon { display: inline-grid; place-items: center; color: var(--c-brand); flex: none; }
.cred__label { font-weight: 700; font-size: .9rem; color: var(--c-ink); }
.creds--detail { display: grid; grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr)); gap: .75rem; }
.creds--detail .cred { align-items: flex-start; border-radius: var(--r-md); padding: .9rem 1rem; }
.creds--detail .cred__text { display: flex; flex-direction: column; gap: .2rem; }
.cred__body { font-size: .88rem; color: var(--c-ink-soft); line-height: 1.45; }
.credStrip { background: var(--c-bg-alt); border-bottom: 1px solid var(--c-line); padding-block: 1rem; }
.credStrip .creds { justify-content: center; }

.team { list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr)); gap: 1rem; margin-top: 1.25rem; }
.team__member { display: flex; flex-direction: column; gap: .15rem; padding: 1.1rem; background: var(--c-surface); border: var(--bw) solid var(--c-line); border-radius: var(--r-md); }
.team__initials { display: inline-grid; place-items: center; width: 2.75rem; height: 2.75rem; margin-bottom: .5rem; border-radius: 50%; background: var(--c-node-bg); color: var(--c-node-ink); font-family: var(--f-display); font-weight: var(--fw-display-heavy); }
.team__name { font-weight: 800; }
.team__role { font-size: .9rem; color: var(--c-brand); font-weight: 700; }
.team__since { font-size: .85rem; color: var(--c-ink-soft); }


/* ---------- Service runs (three columns) ------------------- */

.runs { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.5rem, 3vw, 2.5rem); }
@media (max-width: 62rem) { .runs { grid-template-columns: minmax(0, 1fr); } }
.run { position: relative; padding: 1.5rem 1.5rem 1.25rem; background: var(--c-surface); border: var(--bw) solid var(--c-line); border-radius: var(--r-lg); }
.run__head { margin-bottom: 1.1rem; }
.run__icon { display: inline-grid; place-items: center; width: 3rem; height: 3rem; border-radius: var(--r-node); background: var(--run-color); color: var(--c-run-icon-ink); margin-bottom: .9rem; }
.run--gas { --run-color: var(--c-gas); }
.run--water { --run-color: var(--c-water); }
.run--plumbing { --run-color: var(--c-plumbing); }
.run__title { font-size: 1.4rem; }
.run__blurb { margin-top: .45rem; color: var(--c-ink-soft); font-size: .95rem; }
.run__list { list-style: none; position: relative; margin-left: .45rem; padding-left: 1.25rem; border-left: var(--pipe-w) solid var(--run-color); }
.run__item { position: relative; }
.run__item::before { content: ""; position: absolute; left: -1.25rem; top: 1.05rem; width: .85rem; height: var(--pipe-w); background: var(--run-color); }
.run__item a { display: block; padding: .5rem 0; text-decoration: none; color: var(--c-ink); }
.run__item a:hover .run__name { color: var(--c-link); }
.run__name { font-weight: 700; }
.run__desc { display: block; margin-top: .15rem; font-size: .88rem; color: var(--c-ink-soft); line-height: 1.45; }
.run__item--child { margin-left: 1rem; }
.run__item--child .run__name { font-weight: 600; font-size: .95rem; }


/* ---------- Gas band --------------------------------------- */

.gasBand { background: var(--c-dark-bg); color: var(--c-dark-ink); position: relative; overflow: hidden; }
.gasBand::before { content: ""; position: absolute; inset: 0; background: var(--gasband-glow); pointer-events: none; }
.gasBand__inner { position: relative; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.gasBand .eyebrow { color: var(--c-brand-on-dark); }
.gasBand .sectionHead__title { color: var(--c-dark-ink); margin-bottom: 1.25rem; }
.gasBand p { color: var(--c-dark-soft); font-size: 1.05rem; }
.gasBand__points { list-style: none; display: grid; gap: .75rem; margin-top: 1.5rem; }
.gasBand__points li { padding-left: 1rem; border-left: var(--pipe-w) solid var(--c-brand-on-dark); color: var(--c-dark-soft); }
.gasBand__points strong { display: block; color: var(--c-dark-ink); }
.gasBand__links { list-style: none; display: grid; gap: .5rem; }
.gasBand__links a { display: flex; align-items: center; gap: .85rem; padding: .95rem 1.1rem; background: var(--c-dark-card); border: 1px solid var(--c-dark-line); border-radius: var(--r-md); color: var(--c-dark-ink); text-decoration: none; font-weight: 700; }
.gasBand__links a:hover { border-color: var(--c-brand-on-dark); color: var(--c-dark-ink); }
.gasBand__icon { color: var(--c-brand-on-dark); flex: none; }
.gasBand__arrow { margin-left: auto; opacity: .6; }
@media (max-width: 54rem) { .gasBand__inner { grid-template-columns: minmax(0, 1fr); } }


/* ---------- Reviews as dispatch notes ---------------------- */

.reviewsHead { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 1rem 2rem; margin-bottom: 2rem; }
.reviewsHead .score { padding: .7rem 1rem; background: var(--c-surface); border: var(--bw) solid var(--c-line); border-radius: var(--r-pill); }
.notes { display: grid; grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr)); gap: 1.25rem; align-items: start; }
.note {
	position: relative; margin: 0;
	padding: 1.5rem 1.35rem 1.25rem;
	background: var(--c-note-bg);
	border: var(--bw) solid var(--c-note-line);
	border-top: 2px dashed var(--c-note-perf);
	border-radius: var(--r-note);
	box-shadow: var(--shadow-1);
}
.note::before, .note::after { content: ""; position: absolute; top: -.55rem; width: 1rem; height: 1rem; border-radius: 50%; background: var(--c-bg-alt); border: var(--bw) solid var(--c-note-line); }
.note::before { left: 1.25rem; }
.note::after { right: 1.25rem; }
.note__tag { margin: 0 0 .6rem; font-family: var(--f-mono); font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; color: var(--c-ink-mute); }
.note__body { margin: 0; }
.note__body p { font-size: .98rem; color: var(--c-ink); }
.note__when { font-weight: 500; color: var(--c-ink-mute); }
.note__by { margin-top: 1rem; padding-top: .7rem; border-top: 1px solid var(--c-line); font-weight: 800; font-size: .9rem; }


/* ---------- Towns ------------------------------------------ */

.prose + .gazetteer { margin-top: 2rem; }
.gazetteer { display: grid; grid-template-columns: 2fr 1fr; gap: 2rem 3rem; align-items: start; }
.gazetteer__county:first-child { grid-row: span 2; }
.gazetteer__county:first-child .gazetteer__list { columns: 2; column-gap: 3rem; }
.gazetteer__county:first-child .gazetteer__list li { break-inside: avoid; }
@media (max-width: 62rem) { .gazetteer { grid-template-columns: minmax(0, 1fr); } .gazetteer__county:first-child { grid-row: auto; } }
@media (max-width: 40rem) { .gazetteer__county:first-child .gazetteer__list { columns: 1; } }
.gazetteer__head { font-size: 1.2rem; padding-bottom: .6rem; margin-bottom: .4rem; border-bottom: var(--pipe-w) solid var(--c-brand); }
.gazetteer__list { list-style: none; }
.gazetteer__town { display: flex; align-items: baseline; gap: .5rem; padding: .55rem 0; text-decoration: none; color: var(--c-ink); border-bottom: 1px solid var(--c-line); }
.gazetteer__name { font-weight: 700; }
.gazetteer__town::after { content: ""; order: 1; flex: 1; border-bottom: 1px dotted var(--c-line); opacity: .7; transform: translateY(-.25rem); }
.gazetteer__gas { order: 2; font-size: .82rem; color: var(--c-ink-mute); text-align: right; }
.gazetteer__town:hover .gazetteer__name { color: var(--c-link); }
.gazetteer--detail .gazetteer__town { border-bottom: 0; }
.gazetteer--names .gazetteer__town::after { content: none; }
.gazetteer__blurb { margin: 0 0 .5rem; padding-bottom: .6rem; border-bottom: 1px solid var(--c-line); font-size: .88rem; color: var(--c-ink-soft); }

.townChips { list-style: none; display: flex; flex-wrap: wrap; gap: .5rem; }
.townChip { display: inline-flex; align-items: center; gap: .35rem; padding: .5rem .9rem; border: var(--bw) solid var(--c-line); border-radius: var(--r-pill); background: var(--c-surface); color: var(--c-ink); text-decoration: none; font-weight: 600; font-size: .92rem; }
.townChip:hover { border-color: var(--c-brand); color: var(--c-link); }
.townChip .icon { color: var(--c-brand); }


/* ---------- Link lists ------------------------------------- */

.section--links { padding-top: var(--sec-pad) !important; border-top: 1px solid var(--c-line); }
.fittings { list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(19rem, 1fr)); gap: .85rem; }
.fitting__link { display: flex; align-items: flex-start; gap: .9rem; height: 100%; padding: 1.1rem; background: var(--c-surface); border: var(--bw) solid var(--c-line); border-radius: var(--r-md); text-decoration: none; color: var(--c-ink); transition: border-color .15s, transform .15s; }
.fitting__link:hover { border-color: var(--fit-color, var(--c-brand)); color: var(--c-ink); transform: translateY(-2px); }
.fitting--gas { --fit-color: var(--c-gas); }
.fitting--water { --fit-color: var(--c-water); }
.fitting--plumbing { --fit-color: var(--c-plumbing); }
.fitting__icon { display: inline-grid; place-items: center; width: 2.6rem; height: 2.6rem; flex: none; border-radius: var(--r-node); background: var(--fit-color, var(--c-brand)); color: var(--c-run-icon-ink); }
.fitting__text { display: flex; flex-direction: column; gap: .2rem; }
.fitting__title { font-weight: 800; }
.fitting__blurb { font-size: .9rem; color: var(--c-ink-soft); line-height: 1.45; }
.fitting__arrow { margin-left: auto; flex: none; color: var(--c-ink-mute); }

.guideCards { display: grid; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); gap: 1rem; }
.guideCard { display: flex; flex-direction: column; gap: .5rem; padding: 1.35rem; background: var(--c-surface); border: var(--bw) solid var(--c-line); border-radius: var(--r-md); text-decoration: none; color: var(--c-ink); }
.guideCard:hover { border-color: var(--c-brand); color: var(--c-ink); }
.guideCard__topic { font-size: .76rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--c-eyebrow); }
.guideCard__title { font-family: var(--f-display); font-weight: var(--fw-display); text-transform: var(--tt-display); letter-spacing: var(--ls-display); font-size: 1.25rem; line-height: 1.2; }
.guideCard__dek { font-size: .92rem; color: var(--c-ink-soft); }

.comboTowns { display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: 2rem 2.5rem; }
.comboTown__name { font-size: 1.15rem; padding-bottom: .55rem; margin-bottom: .35rem; border-bottom: var(--pipe-w) solid var(--c-brand); }
.comboTown__name a { color: var(--c-ink); text-decoration: none; }
.comboTown__name a:hover { color: var(--c-link); }
.comboTown__list { list-style: none; }
.comboTown__list a { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .5rem 0; border-bottom: 1px solid var(--c-line); color: var(--c-ink-soft); text-decoration: none; font-weight: 600; }
.comboTown__list a:hover { color: var(--c-link); }
.comboTown__list .icon { color: var(--c-ink-mute); flex: none; }
.comboLinks { list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr)); gap: 0 2rem; }
.comboLinks a { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .75rem 0; border-bottom: 1px solid var(--c-line); color: var(--c-ink); text-decoration: none; font-weight: 700; }
.comboLinks a:hover { color: var(--c-link); }


/* ---------- FAQs ------------------------------------------- */

.faqs { display: grid; grid-template-columns: minmax(0, 20rem) minmax(0, 1fr); gap: 2rem clamp(2rem, 5vw, 4rem); align-items: start; }
.faqs__head { position: sticky; top: 7rem; margin-bottom: 0; }
.faqs__aside { margin-top: 1rem; color: var(--c-ink-soft); }
.faqs__head .sectionHead__title { font-size: clamp(1.6rem, 2.6vw, 2.15rem); }
@media (max-width: 54rem) { .faqs { grid-template-columns: minmax(0, 1fr); } .faqs__head { position: static; } }
.faqList { border-top: var(--bw) solid var(--c-line-strong); }
.faq { border-bottom: 1px solid var(--c-line); }
.faq__q { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.05rem 0; cursor: pointer; list-style: none; font-weight: 800; font-size: 1.04rem; }
.faq__q::-webkit-details-marker { display: none; }
.faq__icon { flex: none; color: var(--c-brand); transition: transform .2s; }
.faq[open] .faq__icon { transform: rotate(45deg); }
.faq__a { padding: 0 2.5rem 1.15rem 0; color: var(--c-ink-soft); }


/* ---------- Prose aside ------------------------------------ */

.proseAside { background: var(--c-bg-alt); }
.proseAside__inner { display: grid; grid-template-columns: minmax(0, 1fr) 19rem; gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.proseAside .sectionHead__title { margin-bottom: 1rem; }
.proseAside .pageAside { position: static; }
.proseAside .callCard { display: grid; }
@media (max-width: 54rem) { .proseAside__inner { grid-template-columns: minmax(0, 1fr); } }


/* ---------- CTA band + forms ------------------------------- */

.ctaBand { position: relative; background: var(--c-dark-bg); color: var(--c-dark-ink); padding-block: var(--sec-pad); overflow: hidden; }
.ctaBand::before { content: ""; position: absolute; inset: 0; background: var(--gasband-glow); pointer-events: none; }
.ctaBand__inner { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 27rem); gap: clamp(2rem, 5vw, 4rem); align-items: center; }
.ctaBand .eyebrow { color: var(--c-brand-on-dark); }
.ctaBand__title { font-size: var(--fs-h2); color: var(--c-dark-ink); }
.ctaBand__sub { margin-top: 1rem; color: var(--c-dark-soft); font-size: 1.08rem; max-width: 34rem; }
.ctaBand__phone { display: inline-flex; align-items: center; gap: .7rem; margin-top: 1.5rem; font-family: var(--f-display); font-weight: var(--fw-display-heavy); font-size: clamp(2rem, 4.5vw, 3.1rem); line-height: 1; color: var(--c-dark-ink); text-decoration: none; }
.ctaBand__phone .icon { color: var(--c-accent); }
.ctaBand__phone:hover { color: var(--c-brand-on-dark); }
.ctaBand__facts { list-style: none; display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; margin-top: 1.5rem; font-size: .9rem; color: var(--c-dark-soft); }
.ctaBand__facts li { display: inline-flex; align-items: center; gap: .35rem; }
.ctaBand__facts .icon { color: var(--c-brand-on-dark); }
.ctaBand__form { padding: clamp(1.25rem, 3vw, 1.75rem); background: var(--c-surface); color: var(--c-ink); border-radius: var(--r-lg); box-shadow: var(--shadow-2); }
@media (max-width: 54rem) { .ctaBand__inner { grid-template-columns: minmax(0, 1fr); } }

.quoteForm { display: grid; gap: 1rem; }
.quoteForm__title { margin: 0; font-family: var(--f-display); font-weight: var(--fw-display); text-transform: var(--tt-display); font-size: 1.3rem; }
.quoteForm__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.fieldRow { display: grid; gap: 1rem; }
.fieldRow--2 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.quoteForm--compact .fieldRow--2 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
@media (max-width: 34rem) { .fieldRow--2, .quoteForm--compact .fieldRow--2 { grid-template-columns: minmax(0, 1fr); } }
.field { margin: 0; display: grid; gap: .35rem; border: 0; padding: 0; min-width: 0; }
.field__label { font-weight: 700; font-size: .9rem; color: var(--c-ink); padding: 0; }
.field__req { color: var(--c-accent-text); }
.field__opt { font-weight: 500; color: var(--c-ink-mute); }
.field__input { width: 100%; min-height: 3rem; padding: .7rem .85rem; font: inherit; font-size: 1rem; color: var(--c-ink); background: var(--c-input-bg); border: var(--bw) solid var(--c-input-line); border-radius: var(--r-sm); }
.field__input::placeholder { color: var(--c-ink-mute); }
.field__input:focus { outline: none; border-color: var(--c-brand); box-shadow: 0 0 0 3px var(--c-focus-ring); }
.field__input--area { min-height: 7rem; resize: vertical; }
.field__input.is-invalid { border-color: var(--c-error); }
.field__error { font-size: .82rem; color: var(--c-error); font-weight: 600; min-height: 0; }
.field__error:empty { display: none; }
.field__hint { margin: 0; font-size: .85rem; color: var(--c-ink-mute); }

.chipSet { display: flex; flex-wrap: wrap; gap: .45rem; }
.chip input { position: absolute; opacity: 0; pointer-events: none; }
.chip__face { display: inline-flex; align-items: center; gap: .35rem; padding: .5rem .85rem; border: var(--bw) solid var(--c-input-line); border-radius: var(--r-pill); font-size: .9rem; font-weight: 600; cursor: pointer; background: var(--c-input-bg); }
.chip__tick { display: none; }
.chip input:checked + .chip__face { background: var(--c-brand); border-color: var(--c-brand); color: var(--c-brand-ink); }
.chip input:checked + .chip__face .chip__tick { display: block; }
.chip input:focus-visible + .chip__face { outline: 3px solid var(--c-focus); outline-offset: 2px; }

.dropZone { position: relative; display: block; border: 2px dashed var(--c-input-line); border-radius: var(--r-md); background: var(--c-input-bg); cursor: pointer; }
.dropZone input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.dropZone__face { display: flex; align-items: center; justify-content: center; gap: .6rem; padding: 1.1rem; color: var(--c-ink-soft); font-weight: 600; }
.dropZone.is-over { border-color: var(--c-brand); }
.fileList { list-style: none; display: grid; gap: .35rem; font-size: .88rem; }
.fileList li { display: flex; gap: .75rem; align-items: center; }
.fileList__size { color: var(--c-ink-mute); }
.fileList__remove { margin-left: auto; padding: 0; border: 0; background: none; color: var(--c-link); font-weight: 700; font-size: .85rem; }
.fileList .is-oversize { color: var(--c-error); }

.quoteForm__foot { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.25rem; }
.quoteForm--compact .quoteForm__foot .btn { width: 100%; }
.quoteForm__alt { margin: 0; font-size: .9rem; color: var(--c-ink-soft); }
.quoteForm__spinner { display: none; width: 1rem; height: 1rem; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: ggSpin .6s linear infinite; }
.quoteForm.is-sending .quoteForm__spinner { display: inline-block; }
.quoteForm.is-sending button[type="submit"] { opacity: .75; pointer-events: none; }
@keyframes ggSpin { to { transform: rotate(360deg); } }
.quoteForm__status { margin: 0; font-weight: 700; }
.quoteForm__status:empty { display: none; }
.quoteForm__status.is-ok { padding: .85rem 1rem; background: var(--c-ok-bg); color: var(--c-ok-ink); border-radius: var(--r-sm); }
.quoteForm__status.is-error { color: var(--c-error); }


/* ---------- Contact page ----------------------------------- */

.contact__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: clamp(2rem, 5vw, 4rem); align-items: start; }
@media (max-width: 62rem) { .contact__grid { grid-template-columns: minmax(0, 1fr); } }
.contact__direct { display: grid; gap: 1.25rem; }
.contact__direct .block__title { margin-bottom: 0; }
.contact__note { margin: 0; color: var(--c-ink-soft); }
.contact__list { list-style: none; display: grid; gap: .65rem; }
.contact__list li { display: flex; gap: .6rem; align-items: flex-start; }
.contact__list .icon { color: var(--c-brand); flex: none; margin-top: .2rem; }
.contact__form { padding: clamp(1.25rem, 3vw, 2rem); background: var(--c-surface); border: var(--bw) solid var(--c-line); border-radius: var(--r-lg); }
.contact__intro { color: var(--c-ink-soft); }
.mapFrame { aspect-ratio: 4 / 3; border-radius: var(--r-md); overflow: hidden; border: var(--bw) solid var(--c-line); background: var(--c-bg-alt); }
.mapFrame iframe { width: 100%; height: 100%; border: 0; }


/* ---------- Reviews page, gallery -------------------------- */

.leaveReview { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem; padding: clamp(1.5rem, 3vw, 2.25rem); background: var(--c-surface); border: var(--bw) solid var(--c-line); border-radius: var(--r-lg); }
.leaveReview p { color: var(--c-ink-soft); margin-top: .5rem; }

.gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); gap: 1rem; }
.gallery__item { margin: 0; }
.gallery__item img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: var(--r-md); }
.gallery__item--pair { grid-column: span 2; }
@media (max-width: 38rem) { .gallery__item--pair { grid-column: auto; } }
.beforeAfter { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: .5rem; }
.beforeAfter__shot { position: relative; display: block; }
.beforeAfter__shot img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: var(--r-md); }
.jobPhoto--pair .beforeAfter__shot img { aspect-ratio: 4 / 5; }
.beforeAfter__tag { position: absolute; left: .6rem; top: .6rem; padding: .25rem .6rem; border-radius: 999px; font-size: .78rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; background: rgba(15, 18, 24, .78); color: #fff; }
.beforeAfter__tag--after { background: var(--c-brand); }
.gallery__item figcaption { margin-top: .5rem; font-size: .9rem; color: var(--c-ink-soft); }
.lightbox { max-width: min(92vw, 70rem); padding: 0; border: 0; background: transparent; }
.lightbox::backdrop { background: rgba(0, 0, 0, .85); }
.lightbox img { max-height: 85vh; width: auto; margin-inline: auto; border-radius: var(--r-md); }
.lightbox__close { position: absolute; top: .5rem; right: .5rem; display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border: 0; border-radius: 50%; background: rgba(0, 0, 0, .6); color: #fff; }


/* ---------- Footer ----------------------------------------- */

.siteFoot { background: var(--c-foot-bg); color: var(--c-foot-ink); font-size: .93rem; }
.siteFoot a { color: var(--c-foot-ink); text-decoration: none; }
.siteFoot a:hover { color: var(--c-brand-on-dark); text-decoration: underline; }
.siteFoot__call { background: var(--c-foot-call-bg); color: var(--c-foot-call-ink); }
.siteFoot__callInner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; padding-block: 1.25rem; }
.siteFoot__callLine { margin: 0; font-family: var(--f-display); font-weight: var(--fw-display); text-transform: var(--tt-display); letter-spacing: var(--ls-display); font-size: 1.25rem; }
.siteFoot__callLine span { color: var(--c-foot-call-soft); }
.siteFoot__call .btn, .siteFoot__call .btn:hover { color: var(--c-accent-ink); text-decoration: none; }
.siteFoot__grid { display: grid; grid-template-columns: 1.4fr repeat(4, 1fr); gap: 2rem; padding-block: clamp(2.5rem, 5vw, 3.5rem); }
@media (max-width: 70rem) { .siteFoot__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .siteFoot__brand { grid-column: 1 / -1; } }
@media (max-width: 34rem) { .siteFoot__grid { grid-template-columns: minmax(0, 1fr); } }
.siteFoot .brandMark__trade { color: var(--c-foot-soft); }
.siteFoot__blurb { margin-top: 1rem; color: var(--c-foot-soft); max-width: 22rem; }
.siteFoot__facts { list-style: none; display: grid; gap: .45rem; margin-top: 1rem; color: var(--c-foot-soft); }
.siteFoot__facts li { display: flex; gap: .5rem; align-items: flex-start; line-height: 1.35; }
.siteFoot__facts .icon { margin-top: .1rem; }
.siteFoot__licenses > span { display: grid; gap: .15rem; }
.siteFoot__facts .icon { color: var(--c-brand-on-dark); flex: none; }
.siteFoot__head { font-family: var(--f-eyebrow); font-size: var(--fs-eyebrow); font-weight: 700; letter-spacing: var(--ls-eyebrow); text-transform: uppercase; color: var(--c-foot-soft); margin-bottom: .9rem; }
.siteFoot__list { list-style: none; display: grid; gap: .6rem; }
.siteFoot__list a { display: block; line-height: 1.25; }
.siteFoot__list--towns { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 1rem; }
.siteFoot__base { border-top: 1px solid var(--c-foot-line); }
.siteFoot__baseInner { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .75rem; padding-block: 1.1rem; font-size: .84rem; color: var(--c-foot-soft); }
.siteFoot__baseInner p { margin: 0; display: flex; gap: 1.25rem; }
@media (max-width: 47.99rem) { .siteFoot { padding-bottom: 4.5rem; } }


/* ---------- Mobile call bar -------------------------------- */

.callbar { display: none; }
@media (max-width: 47.99rem) {
	.callbar {
		position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
		display: grid; grid-template-columns: 1.6fr 1fr 1fr;
		background: var(--c-dark-bg); border-top: 1px solid var(--c-dark-line);
		padding-bottom: env(safe-area-inset-bottom);
	}
	.callbar__btn { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .15rem; min-height: 3.75rem; color: var(--c-dark-ink); text-decoration: none; font-size: .78rem; font-weight: 700; }
	.callbar__btn--call { background: var(--c-accent); color: var(--c-accent-ink); font-size: .9rem; flex-direction: row; gap: .5rem; }
	.callbar__btn:hover { color: inherit; }
}


/* ---------- Look switcher (preview only) ------------------- */

.styleSwitch { position: fixed; left: 1rem; bottom: 1rem; z-index: 70; display: flex; align-items: center; gap: .25rem; padding: .3rem; background: #111; color: #fff; border-radius: 999px; box-shadow: 0 6px 24px rgba(0, 0, 0, .3); font: 600 .78rem/1 system-ui, sans-serif; }
.styleSwitch__label { padding: 0 .5rem; opacity: .6; }
.styleSwitch__link { padding: .45rem .75rem; border-radius: 999px; color: #fff; text-decoration: none; }
.styleSwitch__link.is-active { background: #fff; color: #111; }
@media (max-width: 47.99rem) { .styleSwitch { bottom: 4.75rem; } }



/* --- Self-hosted fonts --------------------------------------- */

/*	Latin subsets of the two variable fonts (SIL Open Font License),
	served from the theme. Bricolage carries weight 500-800 and the
	optical-size axis; Figtree 400-700 plus an italic. */
@font-face {
	font-family: "Bricolage Grotesque";
	font-style: normal;
	font-weight: 500 800;
	font-stretch: 100%;
	font-display: swap;
	src: url("../fonts/bricolage-grotesque-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: "Figtree";
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url("../fonts/figtree-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: "Figtree";
	font-style: italic;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/figtree-italic-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;
}

/* --- Pilot Light structural touches --------------------------- */

/*	The flame gradient runs through the H1 underline on gas pages. */
.pageHero--gas .pageHero__title { background: linear-gradient(90deg, #fff 55%, #a5f3fc); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero__title { background: linear-gradient(100deg, #ffffff 40%, #c7d2fe 75%, #a5f3fc); -webkit-background-clip: text; background-clip: text; color: transparent; }
.dispatch { border: 0; box-shadow: 0 0 0 1px rgba(255, 255, 255, .06), 0 30px 80px rgba(0, 0, 0, .45), 0 0 0 6px rgba(103, 232, 249, .08); }
.note__tag { color: var(--c-brand); }