/*
 * Painters In NC conversion redesign.
 *
 * This layer styles the existing WordPress markup. It intentionally does not
 * replace page content, metadata, headings, schema, forms, or link targets.
 */

:root {
	--brand-blue: #38b6ff;
	--brand-blue-light: #72caff;
	--action-green: #7cda24;
	--action-green-dark: #61ad19;
	--teal: #25e4a2;
	--ink: #071c2d;
	--ink-2: #0a263b;
	--ink-3: #0e314a;
	--body: #102330;
	--muted: #60727d;
	--surface: #eef3f3;
	--border: #d7e0e3;
	--white: #fff;
	--font-head: "Barlow Condensed", system-ui, sans-serif;
	--font-body: "DM Sans", system-ui, sans-serif;
	--radius: 10px;
	--radius-sm: 5px;
	--shadow-sm: 0 5px 16px rgba(0, 12, 20, 0.08);
	--shadow-md: 0 14px 34px rgba(0, 12, 20, 0.14);
	--shadow-lg: 0 20px 48px rgba(0, 12, 20, 0.25);
	--header-h: 88px;
	--maxw: 1180px;
}

body {
	color: var(--body);
	font-family: var(--font-body);
	background: var(--white);
}

h1,
h2,
h3,
h4,
.btn,
.nav-menu,
.header-phone,
.estimate-form__heading,
.service-card__title,
.stat__num {
	font-family: var(--font-head);
}

h1,
h2,
h3 {
	letter-spacing: -0.015em;
}

h1 {
	font-size: clamp(3.15rem, 6vw, 5.3rem);
	font-weight: 900;
	line-height: 0.92;
	text-transform: uppercase;
}

h2 {
	font-size: clamp(2.45rem, 4.5vw, 3.8rem);
	font-weight: 900;
	line-height: 0.96;
	text-transform: uppercase;
}

h3 {
	font-size: clamp(1.35rem, 2vw, 1.75rem);
	font-weight: 800;
	line-height: 1;
	text-transform: uppercase;
}

.container {
	max-width: var(--maxw);
	padding-inline: 20px;
}

.section {
	padding-block: clamp(64px, 7vw, 92px);
}

.section-head {
	max-width: 800px;
}

.section-head::before {
	display: inline-block;
	width: 34px;
	height: 3px;
	margin-bottom: 15px;
	background: linear-gradient(90deg, var(--action-green), var(--brand-blue));
	content: "";
}

.section-head__sub {
	max-width: 710px;
	margin-inline: auto;
	font-size: 1.06rem;
	line-height: 1.65;
}

