/* ==========================================================================
   AC Repair Pro — Theme Stylesheet
   Design language: industrial dispatch / emergency service.
   Steel-blue base, alert-orange CTA, hazard-stripe accents,
   LED-style phone readouts. Built mobile-first.
   ========================================================================== */

:root {
	/* Color tokens */
	--acrp-ink:        #0D1B2A; /* deep steel-blue, near-black */
	--acrp-panel:      #16263A; /* panel / card background */
	--acrp-panel-2:    #1B2838; /* secondary panel */
	--acrp-steel:      #E8EDF2; /* cold steel-white text on dark */
	--acrp-steel-dim:  #A9B7C6; /* muted steel text */
	--acrp-orange:     #00C896; /* emerald green — primary CTA */
	--acrp-orange-dk:  #00A87E; /* pressed/hover state */
	--acrp-ice:        #3CB4E8; /* cold accent, AC services */
	--acrp-hazard:     #FFC107; /* warning-stripe yellow */
	--acrp-line:       rgba(232, 237, 242, 0.12);

	/* Type tokens */
	--acrp-font-display: 'Oswald', 'Arial Narrow', sans-serif;
	--acrp-font-body:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--acrp-font-mono:    'JetBrains Mono', 'Courier New', monospace;

	/* Layout tokens */
	--acrp-max-width: 1180px;
	--acrp-radius:    10px;
	--acrp-radius-lg: 18px;
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }

/* Offsets jump-to sections so the sticky dispatch bar doesn't cover
   the top of the section when the in-page nav scrolls to it. */
#services, #why-us, #how-it-works, #gallery, #reviews, #service-area, #faq {
	scroll-margin-top: 52px;
}
body {
	margin: 0;
	background: var(--acrp-ink);
	color: var(--acrp-steel);
	font-family: var(--acrp-font-body);
	font-size: 16px;
	line-height: 1.55;
	-webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; }
ul { margin: 0; padding: 0; list-style: none; }
a { color: inherit; text-decoration: none; }
h1, h2, h3 { margin: 0; font-family: var(--acrp-font-display); }
p { margin: 0; }
button { font-family: inherit; }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

:focus-visible {
	outline: 3px solid var(--acrp-hazard);
	outline-offset: 2px;
}

.acrp-section__inner {
	max-width: var(--acrp-max-width);
	margin: 0 auto;
	padding: 0 24px;
}

/* ---------- Signature element: sticky dispatch bar ---------- */
/* Background is intentionally the dark ink color, NOT the CTA accent.
   Modern iOS Safari (26+) no longer reads the <meta name="theme-color">
   tag — it colors the status bar / toolbar by sampling the actual
   background-color of whatever fixed/sticky element sits at the very
   top and bottom of the viewport. Since this bar is pinned to top:0,
   its background IS the iOS status bar color. Keeping it on the dark
   ink token (instead of the bright accent) keeps the status bar and
   bottom toolbar matching the rest of the dark UI. The accent color
   is still shown via the pulse dot and phone text so the bar doesn't
   lose its "live/online" brand feel. */
.acrp-dispatch-bar {
	background: var(--acrp-ink);
	color: var(--acrp-steel);
	font-family: var(--acrp-font-mono);
	font-weight: 700;
	position: sticky;
	top: 0;
	z-index: 100;
	border-bottom: 1px solid var(--acrp-line);
}
.acrp-dispatch-bar__phone { color: var(--acrp-orange); }
.acrp-dispatch-bar__inner {
	max-width: var(--acrp-max-width);
	margin: 0 auto;
	padding: 8px 20px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	font-size: 13px;
	letter-spacing: 0.02em;
}
.acrp-dispatch-bar__status {
	display: flex;
	align-items: center;
	gap: 8px;
	text-transform: uppercase;
}
.acrp-dispatch-bar__phone {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 14px;
	white-space: nowrap;
}
.acrp-dispatch-bar__phone svg { width: 14px; height: 14px; }

.acrp-pulse-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--acrp-orange);
	display: inline-block;
	position: relative;
	flex-shrink: 0;
}
.acrp-pulse-dot::after {
	content: '';
	position: absolute;
	inset: -3px;
	border-radius: 50%;
	border: 2px solid var(--acrp-orange);
	opacity: 0.6;
	animation: acrp-pulse 1.8s ease-out infinite;
}
@keyframes acrp-pulse {
	0%   { transform: scale(0.6); opacity: 0.7; }
	100% { transform: scale(1.8); opacity: 0; }
}

/* ---------- Header ---------- */
.acrp-site-header {
	background: var(--acrp-ink);
	border-bottom: 1px solid var(--acrp-line);
}
.acrp-site-header__inner {
	position: relative;
	max-width: var(--acrp-max-width);
	margin: 0 auto;
	padding: 16px 24px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
}
.acrp-logo { display: flex; align-items: center; }
.acrp-logo__text {
	font-family: var(--acrp-font-display);
	font-weight: 700;
	font-size: 22px;
	letter-spacing: 0.01em;
	color: var(--acrp-steel);
	text-transform: uppercase;
}
.acrp-primary-nav { display: none; }
.acrp-primary-nav__list {
	display: flex;
	gap: 28px;
}
.acrp-primary-nav__list a {
	font-weight: 600;
	font-size: 15px;
	color: var(--acrp-steel-dim);
	transition: color 0.15s ease;
}
.acrp-primary-nav__list a:hover { color: var(--acrp-steel); }

