/* Shared colors and rhythm for the editable homepage sections. */
.home-content {
	--home-ink: #092a3d;
	--home-copy: #375363;
	--home-blue: #006785;
	--home-ice: #8fe7f3;
	--home-line: #bfd1d9;
	--home-space: clamp(40px, 5.2vw, 80px);
}
.home-content .pws-block-section { margin: 0; scroll-margin-top: calc(var(--pws-compact-brand) + 16px); }
.home-content :is(.about_outer,.services_outer,.gallery_outer,.testimonial_outer,.form_outer) {
	padding-block: var(--home-space);
	color: var(--home-copy);
}
.home-content .pws-block-section h2 {
	margin: 0 0 22px;
	padding: 0;
	color: var(--home-ink);
	font: 700 clamp(32px,3.1vw,52px)/1.08 var(--heading);
	letter-spacing: -.045em;
	text-transform: none;
	text-wrap: balance;
}
.home-content .pws-block-section h2::after { content: none; }
.home-content .pws-block-section h2 span {
	display: block;
	margin: 0 0 9px;
	padding: 0;
	color: var(--home-blue);
	font: 700 12px/1.4 var(--body);
	letter-spacing: .15em;
	text-transform: uppercase;
}
.home-content .pws-block-section .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	min-height: 44px;
	border: 1px solid transparent;
	border-radius: 5px;
	padding: 10px 17px;
	color: white;
	background: #0a354e;
	box-shadow: inset 0 -3px #0084a9;
	font: 700 16px/1.35 var(--body);
}
.home-content .pws-block-section .wp-block-button__link::after {
	content: "";
	width: 18px; height: 18px; flex: none;
	background: currentColor;
	mask: url("../icons/rightward.svg") center / contain no-repeat;
}
.home-content .pws-block-section :focus-visible { outline: 3px solid #0081a3; outline-offset: 3px; }
.home-content .pws-block-section .wp-block-button__link:is(:hover,:focus-visible) { color: white; background: #10536d; }
.home-content .pws-hero-cta { background: #0a354e; border-color: #80cddf; box-shadow: inset 0 -3px #0084a9; border-radius: 5px; }
.home-content .pws-hero-cta:is(:hover,:focus-visible) { background: #effaff; color: #0a354e; }
.home-content .pws-hero-controls button:is(:hover,:focus-visible) { background: #10536d; }

/* The three marks form one sign directly under the hero. */
.home-content .top_box_3x3_outer {
	padding: 0;
	background: #0a2839;
	border-block: 1px solid #36576a;
}
.top_box_3x3_outer .pws-block-row {
	display: grid;
	grid-template-columns: repeat(3,minmax(0,1fr));
	gap: 0;
}
.top_box_3x3_outer .top_box_3x3_box {
	display: block;
	position: relative;
	padding: 0;
	margin: 0;
	min-height: 0;
	color: #f1f8fb;
	text-align: left;
}
.top_box_3x3_outer .top_box_3x3_box > div {
	display: flex;
	align-items: center;
	gap: clamp(12px,1.55vw,24px);
	min-height: 124px;
	padding: 19px clamp(12px,2.2vw,34px);
}
.top_box_3x3_outer .wp-block-column + .wp-block-column { border-inline-start: 1px solid #375666; }
.top_box_3x3_outer .top_box_3x3_box::after {
	content: "";
	position: absolute; bottom: 0; left: 0; right: 0; height: 2px;
	background: linear-gradient(90deg, #1b9fbf, #8ae5f4);
	transform-origin: left;
	transform: scaleX(0);
}
.top_box_3x3_outer .wp-block-image {
	position: relative;
	display: grid; place-items: center;
	flex: none;
	width: 64px; height: 64px; padding: 10px;
	overflow: hidden;
	border: 1px solid #517482;
	border-radius: 15px 5px 15px 5px;
	background: linear-gradient(145deg,#21485b,#0d2c3e);
	box-shadow: inset 0 1px #a7e1f332;
}
.top_box_3x3_outer .wp-block-image::after {
	content: "";
	position: absolute; inset: -50% 0; width: 30%;
	pointer-events: none;
	background: linear-gradient(90deg,transparent,#d7faff66,transparent);
	transform: translateX(-260%) skewX(-22deg);
}
.top_box_3x3_outer .top_box_3x3_box .wp-block-image img { width: 44px; height: 44px; transform: none; }
.top_box_3x3_outer .top_box_3x3_box_inner p {
	max-width: 20ch; margin: 0; padding: 0; color: inherit;
	font: 700 clamp(17px,1.45vw,22px)/1.24 var(--heading);
	letter-spacing: -.025em; text-transform: none;
}
.home-content .about_outer { background: white; text-align: left; }
.home-content .about_outer .pws-block-row, .home-content .form_outer .pws-block-row { gap: clamp(24px,5vw,76px); }
.home-content .about_img_css figure { margin: 0; }
.home-content .about_img_css img { width: 100%; max-width: 620px; border-radius: 10px; }
.home-content .about_outer p, .home-content .services_outer .container p {
	max-width: 62ch; color: var(--home-copy); font: 400 clamp(16px,1.12vw,19px)/1.65 var(--body);
}
.home-content .about_outer .wp-block-buttons { margin-top: 22px; }

/* Start the service collection with the company's signature deck work. */
.home-content .services_outer { background: #edf4f6; border-block: 1px solid #d9e5ea; }
.home-content .services_outer > div > .container { align-items: center; margin-bottom: 28px; }
.home-content .services_outer .container :is(h2,p) { margin: 0; }
.home-content .services_outer h2 span { display: none; }
.home-content .pws-services-row {
	width: 100%; max-width: var(--pws-container); margin: 0 auto; padding-inline: 15px;
	display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px;
}
.home-content .services_box {
	position: relative; isolation: isolate; height: 100%; min-width: 0; overflow: hidden;
	margin: 0; border: 1px solid var(--home-line); border-radius: 10px;
	background: white; box-shadow: 0 3px 10px #102a3b0a;
	--service-mark: url("../icons/house.svg");
}
.services_box:has(a[href*="deck-and-fence"]) { --service-mark: url("../icons/deck.svg"); }
.services_box:has(a[href*="holiday-lighting"]) { --service-mark: url("../icons/lights.svg"); }
.services_box:has(a[href*="concrete-cleaning"]) { --service-mark: url("../icons/concrete.svg"); }
.services_box:has(a[href*="gutter-cleaning"]) { --service-mark: url("../icons/gutter.svg"); }
.home-content .services_box > div { display: flex; flex-direction: column; height: 100%; }
.home-content .services_box figure { position: relative; overflow: hidden; background: #c6d9de; }
.home-content .services_box figure img { display: block; width: 100%; height: clamp(145px,12vw,190px); object-fit: cover; }
.home-content .services_box figure::after {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background: linear-gradient(0deg,#09283e38,transparent 42%);
}
.home-content .services_box_content {
	flex: 1; display: flex; margin: 0; min-height: 0; padding: 20px clamp(16px,1.4vw,24px);
	background: transparent; color: var(--home-copy); text-align: left;
}
.home-content .services_box_content > div { display: flex; flex-direction: column; align-items: start; width: 100%; }
.home-content .services_box h3 {
	display: flex; align-items: start; gap: 10px; padding: 0; margin: 0 0 9px; color: var(--home-ink);
	font: 700 clamp(18px,1.45vw,23px)/1.2 var(--heading); letter-spacing: -.03em; text-wrap: pretty;
}
.home-content .services_box h3::before {
	content: ""; width: 24px; height: 24px; flex: none; background: #007794;
	mask: var(--service-mark) center / contain no-repeat;
}
.home-content .services_box p { margin: 0 0 10px; padding: 0; color: inherit; font: 400 16px/1.5 var(--body); }
.home-content .services_box .wp-block-buttons { margin: auto 0 0; }
.home-content .services_box .wp-block-button__link {
	padding: 4px 0; background: transparent; box-shadow: none; color: var(--home-blue);
}
.home-content .services_box .wp-block-button__link::before { content: ""; position: absolute; inset: 0; z-index: 1; }
.home-content .services_box:focus-within { outline: 3px solid #007d9a; outline-offset: 3px; }
.home-content .services_box:focus-within .wp-block-button__link, .home-content .services_box .wp-block-button__link:hover { background: transparent; color: #005670; }
@media (min-width:1200px) {
	.home-content .pws-services-row { grid-template-columns: 1.12fr 1fr 1fr; }
	.home-content .pws-services-row > :first-child { grid-row: span 2; }
	.home-content .pws-services-row > :first-child .services_box { background: #092a3d; }
	.home-content .pws-services-row > :first-child .services_box figure { flex: 1; min-height: 280px; }
	.home-content .pws-services-row > :first-child figure img { position: absolute; height: 100%; inset: 0; }
	.home-content .pws-services-row > :first-child .services_box_content { flex: none; padding: clamp(23px,2vw,34px); color: #dcebf1; }
	.home-content .pws-services-row > :first-child h3 { flex-direction: column; color: white; font-size: clamp(26px,2.2vw,35px); }
	.home-content .pws-services-row > :first-child h3::before { background: var(--home-ice); width: 32px; height: 32px; }
	.home-content .pws-services-row > :first-child .wp-block-button__link { color: var(--home-ice); }
}
@media (min-width:650px) and (max-width:1199px) {
	.home-content .pws-services-row > :first-child { grid-column: 1 / -1; }
	.home-content .pws-services-row > :first-child .services_box > div { display: grid; grid-template-columns: 1fr 1fr; }
	.home-content .pws-services-row > :first-child figure img { height: 100%; min-height: 210px; }
}

/* The native gallery shows its full set and keeps the full-size photo viewer. */
.home-content .gallery_outer { background: white; }
.home-content .gallery_outer h2, .home-content .testimonial_outer h2 { text-align: left; }
.home-content .gallery_outer .pws-project-strip {
	display: grid; grid-template-columns: repeat(5,minmax(0,1fr));
	grid-auto-flow: row; grid-auto-columns: auto; grid-auto-rows: clamp(140px,10.8vw,182px);
	gap: clamp(8px,1vw,15px); overflow: visible; scroll-snap-type: none; padding: 0; margin: 0;
}
.home-content .gallery_outer .pws-project-strip > figure:first-child { grid-column: span 2; grid-row: span 2; }
.home-content .gallery_outer .pws-project-strip figure.wp-block-image a {
	position: relative; display: block; width: 100%; height: 100%; border-radius: 7px;
}
.home-content .gallery_outer .pws-project-strip figure.wp-block-image img { display: block; height: 100%; width: 100%; object-fit: cover; }
.home-content .pws-project-strip figure a::after {
	content: ""; position: absolute; right: 10px; bottom: 10px; width: 32px; height: 32px;
	border: 1px solid #c0e8ee; border-radius: 50%;
	background: #0a293ce8 url("../icons/expand-photo-light.svg") center / 16px no-repeat;
}
.home-content .gallery_outer .wp-block-buttons { justify-content: flex-start; margin-top: 20px; }

/* The two Ready Seal guides share one low, easily scanned download band. */
.home-content .special_button_outer { padding: 28px 0; background: #0b293b; }
.home-content .special_button_outer .pws-block-row { gap: 0; }
.home-content .special_button_outer .wp-block-column {
	display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center;
	gap: 10px 18px; padding: 14px clamp(16px,2vw,32px); text-align: left;
}
.home-content .special_button_outer .wp-block-column + div { border-left: 1px solid #3e5966; }
.home-content .special_button_outer h3 { flex: 1 1 12ch; margin: 0; padding: 0; color: white; font: 700 clamp(19px,1.65vw,26px)/1.2 var(--heading); letter-spacing: -.03em; }
.home-content .special_button_outer .wp-block-buttons { margin: 0; }
.home-content .special_button_outer .wp-block-button__link { padding: 8px 12px; border-color: #567f90; background: transparent; box-shadow: none; color: #ceeff6; }
.home-content .special_button_outer .wp-block-button__link::before { content: ""; margin: 0; width: 20px; height: 20px; background: currentColor; mask: url("../icons/download-guide.svg") center / contain no-repeat; }
.home-content .special_button_outer .wp-block-button__link::after { content: none; }
.home-content .special_button_outer .wp-block-button__link:is(:hover,:focus-visible) { background: #16475c; }
.home-content .testimonial_outer { background: #f0f5f7; border-bottom: 1px solid #dae5e9; }
.home-content .testimonial_outer rp-review-inner { border-radius: 8px; }
.home-content .form_outer { text-align: left; background: white; }
.home-content .form_outer .nf-form-cont { color: var(--home-copy); max-width: 76ch; }
.home-content .form_outer .nf-form-cont span { display: inline; color: inherit; font: inherit; }
.home-content .form_outer .nf-form-fields-required { display: block; }
.home-content .form_outer .nf-form-cont .ninja-forms-req-symbol { color: #a42724; }
.home-content .form_outer .nf-field-label label { color: var(--home-ink); font: 700 16px/1.45 var(--body); }
.home-content .form_outer .nf-field-element :where(input:not([type=submit],[type=button],[type=checkbox],[type=radio],[type=hidden]),select,textarea) {
	max-width: 100%; color: var(--home-ink); border: 1px solid #93adba; border-radius: 5px; background: #f8fbfc;
}
.home-content .form_outer .nf-field-element :is(input[type=button],input[type=submit],button[type=submit]) {
	padding: 11px 20px; min-height: 44px; border: 0; border-radius: 5px; background: #0a354e; color: white; box-shadow: inset 0 -3px #0084a9; cursor: pointer;
}
.home-content .form_outer .nf-field-element :is(input[type=button],input[type=submit],button[type=submit]):hover { background: #10536d; }
.home-content .quick_address {
	margin: 0; border-radius: 9px; background: #0a2839; color: white; overflow: hidden; box-shadow: none;
}
.home-content .quick_address img { display: block; width: 100%; }
.home-content .quick_address_text { padding: 4px clamp(18px,2.2vw,36px); }
.home-content .quick_address h5 { margin: 0; padding: 0; color: #eff8fa; }
.home-content .quick_address h5 + h5 { border-top: 1px solid #345160; }
.home-content .quick_address h5::before { content: none; }
.home-content .quick_address h5 a {
	position: relative; padding: 18px 0 18px 36px; min-height: 48px; color: inherit;
	font: 400 16px/1.45 var(--body); overflow-wrap: anywhere;
}
.home-content .quick_address h5 span { padding: 0 0 3px; color: white; font: 700 16px/1.3 var(--body); }
.home-content .quick_address h5 a::before {
	content: ""; position: absolute; top: 18px; left: 0; width: 21px; height: 21px;
	background: #88dcea; mask: var(--contact-mark) center / contain no-repeat;
}
.quick_address .address_custom { --contact-mark: url("../icons/location.svg"); }
.quick_address .phone_custom { --contact-mark: url("../icons/phone.svg"); }
.quick_address .email_custom { --contact-mark: url("../icons/email.svg"); }
.home-content .quick_address a:is(:hover,:focus-visible) { color: var(--home-ice); text-decoration: underline; text-underline-offset: 3px; }

@media (hover:hover) and (pointer:fine) {
	.home-content .top_box_3x3_box:hover { background: #113347; }
	.top_box_3x3_box:hover .wp-block-image { border-color: #83cedf; box-shadow: 0 0 16px #4ed1ec24; }
	.top_box_3x3_outer .top_box_3x3_box:hover::after { transform: scaleX(1); }
	.home-content .services_box:hover { border-color: #4996a9; box-shadow: 0 8px 22px #14394c20; }
	.home-content .pws-project-strip a:hover::after { background-color: #005e7a; }
}
@media (prefers-reduced-motion:no-preference) and (hover:hover) and (pointer:fine) {
	.top_box_3x3_box, .top_box_3x3_box .wp-block-image, .services_box { transition: background-color .22s, border-color .22s, box-shadow .22s; }
	.top_box_3x3_box::after, .pws-block-section .wp-block-button__link::after, .pws-project-strip a::after { transition: transform .3s ease-out; }
	.top_box_3x3_box:hover .wp-block-image::after { animation: pws-enamel-glint .68s ease-out both; }
	@keyframes pws-enamel-glint { to { transform: translateX(490%) skewX(-22deg); } }
	.services_box figure img, .pws-project-strip img { transition: transform .48s cubic-bezier(.2,.65,.25,1); }
	.home-content .services_box:is(:hover,:focus-within) figure img,
	.home-content .pws-project-strip a:is(:hover,:focus-visible) img { transform: scale(1.045); }
	.home-content .services_box:is(:hover,:focus-within) .wp-block-button__link::after,
	.home-content .pws-block-section .wp-block-button__link:is(:hover,:focus-visible)::after { transform: translateX(4px); }
}
@media (max-width:1199px) {
	.home-content .gallery_outer .pws-project-strip { grid-template-columns: repeat(4,minmax(0,1fr)); }
	.home-content .gallery_outer .pws-project-strip > figure:first-child { grid-row: auto; }
}
@media (max-width:991px) {
	.top_box_3x3_outer .top_box_3x3_box > div { flex-direction: column; align-items: start; gap: 12px; }
	.home-content .special_button_outer .wp-block-column { flex-direction: column; align-items: start; }
	.home-content .special_button_outer h3 { flex: none; }
}
@media (max-width:781px) {
	.home-content .pws-block-section .container.pws-block-row { margin-inline: auto; }
	.home-content .about_outer .pws-block-row { display: grid; gap: 26px; }
	.home-content .about_img_css img { max-height: 380px; width: auto; }
	.home-content .services_outer > div > .container { gap: 10px; }
	.home-content .special_button_outer .wp-block-column + div { border-left: 0; border-top: 1px solid #3e5966; }
	.home-content .special_button_outer .wp-block-column { flex-direction: row; align-items: center; padding-inline: 0; }
}
@media (max-width:649px) {
	.top_box_3x3_outer .pws-block-row { grid-template-columns: 1fr; }
	.top_box_3x3_outer .wp-block-column + .wp-block-column { border-inline-start: 0; border-top: 1px solid #375666; }
	.top_box_3x3_outer .top_box_3x3_box > div { flex-direction: row; align-items: center; gap: 16px; padding: 12px 2px; min-height: 74px; }
	.top_box_3x3_outer .wp-block-image { width: 48px; height: 48px; padding: 5px; }
	.top_box_3x3_outer .top_box_3x3_box .wp-block-image img { width: 36px; height: 36px; }
	.home-content .pws-services-row { grid-template-columns: minmax(0,1fr); }
	.home-content .services_box figure img { height: auto; aspect-ratio: 2.25; }
	.home-content .gallery_outer .pws-project-strip { grid-template-columns: repeat(2,minmax(0,1fr)); grid-auto-rows: clamp(100px,29vw,160px); }
	.home-content .gallery_outer .pws-project-strip > figure:first-child { grid-row: span 2; }
	.home-content .pws-project-strip figure a::after { width: 26px; height: 26px; right: 6px; bottom: 6px; }
}