/* Utility bar and navigation */
.site-utility {
	position: relative;
	z-index: 103;
	min-height: 37px;
	color: #0b2311;
	background: linear-gradient(90deg, #62bb15, #91e044 55%, #6bc41a);
	font: 800 0.81rem/1 var(--font-head);
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.site-utility__inner {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 37px;
	padding-inline: 0;
}

.site-utility__inner > * {
	padding: 0 26px;
	color: inherit;
	border-right: 1px solid rgba(7, 28, 45, 0.28);
}

.site-utility__inner > :last-child {
	border-right: 0;
}

.site-utility a:hover {
	color: var(--ink);
	text-decoration: underline;
}

.site-header {
	position: sticky;
	top: 0;
	z-index: 102;
	color: var(--white);
	background: rgba(4, 22, 36, 0.985);
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.site-header.is-stuck {
	box-shadow: 0 12px 28px rgba(0, 12, 20, 0.28);
}

.site-header__inner {
	min-height: 88px;
}

.site-logo img {
	width: clamp(172px, 19vw, 225px);
}

.site-nav {
	gap: 18px;
}

.nav-menu {
	gap: 4px;
	font-size: 0.98rem;
	font-weight: 700;
	letter-spacing: 0.035em;
	text-transform: uppercase;
}

.nav-menu a {
	position: relative;
	padding: 12px 10px;
	color: var(--white);
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	border-radius: 0;
}

.nav-menu a::after {
	position: absolute;
	right: 10px;
	bottom: 5px;
	left: 10px;
	height: 2px;
	background: var(--action-green);
	content: "";
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.2s ease;
}

.nav-menu a:hover,
.nav-menu .current-menu-item > a {
	color: var(--white);
	background: transparent;
}

.nav-menu a:hover::after,
.nav-menu .current-menu-item > a::after,
.nav-menu a:focus-visible::after {
	transform: scaleX(1);
}

.header-phone {
	color: var(--white);
	font-size: 1.45rem;
	font-weight: 800;
	line-height: 0.95;
}

.header-phone small {
	display: block;
	margin-bottom: 4px;
	color: #b9c8d1;
	font-size: 0.66rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-align: right;
	text-transform: uppercase;
}

.header-phone .icon {
	color: var(--action-green);
}

.header-phone:hover {
	color: var(--action-green);
}

.nav-toggle__bar {
	background: var(--white);
}

/* Buttons */
.btn {
	min-height: 48px;
	padding: 13px 23px;
	font-size: 1rem;
	font-weight: 800;
	letter-spacing: 0.035em;
	text-transform: uppercase;
	border-radius: 4px;
}

.btn--cta {
	color: #0c2810;
	background: linear-gradient(135deg, #90e340, var(--action-green));
	box-shadow: 0 9px 22px rgba(124, 218, 36, 0.22);
}

.btn--cta:hover {
	color: #0c2810;
	background: linear-gradient(135deg, #9bea4c, #86e22c);
}

.btn--outline {
	border-color: rgba(255, 255, 255, 0.48);
	border-radius: 4px;
}

/* Breadcrumbs */
.breadcrumbs {
	padding: 12px 0;
	color: #b8c8d1;
	background: #061827;
	border: 0;
	border-top: 1px solid rgba(255, 255, 255, 0.05);
	font-size: 0.78rem;
}

.breadcrumbs a {
	color: var(--brand-blue);
}

/* Existing hero content in the approved two-column composition */
.hero {
	position: relative;
	isolation: isolate;
	min-height: 650px;
	color: var(--white);
	background-color: var(--ink);
	background-position: center 48%;
	overflow: visible;
}

.hero::after {
	position: absolute;
	z-index: -1;
	inset: 0;
	opacity: 0.12;
	background-image:
		linear-gradient(rgba(255, 255, 255, 0.13) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, 0.13) 1px, transparent 1px);
	background-size: 50px 50px;
	content: "";
	mask-image: linear-gradient(90deg, #000, transparent 66%);
}

.hero__overlay {
	background:
		linear-gradient(90deg, rgba(3, 21, 35, 0.97) 0%, rgba(3, 21, 35, 0.91) 44%, rgba(3, 21, 35, 0.62) 78%, rgba(3, 21, 35, 0.78) 100%),
		linear-gradient(0deg, rgba(3, 21, 35, 0.72), rgba(3, 21, 35, 0.08));
}

.hero__inner {
	min-height: 650px;
	padding-block: clamp(54px, 7vw, 84px);
}

.hero__inner.pinc-v2-hero-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.17fr) minmax(330px, 0.83fr);
	gap: clamp(32px, 5vw, 56px);
	align-items: center;
}

.hero__content {
	max-width: 740px;
}

.hero__eyebrow {
	padding: 0;
	color: var(--action-green);
	background: transparent;
	border: 0;
	border-radius: 0;
	font: 800 0.9rem/1 var(--font-head);
	letter-spacing: 0.075em;
}

.hero__eyebrow::before {
	display: inline-block;
	width: 30px;
	height: 3px;
	margin-right: 10px;
	vertical-align: middle;
	background: linear-gradient(90deg, var(--action-green), var(--brand-blue));
	content: "";
}

.hero__title {
	max-width: 760px;
	margin-bottom: 20px;
	color: var(--white);
	text-shadow: 0 4px 22px rgba(0, 10, 18, 0.28);
}

.pinc-v2-h1-service {
	display: block;
	margin-bottom: 14px;
	color: var(--brand-blue-light);
	font-size: 0.42em;
	line-height: 1;
	letter-spacing: 0.035em;
}

.pinc-v2-h1-benefit {
	display: block;
}

.pinc-v2-visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.hero__sub {
	max-width: 690px;
	color: #d4dfe5;
	font-size: 1.05rem;
	line-height: 1.62;
}

.hero__cta {
	margin-bottom: 24px;
}

.trust-badges {
	gap: 10px 17px;
	font: 700 0.83rem/1.2 var(--font-head);
	letter-spacing: 0.035em;
	text-transform: uppercase;
}

.trust-badges__tick {
	color: var(--action-green);
	background: transparent;
	border: 1px solid var(--action-green);
}

.pinc-v2-hero-form {
	width: 100%;
	max-width: 430px;
	justify-self: end;
}

.hero .estimate-form {
	padding: 27px 25px 22px;
	color: var(--body);
	background: rgba(255, 255, 255, 0.985);
	border: 1px solid rgba(255, 255, 255, 0.68);
	border-radius: 13px;
	box-shadow: var(--shadow-lg);
}

.hero .estimate-form::before {
	display: inline-block;
	margin-bottom: 15px;
	padding: 8px 14px;
	color: #122a16;
	background: var(--action-green);
	font: 800 0.75rem/1 var(--font-head);
	letter-spacing: 0.04em;
	text-transform: uppercase;
	content: "Fast, free, no obligation";
	transform: skew(-10deg);
}

.hero .estimate-form__heading {
	margin-bottom: 15px;
	font-size: 2.15rem;
	font-weight: 900;
	line-height: 0.95;
	text-transform: uppercase;
}

.hero .estimate-form label {
	font: 800 0.72rem/1 var(--font-head);
	letter-spacing: 0.045em;
	text-transform: uppercase;
}

.hero .estimate-form input,
.hero .estimate-form select,
.hero .estimate-form textarea {
	background: #f7f8f7;
	border-color: #c9d2d6;
	border-radius: 4px;
}

.hero .estimate-form .btn {
	width: 100%;
}

/* Content systems */
.problem {
	background: var(--white);
}

.pain,
.step,
.service-card {
	border-color: var(--border);
	border-radius: 9px;
	box-shadow: 0 10px 28px rgba(8, 31, 47, 0.07);
}

.pain {
	background: #f5f7f6;
}

.pain__icon {
	color: var(--action-green-dark);
	background: #eef8e5;
	border: 1px solid rgba(124, 218, 36, 0.55);
	border-radius: 50%;
}

.pain__good strong {
	color: var(--action-green-dark);
}

.proof {
	background:
		radial-gradient(800px 300px at 12% -10%, rgba(56, 182, 255, 0.16), transparent 60%),
		linear-gradient(120deg, var(--ink), var(--ink-3));
}

.stat {
	border-radius: 6px;
}

.stat__num {
	color: var(--action-green);
	font-size: clamp(2rem, 4vw, 2.8rem);
	font-weight: 900;
	text-transform: uppercase;
}

.process {
	background: var(--surface);
}

.step {
	background: var(--white);
}

.step__num {
	color: #0b2510;
	background: var(--action-green);
}

.service-card__title {
	font-size: 1.55rem;
	font-weight: 800;
	line-height: 1;
	text-transform: uppercase;
}

.service-card__link {
	color: var(--action-green-dark);
	font-family: var(--font-head);
	font-weight: 800;
	text-transform: uppercase;
}

.service-card--cta {
	color: var(--white);
	background: linear-gradient(145deg, var(--ink), var(--ink-3));
	border: 0;
}

.service-card--cta .service-card__title,
.service-card--cta .service-card__benefit {
	color: var(--white);
}

.close {
	color: var(--white);
	background:
		linear-gradient(120deg, rgba(7, 28, 45, 0.98), rgba(14, 49, 74, 0.94)),
		var(--ink);
}

.close__grid.pinc-v2-close-single {
	grid-template-columns: minmax(0, 760px);
	justify-content: center;
	text-align: center;
}

.close__grid.pinc-v2-close-single .close__sub {
	margin-inline: auto;
}

.close__grid.pinc-v2-close-single .close__info {
	justify-items: center;
}

.close__title,
.close__sub,
.close__info li,
.close__info a {
	color: var(--white);
}

.close .btn--cta {
	color: #0c2810;
	background: var(--action-green);
}

/* Article, About, and Contact variants use the same typography with a calmer
 * reading measure. Existing section and heading order remains untouched. */
.pinc-family-guide .page-main > .section:not(.hero),
.pinc-family-about .page-main > .section:not(.hero),
.pinc-family-contact .page-main > .section:not(.hero) {
	font-size: 1.03rem;
}

.pinc-family-guide .page-main > .section:not(.hero) > .container {
	max-width: 920px;
}

.pinc-family-guide .page-main > .services > .container,
.pinc-family-guide .page-main > .close > .container {
	max-width: var(--maxw);
}

.pinc-family-location .hero__eyebrow,
.pinc-family-service-location .hero__eyebrow {
	color: var(--brand-blue-light);
}

/* Footer */
.site-footer {
	background: #061827;
}

.site-footer__grid {
	padding-block: 64px;
}

.site-footer__logo {
	width: 215px;
	padding: 0;
	background: transparent;
	border-radius: 0;
}

.site-footer__heading {
	font-size: 1.3rem;
	font-weight: 800;
	letter-spacing: 0.035em;
	text-transform: uppercase;
}

.site-footer__list,
.site-footer__tag,
.site-footer__note {
	font-size: 0.9rem;
}

.site-footer__list a:hover {
	color: var(--action-green);
}

.mobile-call-bar {
	color: #0c2810;
	background: var(--action-green);
	font-family: var(--font-head);
	font-weight: 800;
	letter-spacing: 0.035em;
	text-transform: uppercase;
}

/* Tablet and mobile */
@media (max-width: 1180px) {
	.site-header__actions .header-phone {
		display: none;
	}

	.nav-menu {
		font-size: 0.9rem;
	}
}

@media (max-width: 1023px) {
	.site-header__inner {
		min-height: 74px;
	}

	.site-nav {
		inset: 111px 0 auto;
		color: var(--body);
		background: var(--white);
	}

	.nav-menu a {
		color: var(--ink);
	}

	.nav-menu a:hover,
	.nav-menu .current-menu-item > a {
		color: var(--ink);
	}

	.site-header__actions .header-phone {
		display: flex;
		justify-content: center;
		color: var(--ink);
		background: var(--surface);
	}

	.header-phone small {
		color: var(--muted);
		text-align: left;
	}

	.hero__inner.pinc-v2-hero-grid {
		grid-template-columns: 1fr;
	}

	.pinc-v2-hero-form {
		max-width: 720px;
		justify-self: stretch;
	}
}

@media (max-width: 700px) {
	.site-utility__inner {
		padding-inline: 14px;
		white-space: nowrap;
	}

	.site-utility__inner > * {
		display: none;
	}

	.site-utility__inner > :last-child {
		display: inline;
		padding: 0;
	}

	.site-logo img {
		width: 170px;
	}

	.hero {
		min-height: 0;
		background-position: 58% center;
	}

	.hero__inner {
		min-height: 0;
		padding-block: 54px 64px;
	}

	.hero__title {
		font-size: clamp(2.75rem, 13vw, 4rem);
	}

	.hero__sub {
		font-size: 1rem;
	}

	.hero__cta .btn {
		width: 100%;
	}

	.trust-badges {
		display: grid;
		grid-template-columns: 1fr 1fr;
	}

	.hero .estimate-form {
		padding: 22px 18px 18px;
	}

	.section {
		padding-block: 62px;
	}

	.close__grid.pinc-v2-close-single {
		text-align: left;
	}

	.close__grid.pinc-v2-close-single .close__info {
		justify-items: start;
	}

	.site-footer__grid {
		padding-block: 48px;
	}
}

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