/* Mobile hamburger toggle — only shown below the desktop breakpoint */
.acrp-nav-toggle {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	width: 38px;
	height: 38px;
	padding: 0;
	border: none;
	background: transparent;
	cursor: pointer;
	flex-shrink: 0;
}
.acrp-nav-toggle span {
	display: block;
	width: 100%;
	height: 2px;
	background: var(--acrp-steel);
	border-radius: 2px;
	transition: transform 0.2s ease, opacity 0.2s ease;
}
.acrp-nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.acrp-nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.acrp-nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.acrp-header-cta {
	display: flex;
	align-items: center;
	gap: 8px;
	background: var(--acrp-orange);
	color: #fff;
	font-weight: 700;
	font-size: 14px;
	padding: 10px 18px;
	border-radius: 999px;
	white-space: nowrap;
	transition: background 0.15s ease, transform 0.15s ease;
}
.acrp-header-cta:hover { background: var(--acrp-orange-dk); transform: translateY(-1px); }
.acrp-header-cta svg { width: 16px; height: 16px; }

@media (max-width: 859px) {
	/* Mobile dropdown panel — hidden until toggled open */
	.acrp-primary-nav {
		display: block;
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		background: var(--acrp-ink);
		border-bottom: 1px solid var(--acrp-line);
		max-height: 0;
		overflow: hidden;
		transition: max-height 0.25s ease;
		z-index: 50;
	}
	.acrp-primary-nav.is-open { max-height: 420px; }
	.acrp-primary-nav__list {
		flex-direction: column;
		gap: 0;
		padding: 8px 24px 16px;
	}
	.acrp-primary-nav__list li {
		border-bottom: 1px solid var(--acrp-line);
	}
	.acrp-primary-nav__list li:last-child { border-bottom: none; }
	.acrp-primary-nav__list a {
		display: block;
		padding: 14px 4px;
	}
}

@media (min-width: 860px) {
	.acrp-primary-nav { display: block; }
	.acrp-nav-toggle { display: none; }
}

/* ---------- Hero (slider as a background layer, text overlaid on top) ---------- */
.acrp-hero {
	position: relative;
	overflow: hidden;
	min-height: 560px;
	display: flex;
	align-items: center;
	padding: 64px 0 56px;
	background: var(--acrp-ink); /* shows behind fallback illustrations / before slider paints */
}

/* Dark gradient over the slider photos so white/light text stays readable */
.acrp-hero__overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	--acrp-overlay-opacity: 0.75; /* fallback; actual value is set inline per the Customizer setting */
	background:
		linear-gradient(
			to top,
			rgba(13, 27, 42, calc(var(--acrp-overlay-opacity) * 1.25)) 0%,
			rgba(13, 27, 42, calc(var(--acrp-overlay-opacity) * 0.7)) 55%,
			rgba(13, 27, 42, var(--acrp-overlay-opacity)) 100%
		),
		radial-gradient(circle at 80% 0%, rgba(60, 180, 232, 0.18), transparent 55%);
	pointer-events: none;
}

.acrp-hero__inner {
	position: relative;
	z-index: 3;
	max-width: var(--acrp-max-width);
	margin: 0 auto;
	padding: 0 24px;
	text-align: center;
	width: 100%;
}

/* ---------- Text entrance animation ---------- */
@keyframes acrp-fade-up {
	from { opacity: 0; transform: translateY(18px); }
	to   { opacity: 1; transform: translateY(0); }
}
.acrp-anim {
	opacity: 0;
	animation: acrp-fade-up 0.7s ease forwards;
}
.acrp-anim--1 { animation-delay: 0.1s; }
.acrp-anim--2 { animation-delay: 0.25s; }
.acrp-anim--3 { animation-delay: 0.45s; }
.acrp-anim--4 { animation-delay: 0.65s; }
.acrp-anim--5 { animation-delay: 0.8s; }

@media (prefers-reduced-motion: reduce) {
	.acrp-anim { opacity: 1; animation: none; transform: none; }
}

.acrp-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--acrp-font-mono);
	font-weight: 700;
	font-size: 13px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--acrp-hazard);
	background: rgba(255, 193, 7, 0.08);
	border: 1px solid rgba(255, 193, 7, 0.35);
	border-radius: 999px;
	padding: 7px 16px;
	margin-bottom: 28px;
}
.acrp-eyebrow .acrp-pulse-dot { background: var(--acrp-hazard); }
.acrp-eyebrow .acrp-pulse-dot::after { border-color: var(--acrp-hazard); }

