/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 6.37
*/

/*************** ADD CUSTOM CSS HERE.   ***************/

:root {
	--spp-ink: #123844;
	--spp-deep: #082f3a;
	--spp-teal: #0b8f9f;
	--spp-aqua: #35c8cf;
	--spp-sand: #f5f8f7;
	--spp-line: #d9e8e9;
}

.spp-services-enhancement { position: relative; padding: 94px 24px 104px; overflow: hidden; background: linear-gradient(135deg, #082f3a 0%, #0d6674 62%, #118ba0 100%); }
.spp-services-enhancement::before { position: absolute; top: -160px; right: -100px; width: 520px; height: 520px; border: 1px solid rgba(185,245,239,.15); border-radius: 50%; content: ""; box-shadow: 0 0 0 24px rgba(185,245,239,.04), 0 0 0 48px rgba(185,245,239,.025); }
.spp-services-enhancement-inner { position: relative; z-index: 1; max-width: 1160px; margin: 0 auto; }
.spp-services-enhancement-intro { max-width: 740px; margin: 0 auto 44px; text-align: center; }
.spp-services-enhancement .spp-location-eyebrow { margin: 0 0 12px; color: var(--spp-aqua) !important; font-size: 11px; font-weight: 800; letter-spacing: .19em; }
.spp-services-enhancement-intro h2 { margin: 0 0 16px; color: #fff; font-size: clamp(30px, 4vw, 50px); letter-spacing: -.045em; line-height: 1.04; }
.spp-services-enhancement-intro > p:last-child { margin: 0; color: rgba(255,255,255,.76); font-size: 17px; line-height: 1.75; }
.spp-services-process { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.spp-services-process article { min-height: 218px; padding: 24px 22px; border: 1px solid rgba(185,245,239,.23); border-radius: 18px; background: rgba(255,255,255,.08); box-shadow: 0 14px 28px rgba(0,0,0,.11); }
.spp-services-process article > span { display: inline-grid; width: 34px; height: 34px; margin-bottom: 26px; place-items: center; border: 1px solid rgba(185,245,239,.5); border-radius: 50%; color: var(--spp-aqua); font-size: 11px; font-weight: 800; }
.spp-services-process h3 { margin: 0 0 9px; color: #fff; font-size: 22px; }
.spp-services-process p { margin: 0; color: rgba(255,255,255,.7); font-size: 14px; line-height: 1.65; }
.spp-services-guidance { display: grid; grid-template-columns: 1.05fr .95fr; gap: 42px; align-items: center; margin-top: 52px; padding: 34px 38px; border: 1px solid rgba(185,245,239,.26); border-radius: 20px; background: rgba(4,30,38,.28); }
.spp-services-guidance h3 { margin: 0; color: #fff; font-size: clamp(24px, 3vw, 34px); letter-spacing: -.035em; line-height: 1.08; }
.spp-services-guidance ul { margin: 0; padding-left: 20px; }
.spp-services-guidance li { margin: 7px 0; color: rgba(255,255,255,.78); font-size: 14px; line-height: 1.5; }
.spp-services-guidance li::marker { color: var(--spp-aqua); }
.spp-services-enhancement-cta { display: flex; justify-content: center; align-items: center; gap: 22px; margin-top: 38px; color: rgba(255,255,255,.8); }
.spp-services-enhancement-cta p { margin: 0; font-size: 15px; }
.spp-services-enhancement-cta .button { margin: 0; color: var(--spp-deep) !important; background: var(--spp-aqua) !important; }
@media only screen and (max-width: 48em) {
	.spp-services-enhancement { padding: 68px 18px 76px; }
	.spp-services-process { grid-template-columns: 1fr 1fr; }
	.spp-services-process article { min-height: 0; padding: 20px 17px; }
	.spp-services-process article > span { margin-bottom: 20px; }
	.spp-services-guidance { grid-template-columns: 1fr; gap: 24px; padding: 27px 22px; }
	.spp-services-enhancement-cta { display: block; text-align: center; }
	.spp-services-enhancement-cta .button { margin-top: 15px; }
}

/* Social links are intentionally hidden until the brand channels are ready. */
.social-icons,
.social-links,
.spp-social-links,
.portfolio-share,
.share-icons,
.share-row,
.social-share { display: none !important; }

html { scroll-behavior: smooth; }
html { scrollbar-color: var(--spp-teal) #e8f3f3; scrollbar-width: thin; }
body::-webkit-scrollbar,
.off-canvas::-webkit-scrollbar,
.mfp-wrap::-webkit-scrollbar { width: 11px; height: 11px; }
body::-webkit-scrollbar-track,
.off-canvas::-webkit-scrollbar-track,
.mfp-wrap::-webkit-scrollbar-track { background: #e8f3f3; }
body::-webkit-scrollbar-thumb,
.off-canvas::-webkit-scrollbar-thumb,
.mfp-wrap::-webkit-scrollbar-thumb { border: 3px solid #e8f3f3; border-radius: 999px; background: linear-gradient(180deg, var(--spp-aqua), var(--spp-teal)); }
body::-webkit-scrollbar-thumb:hover,
.off-canvas::-webkit-scrollbar-thumb:hover,
.mfp-wrap::-webkit-scrollbar-thumb:hover { background: var(--spp-deep); }
body {
	background: var(--spp-sand);
	color: var(--spp-ink);
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* Shared button motion: polished lift, water-color sheen, and tactile press state. */
.button,
button,
input[type="submit"],
input[type="button"] { transition: transform .24s ease, box-shadow .24s ease, background-color .24s ease, background-position .45s ease, color .24s ease !important; }
.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover { transform: translateY(-3px); box-shadow: 0 12px 24px rgba(8,47,58,.18) !important; }
.button:active,
button:active,
input[type="submit"]:active,
input[type="button"]:active { transform: translateY(-1px) scale(.98); box-shadow: 0 6px 12px rgba(8,47,58,.14) !important; }
.button.primary,
button[type="submit"],
input[type="submit"] { background-image: linear-gradient(110deg, var(--spp-teal) 0%, var(--spp-aqua) 46%, var(--spp-teal) 100%) !important; background-position: 0% 50%; background-size: 220% 100%; }
.button.primary:hover,
button[type="submit"]:hover,
input[type="submit"]:hover { background-position: 100% 50%; color: var(--spp-deep) !important; }
.button.is-outline:hover { border-color: var(--spp-teal) !important; color: #fff !important; background: var(--spp-teal) !important; }

h1, h2, h3, h4, h5, h6,
.heading-font,
.nav > li > a,
.button,
button { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important; }

h1, h2, h3, h4, h5, h6 { color: var(--spp-deep); letter-spacing: -.025em; }

/* Header: calm, high-contrast, and conversion-focused. */
.header-wrapper { position: relative; z-index: 50; }
.header-top {
	background: var(--spp-deep) !important;
	min-height: 34px !important;
	letter-spacing: .12em;
	font-size: 11px;
	font-weight: 700;
}
.header-top .nav > li > a,
.header-top .nav > li > span { color: rgba(255,255,255,.85) !important; }
.html_topbar_left strong { font-size: 0 !important; }
.html_topbar_left strong::after { content: "Serving Los Angeles · Orange County · Santa Barbara"; font-size: 11px; }
#masthead,
.header-main {
	background: rgba(255,255,255,.98) !important;
	min-height: 102px !important;
	box-shadow: 0 8px 28px rgba(8,47,58,.08);
}
#logo { width: 244px !important; }
#logo a { position: relative; display: block; width: 244px; height: 94px; overflow: visible; border-radius: 0; background: url("/wp-content/themes/flatsome-child/assets/splash-logo-cursive-transparent.webp") center 39% / 244px 163px no-repeat; box-shadow: none; transform: perspective(600px) rotateX(var(--spp-logo-tilt-y, 0deg)) rotateY(var(--spp-logo-tilt-x, 0deg)) translateY(0); transition: transform .2s ease-out; transform-style: preserve-3d; will-change: transform; }
#logo a::after { position: absolute; right: 8px; bottom: 3px; z-index: 3; color: var(--spp-deep); content: "POOL PLASTERING"; font-size: 9px; font-weight: 800; letter-spacing: .08em; line-height: 1; }
.spp-logo-splash { position: absolute; z-index: 1; inset: 24% 10% 17%; pointer-events: none; border: 2px solid rgba(116,239,245,.72); border-radius: 50%; opacity: 0; background: radial-gradient(ellipse at 34% 25%, rgba(229,255,255,.26), transparent 24%), radial-gradient(ellipse at 66% 72%, rgba(53,200,207,.16), transparent 44%); box-shadow: inset 0 0 12px rgba(185,255,255,.48), 0 0 0 1px rgba(255,255,255,.18), 0 7px 16px rgba(8,47,58,.16); transform: scale(.72); filter: blur(.15px); }
.spp-logo-splash::before { position: absolute; top: -18px; left: 23%; width: 8px; height: 15px; border-radius: 70% 30% 70% 30%; background: linear-gradient(145deg, #f0ffff 0%, #8ceff2 32%, var(--spp-teal) 78%); box-shadow: 34px 7px 0 -1px #7ce8ed, 79px -8px 0 -2px #b4ffff, 126px 9px 0 -1px #43cbd3, 155px 25px 0 -3px rgba(240,255,255,.9); content: ""; opacity: 0; transform: translateY(9px) rotate(14deg); filter: drop-shadow(0 3px 2px rgba(8,47,58,.22)); }
.spp-logo-splash::after { position: absolute; right: 8%; bottom: -8px; width: 14px; height: 8px; border-radius: 50%; background: rgba(53,200,207,.6); box-shadow: -47px 7px 0 -2px rgba(53,200,207,.46), -93px -4px 0 -3px rgba(207,255,255,.78), -126px 11px 0 -4px rgba(53,200,207,.7); content: ""; opacity: 0; }
.spp-logo-ripple-secondary { position: absolute; inset: -12%; border: 1px solid rgba(187,255,255,.62); border-radius: 50%; opacity: 0; transform: scale(.58); }
.spp-logo-glint { position: absolute; top: 17%; left: 18%; width: 37%; height: 10%; border-radius: 50%; background: linear-gradient(100deg, transparent, rgba(245,255,255,.8), transparent); opacity: 0; filter: blur(1px); transform: rotate(-13deg) skewX(-18deg); }
#logo a:hover .spp-logo-splash { animation: spp-logo-ripple 1.25s ease-out both; }
#logo a:hover .spp-logo-splash::before { animation: spp-logo-droplets .75s cubic-bezier(.2,.75,.35,1) .08s both; }
#logo a:hover .spp-logo-splash::after { animation: spp-logo-splash-dots .9s ease-out .12s both; }
#logo a:hover .spp-logo-ripple-secondary { animation: spp-logo-ripple-secondary 1.4s ease-out .05s both; }
#logo a:hover .spp-logo-glint { animation: spp-logo-glint 1.05s ease-out .08s both; }
@keyframes spp-logo-ripple { 0% { opacity: 0; transform: scale(.72); } 18% { opacity: .85; } 100% { opacity: 0; transform: scale(1.08); } }
@keyframes spp-logo-droplets { 0% { opacity: 0; transform: translateY(9px) rotate(14deg); } 28% { opacity: 1; } 100% { opacity: 0; transform: translateY(-17px) rotate(4deg); } }
@keyframes spp-logo-splash-dots { 0% { opacity: 0; transform: scale(.4); } 25% { opacity: .9; } 100% { opacity: 0; transform: scale(1.4); } }
@keyframes spp-logo-ripple-secondary { 0% { opacity: 0; transform: scale(.58); } 18% { opacity: .72; } 100% { opacity: 0; transform: scale(1.12); } }
@keyframes spp-logo-glint { 0% { opacity: 0; transform: translateX(-28px) rotate(-13deg) skewX(-18deg); } 30% { opacity: .9; } 100% { opacity: 0; transform: translateX(92px) rotate(-13deg) skewX(-18deg); } }

@media (prefers-reduced-motion: reduce) {
	#logo a { transition: none !important; transform: none !important; }
	#logo a:hover .spp-logo-splash,
	#logo a:hover .spp-logo-splash::before,
	#logo a:hover .spp-logo-splash::after,
	#logo a:hover .spp-logo-ripple-secondary,
	#logo a:hover .spp-logo-glint { animation: none !important; }
}

/* Water hover treatment for content imagery. */
.spp-water-frame { position: relative; overflow: hidden; isolation: isolate; perspective: 900px; transform: rotateX(var(--spp-tilt-y, 0deg)) rotateY(var(--spp-tilt-x, 0deg)) translateY(0); transform-style: preserve-3d; transition: transform .22s ease-out, box-shadow .35s ease; will-change: transform; }
.spp-water-frame img { position: relative; z-index: 0; transform: translate3d(var(--spp-shift-x, 0), var(--spp-shift-y, 0), 0) scale(1); transition: transform .65s cubic-bezier(.2,.7,.2,1), filter .65s ease; will-change: transform; }
.spp-water-frame::before { position: absolute; z-index: 1; inset: -30%; pointer-events: none; content: ""; opacity: 0; background: radial-gradient(ellipse 28% 22% at var(--spp-glow-x, 32%) var(--spp-glow-y, 28%), rgba(224,255,255,.7) 0%, rgba(138,239,245,.2) 32%, transparent 72%), repeating-linear-gradient(116deg, transparent 0 11%, rgba(210,255,255,.07) 12% 13%, transparent 14% 23%), linear-gradient(118deg, transparent 32%, rgba(210,255,255,.42) 48%, transparent 61%); mix-blend-mode: screen; transform: translateX(-24%) rotate(-7deg); transition: opacity .35s ease, background-position .2s ease; }
.spp-water-frame::after { position: absolute; z-index: 2; top: var(--spp-ripple-y, 50%); left: var(--spp-ripple-x, 50%); width: 34%; aspect-ratio: 1; pointer-events: none; content: ""; border: 2px solid rgba(220,255,255,.82); border-radius: 50%; opacity: 0; box-shadow: 0 0 0 8px rgba(53,200,207,.16), 0 0 0 18px rgba(190,255,255,.12), inset 0 0 18px rgba(190,255,255,.3); transform: translate(-50%, -50%) scale(.18); }
.spp-water-drops { position: absolute; z-index: 3; inset: 0; pointer-events: none; opacity: 0; }
.spp-water-drops::before { position: absolute; top: 22%; left: 20%; width: 8px; height: 13px; border-radius: 70% 30% 65% 35%; background: linear-gradient(145deg, #d8ffff, var(--spp-aqua)); content: ""; box-shadow: 46px 20px 0 -2px #82edf0, 112px -8px 0 -3px #bafcff, 170px 36px 0 -2px #43cbd3; }
.spp-water-drops::after { position: absolute; right: 16%; bottom: 22%; width: 15px; height: 7px; border-radius: 50%; background: rgba(207,255,255,.7); content: ""; box-shadow: -54px 8px 0 -2px rgba(53,200,207,.58), -105px -5px 0 -3px rgba(207,255,255,.8); }
.spp-water-frame:hover { box-shadow: 0 24px 44px rgba(8,47,58,.2); }
.spp-water-frame:hover img { filter: saturate(1.12) contrast(1.04); transform: translate3d(var(--spp-shift-x, 0), var(--spp-shift-y, 0), 18px) scale(1.055); }
.spp-water-frame:hover::before { opacity: 1; animation: spp-water-sheen 1.2s ease-out both; }
.spp-water-frame:hover::after { animation: spp-water-ripple 1.05s ease-out .08s both; }
.spp-water-frame:hover .spp-water-drops { animation: spp-water-drops 1s ease-out .12s both; }
@keyframes spp-water-sheen { 0% { transform: translateX(-24%) rotate(-7deg); } 100% { transform: translateX(24%) rotate(-7deg); } }
@keyframes spp-water-ripple { 0% { opacity: 0; transform: translate(-50%, -50%) scale(.18); } 18% { opacity: .85; } 100% { opacity: 0; transform: translate(-50%, -50%) scale(2.15); } }
@keyframes spp-water-drops { 0% { opacity: 0; transform: translateY(10px); } 20% { opacity: 1; } 100% { opacity: 0; transform: translateY(-12px); } }
@media (prefers-reduced-motion: reduce) {
	.spp-water-frame,
	.spp-water-frame img { transition: none !important; transform: none !important; }
	.spp-water-frame::before,
	.spp-water-frame::after,
	.spp-water-frame:hover .spp-water-drops { animation: none !important; opacity: 0 !important; }
}
#logo img { display: none !important; }
#masthead .button,
#masthead .button.primary {
	background: var(--spp-teal) !important;
	border: 0 !important;
	box-shadow: 0 8px 18px rgba(11,143,159,.2) !important;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .08em;
}
#masthead .button:hover,
#masthead .button:focus-visible { background: var(--spp-deep) !important; color: #fff !important; transform: translateY(-1px); }
#masthead .header-nav-main {
	background: #fff !important;
	border-bottom: 1px solid var(--spp-line);
	min-height: 54px !important;
}
#masthead .header-nav-main > li > a {
	color: var(--spp-ink) !important;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .08em;
	padding-left: 11px !important;
	padding-right: 11px !important;
}
#masthead .header-inner { max-width: 1400px !important; }
#masthead .header-nav-main.nav-right { display: none !important; }
.spp-header-actions { display: flex; align-items: center; gap: 14px; margin-left: auto; padding-left: 12px; }
.spp-header-phone { color: var(--spp-ink) !important; font-size: 12px; font-weight: 800; white-space: nowrap; }
.spp-header-cta { margin: 0 !important; padding: 12px 16px !important; white-space: nowrap; }
#masthead .header-nav-main > li:hover > a,
#masthead .header-nav-main > li.current-menu-item > a { color: var(--spp-teal) !important; }

/* Homepage hero fallback: the existing slider is retained, but the page stays
   visually complete when its canvas script is delayed or unavailable. */
.home #content > .section:first-child {
	position: relative;
	min-height: 650px;
	padding: 0 !important;
	background:
		linear-gradient(90deg, rgba(8,47,58,.88) 0%, rgba(8,47,58,.56) 42%, rgba(8,47,58,.05) 78%),
		url("/wp-content/uploads/2025/06/IMG_0332-scaled-1.jpg") center 48% / cover no-repeat !important;
	overflow: hidden;
}
.home #content > .section:first-child .section-bg,
.home #content > .section:first-child sr7-module { opacity: 0 !important; }
.home #content > .section:first-child .section-content {
	min-height: 650px;
	display: flex;
	align-items: center;
	padding: 72px 6vw !important;
}
.spp-hero-copy { position: absolute; left: 6vw; top: 50%; transform: translateY(-50%); z-index: 3; max-width: 690px; color: #fff; }
.spp-hero-copy .eyebrow {
	display: inline-block;
	margin-bottom: 18px;
	color: #b9f5ef;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .18em;
	text-transform: uppercase;
}
.spp-hero-copy h1 {
	margin: 0 0 18px;
	color: #fff;
	font-size: clamp(42px, 5.5vw, 76px);
	line-height: .98;
	letter-spacing: -.045em;
}
.spp-hero-copy p { max-width: 570px; margin: 0 0 28px; color: rgba(255,255,255,.9); font-size: 18px; line-height: 1.65; }
.spp-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.spp-hero-actions a { margin: 0 !important; }
.spp-hero-actions .button { min-width: 176px; }
.spp-hero-slider { position: absolute; inset: 0; z-index: 3; overflow: hidden; }
.spp-hero-track, .spp-hero-slide { position: absolute; inset: 0; }
.spp-hero-slide { display: block; background-position: center; background-size: cover; opacity: 0; pointer-events: none; transform: scale(1.025); transition: opacity .7s ease, transform 7s ease; }
.spp-hero-slide.is-active { opacity: 1; pointer-events: auto; transform: scale(1); }
.spp-hero-slide .spp-hero-copy { z-index: 2; }
.spp-hero-controls { position: absolute; right: 6vw; bottom: 60px; z-index: 5; display: flex; align-items: center; gap: 10px; }
.spp-hero-arrow { display: grid !important; width: 42px !important; min-width: 42px !important; max-width: 42px !important; height: 42px !important; min-height: 42px !important; max-height: 42px !important; place-items: center; padding: 0 !important; border: 1px solid rgba(255,255,255,.55); border-radius: 50% !important; color: #fff; background: rgba(8,47,58,.58); box-shadow: 0 8px 18px rgba(8,47,58,.2); font-size: 27px; line-height: 1 !important; cursor: pointer; backdrop-filter: blur(8px); transition: background .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease; }
.spp-hero-arrow:hover, .spp-hero-arrow:focus-visible { border-color: rgba(255,255,255,.9); background: var(--spp-teal); box-shadow: 0 11px 24px rgba(8,47,58,.3); transform: translateY(-2px); }
.spp-hero-dots { position: absolute; right: 6vw; bottom: 27px; z-index: 5; display: flex; align-items: center; gap: 8px; }
.spp-hero-dot { width: 26px !important; min-width: 26px !important; max-width: 26px !important; height: 4px !important; min-height: 4px !important; max-height: 4px !important; padding: 0 !important; border: 0; border-radius: 999px; background: rgba(255,255,255,.48); font-size: 0 !important; line-height: 0 !important; cursor: pointer; transition: width .25s ease, min-width .25s ease, max-width .25s ease, background .25s ease, opacity .25s ease; }
.spp-hero-dot:hover, .spp-hero-dot:focus-visible { background: #fff; opacity: .95; }
.spp-hero-dot.is-active { width: 48px !important; min-width: 48px !important; max-width: 48px !important; background: var(--spp-aqua); }

/* Give the rest of the homepage and inner pages a premium editorial rhythm. */
.home #content > .section:not(:first-child),
body:not(.home) #content > .section { padding-top: 88px !important; padding-bottom: 88px !important; }
.home #content > .section:nth-child(2) { background: #fff !important; }
.home #content > .section:nth-child(3) { background: #e9f7f7 !important; }
.home #content > .section:nth-child(4) { background: #fff !important; }
.home #content > .section:nth-child(5) { background: var(--spp-deep) !important; }
.home #content > .section:nth-child(5) h2,
.home #content > .section:nth-child(5) p { color: #fff !important; }
.home #content > .section:nth-child(2) { padding-top: 104px !important; padding-bottom: 104px !important; background: #fff !important; }
.home #content > .section:nth-child(2) .col-inner { max-width: 820px; margin: 0 auto; text-align: center; }
.home #content > .section:nth-child(2) .section-title-main { display: inline-flex; flex-direction: column; gap: 9px; color: var(--spp-deep) !important; font-size: clamp(28px, 3vw, 42px); line-height: 1.08; }
.home #content > .section:nth-child(2) .section-title-main::before { color: var(--spp-teal); content: "THE SPLASH STANDARD"; font-size: 11px; font-weight: 800; letter-spacing: .2em; line-height: 1.2; }
.home #content > .section:nth-child(2) p { color: #4b6870; font-size: 17px; line-height: 1.8; }
.home #content > .section:nth-child(3) { padding: 28px 6vw !important; background: var(--spp-sand) !important; }
.home #content > .section:nth-child(3) .message-box { min-height: 270px; display: flex; align-items: center; overflow: hidden; border-radius: 24px; box-shadow: 0 18px 42px rgba(8,47,58,.16); }
.home #content > .section:nth-child(3) .message-box-bg-overlay { background: linear-gradient(90deg, rgba(8,47,58,.88), rgba(8,47,58,.38)) !important; }
.home #content > .section:nth-child(3) .message-box p { margin: 0; color: #fff; font-size: clamp(24px, 3vw, 38px); font-weight: 800; line-height: 1.15; }
.home #content > .section:nth-child(4) { padding-top: 96px !important; padding-bottom: 112px !important; background: #fff !important; }
.home #content > .section:nth-child(4) .section-content > .row { max-width: 1220px; margin: 0 auto; }
.home #content > .section:nth-child(4) .col { padding: 12px !important; }
.home #content > .section:nth-child(4) .col-inner { height: 100%; overflow: hidden; border: 1px solid var(--spp-line); border-radius: 22px; background: #fff; box-shadow: 0 12px 30px rgba(8,47,58,.08); transition: transform .25s ease, box-shadow .25s ease; }
.home #content > .section:nth-child(4) .col-inner:hover { transform: translateY(-6px); box-shadow: 0 20px 42px rgba(8,47,58,.15); }
.home #content > .section:nth-child(4) .box { margin: 0; }
.home #content > .section:nth-child(4) .box-image { overflow: hidden; }
.home #content > .section:nth-child(4) .box-image .image-zoom { height: 0 !important; padding-top: 100% !important; }
.home #content > .section:nth-child(4) .box-image,
.home #content > .section:nth-child(4) .box-image .image-zoom,
.home #content > .section:nth-child(4) .box-image .image-zoom-long { height: 380px !important; min-height: 0 !important; padding-top: 0 !important; }
.home #content > .section:nth-child(4) .box-image img { display: block !important; width: 100% !important; height: 100% !important; min-height: 100%; object-fit: cover !important; border-radius: 0 !important; transition: transform .45s ease; }
.home #content > .section:nth-child(4) .col-inner:hover .box-image img { transform: scale(1.04); }
.home #content > .section:nth-child(4) .box-text { padding: 18px 22px 24px; }
.home #content > .section:nth-child(4) .box-text-inner { padding: 0; }
.home #content > .section:nth-child(4) .button { width: 100%; margin: 0 !important; }
.home #content > .section:nth-child(5) { padding: 28px 6vw !important; background: #fff !important; }
.home #content > .section:nth-child(5) .message-box { min-height: 260px; display: flex; align-items: center; overflow: hidden; border-radius: 24px; box-shadow: 0 18px 42px rgba(8,47,58,.16); }
.home #content > .section:nth-child(5) .message-box-bg-image { background-image: url("/wp-content/themes/flatsome-child/assets/splash-contact-hero.webp") !important; background-position: center 52% !important; background-size: cover !important; }
.home #content > .section:nth-child(5) .message-box-bg-overlay { background: linear-gradient(90deg, rgba(8,47,58,.86), rgba(8,47,58,.38)) !important; }
.home #content > .section:nth-child(5) .message-box p { margin: 0; color: #fff !important; font-size: clamp(24px, 3vw, 38px); font-weight: 800; line-height: 1.15; }
.home #content > .section:nth-child(5) .button { min-width: 170px; color: #fff !important; border-color: #fff !important; background: transparent !important; }
.home #content > .section:nth-child(5) .button:hover { color: var(--spp-deep) !important; border-color: var(--spp-aqua) !important; background: var(--spp-aqua) !important; }
.section-title span,
.section-title-main { color: var(--spp-deep) !important; font-weight: 800; }
.home .section:nth-child(n+2) .button,
body:not(.home) .button {
	border: 0 !important;
	border-radius: 999px !important;
	background: var(--spp-teal) !important;
	box-shadow: 0 10px 24px rgba(11,143,159,.18) !important;
	font-weight: 800;
	letter-spacing: .06em;
}
.home .section:nth-child(n+2) .button:hover,
body:not(.home) .button:hover { background: var(--spp-deep) !important; transform: translateY(-2px); }
.home #content > .section:nth-child(2) .button:hover,
.home #content > .section:nth-child(3) .button:hover,
.home #content > .section:nth-child(4) .button:hover { color: #fff !important; }

/* Image treatment, content cards, forms, and footer. */
.home #content img,
body:not(.home) #content img { border-radius: 18px; }
.home #content .box,
body:not(.home) #content .box,
.home #content .col-inner { border-radius: 18px; }
input, textarea, select {
	border: 1px solid var(--spp-line) !important;
	border-radius: 10px !important;
	background: #fff !important;
	box-shadow: none !important;
}
input:focus, textarea:focus, select:focus { border-color: var(--spp-teal) !important; box-shadow: 0 0 0 3px rgba(53,200,207,.18) !important; }
.absolute-footer, footer {
	background: var(--spp-deep) !important;
	color: rgba(255,255,255,.78) !important;
	border-top: 4px solid var(--spp-aqua);
}
.absolute-footer a, footer a { color: #b9f5ef !important; }
.absolute-footer a:hover, footer a:hover { color: #fff !important; }
.spp-footer { margin-top: 0; color: rgba(255,255,255,.78); background: var(--spp-deep); border-top: 4px solid var(--spp-aqua); }
.spp-footer-main { padding: 68px 6vw 54px; }
.spp-footer-grid { display: grid; grid-template-columns: minmax(240px, 1.6fr) repeat(2, minmax(130px, .8fr)) minmax(250px, 1.25fr); gap: 42px; max-width: 1280px; margin: 0 auto; }
.spp-footer-brand { max-width: 310px; }
.spp-footer-logo { position: relative; display: block; width: 242px; height: 100px; margin: -7px 0 16px; }
.spp-footer-logo img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center; border-radius: 0 !important; filter: none; opacity: .94; }
.spp-footer-logo-subtitle { position: absolute; right: 5px; bottom: 3px; color: #fff; font-size: 9px; font-weight: 800; letter-spacing: .12em; line-height: 1; }
.spp-footer-brand p, .spp-footer-contact p { margin: 0 0 18px; color: rgba(255,255,255,.72); font-size: 14px; line-height: 1.7; }
.spp-footer-phone { color: #fff !important; font-size: 18px; font-weight: 800; letter-spacing: .02em; }
.spp-footer-column { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.spp-footer-column h3 { margin: 4px 0 9px; color: #fff !important; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; }
.spp-footer-column a { color: rgba(255,255,255,.72) !important; font-size: 14px; }
.spp-footer-column a:hover { color: var(--spp-aqua) !important; }
.spp-footer-contact .button { margin: 4px 0 0 !important; color: #fff !important; background: var(--spp-teal) !important; }
.spp-footer-contact .button:hover { background: var(--spp-aqua) !important; color: var(--spp-deep) !important; }
.spp-footer-bottom { border-top: 1px solid rgba(255,255,255,.14); }
.spp-footer-bottom-inner { display: flex; justify-content: space-between; gap: 20px; max-width: 1280px; margin: 0 auto; padding: 21px 6vw; color: rgba(255,255,255,.54); font-size: 12px; }
.spp-footer-legal { display: flex; gap: 20px; }
.spp-footer-legal a { color: rgba(255,255,255,.66) !important; }
.spp-footer + .absolute-footer, .spp-footer ~ .absolute-footer { display: none !important; }
.footer-widgets { display: none !important; }
/* FAQ: convert the legacy copy into a clear, scannable accordion system. */
.page-id-17 #content > .section { background: var(--spp-sand) !important; padding-top: 76px !important; padding-bottom: 92px !important; }
.page-id-17 #content > .section .col-inner { max-width: 980px; margin: 0 auto; }
.spp-faq-content { max-width: 920px; margin: 0 auto; }
.spp-faq-intro { max-width: 760px; margin: 0 auto 52px; color: #41616a; font-size: 18px; line-height: 1.75; text-align: center; }
.spp-faq-group { margin: 0 0 42px; }
.spp-faq-group h2 { margin: 0 0 16px; color: var(--spp-deep); font-size: 24px; letter-spacing: -.025em; }
.spp-faq-item { margin: 0 0 10px; overflow: hidden; border: 1px solid var(--spp-line); border-radius: 13px; background: #fff; box-shadow: 0 8px 24px rgba(8,47,58,.055); transition: border-color .2s ease, box-shadow .2s ease; }
.spp-faq-item[open] { border-color: rgba(11,143,159,.45); box-shadow: 0 12px 30px rgba(8,47,58,.1); }
.spp-faq-item summary { display: flex; align-items: center; justify-content: space-between; gap: 22px; padding: 22px 25px; color: var(--spp-deep); cursor: pointer; font-size: 16px; font-weight: 800; line-height: 1.4; list-style: none; }
.spp-faq-item summary::-webkit-details-marker { display: none; }
.spp-faq-item summary::after { flex: 0 0 auto; width: 28px; height: 28px; border-radius: 50%; color: #fff; background: var(--spp-teal); content: "+"; font-size: 21px; font-weight: 400; line-height: 27px; text-align: center; transition: transform .2s ease, background .2s ease; }
.spp-faq-item[open] summary::after { background: var(--spp-deep); content: "−"; transform: rotate(180deg); }
.spp-faq-item summary:hover { color: var(--spp-teal); }
.spp-faq-answer { padding: 0 25px 24px; color: #4e6970; font-size: 15px; line-height: 1.75; }
.spp-faq-answer p { margin: 0; }
.spp-faq-note { margin: 16px 0 0; padding: 25px 28px; border: 1px solid rgba(53,200,207,.35); border-radius: 15px; color: var(--spp-ink); background: #e9f7f7; font-size: 16px; line-height: 1.65; }
.spp-faq-note strong { color: var(--spp-deep); }
.spp-faq-note a { color: var(--spp-teal) !important; font-weight: 800; }
/* Contact hero: a warm, realistic pool-finish image with readable title contrast. */
.page-id-20 .page-title .title-bg { background-image: url("/wp-content/themes/flatsome-child/assets/splash-contact-hero.webp") !important; background-position: center center !important; }
.page-id-20 .page-title .title-overlay { background: linear-gradient(90deg, rgba(8,47,58,.84) 0%, rgba(8,47,58,.58) 46%, rgba(8,47,58,.12) 100%) !important; }
.page-id-20 .page-title-inner { min-height: 300px; padding-top: 50px; padding-bottom: 50px; }
.page-id-20 .page-title .entry-title { color: #fff !important; font-size: clamp(42px, 5vw, 68px); letter-spacing: -.045em; }
/* Shared inner-page hero: every page uses the same Contact-style image, overlay, and title layout. */
body:not(.home) .page-title .title-bg { background-image: url("/wp-content/themes/flatsome-child/assets/splash-contact-hero.webp") !important; background-position: center center !important; background-size: cover !important; }
body:not(.home) .page-title .title-overlay { background: linear-gradient(90deg, rgba(8,47,58,.88) 0%, rgba(8,47,58,.58) 48%, rgba(8,47,58,.16) 100%) !important; }
body:not(.home) .page-title-inner { min-height: 300px; padding-top: 50px; padding-bottom: 50px; }
body:not(.home) .page-title .entry-title { color: #fff !important; font-size: clamp(42px, 5vw, 68px); letter-spacing: -.045em; }
.spp-page-hero { position: relative; min-height: 300px; overflow: hidden; background: linear-gradient(90deg, rgba(8,47,58,.88), rgba(8,47,58,.16)), url("/wp-content/themes/flatsome-child/assets/splash-contact-hero.webp") center / cover no-repeat; }
.spp-page-hero-inner { display: flex; align-items: center; min-height: 300px; max-width: 1240px; margin: 0 auto; padding: 50px 6vw; }
.spp-page-hero h1 { margin: 0; color: #fff !important; font-size: clamp(42px, 5vw, 68px); letter-spacing: -.045em; }
/* Newsletter popup: replace the theme placeholder with a warm, realistic pool image. */
#header-newsletter-signup { max-width: 700px !important; padding: 0 !important; overflow: hidden; border: 0 !important; border-radius: 18px !important; background: var(--spp-deep) !important; box-shadow: 0 24px 70px rgba(8,47,58,.35) !important; }
#header-newsletter-signup .banner { min-height: 500px; border-radius: 18px; overflow: hidden; }
#header-newsletter-signup .banner-bg { background-image: url("/wp-content/themes/flatsome-child/assets/splash-newsletter-bg.webp") !important; background-position: center center !important; background-size: cover !important; }
#header-newsletter-signup .banner-bg > img { display: none !important; }
#header-newsletter-signup .banner-bg .overlay { background: linear-gradient(90deg, rgba(8,47,58,.94) 0%, rgba(8,47,58,.76) 44%, rgba(8,47,58,.24) 100%) !important; }
#header-newsletter-signup .is-border { border-color: rgba(185,245,239,.25) !important; border-radius: 12px; }
#header-newsletter-signup .text-box { width: 58% !important; }
#header-newsletter-signup .text-box-content { padding: 35px 8px 35px 0; color: #fff !important; }
#header-newsletter-signup .text-inner h3 { margin-bottom: 12px; color: #fff !important; font-size: 27px; letter-spacing: .02em; }
#header-newsletter-signup .text-inner p.lead { color: rgba(255,255,255,.84) !important; font-size: 15px; line-height: 1.65; }
#header-newsletter-signup .wpforms-field { padding: 0 0 18px !important; }
#header-newsletter-signup .wpforms-field-label { margin-bottom: 8px !important; color: #fff !important; font-size: 16px !important; font-weight: 800 !important; letter-spacing: .02em; }
#header-newsletter-signup .wpforms-required-label { color: var(--spp-aqua) !important; }
#header-newsletter-signup .wpforms-field input { width: 100% !important; min-height: 46px; border: 1px solid rgba(255,255,255,.48) !important; border-radius: 10px !important; color: #fff !important; background: rgba(255,255,255,.13) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.1) !important; }
#header-newsletter-signup .wpforms-field input:focus { border-color: var(--spp-aqua) !important; background: rgba(255,255,255,.2) !important; box-shadow: 0 0 0 3px rgba(53,200,207,.18) !important; }
#header-newsletter-signup .wpforms-submit-container { margin-top: 5px !important; }
#header-newsletter-signup .wpforms-submit { min-height: 48px; padding: 0 28px !important; border: 0 !important; border-radius: 999px !important; color: var(--spp-deep) !important; background: var(--spp-aqua) !important; box-shadow: 0 10px 22px rgba(0,0,0,.15) !important; font-size: 16px !important; font-weight: 800 !important; }
#header-newsletter-signup .wpforms-submit:hover { color: #fff !important; background: var(--spp-teal) !important; }
#header-newsletter-signup input[type="email"], #header-newsletter-signup input[type="text"] { border: 1px solid rgba(255,255,255,.32) !important; color: #fff !important; background: rgba(255,255,255,.12) !important; }
#header-newsletter-signup input::placeholder { color: rgba(255,255,255,.7); }
#header-newsletter-signup input[type="submit"], #header-newsletter-signup button { border: 0 !important; color: var(--spp-deep) !important; background: var(--spp-aqua) !important; font-weight: 800; }
.page-id-20 #content > .section { background: linear-gradient(180deg, #f5f8f7 0%, #eaf5f5 100%) !important; }
.page-id-20 #content > .section .section-content { max-width: 1240px; margin: 0 auto; }
.page-id-20 #content > .section .section-content > .row { align-items: stretch; gap: 28px; }
.page-id-20 #content > .section .section-content > .row > .col { flex: 0 1 calc(50% - 14px) !important; width: calc(50% - 14px) !important; padding: 0 !important; }
.page-id-20 #content > .section .section-content > .row > .col > .col-inner { height: 100%; padding: 38px !important; border: 1px solid var(--spp-line); border-radius: 20px; background: #fff; box-shadow: 0 16px 38px rgba(8,47,58,.08); }
.page-id-20 #content > .section .section-content > .row > .col:first-child > .col-inner { border-color: var(--spp-deep); color: rgba(255,255,255,.8); background: var(--spp-deep); }
.page-id-20 #content > .section .section-content > .row > .col:first-child h3 { margin: 30px 0 10px; color: #fff !important; font-size: 13px; letter-spacing: .12em; text-transform: uppercase; }
.page-id-20 #content > .section .section-content > .row > .col:first-child h3:first-of-type { margin-top: 34px; }
.page-id-20 #content > .section .section-content > .row > .col:first-child p { color: rgba(255,255,255,.78); font-size: 16px; line-height: 1.75; }
.page-id-20 #content > .section .section-content > .row > .col:first-child p:first-child { color: #fff; font-size: 20px; line-height: 1.6; }
.page-id-20 #content > .section .section-content > .row > .col:first-child a { color: var(--spp-aqua) !important; font-weight: 800; }
.page-id-20 #content > .section .section-content > .row > .col:last-child > .col-inner { padding: 34px 38px 38px !important; }
.page-id-20 .section-title-container { margin-bottom: 25px; }
.page-id-20 .section-title { margin: 0; }
.page-id-20 .section-title-main { font-size: 22px; letter-spacing: -.02em; }
.page-id-20 .wpforms-container { margin: 0 !important; }
.page-id-20 .wpforms-field { padding: 0 0 17px !important; }
.page-id-20 .wpforms-field-label { margin-bottom: 7px !important; color: var(--spp-deep) !important; font-size: 13px !important; font-weight: 800 !important; letter-spacing: .04em; }
.page-id-20 .wpforms-field input, .page-id-20 .wpforms-field textarea { width: 100% !important; border: 1px solid var(--spp-line) !important; border-radius: 10px !important; color: var(--spp-ink) !important; background: #f9fcfc !important; }
.page-id-20 .wpforms-field input:focus, .page-id-20 .wpforms-field textarea:focus { border-color: var(--spp-teal) !important; background: #fff !important; }
.page-id-20 .wpforms-submit-container { margin-top: 5px !important; }
.page-id-20 .wpforms-submit { width: 100% !important; min-height: 48px; border: 0 !important; border-radius: 999px !important; color: #fff !important; background: var(--spp-teal) !important; font-size: 13px !important; font-weight: 800 !important; letter-spacing: .1em; text-transform: uppercase; }
.page-id-20 .wpforms-submit:hover { background: var(--spp-deep) !important; }
.page-id-20 .rounded { overflow: hidden; margin-top: 10px; border-radius: 15px; }
.page-id-20 .rounded iframe { display: block; min-height: 300px; border-radius: 15px; }
/* Estimate page: a focused, polished project-intake experience. */
.page-id-139 #content { background: linear-gradient(180deg, #f5f8f7 0%, #eaf5f5 100%) !important; }
.page-id-139 #content .row-main { max-width: 1240px; margin: 0 auto; }
.page-id-139 #content .row-main > .col { padding: 0 !important; }
.page-id-139 #content .row-main > .col > .col-inner { padding: 0 !important; }
.page-id-139 #content .section:has(#wpforms-143) { padding: 88px 24px 104px !important; }
.page-id-139 #wpforms-143 { max-width: 960px; margin: 0 auto !important; padding: 42px 48px 48px; border: 1px solid var(--spp-line); border-radius: 22px; background: #fff; box-shadow: 0 18px 46px rgba(8,47,58,.1); }
.page-id-139 #section_306947564 { padding: 88px 24px 104px !important; }
.page-id-139 #section_306947564 > .section-content > .row { max-width: 960px; margin: 0 auto; }
.page-id-139 #section_306947564 > .section-content > .row > .col { padding: 0 !important; }
.page-id-139 #section_306947564 > .section-content > .row > .col > .col-inner { padding: 42px 48px 48px !important; border: 1px solid var(--spp-line); border-radius: 22px; background: #fff; box-shadow: 0 18px 46px rgba(8,47,58,.1); }
.page-id-139 .section-title-container { margin: 0 0 34px; }
.page-id-139 .section-title { margin: 0; text-align: center; }
.page-id-139 .section-title-main { display: inline-flex; flex-direction: column; align-items: center; gap: 9px; color: var(--spp-deep) !important; font-size: clamp(30px, 4vw, 44px); line-height: 1.05; text-align: center; }
.page-id-139 .section-title-main::before { max-width: 1100px; color: #4b6870; content: "Complete the form below to tell us about your pool project. We will review your details and contact you with a personalized estimate for our services."; font-size: 16px; font-weight: 500; letter-spacing: 0; line-height: 1.65; text-align: center; }
.page-id-139 .spp-footer-column:not(.spp-footer-contact) a[href*="/estimate/"] { display: none !important; }
.page-id-139 .wpforms-container { margin: 0 !important; }
.page-id-139 .wpforms-field-container { display: block; }
.page-id-139 .wpforms-field { padding: 0 0 20px !important; }
.page-id-139 .wpforms-field-label { margin-bottom: 8px !important; color: var(--spp-deep) !important; font-size: 13px !important; font-weight: 800 !important; letter-spacing: .04em; }
.page-id-139 .wpforms-field-description { margin-top: 7px !important; color: #6b8085 !important; font-size: 12px !important; line-height: 1.55; }
.page-id-139 .wpforms-field input, .page-id-139 .wpforms-field textarea, .page-id-139 .wpforms-field select { width: 100% !important; min-height: 46px; border: 1px solid var(--spp-line) !important; border-radius: 10px !important; color: var(--spp-ink) !important; background: #f9fcfc !important; box-shadow: none !important; }
.page-id-139 .wpforms-field textarea { min-height: 120px; padding-top: 13px !important; }
.page-id-139 .wpforms-field input:focus, .page-id-139 .wpforms-field textarea:focus, .page-id-139 .wpforms-field select:focus { border-color: var(--spp-teal) !important; background: #fff !important; box-shadow: 0 0 0 3px rgba(53,200,207,.14) !important; }
.page-id-139 .wpforms-field-row, .page-id-139 .wpforms-field-layout-rows { margin-left: -8px !important; margin-right: -8px !important; }
.page-id-139 .wpforms-field-row-block, .page-id-139 .wpforms-layout-column { padding-left: 8px !important; padding-right: 8px !important; }
.page-id-139 .wpforms-submit-container { margin-top: 8px !important; }
.page-id-139 .wpforms-submit { width: 100% !important; min-height: 52px; border: 0 !important; border-radius: 999px !important; color: #fff !important; background: var(--spp-teal) !important; box-shadow: 0 10px 24px rgba(11,143,159,.2) !important; font-size: 13px !important; font-weight: 800 !important; letter-spacing: .11em; text-transform: uppercase; }
.page-id-139 .wpforms-submit:hover { background: var(--spp-deep) !important; }

/* Gallery: uniform image windows so every project thumbnail fills its card. */
.page-id-14 #content .row.large-columns-4 { row-gap: 22px; }
.page-id-14 #content .gallery-box { height: 270px !important; overflow: hidden; border: 1px solid var(--spp-line); border-radius: 18px; background: #fff; box-shadow: 0 12px 28px rgba(8,47,58,.08); }
.page-id-14 #content .gallery-box .box-image,
.page-id-14 #content .gallery-box .box-image .image-zoom-long { height: 100% !important; min-height: 0 !important; padding: 0 !important; }
.page-id-14 #content .gallery-box .box-image img { display: block; width: 100% !important; height: 100% !important; object-fit: cover; object-position: center; border-radius: 0 !important; }
.page-id-14 #content .gallery-box .box-text { position: absolute; right: 0; bottom: 0; left: 0; padding: 14px 16px; background: linear-gradient(transparent, rgba(8,47,58,.88)); }
.page-id-14 #content .gallery-box .box-text p { margin: 0; color: #fff; font-size: 13px; font-weight: 800; }

/* Featured item detail pages: editorial summary + consistent media gallery. */
.single-featured_item #main { background: linear-gradient(180deg, #f5f8f7 0%, #eaf5f5 100%) !important; }
.single-featured_item .portfolio-page-wrapper { padding: 72px 24px 96px; }
.single-featured_item .portfolio-top .page-wrapper { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 42px; max-width: 1240px; margin: 0 auto; }
.single-featured_item .portfolio-summary { position: sticky; top: 118px; width: 100%; min-width: 0; box-sizing: border-box; padding: 30px 26px 28px; border: 1px solid var(--spp-line); border-radius: 20px; background: #fff; box-shadow: 0 16px 38px rgba(8,47,58,.1); }
.single-featured_item .portfolio-top .page-wrapper > .col { float: none !important; width: auto !important; max-width: none !important; }
.single-featured_item .portfolio-top .page-wrapper > .large-3 { width: 300px !important; }
.single-featured_item .portfolio-top .page-wrapper > .large-9 { min-width: 0; }
.single-featured_item .portfolio-summary.entry-summary.sticky-sidebar { width: 100% !important; max-width: none !important; }
.single-featured_item .featured_item_cats { margin: 0 0 16px !important; }
.single-featured_item .featured_item_cats a { color: var(--spp-teal) !important; font-size: 12px; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.single-featured_item .portfolio-summary .entry-title { margin: 0 0 24px; color: var(--spp-deep); font-size: clamp(28px, 3vw, 46px); letter-spacing: -.045em; line-height: 1.05; }
.single-featured_item .portfolio-share { padding-top: 20px; border-top: 1px solid var(--spp-line); }
.single-featured_item .portfolio-share .icon { color: var(--spp-teal) !important; transition: transform .2s ease, color .2s ease; }
.single-featured_item .portfolio-share .icon:hover { color: var(--spp-deep) !important; transform: translateY(-2px); }
.single-featured_item .spp-featured-cta { width: 100%; margin: 25px 0 0 !important; text-align: center; }
.single-featured_item #portfolio-content { min-width: 0; }
.single-featured_item .portfolio-inner { padding: 0 !important; border: 0; }
.single-featured_item .portfolio-inner > table { width: 100% !important; border-collapse: separate; border-spacing: 0; }
.single-featured_item .portfolio-inner > table td { width: 50% !important; padding: 0 10px !important; vertical-align: top; }
.single-featured_item .portfolio-inner > table td:first-child { padding-left: 0 !important; }
.single-featured_item .portfolio-inner > table td:last-child { padding-right: 0 !important; }
.single-featured_item .gallery-item { margin: 0; }
.single-featured_item .gallery-icon,
.single-featured_item .spp-featured-media-frame { position: relative; height: 590px; overflow: hidden; border: 1px solid var(--spp-line); border-radius: 18px; background: #dfe9e7; box-shadow: 0 18px 40px rgba(8,47,58,.12); }
.single-featured_item .gallery-icon img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; transition: transform .5s ease, filter .5s ease; }
.single-featured_item .gallery-icon:hover img { filter: saturate(1.1); transform: scale(1.035); }
.single-featured_item .spp-featured-image-trigger::after { position: absolute; right: 18px; bottom: 18px; width: 42px; height: 42px; border-radius: 50%; color: var(--spp-deep); content: "↗"; background: var(--spp-aqua); box-shadow: 0 8px 18px rgba(8,47,58,.22); font-size: 23px; line-height: 40px; text-align: center; }
.single-featured_item .spp-featured-video-frame iframe { display: block; width: 100%; height: 100%; border: 0; object-fit: cover; }
.single-featured_item .spp-featured-video-trigger { position: absolute; top: 50%; left: 50%; width: 70px; height: 70px; border: 0; border-radius: 50%; color: #fff; background: rgba(8,47,58,.84); box-shadow: 0 12px 26px rgba(8,47,58,.3); font-size: 27px; line-height: 70px; opacity: .96; transform: translate(-50%, -50%); transition: transform .25s ease, background .25s ease; }
.single-featured_item .spp-featured-video-trigger:hover { background: var(--spp-teal); transform: translate(-50%, -50%) scale(1.08); }
.single-featured_item .spp-featured-video-trigger span { position: relative; left: 2px; }
.spp-modal-open { overflow: hidden; }
.spp-featured-modal { position: fixed; z-index: 100000; inset: 0; display: flex; align-items: center; justify-content: center; padding: 34px; visibility: hidden; opacity: 0; transition: visibility .2s ease, opacity .2s ease; }
.spp-featured-modal.is-open { visibility: visible; opacity: 1; }
.spp-featured-modal-backdrop { position: absolute; inset: 0; background: rgba(8,47,58,.88); backdrop-filter: blur(8px); }
.spp-featured-modal-dialog { position: relative; z-index: 1; width: min(1080px, 94vw); max-height: 92vh; padding: 18px; border: 1px solid rgba(185,245,239,.35); border-radius: 20px; background: #082f3a; box-shadow: 0 28px 80px rgba(0,0,0,.42); }
.spp-featured-modal-content { display: flex; align-items: center; justify-content: center; max-height: calc(92vh - 76px); overflow: hidden; border-radius: 12px; background: #001e26; }
.spp-featured-modal-content img { display: block; max-width: 100%; max-height: calc(92vh - 76px); width: auto; height: auto; object-fit: contain; }
.spp-featured-modal-content iframe { display: block; width: min(100%, 980px); height: min(70vh, 620px); border: 0; }
.spp-featured-modal-close { position: absolute; z-index: 2; top: -17px; left: 50%; display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; padding: 0; border: 2px solid #fff; border-radius: 50%; color: #fff; background: var(--spp-teal); font-size: 22px; line-height: 1; transform: translateX(-50%); }
.spp-featured-modal-caption { margin: 12px 4px 0; color: rgba(255,255,255,.78); font-size: 12px; font-weight: 700; letter-spacing: .04em; text-align: center; }
@media only screen and (max-width: 48em) {
	.single-featured_item .portfolio-page-wrapper { padding: 42px 16px 70px; }
	.single-featured_item .portfolio-top .page-wrapper { display: block; }
	.single-featured_item .portfolio-summary { position: static; margin-bottom: 24px; padding: 24px 20px; }
	.single-featured_item .portfolio-summary .entry-title { font-size: 34px; }
	.single-featured_item .portfolio-inner > table,
	.single-featured_item .portfolio-inner > table tbody,
	.single-featured_item .portfolio-inner > table tr { display: block; }
	.single-featured_item .portfolio-inner > table td { display: block; width: 100% !important; padding: 0 0 18px !important; }
	.single-featured_item .gallery-icon,
	.single-featured_item .spp-featured-media-frame { height: 420px; border-radius: 15px; }
	.spp-featured-modal { padding: 20px 12px; }
	.spp-featured-modal-dialog { width: 100%; padding: 10px; border-radius: 15px; }
	.spp-featured-modal-close { top: -15px; left: 50%; width: 30px; height: 30px; font-size: 19px; transform: translateX(-50%); }
}

/* Services page refresh: calm hierarchy, consistent service cards, and stronger conversion path. */
body.page-id-11 #content { background: linear-gradient(180deg, #f5f9f8 0%, #eef6f5 100%) !important; }
body.page-id-11 #content > .section:first-of-type {
	padding: 76px 24px 68px !important;
	background: #f5f9f8 !important;
}
body.page-id-11 #content > .section:first-of-type .section-content,
body.page-id-11 #content > .section:first-of-type .row { max-width: 900px; margin: 0 auto; }
body.page-id-11 #content > .section:first-of-type .col-inner { padding: 0 !important; text-align: center; }
body.page-id-11 #content > .section:last-of-type h1,
body.page-id-11 #content > .section:last-of-type h2,
body.page-id-11 #content > .section:last-of-type h3,
body.page-id-11 #content > .section:last-of-type h4,
body.page-id-11 #content > .section:last-of-type h5,
body.page-id-11 #content > .section:last-of-type h6,
body.page-id-11 #content > .section:last-of-type p,
body.page-id-11 #content > .section:last-of-type li { color: var(--spp-deep) !important; }
body.page-id-11 #content > .section:first-of-type h1 {
	margin: 0 0 17px;
	color: var(--spp-deep);
	font-size: clamp(31px, 4vw, 48px);
	letter-spacing: -.045em;
	line-height: 1.04;
}
body.page-id-11 #content > .section:first-of-type h1::after {
	display: block;
	width: 54px;
	height: 4px;
	margin: 20px auto 0;
	border-radius: 999px;
	background: linear-gradient(90deg, var(--spp-teal), var(--spp-aqua));
	content: "";
}
body.page-id-11 #content > .section:first-of-type p {
	max-width: 720px;
	margin: 0 auto;
	color: #4b6870;
	font-size: 18px;
	line-height: 1.8;
}
body.page-id-11 #content > .section:not(:first-of-type) {
	position: relative;
	min-height: 390px;
	padding: 58px 24px !important;
	background: #fff !important;
	isolation: isolate;
}
body.page-id-11 #content > .section:not(:first-of-type):nth-of-type(odd) { background: #f5f9f8 !important; }
body.page-id-11 #content > .section:not(:first-of-type) .section-content,
body.page-id-11 #content > .section:not(:first-of-type) > .row { position: relative; z-index: 2; max-width: 1160px; margin: 0 auto; }
body.page-id-11 #content > .section:not(:first-of-type) .section-bg {
	position: absolute !important;
	top: 58px;
	right: auto;
	bottom: 58px;
	left: max(24px, calc((100% - 1160px) / 2));
	width: min(48%, 540px);
	height: auto;
	overflow: hidden;
	border-radius: 22px;
	background: #dcebea;
	box-shadow: 0 18px 45px rgba(8,47,58,.12);
	z-index: 0;
}
body.page-id-11 #content > .section:not(:first-of-type) .section-bg img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center; background: #eaf5f5; opacity: .95; }
body.page-id-11 #content > .section:not(:first-of-type) .section-bg-overlay { background: linear-gradient(90deg, rgba(8,47,58,.2), transparent 70%) !important; }
body.page-id-11 #content > .section:not(:first-of-type) .section-content > .row { display: flex; align-items: center; min-height: 274px; }
body.page-id-11 #content > .section:not(:first-of-type) .section-content > .row > .col:first-child { margin-left: 52%; }
body.page-id-11 #content > .section:not(:first-of-type) .section-content > .row > .col { width: 48%; }
body.page-id-11 #content > .section:not(:first-of-type) .section-content > .row > .col .col-inner {
	padding: 34px 38px !important;
	border: 1px solid rgba(180,211,209,.7);
	border-radius: 20px;
	background: rgba(255,255,255,.94);
	box-shadow: 0 14px 34px rgba(8,47,58,.09);
}
body.page-id-11 #content > .section:not(:first-of-type) h2,
body.page-id-11 #content > .section:not(:first-of-type) h3 {
	margin: 0 0 14px;
	color: var(--spp-deep);
	font-size: clamp(26px, 3vw, 38px);
	letter-spacing: -.045em;
	line-height: 1.08;
}
body.page-id-11 #content > .section:not(:first-of-type) p,
body.page-id-11 #content > .section:not(:first-of-type) li { color: #4b6870; font-size: 16px; line-height: 1.72; }
body.page-id-11 #content > .section:not(:first-of-type) ul { margin: 18px 0 0 18px; }
body.page-id-11 #content > .section:not(:first-of-type) li::marker { color: var(--spp-teal); }
body.page-id-11 #content > .section:not(:first-of-type) .img-inner {
	height: 310px;
	overflow: hidden;
	border-radius: 22px;
	background: #dcebea;
	box-shadow: 0 18px 45px rgba(8,47,58,.12);
}
body.page-id-11 #content > .section:not(:first-of-type) .img-inner img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center; background: #eaf5f5; }
body.page-id-11 #content > .section:last-of-type {
	min-height: 0;
	padding: 72px 24px !important;
	background: linear-gradient(120deg, var(--spp-deep), #118ba0) !important;
}
body.page-id-11 #content > .section:last-of-type .section-bg { display: none; }
body.page-id-11 #content > .section:last-of-type .section-content > .row { display: block; min-height: 0; text-align: center; }
body.page-id-11 #content > .section:last-of-type .section-content > .row > .col { width: 100%; margin: 0 !important; }
body.page-id-11 #content > .section:last-of-type .col-inner { max-width: 760px; margin: 0 auto; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; }
body.page-id-11 #content > .section:last-of-type h2,
body.page-id-11 #content > .section:last-of-type h3,
body.page-id-11 #content > .section:last-of-type p { color: #fff; }
body.page-id-11 #content > .section:last-of-type .button { margin-top: 14px; background: var(--spp-aqua) !important; color: var(--spp-deep) !important; }
@media only screen and (max-width: 48em) {
	body.page-id-11 #content > .section:first-of-type { padding: 56px 22px 48px !important; }
	body.page-id-11 #content > .section:first-of-type p { font-size: 16px; }
	body.page-id-11 #content > .section:not(:first-of-type) { min-height: 0; padding: 30px 18px 42px !important; }
	body.page-id-11 #content > .section:not(:first-of-type) .section-bg { position: relative; top: auto; right: auto; bottom: auto; left: auto; width: 100%; height: 230px; margin: 0 0 20px; }
	body.page-id-11 #content > .section:not(:first-of-type) .section-content > .row { display: block; min-height: 0; }
	body.page-id-11 #content > .section:not(:first-of-type) .section-content > .row > .col:first-child,
	body.page-id-11 #content > .section:not(:first-of-type) .section-content > .row > .col { width: 100%; margin: 0; }
	body.page-id-11 #content > .section:not(:first-of-type) .section-content > .row > .col .col-inner { padding: 26px 22px !important; }
	body.page-id-11 #content > .section:not(:first-of-type) .img-inner { height: 230px; }
	body.page-id-11 #content > .section:last-of-type { padding: 54px 22px !important; }
}

/* Products Finish Studio: choose a real product texture and preview it on a dimensional pool. */
.page-id-23 #content .spp-finish-studio { max-width: 1240px; margin: 0 auto 76px; padding: 44px 48px 48px; border: 1px solid var(--spp-line); border-radius: 24px; background: linear-gradient(135deg, #082f3a, #0d6674); box-shadow: 0 24px 54px rgba(8,47,58,.2); }
.spp-finish-studio-intro { max-width: 760px; color: #fff; }
.spp-finish-eyebrow { margin: 0 0 12px !important; color: var(--spp-aqua) !important; font-size: 11px !important; font-weight: 800 !important; letter-spacing: .2em; line-height: 1.3 !important; }
.spp-finish-studio-intro h2 { margin: 0 0 12px; color: #fff; font-size: clamp(30px, 4vw, 48px); letter-spacing: -.045em; line-height: 1.04; }
.spp-finish-studio-intro > p:last-child { margin: 0; color: rgba(255,255,255,.76); font-size: 16px; line-height: 1.7; }
.spp-finish-studio-grid { display: grid; grid-template-columns: minmax(230px, .75fr) minmax(420px, 1.25fr); gap: 34px; align-items: start; margin-top: 36px; }
.spp-finish-picker { max-height: 560px; overflow: hidden auto; padding: 0 10px 10px 0; scrollbar-color: var(--spp-aqua) rgba(255,255,255,.12); scrollbar-width: thin; }
.spp-finish-picker::-webkit-scrollbar { width: 8px; }
.spp-finish-picker::-webkit-scrollbar-track { border-radius: 99px; background: rgba(255,255,255,.1); }
.spp-finish-picker::-webkit-scrollbar-thumb { border: 2px solid #082f3a; border-radius: 99px; background: linear-gradient(180deg, var(--spp-aqua), var(--spp-teal)); }
.spp-finish-label { margin: 0 0 12px !important; color: #fff !important; font-size: 12px !important; font-weight: 800 !important; letter-spacing: .12em; text-transform: uppercase; }
.spp-finish-filters { display: flex; flex-wrap: wrap; gap: 7px; margin: 0 0 14px; }
.spp-finish-filter { min-width: 0 !important; min-height: 38px !important; padding: 9px 15px !important; border: 1px solid rgba(185,245,239,.34); border-radius: 999px !important; color: rgba(255,255,255,.82); background: rgba(255,255,255,.06); box-shadow: none !important; font-size: 10px; font-weight: 800; letter-spacing: .1em; line-height: 1 !important; text-transform: uppercase; transition: color .2s ease, border-color .2s ease, background .2s ease, transform .2s ease; }
.spp-finish-filter:hover, .spp-finish-filter:focus-visible { border-color: var(--spp-aqua); color: #fff; background: rgba(53,200,207,.18); transform: translateY(-1px); }
.spp-finish-filter.is-active { border-color: var(--spp-aqua); color: var(--spp-deep); background: var(--spp-aqua); }
.spp-finish-option[hidden] { display: none !important; }
.spp-finish-options { display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px; }
.spp-finish-option { position: relative; display: flex; min-height: 164px; flex-direction: column; align-items: stretch; overflow: hidden; padding: 0; border: 1px solid rgba(185,245,239,.28); border-radius: 14px; color: rgba(255,255,255,.9); background: #063944; box-shadow: 0 7px 0 rgba(3,31,39,.5), 0 13px 22px rgba(0,0,0,.16); text-align: left; transform: translateY(0); transition: border-color .25s ease, background .25s ease, box-shadow .25s ease, transform .25s ease; }
.spp-finish-option::after { position: absolute; z-index: 2; inset: 0; pointer-events: none; content: ""; opacity: 0; background: linear-gradient(112deg, transparent 28%, rgba(235,255,255,.42) 48%, transparent 65%); transform: translateX(-110%); transition: opacity .2s ease; }
.spp-finish-option:hover { border-color: var(--spp-aqua); background: #0a5260; box-shadow: 0 9px 0 rgba(3,31,39,.48), 0 18px 28px rgba(0,0,0,.23); transform: translateY(-4px) rotateX(1deg); }
.spp-finish-option:hover::after { opacity: 1; animation: spp-chip-glint .9s ease-out both; }
.spp-finish-option.is-selected { border-color: var(--spp-aqua); background: #0a5260; box-shadow: 0 0 0 2px rgba(53,200,207,.38), 0 8px 0 rgba(3,31,39,.48), 0 18px 30px rgba(0,0,0,.22); transform: translateY(-2px); }
.spp-finish-option img { display: block; width: 100%; height: 104px; flex: 0 0 104px; border: 0; border-radius: 0; object-fit: cover; object-position: center; filter: saturate(.98) contrast(1.04); transition: transform .45s ease, filter .45s ease; }
.spp-finish-option:hover img { filter: saturate(1.16) contrast(1.06); transform: scale(1.07); }
.spp-finish-option span { position: relative; z-index: 3; display: block; padding: 10px 9px 11px; font-size: 10px; font-weight: 800; letter-spacing: .035em; line-height: 1.25; }
.spp-finish-option .spp-finish-swatch { position: absolute; z-index: 4; top: 9px; right: 9px; width: 24px; height: 7px; border: 1px solid rgba(255,255,255,.62); border-radius: 99px; background: #348ca8; box-shadow: 0 2px 5px rgba(8,47,58,.3); }
@keyframes spp-chip-glint { from { transform: translateX(-110%); } to { transform: translateX(110%); } }
.spp-finish-swatch.tone-jade { background: #4aab96; } .spp-finish-swatch.tone-aqua { background: #a8e6e3; } .spp-finish-swatch.tone-tropical { background: #277eb4; } .spp-finish-swatch.tone-night { background: #2d5269; } .spp-finish-swatch.tone-sand { background: #c4a774; }
.spp-finish-preview { padding: 18px; border: 1px solid rgba(185,245,239,.28); border-radius: 18px; background: rgba(4,30,38,.38); }
.spp-pool-3d { position: relative; height: 335px; overflow: hidden; border-radius: 14px; background: linear-gradient(180deg, #c3d2ce 0%, #9ab2b1 42%, #617f87 100%); perspective: 1100px; isolation: isolate; }
.spp-pool-3d::before { position: absolute; z-index: 0; inset: 0; pointer-events: none; content: ""; background: radial-gradient(ellipse at 50% 4%, rgba(255,255,255,.38), transparent 42%), linear-gradient(180deg, transparent 48%, rgba(8,47,58,.2) 100%); }
.spp-pool-3d::after { position: absolute; z-index: 7; inset: 0; pointer-events: none; content: ""; border: 1px solid rgba(255,255,255,.16); border-radius: inherit; box-shadow: inset 0 0 35px rgba(8,47,58,.22); }
.spp-pool-coping { position: absolute; z-index: 5; inset: 12% 7% 15%; border: 14px solid #eadcc2; border-radius: 50% 50% 16% 16%; background: transparent; box-shadow: 0 28px 30px rgba(8,47,58,.32), inset 0 0 0 2px rgba(255,255,255,.62), inset 0 -5px 0 rgba(156,129,92,.22); transform: rotateX(58deg) rotateZ(-2deg) translateZ(24px); }
.spp-pool-coping::after { position: absolute; inset: 5px; border: 1px solid rgba(255,255,255,.5); border-radius: inherit; content: ""; }
.spp-pool-floor { position: absolute; z-index: 2; inset: 20% 13% 18%; border-radius: 47% 47% 13% 13%; background-image: linear-gradient(var(--spp-finish-tint), var(--spp-finish-tint)), var(--spp-finish-image); background-position: center; background-size: cover; box-shadow: inset 0 0 34px rgba(8,47,58,.48), 0 24px 26px rgba(8,47,58,.34); transform: rotateX(58deg) rotateZ(-2deg) translateZ(-40px); filter: saturate(1.08) contrast(1.04); transition: background-image .35s ease, filter .35s ease; }
.spp-pool-floor::after { position: absolute; inset: 0; content: ""; background: repeating-linear-gradient(12deg, rgba(210,255,255,.13) 0 2px, transparent 2px 24px); mix-blend-mode: screen; }
.spp-pool-water { position: absolute; z-index: 4; inset: 22% 15% 23%; overflow: hidden; border: 1px solid rgba(224,255,255,.38); border-radius: 47% 47% 13% 13%; background: linear-gradient(135deg, rgba(144,239,243,.46), rgba(8,117,143,.48) 54%, rgba(5,66,91,.54)); box-shadow: inset 0 0 20px rgba(220,255,255,.24), inset 0 -18px 24px rgba(8,47,58,.26), 0 5px 11px rgba(8,47,58,.2); transform: rotateX(58deg) rotateZ(-2deg) translateZ(8px); pointer-events: none; }
.spp-pool-water::before { position: absolute; z-index: 1; inset: 4%; border: 1px solid rgba(235,255,255,.28); border-radius: inherit; content: ""; box-shadow: inset 0 0 18px rgba(255,255,255,.2); }
.spp-pool-water::after { position: absolute; z-index: 2; inset: 0; pointer-events: none; content: ""; background: radial-gradient(ellipse at 28% 20%, rgba(255,255,255,.42), transparent 27%), linear-gradient(125deg, transparent 30%, rgba(223,255,255,.22) 47%, transparent 60%); mix-blend-mode: screen; }
.spp-pool-water span { position: absolute; inset: -20%; background: repeating-radial-gradient(ellipse at 35% 45%, transparent 0 18px, rgba(218,255,255,.2) 19px 21px, transparent 22px 39px); animation: spp-finish-water 8s linear infinite; }
@keyframes spp-finish-water { from { transform: translate3d(-2%, -1%, 0) rotate(0); } to { transform: translate3d(2%, 1%, 0) rotate(5deg); } }
.spp-pool-wall { position: absolute; z-index: 1; bottom: 22%; width: 17%; height: 27%; background: linear-gradient(90deg, rgba(28,76,88,.88), rgba(111,153,157,.72)); filter: blur(.15px); opacity: .68; transform: skewY(16deg) rotateX(18deg); }
.spp-pool-wall-left { left: 14%; } .spp-pool-wall-right { right: 14%; transform: skewY(-16deg) rotateX(18deg); }
.spp-finish-preview-caption { display: grid; grid-template-columns: 1fr auto; gap: 5px 16px; align-items: center; padding: 14px 2px 0; color: rgba(255,255,255,.56); font-size: 11px; }
.spp-selected-finish { color: #fff; font-weight: 800; }
.spp-finish-caption-note { color: rgba(255,255,255,.56); }
.spp-finish-details-link { grid-column: 2; grid-row: 1 / span 2; align-self: center; color: var(--spp-aqua); font-size: 11px; font-weight: 800; letter-spacing: .035em; text-decoration: none; white-space: nowrap; transition: color .2s ease, transform .2s ease; }
.spp-finish-details-link:hover, .spp-finish-details-link:focus-visible { color: #fff; transform: translateX(2px); }
.spp-finish-quote { margin-top: 38px; padding-top: 28px; border-top: 1px solid rgba(185,245,239,.22); }
.spp-finish-quote-heading { position: relative; display: flex; justify-content: space-between; gap: 20px; align-items: end; padding-right: 42px; cursor: pointer; }
.spp-finish-quote-heading::after { position: absolute; top: 50%; right: 4px; display: grid; width: 30px; height: 30px; place-items: center; border: 1px solid rgba(185,245,239,.42); border-radius: 50%; color: var(--spp-aqua); content: "+"; font-size: 22px; line-height: 1; transform: translateY(-50%); transition: background .2s ease, color .2s ease, transform .2s ease; }
.spp-finish-quote-heading:hover::after,
.spp-finish-quote-heading:focus-visible::after { color: var(--spp-deep); background: var(--spp-aqua); }
.spp-finish-quote:not(.is-collapsed) .spp-finish-quote-heading::after { content: "−"; transform: translateY(-50%) rotate(180deg); }
.spp-finish-quote.is-collapsed .spp-finish-fields,
.spp-finish-quote.is-collapsed > .button { display: none; }
.spp-finish-quote.is-collapsed { padding-bottom: 2px; }
.spp-finish-quote h3 { margin: 0; color: #fff; font-size: 25px; }
.spp-finish-quote-status { max-width: 420px; color: var(--spp-aqua); font-size: 13px; line-height: 1.4; text-align: right; }
.spp-finish-fields { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 13px; margin: 20px 0; }
.spp-finish-fields label { color: rgba(255,255,255,.78); font-size: 11px; font-weight: 800; letter-spacing: .04em; }
.spp-finish-fields input, .spp-finish-fields textarea { display: block; width: 100%; margin-top: 7px; border: 1px solid rgba(185,245,239,.28) !important; color: #fff !important; background: rgba(255,255,255,.1) !important; }
.spp-finish-fields textarea { resize: vertical; }
.spp-finish-fields label:last-of-type { grid-column: 1 / -1; }
.spp-finish-honeypot { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.spp-finish-quote > .button { margin: 0; }
@media only screen and (max-width: 48em) {
	.page-id-23 #content .spp-finish-studio { margin: 0 16px 52px; padding: 28px 19px 30px; border-radius: 18px; }
	.spp-finish-studio-grid { grid-template-columns: 1fr; gap: 24px; }
	.spp-finish-options { grid-template-columns: 1fr 1fr; gap: 10px; }
	.spp-finish-picker { max-height: 430px; padding-right: 7px; }
	.spp-finish-option { min-height: 148px; }
	.spp-finish-option img { height: 90px; flex-basis: 90px; }
	.spp-pool-3d { height: 260px; }
	.spp-finish-preview-caption { grid-template-columns: 1fr; }
	.spp-finish-details-link { grid-column: 1; grid-row: auto; }
	.spp-finish-quote-heading { display: block; }
	.spp-finish-quote-status { margin-top: 12px; text-align: left; }
	.spp-finish-fields { grid-template-columns: 1fr; }
	.spp-finish-fields label:last-of-type { grid-column: auto; }
}

/* Products catalogue: refined filter bar, consistent cards, and calmer supporting sections. */
.page-id-23 #content > .section:first-of-type { padding: 76px 24px 92px !important; background: #f5f8f7 !important; }
.page-id-23 #content > .section:first-of-type > .section-content > .row { max-width: 1240px; margin: 0 auto; }
.page-id-23 #content .portfolio-element-wrapper.has-filtering::before { display: block; margin: 0 0 24px; color: var(--spp-deep); content: "Explore our finish collection"; font-size: clamp(28px, 3vw, 42px); font-weight: 800; letter-spacing: -.04em; line-height: 1.05; text-align: center; }
.page-id-23 #content .filter-nav { display: flex; justify-content: center; gap: 9px; margin: 0 0 32px !important; padding: 0; }
.page-id-23 #content .filter-nav li { margin: 0 !important; }
.page-id-23 #content .filter-nav a { display: block; padding: 10px 19px; border: 1px solid var(--spp-line); border-radius: 999px; color: var(--spp-ink) !important; background: #fff; font-size: 11px; font-weight: 800; letter-spacing: .1em; line-height: 1; text-decoration: none; transition: color .2s ease, background .2s ease, border-color .2s ease, transform .2s ease; }
.page-id-23 #content .filter-nav a:hover,
.page-id-23 #content .filter-nav .active a { border-color: var(--spp-teal); color: #fff !important; background: var(--spp-teal); transform: translateY(-2px); }
.page-id-23 #content .row-isotope > .col { padding: 10px !important; }
.page-id-23 #content .row-isotope > .col > .col-inner { height: 100%; padding: 0 !important; border-radius: 18px !important; background: transparent; }
.page-id-23 #content .portfolio-box { height: 100%; overflow: hidden; border: 1px solid var(--spp-line); border-radius: 18px !important; background: #fff; box-shadow: 0 10px 25px rgba(8,47,58,.07); transition: transform .25s ease, box-shadow .25s ease; }
.page-id-23 #content .portfolio-box:hover { box-shadow: 0 18px 36px rgba(8,47,58,.16); transform: translateY(-5px); }
.page-id-23 #content .portfolio-box .box-image { height: 250px !important; overflow: hidden; border-radius: 0 !important; }
.page-id-23 #content .portfolio-box .box-image .image-zoom-long { height: 100% !important; padding: 0 !important; }
.page-id-23 #content .portfolio-box .box-image img { display: block; width: 100% !important; height: 100% !important; object-fit: cover; object-position: center; border-radius: 0 !important; transition: transform .5s ease, filter .5s ease; }
.page-id-23 #content .portfolio-box:hover .box-image img { filter: saturate(1.1); transform: scale(1.05); }
.page-id-23 #content .portfolio-box .box-text { min-height: 90px; padding: 19px 18px 21px; background: #fff; }
.page-id-23 #content .portfolio-box-title { margin: 0 0 8px; color: var(--spp-deep); font-size: 13px; letter-spacing: .01em; line-height: 1.3; }
.page-id-23 #content .portfolio-box-category { margin: 0; color: var(--spp-teal); font-size: 10px; font-weight: 800; letter-spacing: .13em; }
.page-id-23 #content > .section:not(:first-of-type) { padding: 68px 24px !important; background: #fff !important; }
.page-id-23 #content > .section:not(:first-of-type):nth-of-type(even) { background: #f5f8f7 !important; }
.page-id-23 #content > .section:not(:first-of-type) > .section-content > .row { max-width: 1120px; margin: 0 auto; }
.page-id-23 #content > .section:not(:first-of-type) .col-inner { padding: 34px !important; border: 1px solid var(--spp-line); border-radius: 20px; background: #fff; box-shadow: 0 14px 32px rgba(8,47,58,.07); }
.page-id-23 #content > .section:not(:first-of-type) h2,
.page-id-23 #content > .section:not(:first-of-type) h3 { color: var(--spp-deep); letter-spacing: -.03em; }
.page-id-23 #content > .section:not(:first-of-type) p,
.page-id-23 #content > .section:not(:first-of-type) li { color: #4b6870; line-height: 1.75; }
@media only screen and (max-width: 48em) {
	.page-id-23 #content > .section:first-of-type { padding: 54px 12px 68px !important; }
	.page-id-23 #content .filter-nav { gap: 6px; margin-bottom: 22px !important; }
	.page-id-23 #content .filter-nav a { padding: 9px 12px; font-size: 9px; }
	.page-id-23 #content .row-isotope > .col { padding: 6px !important; }
	.page-id-23 #content .portfolio-box .box-image { height: 160px !important; }
	.page-id-23 #content .portfolio-box .box-text { min-height: 78px; padding: 13px 11px 14px; }
	.page-id-23 #content .portfolio-box-title { font-size: 11px; }
	.page-id-23 #content > .section:not(:first-of-type) { padding: 50px 16px !important; }
	.page-id-23 #content > .section:not(:first-of-type) .col-inner { padding: 24px 20px !important; }
}

/* Legal pages: calm, editorial reading layout with clear section rhythm. */
.page-id-26 #content,
.page-id-3 #content {
	background: linear-gradient(180deg, #f5f8f7 0%, #eaf5f5 100%) !important;
}
.page-id-26 #content > .section,
.page-id-3 #content > .section {
	padding: 76px 24px 96px !important;
}
.page-id-26 #content > .section > .section-content > .row,
.page-id-3 #content > .section > .section-content > .row {
	max-width: 980px;
	margin: 0 auto;
}
.page-id-26 #content > .section > .section-content > .row > .col,
.page-id-3 #content > .section > .section-content > .row > .col {
	padding: 0 !important;
}
.page-id-26 #content > .section > .section-content > .row > .col > .col-inner,
.page-id-3 #content > .section > .section-content > .row > .col > .col-inner {
	padding: 42px 52px 50px !important;
	border: 1px solid var(--spp-line);
	border-radius: 22px;
	background: #fff;
	box-shadow: 0 18px 46px rgba(8,47,58,.1);
}
.page-id-26 .section-title-container,
.page-id-3 .section-title-container {
	margin: 0 0 30px;
	padding: 0;
}
.page-id-26 .section-title,
.page-id-3 .section-title {
	margin: 0;
	text-align: left;
}
.page-id-26 .section-title b,
.page-id-3 .section-title b {
	display: none;
}
.page-id-26 .section-title-main,
.page-id-3 .section-title-main {
	color: var(--spp-deep) !important;
	font-size: clamp(30px, 4vw, 44px);
	font-weight: 800;
	letter-spacing: -.045em;
	line-height: 1.05;
}
.page-id-26 #content p,
.page-id-3 #content p {
	color: #4b6870;
	font-size: 16px;
	line-height: 1.82;
}
.page-id-26 #content > .section > .section-content > .row > .col > .col-inner > p:first-of-type,
.page-id-3 #content > .section > .section-content > .row > .col > .col-inner > p:first-of-type {
	margin-bottom: 30px;
	color: var(--spp-ink);
	font-size: 18px;
	line-height: 1.75;
}
.page-id-26 #content h3:not(.section-title),
.page-id-3 #content h3:not(.section-title) {
	margin: 30px 0 12px;
	padding-top: 24px;
	border-top: 1px solid var(--spp-line);
	color: var(--spp-deep);
	font-size: 19px;
	font-weight: 800;
	letter-spacing: -.01em;
	line-height: 1.35;
}
.page-id-26 #content h3:not(.section-title) strong,
.page-id-3 #content h3:not(.section-title) strong {
	font-weight: inherit;
}
.page-id-26 #content ul,
.page-id-3 #content ul {
	margin: 0 0 24px 20px;
	color: #4b6870;
}
.page-id-26 #content li,
.page-id-3 #content li {
	padding: 4px 0 4px 6px;
	font-size: 15px;
	line-height: 1.7;
}
.page-id-26 #content li::marker,
.page-id-3 #content li::marker {
	color: var(--spp-aqua);
}
.page-id-26 #content hr,
.page-id-3 #content hr {
	display: none;
}
.page-id-26 #content a,
.page-id-3 #content a {
	color: var(--spp-teal);
	font-weight: 700;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}
.page-id-26 #content strong,
.page-id-3 #content strong {
	color: var(--spp-deep);
}
.page-id-26 #content h3:last-of-type + p,
.page-id-3 #content h3:last-of-type + p {
	margin-top: 20px;
	padding: 20px 22px;
	border: 1px solid #c9ecec;
	border-radius: 14px;
	background: #eaf9f9;
}
.cookie-law-info-bar {
	border: 0 !important;
	box-shadow: 0 14px 40px rgba(8,47,58,.18) !important;
	border-radius: 16px !important;
}

/* Floating accessibility and privacy controls: compact Splash-branded treatment. */
#userway-widget,
.uwy,
[data-testid="userway-widget"] {
	filter: drop-shadow(0 10px 20px rgba(8,47,58,.2));
}
#userway-widget iframe,
.uwy iframe {
	border-radius: 18px !important;
}
#cookie-law-info-again,
.cky-btn-revisit,
.cky-revisit-bottom-left,
.cky-revisit-bottom-right {
	width: 48px !important;
	height: 48px !important;
	min-width: 48px !important;
	min-height: 48px !important;
	padding: 0 !important;
	border: 2px solid rgba(255,255,255,.86) !important;
	border-radius: 50% !important;
	color: #fff !important;
	background: linear-gradient(145deg, var(--spp-aqua), var(--spp-teal)) !important;
	box-shadow: 0 10px 22px rgba(8,47,58,.24), inset 0 1px 0 rgba(255,255,255,.28) !important;
	font-size: 0 !important;
	line-height: 1 !important;
	transition: transform .24s ease, box-shadow .24s ease, filter .24s ease !important;
}
#cookie-law-info-again::before,
.cky-btn-revisit::before,
.cky-revisit-bottom-left::before,
.cky-revisit-bottom-right::before {
	content: "";
	display: block;
	width: 18px;
	height: 18px;
	margin: 0 auto;
	border: 2px solid currentColor;
	border-radius: 50%;
	box-sizing: border-box;
}
#cookie-law-info-again:hover,
#cookie-law-info-again:focus-visible,
.cky-btn-revisit:hover,
.cky-btn-revisit:focus-visible,
.cky-revisit-bottom-left:hover,
.cky-revisit-bottom-left:focus-visible,
.cky-revisit-bottom-right:hover,
.cky-revisit-bottom-right:focus-visible {
	transform: translateY(-3px) scale(1.04) !important;
	filter: saturate(1.12) brightness(1.04);
	box-shadow: 0 14px 28px rgba(8,47,58,.3), inset 0 1px 0 rgba(255,255,255,.34) !important;
}
@media only screen and (max-width: 48em) {
	#cookie-law-info-again,
	.cky-btn-revisit,
	.cky-revisit-bottom-left,
	.cky-revisit-bottom-right {
		width: 44px !important;
		height: 44px !important;
		min-width: 44px !important;
		min-height: 44px !important;
	}
}

@media only screen and (max-width: 48em) {
	#masthead { min-height: 78px !important; }
	#logo { width: 170px !important; }
	#logo a { width: 170px; height: 70px; background-size: 170px 113px; }
	#logo a::after { right: 4px; bottom: 2px; font-size: 6px; }
	.spp-logo-splash { inset: 24% 8% 17%; }
	#masthead .button { font-size: 10px; padding: 9px 12px !important; }
	.spp-header-actions { gap: 8px; padding-left: 4px; }
	.spp-header-phone { display: none; }
	.home #content > .section:first-child,
	.home #content > .section:first-child .section-content { min-height: 600px; }
	.home #content > .section:first-child {
		background-position: 62% center !important;
		background-image: linear-gradient(90deg, rgba(8,47,58,.9) 0%, rgba(8,47,58,.52) 100%), url("/wp-content/uploads/2025/06/IMG_0332-scaled-1.jpg") !important;
	}
	.home #content > .section:first-child .section-content { padding: 56px 24px !important; }
	.spp-hero-copy h1 { font-size: 45px; }
	.spp-hero-copy p { font-size: 16px; }
	.spp-hero-controls { right: 24px; bottom: 70px; }
	.spp-hero-dots { right: 24px; bottom: 35px; }
	.spp-footer-main { padding: 52px 24px 40px; }
	.spp-footer-grid { grid-template-columns: 1fr 1fr; gap: 36px 24px; }
	.spp-footer-brand, .spp-footer-contact { grid-column: 1 / -1; max-width: none; }
	.spp-footer-logo { width: 220px; height: 90px; }
	.spp-footer-bottom-inner { flex-direction: column; align-items: flex-start; padding: 18px 24px; }
	.spp-footer-legal { flex-wrap: wrap; gap: 8px 16px; }
	.page-id-17 #content > .section { padding-top: 52px !important; padding-bottom: 62px !important; }
	.spp-faq-intro { margin-bottom: 36px; font-size: 16px; text-align: left; }
	.spp-faq-group { margin-bottom: 30px; }
	.spp-faq-group h2 { font-size: 21px; }
	.spp-faq-item summary { padding: 18px 17px; font-size: 15px; }
	.spp-faq-item summary::after { width: 25px; height: 25px; font-size: 19px; line-height: 24px; }
	.spp-faq-answer { padding: 0 17px 19px; font-size: 14px; }
	.spp-faq-note { padding: 20px; font-size: 15px; }
	.page-id-20 .page-title-inner { min-height: 230px; padding-top: 34px; padding-bottom: 34px; }
	.page-id-20 .page-title .entry-title { font-size: 43px; }
	body:not(.home) .page-title-inner, .spp-page-hero-inner { min-height: 230px; padding-top: 34px; padding-bottom: 34px; }
	body:not(.home) .page-title .entry-title, .spp-page-hero h1 { font-size: 43px; }
	#header-newsletter-signup .banner { min-height: 520px; }
	#header-newsletter-signup .text-box { width: 86% !important; }
	#header-newsletter-signup .text-box-content { padding: 32px 0; }
	#header-newsletter-signup .text-inner h3 { font-size: 23px; }
	.home #content > .section:nth-child(2) { padding-top: 68px !important; padding-bottom: 68px !important; }
	.home #content > .section:nth-child(2) p { font-size: 16px; text-align: left; }
	.home #content > .section:nth-child(3), .home #content > .section:nth-child(5) { padding: 18px 16px !important; }
	.home #content > .section:nth-child(3) .message-box, .home #content > .section:nth-child(5) .message-box { min-height: 285px; border-radius: 18px; }
	.home #content > .section:nth-child(3) .message-box p, .home #content > .section:nth-child(5) .message-box p { font-size: 26px; }
	.home #content > .section:nth-child(4) { padding-top: 58px !important; padding-bottom: 66px !important; }
	.home #content > .section:nth-child(4) .col { padding: 8px 0 !important; }
	.home #content > .section:nth-child(4) .box-image,
	.home #content > .section:nth-child(4) .box-image .image-zoom,
	.home #content > .section:nth-child(4) .box-image .image-zoom-long { height: 270px !important; }
	.page-id-20 #content > .section .section-content > .row { gap: 20px; }
	.page-id-20 #content > .section .section-content > .row > .col { flex: 0 0 100% !important; width: 100% !important; }
	.page-id-20 #content > .section .section-content > .row > .col > .col-inner,
	.page-id-20 #content > .section .section-content > .row > .col:last-child > .col-inner { padding: 27px 22px !important; }
	.page-id-20 #content > .section .section-content > .row > .col:first-child p:first-child { font-size: 18px; }
	.page-id-139 #section_306947564 { padding: 56px 16px 70px !important; }
	.page-id-139 #content .section:has(#wpforms-143) { padding: 56px 16px 70px !important; }
	.page-id-139 #wpforms-143 { padding: 27px 20px 30px; border-radius: 17px; }
	.page-id-139 #section_306947564 > .section-content > .row > .col > .col-inner { padding: 27px 20px 30px !important; border-radius: 17px; }
	.page-id-139 .section-title-container { margin-bottom: 27px; }
	.page-id-139 .section-title-main { font-size: 31px; }
	.page-id-139 .section-title-main::before { font-size: 14px; line-height: 1.65; }
	.page-id-139 .wpforms-field-row, .page-id-139 .wpforms-field-layout-rows { margin-left: 0 !important; margin-right: 0 !important; }
	.page-id-139 .wpforms-field-row-block, .page-id-139 .wpforms-layout-column { padding-left: 0 !important; padding-right: 0 !important; }
	.page-id-26 #content > .section,
	.page-id-3 #content > .section { padding: 54px 16px 68px !important; }
	.page-id-26 #content > .section > .section-content > .row > .col > .col-inner,
	.page-id-3 #content > .section > .section-content > .row > .col > .col-inner { padding: 28px 21px 32px !important; border-radius: 17px; }
	.page-id-26 .section-title-container,
	.page-id-3 .section-title-container { margin-bottom: 24px; }
	.page-id-26 .section-title-main,
	.page-id-3 .section-title-main { font-size: 31px; }
	.page-id-26 #content > .section > .section-content > .row > .col > .col-inner > p:first-of-type,
	.page-id-3 #content > .section > .section-content > .row > .col > .col-inner > p:first-of-type { font-size: 16px; line-height: 1.72; }
	.page-id-26 #content h3:not(.section-title),
	.page-id-3 #content h3:not(.section-title) { margin-top: 25px; padding-top: 20px; font-size: 17px; }
	.page-id-26 #content p,
	.page-id-3 #content p,
	.page-id-26 #content li,
	.page-id-3 #content li { font-size: 14px; line-height: 1.7; }
	.page-id-14 #content .gallery-box { height: 190px !important; border-radius: 14px; }
	.page-id-14 #content .row.large-columns-4 { row-gap: 14px; }
	.home #content > .section:not(:first-child),
	body:not(.home) #content > .section { padding-top: 58px !important; padding-bottom: 58px !important; }
}


@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/


}

/* Compact, page-specific headers: realistic project imagery with a lighter footprint. */
body.page-id-11 .page-title .title-bg,
body.page-id-11 .spp-page-hero { background-image: url("/wp-content/uploads/2025/06/IMG_0332-scaled-1.jpg") !important; background-position: center 52% !important; }
body.page-id-23 .page-title .title-bg,
body.page-id-23 .spp-page-hero { background-image: url("/wp-content/uploads/2025/06/IMG_0263.jpg") !important; background-position: center 48% !important; }
body.page-id-14 .page-title .title-bg,
body.page-id-14 .spp-page-hero { background-image: url("/wp-content/uploads/2025/01/IMG_0395-scaled.jpg") !important; background-position: center 52% !important; }
body.page-id-20 .page-title .title-bg,
body.page-id-20 .spp-page-hero { background-image: url("/wp-content/themes/flatsome-child/assets/splash-contact-hero.webp") !important; background-position: center 52% !important; }
body.page-id-139 .page-title .title-bg,
body.page-id-139 .spp-page-hero { background-image: url("/wp-content/uploads/2025/01/IMG_0294-scaled.jpg") !important; background-position: center 50% !important; }
body.page-id-17 .page-title .title-bg,
body.page-id-17 .spp-page-hero { background-image: url("/wp-content/uploads/2025/01/IMG_0388-scaled.jpg") !important; background-position: center 50% !important; }
body.page-id-26 .page-title .title-bg,
body.page-id-26 .spp-page-hero { background-image: url("/wp-content/uploads/2025/01/IMG_0352-1024x1024.jpg") !important; background-position: center 50% !important; }
body.page-id-3 .page-title .title-bg,
body.page-id-3 .spp-page-hero { background-image: url("/wp-content/uploads/2025/07/assets_task_01k1at3r2ae758x9qxdn5xa3p0_1753783554_img_0-1024x683.webp") !important; background-position: center 50% !important; }

body:not(.home) .page-title-inner,
body:not(.home) .spp-page-hero-inner,
body:not(.home) .spp-page-hero { min-height: 150px !important; }
body:not(.home) .page-title-inner,
body:not(.home) .spp-page-hero-inner { padding-top: 24px !important; padding-bottom: 24px !important; }
body:not(.home) .page-title .entry-title,
body:not(.home) .spp-page-hero h1 { font-size: clamp(32px, 4vw, 48px); }

@media only screen and (max-width: 48em) {
	body:not(.home) .page-title-inner,
	body:not(.home) .spp-page-hero-inner,
	body:not(.home) .spp-page-hero { min-height: 150px !important; }
	body:not(.home) .page-title-inner,
	body:not(.home) .spp-page-hero-inner { padding-top: 22px !important; padding-bottom: 22px !important; }
	body:not(.home) .page-title .entry-title,
	body:not(.home) .spp-page-hero h1 { font-size: 32px; }
}

/* Service-area landing pages: useful local content with a polished, conversion-focused layout. */
.spp-location-page #content { background: linear-gradient(180deg, #f5f8f7 0%, #eaf5f5 100%) !important; }
.spp-location-page #content > .section { padding: 0 !important; }
.spp-location-page #content > .section > .section-content,
.spp-location-page #content > .section > .section-content > .row,
.spp-location-page #content > .section > .section-content > .row > .col,
.spp-location-page #content > .section > .section-content > .row > .col > .col-inner { padding: 0 !important; }
.spp-location-landing { overflow: hidden; }
.spp-location-intro { padding: 84px max(24px, calc((100% - 1160px) / 2)); background: linear-gradient(90deg, rgba(8,47,58,.94), rgba(8,47,58,.64)), url("/wp-content/themes/flatsome-child/assets/splash-contact-hero.webp") center / cover no-repeat; }
.spp-location-eyebrow { margin: 0 0 14px !important; color: var(--spp-aqua) !important; font-size: 11px !important; font-weight: 800 !important; letter-spacing: .2em; line-height: 1.3 !important; }
.spp-location-intro h1 { max-width: 760px; margin: 0 0 20px; color: #fff !important; font-size: clamp(38px, 5vw, 68px); letter-spacing: -.05em; line-height: 1.03; }
.spp-location-lead { max-width: 740px; margin: 0 0 30px !important; color: rgba(255,255,255,.86) !important; font-size: 19px !important; line-height: 1.7 !important; }
.spp-location-intro .button { margin: 0; }
.spp-location-section { display: grid; grid-template-columns: minmax(280px, .9fr) minmax(320px, 1.1fr); gap: 64px; align-items: start; max-width: 1160px; margin: 0 auto; padding: 82px 24px 76px; }
.spp-location-section h2, .spp-location-cta h2 { margin: 0; color: var(--spp-deep); font-size: clamp(28px, 3vw, 42px); letter-spacing: -.04em; line-height: 1.08; }
.spp-location-section > p { margin: 0; color: #4b6870; font-size: 17px; line-height: 1.8; }
.spp-location-services { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1160px; margin: 0 auto; padding: 0 24px 82px; }
.spp-location-services article { padding: 28px 25px; border: 1px solid var(--spp-line); border-radius: 16px; background: #fff; box-shadow: 0 12px 28px rgba(8,47,58,.07); }
.spp-location-services h3 { margin: 0 0 10px; color: var(--spp-deep); font-size: 19px; }
.spp-location-services p { margin: 0; color: #5b7378; font-size: 15px; line-height: 1.7; }
.spp-location-cta { display: flex; justify-content: space-between; align-items: center; gap: 30px; max-width: 1160px; margin: 0 auto 84px; padding: 40px 46px; border-radius: 20px; background: linear-gradient(110deg, var(--spp-deep), #138ea3); }
.spp-location-cta h2 { color: #fff; }
.spp-location-cta .spp-location-eyebrow { color: #aaf2ed !important; }
.spp-location-cta .button { flex: 0 0 auto; margin: 0; background: var(--spp-aqua) !important; color: var(--spp-deep) !important; }

@media only screen and (max-width: 48em) {
	.spp-location-intro { padding: 60px 22px; }
	.spp-location-lead { font-size: 16px !important; }
	.spp-location-section { display: block; padding: 58px 22px 48px; }
	.spp-location-section > p { margin-top: 22px; font-size: 15px; }
	.spp-location-services { grid-template-columns: 1fr; padding: 0 22px 58px; }
	.spp-location-cta { display: block; margin: 0 16px 60px; padding: 30px 24px; }
	.spp-location-cta .button { margin-top: 24px; }
}

/* 404 pool-plastering game. */
.error404 #content,
.error404 #main { background: radial-gradient(circle at 80% 0%, rgba(53,200,207,.18), transparent 32%), linear-gradient(180deg, #082f3a 0%, #0d5967 55%, #eaf5f5 55%, #f5f8f7 100%) !important; }
.error404 #content > *:not(.spp-404-game),
.error404 #main > *:not(.spp-404-game) { display: none !important; }
.spp-404-game { min-height: 940px; padding: 78px 20px 110px; background: radial-gradient(circle at 80% 0%, rgba(53,200,207,.18), transparent 32%), linear-gradient(180deg, #082f3a 0%, #0d5967 55%, #eaf5f5 55%, #f5f8f7 100%) !important; }
.spp-404-game-shell { max-width: 1180px; margin: 0 auto; }
.spp-404-game-intro { display: grid; grid-template-columns: 1.1fr .9fr; gap: 38px; align-items: end; margin-bottom: 28px; color: #fff; }
.spp-404-eyebrow { grid-column: 1 / -1; margin: 0 !important; color: var(--spp-aqua) !important; font-size: 11px !important; font-weight: 800 !important; letter-spacing: .22em; }
.spp-404-game-intro h1 { margin: 0; color: #fff; font-size: clamp(42px, 6vw, 76px); letter-spacing: -.06em; line-height: .95; }
.spp-404-game-intro > p:not(.spp-404-eyebrow) { max-width: 480px; margin: 0 0 3px; color: rgba(255,255,255,.78); font-size: 16px; line-height: 1.7; }
.spp-404-stats { display: flex; grid-column: 1 / -1; gap: 12px; align-items: center; }
.spp-404-level, .spp-404-finish { display: inline-flex; align-items: center; min-height: 34px; padding: 7px 13px; border: 1px solid rgba(185,245,239,.3); border-radius: 999px; color: rgba(255,255,255,.86); background: rgba(255,255,255,.08); font-size: 12px; font-weight: 700; }
.spp-404-level b { margin-left: 4px; color: var(--spp-aqua); }
.spp-404-finish { color: var(--spp-deep); background: var(--spp-aqua); border-color: var(--spp-aqua); }
.spp-404-game-board { padding: 22px; border: 1px solid rgba(185,245,239,.3); border-radius: 24px; background: rgba(8,47,58,.72); box-shadow: 0 26px 70px rgba(8,47,58,.35); backdrop-filter: blur(12px); }
.spp-404-board-head, .spp-404-controls { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.spp-404-board-head { margin: 0 3px 15px; color: rgba(255,255,255,.78); font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.spp-404-progress { color: var(--spp-aqua); }
.spp-404-canvas-wrap { position: relative; overflow: hidden; border-radius: 17px; background: #dfe9e7; box-shadow: inset 0 0 0 2px rgba(255,255,255,.16); }
#spp-404-canvas { display: block; width: 100%; height: auto; cursor: crosshair; touch-action: none; }
.spp-404-board-message { position: absolute; top: 50%; left: 50%; padding: 12px 18px; border: 1px solid rgba(185,245,239,.4); border-radius: 999px; color: #fff; background: rgba(8,47,58,.86); font-size: 13px; font-weight: 800; opacity: 0; pointer-events: none; transform: translate(-50%, -50%) translateY(8px); transition: opacity .25s ease, transform .25s ease; }
.spp-404-board-message.is-visible { opacity: 1; transform: translate(-50%, -50%) translateY(0); }
.spp-404-controls { padding-top: 17px; }
.spp-404-brush { position: relative; display: flex; align-items: center; gap: 9px; color: rgba(255,255,255,.7); font-size: 12px; font-weight: 700; white-space: nowrap; }
.spp-404-brush i, .spp-404-brush b, .spp-404-brush em { display: block; width: 13px; height: 13px; border-radius: 50%; background: #dceff0; box-shadow: inset 1px 1px 3px rgba(8,47,58,.26); }
.spp-404-brush b { width: 18px; height: 18px; background: #8bd9de; }
.spp-404-brush em { background: #348ca8; }
.spp-404-brush.texture-tahoe i { background: #348ca8; } .spp-404-brush.texture-tahoe b { background: #0b647f; } .spp-404-brush.texture-tahoe em { background: #8bd9de; }
.spp-404-brush.texture-night i { background: #31596c; } .spp-404-brush.texture-night b { background: #153c50; } .spp-404-brush.texture-night em { background: #5a8791; }
.spp-404-progress-track { flex: 1; height: 8px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.15); }
.spp-404-progress-track span { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--spp-teal), var(--spp-aqua)); transition: width .2s ease; }
.spp-404-next { margin: 0 !important; padding: 10px 15px !important; font-size: 10px !important; }
.spp-404-finish-list { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px 24px; margin: 24px 0 30px; color: var(--spp-deep); font-size: 12px; font-weight: 800; }
.spp-404-finish-list span { display: inline-flex; align-items: center; gap: 7px; }
.spp-404-finish-list i { width: 12px; height: 12px; border-radius: 50%; background: #dceff0; box-shadow: inset 1px 1px 3px rgba(8,47,58,.2); }
.spp-404-finish-list .spp-texture-tahoe { background: #348ca8; } .spp-404-finish-list .spp-texture-night { background: #31596c; }
.spp-404-actions { display: flex; justify-content: center; gap: 14px; }
.spp-404-actions .button { margin: 0; }
@media only screen and (max-width: 48em) {
	.error404 #content,
	.error404 #main { background: linear-gradient(180deg, #082f3a 0%, #0d5967 35%, #eaf5f5 35%, #f5f8f7 100%) !important; }
	.spp-404-game { min-height: 820px; padding: 48px 14px 76px; }
	.spp-404-game-intro { display: block; margin-bottom: 20px; }
	.spp-404-eyebrow { margin-bottom: 13px !important; }
	.spp-404-game-intro h1 { margin-bottom: 18px; font-size: 47px; }
	.spp-404-game-intro > p:not(.spp-404-eyebrow) { font-size: 15px; }
	.spp-404-stats { margin-top: 20px; }
	.spp-404-game-board { padding: 12px; border-radius: 18px; }
	.spp-404-board-head { font-size: 10px; }
	.spp-404-controls { display: grid; grid-template-columns: 1fr; gap: 13px; }
	.spp-404-brush { justify-content: center; }
	.spp-404-next { justify-self: center; }
	.spp-404-finish-list { display: grid; justify-content: start; margin: 20px 8px 26px; }
	.spp-404-actions { flex-direction: column; align-items: stretch; margin: 0 8px; }
	.spp-404-actions .button { text-align: center; }
}

/* Services: give the Why Choose Splash section a balanced, full-width finish. */
body.page-id-11 #content > .spp-services-why-choose {
	min-height: 0;
	width: 100vw;
	max-width: none !important;
	margin-left: calc(50% - 50vw) !important;
	padding: 64px 24px 78px !important;
	background: #f5f9f8 !important;
}
body.page-id-11 #content > .spp-services-why-choose .section-bg { display: none; }
body.page-id-11 #content > .spp-services-why-choose .section-content,
body.page-id-11 #content > .spp-services-why-choose .section-content > .row {
	width: 100%;
	max-width: 1440px;
	margin: 0 auto;
}
body.page-id-11 #content > .spp-services-why-choose .section-content > .row {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 28px;
	align-items: stretch;
}
body.page-id-11 #content > .spp-services-why-choose .section-content > .row > .col,
body.page-id-11 #content > .spp-services-why-choose .section-content > .row > .col:first-child {
	width: auto !important;
	max-width: none !important;
	flex: none !important;
	margin: 0 !important;
	padding: 0 !important;
}
body.page-id-11 #content > .spp-services-why-choose .col-inner {
	height: 100%;
	padding: 34px !important;
	border: 1px solid rgba(180,211,209,.7);
	border-radius: 22px;
	background: rgba(255,255,255,.96) !important;
	box-shadow: 0 16px 36px rgba(8,47,58,.1);
}
body.page-id-11 #content > .spp-services-why-choose .img-inner {
	height: 100%;
	min-height: 430px;
	overflow: hidden;
	border-radius: 16px;
	background: #dcebea;
}
body.page-id-11 #content > .spp-services-why-choose .img-inner img {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 430px;
	object-fit: cover;
	object-position: center;
}
body.page-id-11 #content > .spp-services-why-choose h2,
body.page-id-11 #content > .spp-services-why-choose h3 {
	max-width: 520px;
	margin: 0 0 18px;
	font-size: clamp(32px, 4vw, 54px);
	line-height: 1.02;
}
body.page-id-11 #content > .spp-services-why-choose p,
body.page-id-11 #content > .spp-services-why-choose li {
	max-width: 620px;
	font-size: 17px;
	line-height: 1.65;
}
body.page-id-11 #content > .spp-services-why-choose ul { margin-top: 22px; }
@media only screen and (max-width: 48em) {
	body.page-id-11 #content > .spp-services-why-choose { padding: 38px 18px 52px !important; }
	body.page-id-11 #content > .spp-services-why-choose .section-content > .row { display: block !important; }
	body.page-id-11 #content > .spp-services-why-choose .section-content > .row > .col + .col { margin-top: 20px !important; }
	body.page-id-11 #content > .spp-services-why-choose .col-inner { padding: 24px !important; }
	body.page-id-11 #content > .spp-services-why-choose .img-inner,
	body.page-id-11 #content > .spp-services-why-choose .img-inner img { min-height: 280px; }
}

/* Services presentation pass: keep every service row in one balanced two-column panel. */
body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) {
	min-height: 0;
	padding: 48px 24px 56px !important;
}

/* The Why Choose block has a one-column wrapper around its real two-column row. */
body.page-id-11 #content > .spp-services-why-choose .section-content > .row {
	display: block !important;
	min-height: 0 !important;
}
body.page-id-11 #content > .spp-services-why-choose .section-content > .row > .col {
	width: 100% !important;
	max-width: none !important;
	flex: none !important;
	margin: 0 !important;
	padding: 0 !important;
}
body.page-id-11 #content > .spp-services-why-choose .section-content > .row > .col > .col-inner {
	height: auto !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
}
body.page-id-11 #content > .spp-services-why-choose .section-content > .row > .col > .col-inner > .row {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 28px;
	width: 100%;
	max-width: 1160px;
	margin: 0 auto;
	align-items: start;
	min-height: 0 !important;
}
body.page-id-11 #content > .spp-services-why-choose .section-content > .row > .col > .col-inner > .row > .col,
body.page-id-11 #content > .spp-services-why-choose .section-content > .row > .col > .col-inner > .row > .col:first-child {
	width: auto !important;
	max-width: none !important;
	flex: none !important;
	margin: 0 !important;
	padding: 0 !important;
}
body.page-id-11 #content > .spp-services-why-choose .section-content > .row > .col > .col-inner > .row > .col-inner,
body.page-id-11 #content > .spp-services-why-choose .section-content > .row > .col > .col-inner > .row > .col > .col-inner {
	height: auto !important;
}
body.page-id-11 #content > .spp-services-why-choose .section-content > .row > .col > .col-inner > .row > .col:first-child { grid-column: 1; grid-row: 1; }
body.page-id-11 #content > .spp-services-why-choose .section-content > .row > .col > .col-inner > .row > .col:nth-child(2) { grid-column: 2; grid-row: 1; }
body.page-id-11 #content > .spp-services-why-choose .section-content > .row > .col > .col-inner > .row > .col:nth-child(2) .col-inner {
	padding: 34px !important;
	border: 1px solid rgba(180,211,209,.7);
	border-radius: 22px;
	background: rgba(255,255,255,.96) !important;
	box-shadow: 0 16px 36px rgba(8,47,58,.1);
}
body.page-id-11 #content > .spp-services-why-choose .section-content > .row > .col > .col-inner > .row .img-inner,
body.page-id-11 #content > .spp-services-why-choose .section-content > .row > .col > .col-inner > .row .img-inner img {
	height: 430px;
	min-height: 0 !important;
}
body.page-id-11 #content > .spp-services-why-choose .section-content > .row > .col > .col-inner > .row .img-inner img {
	width: 100%;
	object-fit: cover;
}
@media only screen and (max-width: 48em) {
	body.page-id-11 #content > .spp-services-why-choose .section-content > .row > .col > .col-inner > .row {
		display: block !important;
	}
	body.page-id-11 #content > .spp-services-why-choose .section-content > .row > .col > .col-inner > .row > .col:nth-child(2) {
		margin-top: 20px !important;
	}
	body.page-id-11 #content > .spp-services-why-choose .section-content > .row > .col > .col-inner > .row .img-inner,
	body.page-id-11 #content > .spp-services-why-choose .section-content > .row > .col > .col-inner > .row .img-inner img {
		height: 280px;
	}
}
body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) .section-bg { display: none; }
body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) .section-content,
body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) .section-content > .row {
	width: 100%;
	max-width: 1160px;
	margin: 0 auto;
}
body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) .section-content > .row {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 28px;
	align-items: stretch;
	min-height: 0 !important;
}
body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) .section-content > .row > .col,
body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) .section-content > .row > .col:first-child {
	width: auto !important;
	max-width: none !important;
	flex: none !important;
	margin: 0 !important;
	padding: 0 !important;
}
body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) .section-content > .row > .col:first-child { grid-column: 2; grid-row: 1; }
body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) .section-content > .row > .col:nth-child(2) { grid-column: 1; grid-row: 1; }
body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) .section-content > .row > .col .col-inner {
	height: 100%;
	padding: 32px !important;
	border: 1px solid rgba(180,211,209,.7);
	border-radius: 22px;
	background: rgba(255,255,255,.96);
	box-shadow: 0 16px 36px rgba(8,47,58,.1);
}
body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) .img-inner {
	height: 100%;
	min-height: 350px;
	overflow: hidden;
	border-radius: 16px;
	background: #dcebea;
}
body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) .img-inner img {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 350px;
	object-fit: cover;
	object-position: center;
}
@media only screen and (max-width: 48em) {
	body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) { padding: 30px 18px 42px !important; }
	body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) .section-content > .row { display: block !important; }
	body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) .section-content > .row > .col:first-child,
	body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) .section-content > .row > .col:nth-child(2) { width: 100% !important; margin: 0 !important; }
	body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) .section-content > .row > .col:first-child { display: block; }
	body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) .section-content > .row > .col:nth-child(2) { margin-bottom: 20px !important; }
	body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) .section-content > .row > .col .col-inner { padding: 24px !important; }
	body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) .img-inner,
	body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) .img-inner img { min-height: 250px; }
}

/* Final cascade guard: prevent Flatsome's flex column widths from narrowing service panels. */
@media only screen and (min-width: 48.01em) {
	body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) .section-content > .row {
		display: grid !important;
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		width: min(1160px, 100%) !important;
		max-width: 1160px !important;
		margin-right: auto !important;
		margin-left: auto !important;
		gap: 28px !important;
		align-items: stretch !important;
		min-height: 0 !important;
	}
	body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) .section-content > .row > .col,
	body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) .section-content > .row > .col:first-child,
	body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) .section-content > .row > .col:nth-child(2) {
		width: auto !important;
		min-width: 0 !important;
		max-width: none !important;
		flex: 0 0 auto !important;
		margin: 0 !important;
		padding: 0 !important;
	}
	body.page-id-11 #content > .section:not(:first-of-type):not(.spp-services-why-choose) .section-content > .row > .col .col-inner {
		width: 100% !important;
		min-height: 0 !important;
	}
}