.acrp-hero__headline {
	font-size: var(--acrp-headline-size, clamp(28px, 7vw, 60px));
	font-weight: 700;
	line-height: 1.12;
	letter-spacing: -0.01em;
	color: var(--acrp-steel);
	text-transform: uppercase;
	margin-bottom: 24px;
	text-shadow: 0 2px 24px rgba(0, 0, 0, 0.45);
	text-wrap: balance;
}

/* On phones the 7vw/28px-floor sizing wraps the full "AC Broke in
   [cities]?" headline onto 3 lines. Tightening the size a bit and
   giving the line a little more width (less side padding) brings it
   back down to 2 lines, matching the desktop wrap. */
@media (max-width: 480px) {
	.acrp-hero__inner { padding-left: 6px; padding-right: 6px; }
	.acrp-hero__headline {
		font-size: clamp(20px, 5.2vw, 22px);
		letter-spacing: -0.015em;
	}
}
/* Extra-narrow legacy phones (iPhone SE 1st-gen / 320px Android) need a
   bit more shrinking to hold the line at 2. */
@media (max-width: 349px) {
	.acrp-hero__headline { font-size: 18px; }
}
.acrp-hero__cities {
	color: var(--acrp-ice);
}
.acrp-hero__promise {
	display: block;
	margin-top: 14px;
	font-size: var(--acrp-promise-size, clamp(20px, 5.4vw, 42px));
}
.acrp-hero__promise mark {
	background: none;
	color: var(--acrp-orange);
	font-family: var(--acrp-font-mono);
	padding: 0 4px;
}

/* Kept for backwards-compat if any other template still uses this class */
.acrp-hero__subhead {
	max-width: 640px;
	margin: 0 auto 36px;
	font-size: 17px;
	line-height: 1.7;
	color: var(--acrp-steel-dim);
	text-shadow: 0 2px 16px rgba(0, 0, 0, 0.5);
}
.acrp-hero__subhead strong {
	color: var(--acrp-steel);
	font-weight: 700;
}

/* ---------- Service tags layout (replaces bullet-string subheadline) ---------- */
.acrp-hero__services {
	margin-bottom: 32px;
	text-align: center;
}
.acrp-hero__services-row {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
	margin-bottom: 10px;
}
.acrp-hero__services-row span {
	font-size: var(--acrp-capsule-size, 15px);
	font-weight: 600;
	color: var(--acrp-capsule-text, #E8EDF2);
	background: var(--acrp-capsule-bg, rgba(232, 237, 242, 0.22));
	border: 1px solid var(--acrp-capsule-border, rgba(232, 237, 242, 0.45));
	border-radius: 999px;
	padding: 7px var(--acrp-capsule-pad, 16px);
	letter-spacing: 0.01em;
	text-shadow: 0 1px 8px rgba(0, 0, 0, 0.4);
	white-space: nowrap;
	transition: background 0.15s ease, border-color 0.15s ease;
}
.acrp-hero__services-all {
	font-style: italic;
	color: var(--acrp-orange) !important;
	border-color: var(--acrp-cta-ring, rgba(0,200,150,0.4)) !important;
	background: var(--acrp-cta-tint-10, rgba(0,200,150,0.1)) !important;
}
.acrp-hero__services-cta {
	margin-top: 14px;
	font-size: 16px;
	font-weight: 700;
	color: var(--acrp-steel);
	letter-spacing: 0.01em;
	text-shadow: 0 1px 8px rgba(0, 0, 0, 0.5);
}

@media (max-width: 540px) {
	.acrp-hero__services-row span { font-size: max(13px, calc(var(--acrp-capsule-size, 15px) - 2px)); padding: 6px 13px; }
}


.acrp-hero__note {
	margin-top: 18px;
	font-size: 13px;
	color: var(--acrp-steel-dim);
	letter-spacing: 0.01em;
}

/* ---------- CTA button (big, red/orange, as specified) ---------- */
.acrp-cta-btn {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	background: var(--acrp-orange);
	color: #fff;
	font-family: var(--acrp-font-mono);
	font-weight: 700;
	font-size: 19px;
	letter-spacing: 0.02em;
	padding: 20px 38px;
	border-radius: var(--acrp-radius);
	box-shadow: var(--acrp-cta-shadow-1, 0 14px 32px -10px rgba(0,200,150,0.45));
	transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
	position: relative;
}
.acrp-cta-btn::before {
	content: '';
	position: absolute;
	inset: -4px;
	border: 2px solid var(--acrp-cta-ring, rgba(0,200,150,0.35));
	border-radius: calc(var(--acrp-radius) + 4px);
	animation: acrp-cta-ring 2.2s ease-out infinite;
}
@keyframes acrp-cta-ring {
	0%   { opacity: 0.8; transform: scale(1); }
	100% { opacity: 0; transform: scale(1.07); }
}
.acrp-cta-btn svg { width: 22px; height: 22px; flex-shrink: 0; }
.acrp-cta-btn:hover {
	background: var(--acrp-orange-dk);
	transform: translateY(-2px);
	box-shadow: var(--acrp-cta-shadow-2, 0 18px 36px -10px rgba(0,200,150,0.55));
}
.acrp-cta-btn--lg {
	font-size: 22px;
	padding: 24px 44px;
}

@media (max-width: 480px) {
	.acrp-cta-btn { font-size: 16px; padding: 18px 24px; width: 100%; justify-content: center; }
	.acrp-cta-btn--lg { font-size: 18px; }
}

/* ---------- Section heading shared styles ---------- */
.acrp-section__heading {
	font-size: clamp(26px, 4vw, 36px);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: -0.005em;
	color: var(--acrp-steel);
	text-align: center;
	margin-bottom: 10px;
}
.acrp-section__subheading {
	text-align: center;
	color: var(--acrp-steel-dim);
	font-size: 16px;
	max-width: 480px;
	margin: 0 auto 40px;
}

/* ---------- Services grid ---------- */
.acrp-services {
	padding: 72px 0;
	background: var(--acrp-panel);
	border-top: 1px solid var(--acrp-line);
	border-bottom: 1px solid var(--acrp-line);
}
.acrp-services__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 16px;
}
.acrp-service-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 14px;
	text-align: center;
	background: var(--acrp-panel-2);
	border: 1px solid var(--acrp-line);
	border-radius: var(--acrp-radius-lg);
	padding: 28px 14px;
	transition: border-color 0.15s ease, transform 0.15s ease;
}
.acrp-service-card:hover {
	border-color: var(--acrp-ice);
	transform: translateY(-3px);
}
/* Gauge-like circular badge — echoes a dial/gauge on HVAC equipment */
.acrp-service-card__badge {
	width: 58px;
	height: 58px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: radial-gradient(circle at 35% 30%, rgba(60, 180, 232, 0.25), rgba(60, 180, 232, 0.06));
	border: 2px solid rgba(60, 180, 232, 0.4);
	color: var(--acrp-ice);
}
.acrp-service-card__badge svg { width: 26px; height: 26px; }
.acrp-service-card__label {
	font-weight: 600;
	font-size: 14.5px;
	color: var(--acrp-steel);
}

@media (min-width: 640px) {
	.acrp-services__grid { grid-template-columns: repeat(4, 1fr); }
}

/* ---------- Review ---------- */
.acrp-review { padding: 72px 0; }
.acrp-review__inner {
	max-width: 680px;
	text-align: center;
}
.acrp-review__stars {
	display: flex;
	justify-content: center;
	gap: 4px;
	color: var(--acrp-hazard);
	margin-bottom: 22px;
}
.acrp-review__stars svg { width: 20px; height: 20px; }
.acrp-review__quote {
	margin: 0 0 18px;
	font-family: var(--acrp-font-display);
	font-size: clamp(20px, 3.4vw, 28px);
	font-weight: 500;
	line-height: 1.4;
	color: var(--acrp-steel);
}
.acrp-review__author {
	font-size: 14px;
	color: var(--acrp-steel-dim);
	font-style: normal;
}

/* ---------- Service area ---------- */
.acrp-area {
	padding: 64px 0;
	background: var(--acrp-panel);
	border-top: 1px solid var(--acrp-line);
	border-bottom: 1px solid var(--acrp-line);
	text-align: center;
}
.acrp-area__icon {
	display: inline-flex;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	align-items: center;
	justify-content: center;
	background: var(--acrp-cta-tint-12, rgba(0,200,150,0.12));
	color: var(--acrp-orange);
	margin-bottom: 18px;
}
.acrp-area__icon svg { width: 26px; height: 26px; }
.acrp-area__text {
	font-size: 16px;
	color: var(--acrp-steel-dim);
	line-height: 1.6;
	text-align: center;
	max-width: 640px;
	margin: 0 auto;
}

/* ---------- Final CTA ---------- */
.acrp-final-cta { padding: 80px 0 96px; text-align: center; }
.acrp-final-cta__icon {
	display: inline-flex;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	align-items: center;
	justify-content: center;
	background: rgba(60, 180, 232, 0.12);
	color: var(--acrp-ice);
	margin-bottom: 20px;
}
.acrp-final-cta__icon svg { width: 28px; height: 28px; }
.acrp-final-cta__heading {
	font-size: clamp(22px, 3.6vw, 32px);
	font-weight: 600;
	color: var(--acrp-steel);
	max-width: 560px;
	margin: 0 auto 32px;
	text-transform: none;
}

/* ---------- Footer ---------- */
.acrp-site-footer {
	background: var(--acrp-ink);
	padding: 56px 0 110px; /* extra bottom padding clears the mobile call bar */
}
.acrp-footer-top {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 28px;
	padding: 0 20px 32px;
	border-bottom: 1px solid var(--acrp-line);
}
.acrp-footer-brand {
	max-width: 480px;
}
.acrp-footer-tagline {
	margin-top: 8px;
	padding: 0 12px;
	color: var(--acrp-steel-dim);
	font-size: 14.5px;
}
.acrp-footer-contact {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
}
.acrp-footer-phone {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--acrp-font-mono);
	font-weight: 700;
	font-size: 18px;
	color: var(--acrp-orange);
}
.acrp-footer-phone svg { width: 16px; height: 16px; }
.acrp-footer-area {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	color: var(--acrp-steel-dim);
	font-size: 14px;
	max-width: 360px;
	text-align: left;
}
.acrp-footer-area svg { width: 16px; height: 16px; flex-shrink: 0; margin-top: 2px; }

.acrp-footer-widget-title {
	font-family: var(--acrp-font-body);
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--acrp-steel-dim);
	margin-bottom: 12px;
}

.acrp-footer-nav__list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 20px;
	padding: 24px 20px;
}
.acrp-footer-nav__list a {
	font-size: 14px;
	color: var(--acrp-steel-dim);
}
.acrp-footer-nav__list a:hover { color: var(--acrp-steel); }

.acrp-footer-bottom {
	padding: 16px 20px 0;
	font-size: 13px;
	color: var(--acrp-steel-dim);
	text-align: center;
}

@media (min-width: 760px) {
	.acrp-footer-top { flex-direction: row; justify-content: center; gap: 56px; }
}

/* Sticky mobile call bar — always-visible CTA on small screens */
/* Background is the dark ink token rather than the CTA accent — this
   element is pinned to bottom:0, and modern iOS Safari (26+) samples
   a fixed element's background-color to tint the bottom toolbar/
   address bar. Ink keeps the toolbar matching the rest of the dark
   UI instead of turning solid green. The accent color is kept as a
   top border stripe + text/icon color so the CTA still reads as a
   "call to action" and not just another dark bar. */
.acrp-mobile-call-bar {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 90;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	background: var(--acrp-ink);
	color: var(--acrp-orange);
	font-family: var(--acrp-font-mono);
	font-weight: 700;
	font-size: 15px;
	padding: 16px 20px;
	padding-bottom: calc(16px + env(safe-area-inset-bottom));
	border-top: 3px solid var(--acrp-orange);
	box-shadow: 0 -6px 20px rgba(0,0,0,0.3);
}
.acrp-mobile-call-bar svg { width: 18px; height: 18px; }

@media (min-width: 860px) {
	.acrp-mobile-call-bar { display: none; }
	.acrp-site-footer { padding-bottom: 56px; }
}

/* ---------- Generic content pages (blog, page.php) ---------- */
.acrp-main--content { padding: 56px 0 80px; }
.acrp-page-title, .acrp-archive-title {
	font-size: clamp(28px, 4.4vw, 40px);
	color: var(--acrp-steel);
	margin-bottom: 24px;
	text-transform: uppercase;
}
.acrp-page-thumb { margin-bottom: 28px; border-radius: var(--acrp-radius-lg); overflow: hidden; }
.acrp-page-body, .acrp-post-card__excerpt {
	color: var(--acrp-steel-dim);
	font-size: 16px;
	line-height: 1.75;
}
.acrp-page-body a, .acrp-post-card__excerpt a { color: var(--acrp-ice); text-decoration: underline; }
.acrp-post-meta { color: var(--acrp-steel-dim); font-size: 14px; margin-bottom: 24px; }

.acrp-post-list { display: grid; gap: 28px; }
.acrp-post-card { border-bottom: 1px solid var(--acrp-line); padding-bottom: 28px; }
.acrp-post-card__thumb { display: block; border-radius: var(--acrp-radius); overflow: hidden; margin-bottom: 16px; }
.acrp-post-card__title { font-size: 22px; margin-bottom: 10px; text-transform: none; }
.acrp-post-card__title a:hover { color: var(--acrp-ice); }

.acrp-pagination { margin-top: 40px; display: flex; justify-content: center; gap: 8px; }
.acrp-pagination a, .acrp-pagination span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 38px;
	height: 38px;
	border-radius: 8px;
	border: 1px solid var(--acrp-line);
	color: var(--acrp-steel-dim);
	font-size: 14px;
}
.acrp-pagination .current { background: var(--acrp-orange); color: #fff; border-color: var(--acrp-orange); }

/* ==========================================================================
   CONTENT EXPANSION — images, stats, why-choose-us, process, gallery,
   brands strip, review grid, area grid, FAQ
   ========================================================================== */

/* ---------- Generic image figure + illustrated fallback ---------- */
.acrp-image {
	margin: 0;
	border-radius: var(--acrp-radius-lg);
	overflow: hidden;
	border: 1px solid var(--acrp-line);
	background: var(--acrp-panel-2);
}
.acrp-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.acrp-image__fallback {
	display: block;
	width: 100%;
	line-height: 0;
}
.acrp-image__fallback svg {
	width: 100%;
	height: auto;
	display: block;
}
.acrp-image--hero { aspect-ratio: 4 / 3; }
.acrp-image--why { aspect-ratio: 4 / 3; }

/* ---------- Hero copy (single column, slider sits below it) ---------- */
.acrp-hero__copy {
	max-width: 760px;
	margin: 0 auto;
	text-align: center;
}

/* ---------- Trust stats bar ---------- */
.acrp-stats {
	background: var(--acrp-panel-2);
	border-bottom: 1px solid var(--acrp-line);
	padding: 36px 0;
}
.acrp-stats__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 24px;
	text-align: center;
}
.acrp-stat__value {
	display: block;
	font-family: var(--acrp-font-mono);
	font-weight: 700;
	font-size: clamp(22px, 4vw, 30px);
	color: var(--acrp-orange);
}
.acrp-stat__label {
	display: block;
	margin-top: 4px;
	font-size: 13px;
	color: var(--acrp-steel-dim);
	letter-spacing: 0.02em;
	text-transform: uppercase;
}
@media (min-width: 640px) {
	.acrp-stats__grid { grid-template-columns: repeat(4, 1fr); }
}

/* ---------- Section heading variant (left-aligned, for split layouts) ---------- */
.acrp-section__heading--left { text-align: left; margin-bottom: 16px; }

/* ---------- Why Choose Us ---------- */
.acrp-why { padding: 80px 0; }
.acrp-why__grid {
	display: grid;
	gap: 40px;
}
.acrp-why__media { order: -1; }
.acrp-why__lede {
	color: var(--acrp-steel-dim);
	font-size: 16.5px;
	line-height: 1.7;
	margin-bottom: 32px;
}
.acrp-why__list {
	display: grid;
	gap: 24px;
}
.acrp-why__list li {
	display: flex;
	gap: 16px;
	align-items: flex-start;
}
.acrp-why__list-icon {
	flex-shrink: 0;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(60, 180, 232, 0.1);
	color: var(--acrp-ice);
}
.acrp-why__list-icon svg { width: 20px; height: 20px; }
.acrp-why__list h3 {
	font-family: var(--acrp-font-body);
	font-size: 16.5px;
	font-weight: 700;
	color: var(--acrp-steel);
	margin-bottom: 4px;
	text-transform: none;
}
.acrp-why__list p {
	font-size: 14.5px;
	color: var(--acrp-steel-dim);
	line-height: 1.6;
}

@media (min-width: 860px) {
	.acrp-why__grid { grid-template-columns: 0.85fr 1.15fr; align-items: center; }
	.acrp-why__media { order: 0; }
}

/* ---------- How It Works ---------- */
.acrp-process { padding: 80px 0; background: var(--acrp-panel); border-top: 1px solid var(--acrp-line); border-bottom: 1px solid var(--acrp-line); }
.acrp-process__list {
	display: grid;
	gap: 24px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.acrp-process__step {
	position: relative;
	background: var(--acrp-panel-2);
	border: 1px solid var(--acrp-line);
	border-radius: var(--acrp-radius-lg);
	padding: 32px 26px;
}
.acrp-process__number {
	display: block;
	font-family: var(--acrp-font-mono);
	font-weight: 700;
	font-size: 13px;
	color: var(--acrp-orange);
	letter-spacing: 0.05em;
	margin-bottom: 16px;
}
.acrp-process__icon {
	display: flex;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	align-items: center;
	justify-content: center;
	background: var(--acrp-cta-tint-10, rgba(0,200,150,0.10));
	color: var(--acrp-orange);
	margin: 0 auto 18px; /* horizontally centers just the icon within the card */
}
.acrp-process__icon svg { width: 22px; height: 22px; }
.acrp-process__title {
	font-size: 19px;
	color: var(--acrp-steel);
	margin-bottom: 10px;
	text-transform: none;
}
.acrp-process__text {
	font-size: 14.5px;
	color: var(--acrp-steel-dim);
	line-height: 1.65;
}
@media (min-width: 760px) {
	.acrp-process__list { grid-template-columns: repeat(3, 1fr); }
}

/* ---------- Work gallery ---------- */
.acrp-gallery { padding: 80px 0; }
.acrp-gallery__grid {
	display: grid;
	gap: 16px;
}
.acrp-gallery__grid .acrp-image { aspect-ratio: 4 / 3; }
@media (min-width: 700px) {
	.acrp-gallery__grid { grid-template-columns: repeat(3, 1fr); }
}

/* ---------- Brands strip ---------- */
.acrp-brands {
	padding: 36px 0;
	background: var(--acrp-panel-2);
	border-top: 1px solid var(--acrp-line);
	border-bottom: 1px solid var(--acrp-line);
}
.acrp-brands__label {
	text-align: center;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--acrp-steel-dim);
	margin-bottom: 18px;
}
.acrp-brands__list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 14px 28px;
}
.acrp-brands__list li {
	font-family: var(--acrp-font-display);
	font-weight: 600;
	font-size: 15px;
	letter-spacing: 0.02em;
	color: var(--acrp-steel-dim);
	text-transform: uppercase;
	opacity: 0.85;
}

/* ---------- Review cards grid (3 reviews) ---------- */
.acrp-reviews { padding: 80px 0; }
.acrp-reviews__grid {
	display: grid;
	gap: 20px;
}
.acrp-review-card {
	background: var(--acrp-panel-2);
	border: 1px solid var(--acrp-line);
	border-radius: var(--acrp-radius-lg);
	padding: 30px 26px;
	display: flex;
	flex-direction: column;
}
.acrp-review-card__stars {
	display: flex;
	gap: 3px;
	color: var(--acrp-hazard);
	margin-bottom: 16px;
}
.acrp-review-card__stars svg { width: 16px; height: 16px; }
.acrp-review-card__quote {
	margin: 0 0 16px;
	font-size: 15.5px;
	line-height: 1.6;
	color: var(--acrp-steel);
	flex-grow: 1;
}
.acrp-review-card__author {
	font-size: 13.5px;
	color: var(--acrp-steel-dim);
	font-style: normal;
}
@media (min-width: 760px) {
	.acrp-reviews__grid { grid-template-columns: repeat(3, 1fr); }
}

/* ---------- Service area — expanded with borough/neighborhood grid ---------- */
.acrp-area__grid {
	display: grid;
	gap: 18px;
	max-width: 720px;
	margin: 36px auto 20px;
	text-align: left;
}
.acrp-area__borough {
	background: var(--acrp-panel-2);
	border: 1px solid var(--acrp-line);
	border-radius: var(--acrp-radius);
	padding: 18px 20px;
}
.acrp-area__borough h3 {
	font-size: 15px;
	color: var(--acrp-ice);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin-bottom: 6px;
}
.acrp-area__borough p {
	font-size: 14px;
	color: var(--acrp-steel-dim);
	line-height: 1.6;
}
.acrp-area__note {
	font-size: 14px;
	color: var(--acrp-steel-dim);
	font-style: italic;
	margin-top: 8px;
	text-align: center;
}
@media (min-width: 640px) {
	.acrp-area__grid { grid-template-columns: repeat(2, 1fr); }
}

/* ---------- FAQ accordion ---------- */
.acrp-faq { padding: 80px 0 96px; }
.acrp-faq__list {
	max-width: 760px;
	margin: 0 auto;
	display: grid;
	gap: 12px;
}
.acrp-faq__item {
	background: var(--acrp-panel-2);
	border: 1px solid var(--acrp-line);
	border-radius: var(--acrp-radius);
	padding: 6px 22px;
}
.acrp-faq__question {
	cursor: pointer;
	list-style: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 16px 0;
	font-weight: 600;
	font-size: 15.5px;
	color: var(--acrp-steel);
}
.acrp-faq__question::-webkit-details-marker { display: none; }
.acrp-faq__toggle {
	flex-shrink: 0;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--acrp-cta-tint-12, rgba(0,200,150,0.12));
	color: var(--acrp-orange);
	font-size: 16px;
	font-weight: 700;
	transition: transform 0.2s ease;
}
.acrp-faq__item[open] .acrp-faq__toggle { transform: rotate(45deg); }
.acrp-faq__answer {
	padding: 0 0 18px;
	font-size: 14.5px;
	line-height: 1.65;
	color: var(--acrp-steel-dim);
}

/* ---------- Image slider — full-bleed background layer behind hero text ---------- */
.acrp-slider {
	position: absolute;
	inset: 0;
	z-index: 0;
}
.acrp-slider__viewport {
	width: 100%;
	height: 100%;
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	-ms-overflow-style: none;
	scrollbar-width: none;
}
.acrp-slider__viewport::-webkit-scrollbar { display: none; }
.acrp-slider__track {
	display: flex;
	height: 100%;
}
.acrp-slider__slide {
	position: relative;
	flex: 0 0 100%;
	scroll-snap-align: start;
	height: 100%;
	background: var(--acrp-panel-2);
	overflow: hidden;
}
.acrp-slider__slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.acrp-slider__fallback {
	display: block;
	width: 100%;
	height: 100%;
}
.acrp-slider__fallback svg {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.acrp-slider__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 42px;
	height: 42px;
	border-radius: 50%;
	border: none;
	background: rgba(13, 27, 42, 0.55);
	color: var(--acrp-steel);
	font-size: 24px;
	line-height: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: background 0.15s ease;
	z-index: 4;
}
.acrp-slider__arrow:hover { background: var(--acrp-orange); }
.acrp-slider__arrow--prev { left: 20px; }
.acrp-slider__arrow--next { right: 20px; }

.acrp-slider__dots {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 18px;
	z-index: 4;
	display: flex;
	justify-content: center;
	gap: 8px;
}
.acrp-slider__dot {
	width: 9px;
	height: 9px;
	border-radius: 50%;
	border: none;
	background: rgba(232, 237, 242, 0.4);
	cursor: pointer;
	padding: 0;
	transition: background 0.15s ease, transform 0.15s ease;
}
.acrp-slider__dot.is-active {
	background: var(--acrp-orange);
	transform: scale(1.2);
}

@media (max-width: 600px) {
	.acrp-hero { min-height: 620px; }
	.acrp-slider__arrow { width: 36px; height: 36px; font-size: 20px; }
}

/* ==========================================================================
   SUB-PAGE TEMPLATES — Services page, Contact page, Privacy Policy page
   ========================================================================== */

.acrp-page-hero {
	padding: 64px 0 48px;
	text-align: center;
	background: var(--acrp-ink);
	border-bottom: 1px solid var(--acrp-line);
}
.acrp-page-hero .acrp-page-title { margin-bottom: 16px; }
.acrp-page-hero--compact { padding: 48px 0 32px; }
.acrp-page-body--intro {
	max-width: 640px;
	margin: 0 auto 32px;
	color: var(--acrp-steel-dim);
}
.acrp-section__subheading--wide {
	max-width: 640px;
	margin: 0 auto 32px;
}

/* ---------- Privacy Policy / legal page ---------- */
.acrp-legal { padding: 56px 0 88px; }
.acrp-legal__inner { max-width: 720px; }
.acrp-legal__body {
	font-size: 15.5px;
}
.acrp-legal__body p { margin-bottom: 18px; }
.acrp-legal__body h2 {
	font-family: var(--acrp-font-body);
	font-size: 20px;
	font-weight: 700;
	color: var(--acrp-steel);
	text-transform: none;
	margin: 32px 0 12px;
}
.acrp-legal__body ul,
.acrp-legal__body ol {
	margin: 0 0 18px;
	padding-left: 22px;
	color: var(--acrp-steel-dim);
}
.acrp-legal__body li { margin-bottom: 8px; }

/* ---------- Services detail grid ---------- */
.acrp-services-detail { padding: 72px 0 88px; }
.acrp-services-detail__grid {
	display: grid;
	gap: 20px;
}
.acrp-service-detail-card {
	background: var(--acrp-panel-2);
	border: 1px solid var(--acrp-line);
	border-radius: var(--acrp-radius-lg);
	padding: 32px 28px;
}
.acrp-service-detail-card__badge {
	display: inline-flex;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	align-items: center;
	justify-content: center;
	background: radial-gradient(circle at 35% 30%, rgba(60, 180, 232, 0.25), rgba(60, 180, 232, 0.06));
	border: 2px solid rgba(60, 180, 232, 0.4);
	color: var(--acrp-ice);
	margin-bottom: 18px;
}
.acrp-service-detail-card__badge svg { width: 24px; height: 24px; }
.acrp-service-detail-card h2 {
	font-size: 19px;
	color: var(--acrp-steel);
	text-transform: none;
	margin-bottom: 10px;
}
.acrp-service-detail-card p {
	font-size: 14.5px;
	color: var(--acrp-steel-dim);
	line-height: 1.65;
}
@media (min-width: 700px) {
	.acrp-services-detail__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
	.acrp-services-detail__grid { grid-template-columns: repeat(3, 1fr); }
}

/* ---------- Contact page ---------- */
.acrp-contact { padding: 72px 0 96px; }
.acrp-contact__grid {
	display: grid;
	gap: 48px;
}
.acrp-contact__form {
	display: grid;
	gap: 6px;
	margin-top: 8px;
}
.acrp-contact__form label {
	font-size: 13px;
	font-weight: 600;
	color: var(--acrp-steel-dim);
	text-transform: uppercase;
	letter-spacing: 0.03em;
	margin-top: 14px;
}
.acrp-contact__form input,
.acrp-contact__form textarea {
	background: var(--acrp-panel-2);
	border: 1px solid var(--acrp-line);
	border-radius: var(--acrp-radius);
	padding: 12px 14px;
	color: var(--acrp-steel);
	font-family: var(--acrp-font-body);
	font-size: 15px;
	resize: vertical;
}
.acrp-contact__form input:focus,
.acrp-contact__form textarea:focus {
	outline: none;
	border-color: var(--acrp-ice);
}
.acrp-contact__submit {
	margin-top: 18px;
	justify-self: start;
	font-size: 16px;
	padding: 14px 30px;
}
.acrp-contact__submit::before { display: none; } /* no pulsing ring on form button */

.acrp-contact__notice {
	padding: 14px 16px;
	border-radius: var(--acrp-radius);
	font-size: 14px;
	margin-bottom: 16px;
}
.acrp-contact__notice--success {
	background: rgba(60, 180, 232, 0.1);
	border: 1px solid rgba(60, 180, 232, 0.35);
	color: var(--acrp-ice);
}
.acrp-contact__notice--error {
	background: var(--acrp-cta-tint-10, rgba(0,200,150,0.10));
	border: 1px solid var(--acrp-cta-ring, rgba(0,200,150,0.35));
	color: var(--acrp-orange);
}

.acrp-contact__info-list {
	display: grid;
	gap: 24px;
	margin-top: 16px;
}
.acrp-contact__info-list li {
	display: flex;
	gap: 16px;
	align-items: flex-start;
}
.acrp-contact__info-list h3 {
	font-family: var(--acrp-font-body);
	font-size: 15.5px;
	font-weight: 700;
	color: var(--acrp-steel);
	margin-bottom: 4px;
	text-transform: none;
}
.acrp-contact__info-list p,
.acrp-contact__info-list a {
	font-size: 14.5px;
	color: var(--acrp-steel-dim);
}
.acrp-contact__info-list a:hover { color: var(--acrp-ice); }

@media (min-width: 860px) {
	.acrp-contact__grid { grid-template-columns: 1.2fr 0.8fr; }
}