/*
Theme Name: Kindling
Theme URI: https://github.com/matchboxdesigngroup/kindling
Author: Matchbox Design Group
Author URI: https://matchboxdesigngroup.com
Description: A modern, responsive, and accessible block theme for WordPress.
Version: 4.0.15
Requires at least: 6.7
Tested up to: 6.7.2
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: kindling
Tags: full-site-editing, block-theme, accessibility-ready, editor-style, block-patterns, responsive-layout

Kindling WordPress Theme, (C) 2025 Matchbox Design Group, LLC.
Kindling is distributed under the terms of the GNU GPL.
*/

/**
 * 1.0 CSS Reset
 *
 * Resetting the CSS to a more sane starting point.
 */

/* Use a more-intuitive box-sizing model. */
*,
*::before,
*::after {
	box-sizing: border-box;
}

/* Allow percentage-based heights in the application. */
html,
body,
.wp-site-blocks {
	min-height: 100%;
}

/* Remove height from the admin bar of the overall height. */
html {
	height: calc(100% - var(--wp-admin--admin-bar--height, 0px));
}

/* Ensure the best type rendering. */
:root {
	font-feature-settings: 'kern';
	font-kerning: normal;
	text-rendering: optimizeLegibility;
}

/* Improve text rendering. */
body {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
}

/* Improve media defaults. */
img,
picture,
video,
canvas,
svg {
	display: block;
	height: auto;
	max-width: 100%;
}

/* Remove built-in form typography styles. */
input,
button,
textarea,
select {
	font: inherit;
}

/* Avoid text overflows. */
p,
h1,
h2,
h3,
h4,
h5,
h6 {
	overflow-wrap: break-word;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	text-wrap: balance;
	text-wrap: pretty; /* pretty is the nicer result but it isn't supported as well. So balance is here as a fallback */
}

p {
	text-wrap: pretty;
}

/* Create a root stacking context. */
.wp-site-blocks {
	isolation: isolate;
}

/* Ensure the alt text is visible when an image is missing. */
img {
	font-size: 1rem;
	font-style: italic;
	line-height: 1.5;
}

/* Set the scroll behavior to smooth. */
html {
	scroll-behavior: smooth;
}

/* Enable view transitions. */
@view-transition {
	navigation: auto;
}

/* WordPress Admin Bar - prevent overlap with site content */
.admin-bar body {
	padding-top: 32px;
}

@media screen and (max-width: 782px) {
	.admin-bar body {
		padding-top: 46px;
	}
}

/* Adjust fixed header elements when admin bar is present */
.admin-bar .wp-block-template-part {
	margin-top: 32px;
	top: 32px;
}

@media screen and (max-width: 782px) {
	.admin-bar .wp-block-template-part {
		margin-top: 46px;
		top: 46px;
	}
}

/**
 * 2.0 Custom Styles
 */

/* Texture background for sections */
.has-texture-bg {
	position: relative;
	background-color: #f3f2ed;
}

/* Cache buster - updated 2025-12-05 */
/* Using WebP with PNG fallback for 47% size savings */

.has-texture-bg::before {
	content: '';
	position: absolute;
	inset: 0;
	background: url('/wp-content/uploads/2025/12/texture-bg.webp') lightgray 0px -286.696px / 100% 192.83% no-repeat;
	opacity: 0.1;
	pointer-events: none;
}

/* Fallback for browsers without WebP support */
@supports not (background-image: -webkit-image-set(url('/wp-content/uploads/2025/12/texture-bg.webp') 1x)) {
	.has-texture-bg::before {
		background: url('/wp-content/uploads/2025/12/texture-bg.png') lightgray 0px -286.696px / 100% 192.83% no-repeat;
	}
}

.has-texture-bg > * {
	position: relative;
}

/* Water ripple background for Project Zero section */
.has-water-ripple-bg {
	position: relative;
	overflow: hidden; /* Prevents ripple from bleeding into adjacent sections */
	background-color: rgba(244, 242, 237, 0.5);
}

/* Using WebP with JPG fallback for 96% size savings */
.has-water-ripple-bg::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: url('/wp-content/uploads/2025/12/water-ripple-texture.webp') no-repeat center center;
	background-size: cover;
	opacity: 0.39;
	pointer-events: none;
	z-index: 0;
}

/* Fallback for browsers without WebP support */
@supports not (background-image: -webkit-image-set(url('/wp-content/uploads/2025/12/water-ripple-texture.webp') 1x)) {
	.has-water-ripple-bg::before {
		background: url('/wp-content/uploads/2025/12/water-ripple-texture.jpg') no-repeat center center;
		background-size: cover;
	}
}

.has-water-ripple-bg > * {
	position: relative;
	z-index: 1;
}

/* Operations Map Section - Communities We Serve */
.has-water-ripple-bg.operations-map-section {
	position: relative;
	min-height: 714px;
	padding-bottom: 500px;
	overflow: visible;
}

.operations-map-section .operations-map-content {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
}

.operations-map-section .operations-map-content .wp-block-heading {
	white-space: nowrap;
}

.operations-map-section .operations-map-content .wp-block-separator {
	margin-left: 0;
	margin-right: auto;
}

.operations-map-section .operations-map-content p {
	max-width: 550px;
	text-align: left;
}

.operations-map-section .operations-map-image {
	position: relative;
	z-index: 1;
	width: 100%;
	margin: 0;
}

.operations-map-section .operations-map-image img {
	width: 100%;
	height: auto;
}

/* Safety Stats Section - ensure no background image bleed */
.safety-stats-section {
	background-image: none;
	position: relative;
	z-index: 2;
}

/* Safety Approach Section - Figma exact spacing */
.safety-approach-content {
	display: flex;
	flex-direction: column;
	gap: 40px;
	align-items: center;
}

.safety-approach-paragraph {
	max-width: 918px;
}

/* Project Zero Image Carousel */
.project-zero-carousel {
	position: relative;
	width: 100%;
	overflow: hidden;
}

.project-zero-carousel .carousel-slides {
	position: relative;
	width: 100%;
}

.project-zero-carousel .carousel-slide {
	display: none;
	width: 100%;
}

.project-zero-carousel .carousel-slide.is-active {
	display: block;
}

.project-zero-carousel .carousel-slide img {
	width: 100%;
	height: auto;
	display: block;
}

/* Carousel dots for Project Zero - centered under image */
.project-zero-carousel .project-zero-carousel-dots {
	display: flex;
	justify-content: center;
	gap: 12px;
	margin-top: 40px;
}

/**
 * 2.5 Company Timeline Section
 */

/* Timeline section - allow overflow */
.company-timeline-section {
	overflow: visible;
}

/* Left-align separator under heading */
.company-timeline-section .wp-block-separator,
.company-timeline-section hr.wp-block-separator {
	margin-left: 0;
	margin-right: auto;
}

/* Timeline container - full width horizontal scroll */
.company-timeline {
	position: relative;
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(-50vw + 50%);
	margin-right: calc(-50vw + 50%);
	overflow-x: auto;
	overflow-y: visible;
	padding: 0 0 40px 0;
	-webkit-overflow-scrolling: touch;
}

.company-timeline .timeline-track {
	position: relative;
	display: inline-flex;
	min-width: 100%;
	padding: 0 60px 0 var(--timeline-left-offset, 16px);
}

/* Horizontal timeline line - aligned with first dot */
.company-timeline .timeline-line {
	position: absolute;
	top: 6px;
	left: var(--timeline-left-offset, 16px);
	right: 0;
	height: 3px;
	background-color: #1a4ea2;
	z-index: 0;
}

/* Set timeline offset to match alignwide columns position */
.company-timeline-section {
	--timeline-left-offset: max(
		16px,
		calc((100vw - var(--wp--style--global--wide-size, 1440px)) / 2)
	);
}

/* Timeline items container */
.company-timeline .timeline-items {
	display: flex;
	gap: 0;
	position: relative;
	z-index: 1;
}

/* Individual timeline item */
.company-timeline .timeline-item {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	min-width: 220px;
	flex-shrink: 0;
}

/* Timeline dot */
.company-timeline .timeline-dot {
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background-color: #1a4ea2;
	margin-bottom: 24px;
	position: relative;
	flex-shrink: 0;
}

/* Timeline content */
.company-timeline .timeline-content {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding-right: 40px;
}

/* Timeline year */
.company-timeline .timeline-year {
	font-family: var(--wp--preset--font-family--sansation), sans-serif;
	font-size: 40px;
	font-weight: 700;
	color: #1a4ea2;
	line-height: 1.2;
}

/* Timeline description */
.company-timeline .timeline-description {
	font-family: var(--wp--preset--font-family--inter), sans-serif;
	font-size: 16px;
	line-height: 1.5;
	color: #000;
	margin: 0;
	max-width: 180px;
}

/* Custom scrollbar */
.company-timeline::-webkit-scrollbar {
	height: 0;
	display: none;
}

/* Hide scrollbar for Firefox */
.company-timeline {
	scrollbar-width: none;
}

/* Drag to scroll cursor */
.company-timeline {
	cursor: grab;
}

.company-timeline.is-dragging {
	cursor: grabbing;
	user-select: none;
}

/* Scroll indicators */
.company-timeline-section::after {
	content: '';
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
	width: 40px;
	height: 40px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231a4ea2' stroke-width='2'%3E%3Cpolyline points='9 18 15 12 9 6'%3E%3C/polyline%3E%3C/svg%3E") center/contain no-repeat;
	opacity: 0;
	transition: opacity 0.3s ease;
	pointer-events: none;
	z-index: 10;
}

.company-timeline-section.can-scroll-right::after {
	opacity: 0.7;
	animation: bounce-right 1.5s ease-in-out infinite;
}

@keyframes bounce-right {
	0%, 100% { transform: translateY(-50%) translateX(0); }
	50% { transform: translateY(-50%) translateX(5px); }
}

/**
 * 2.6 Solutions Section Styles
 */

/* Solutions sections padding */
.solutions-section {
	padding: var(--wp--preset--spacing--80) var(--wp--preset--spacing--50);
}

.solutions-hero-section {
	padding: var(--wp--preset--spacing--80) var(--wp--preset--spacing--50);
}

/* Solutions section column gaps */
.solutions-section .wp-block-columns {
	gap: var(--wp--preset--spacing--70);
}

/* Solutions headings - Sansation font */
.solutions-section h2.wp-block-heading,
.solutions-hero-section h2.wp-block-heading {
	font-family: var(--wp--preset--font-family--sansation), Sansation, sans-serif;
	margin-bottom: var(--wp--preset--spacing--40);
}

.solutions-hero-section h4.wp-block-heading {
	font-family: var(--wp--preset--font-family--inter), Inter, sans-serif;
	margin-bottom: var(--wp--preset--spacing--30);
}

/* Solutions body text */
.solutions-section > .wp-block-columns > .wp-block-column > p,
.solutions-hero-section p {
	font-family: var(--wp--preset--font-family--inter), Inter, sans-serif;
	margin-bottom: var(--wp--preset--spacing--40);
}

/**
 * 3.0 Solutions Hero Section
 */

/* Solutions hero separator - left-aligned, exact width */
.solutions-hero-separator {
	width: 224px;
	max-width: 224px;
	height: 2px;
	margin-left: 0;
	margin-right: auto;
}

/**
 * 3.1 Safety Approach Section
 */

/* Safety Approach section with background image and overlay */
.safety-approach-section {
	position: relative;
	background-color: #000;
}

/* Grayscale background image layer */
.safety-approach-section::before {
	content: '';
	position: absolute;
	inset: 0;
	background: url('/wp-content/uploads/2025/12/safety-approach-bg.jpg') center/cover no-repeat;
	filter: grayscale(100%);
	pointer-events: none;
	z-index: 0;
}

/* Dark overlay - 55% opacity */
.safety-approach-section::after {
	content: '';
	position: absolute;
	inset: 0;
	background-color: rgba(0, 0, 0, 0.55);
	pointer-events: none;
	z-index: 1;
}

.safety-approach-section > * {
	position: relative;
	z-index: 2;
}

/* Heading styling */
.safety-approach-section h2 {
	max-width: 1210px;
	margin-left: auto;
	margin-right: auto;
}

/* Body text styling */
.safety-approach-section p {
	max-width: 918px;
	margin-left: auto;
	margin-right: auto;
}

/**
 * 4.0 Hero Carousel Styles
 */

/* Hero carousel container */
.hero-carousel {
	position: relative;
	overflow: hidden;
}

.hero-carousel .wp-block-cover {
	position: absolute;
	inset: 0;
	opacity: 0;
	transition: opacity 0.6s ease-in-out;
	pointer-events: none;
}

.hero-carousel .wp-block-cover.is-active {
	position: relative;
	opacity: 1;
	pointer-events: auto;
}

/* Show gradient overlay on hero carousel - REQUIRED: !important needed to override WordPress core inline styles */
.hero-carousel .wp-block-cover__background.has-background-dim-0,
.hero-carousel .wp-block-cover__gradient-background.has-background-dim-0,
.wp-block-cover.is-hero .wp-block-cover__background.has-background-dim-0,
.wp-block-cover.is-hero .wp-block-cover__gradient-background.has-background-dim-0 {
	opacity: 1 !important;
}

/* Carousel navigation dots */
.hero-carousel-dots {
	position: absolute;
	bottom: 40px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	gap: 12px;
	z-index: 10;
}

.hero-carousel-dot {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background-color: rgba(255, 255, 255, 0.5);
	border: 2px solid white;
	cursor: pointer;
	transition: background-color 0.3s ease;
	padding: 0;
}

.hero-carousel-dot:hover,
.hero-carousel-dot.is-active {
	background-color: white;
}

/**
 * 4.0 Trusted Partners Section
 */

/* Trusted Partners section - fine-tune overlay opacity to match Figma (77%) - REQUIRED: !important needed to override WordPress core cover block opacity */
.trusted-partners-section .wp-block-cover__background {
	opacity: 0.77 !important;
}

/* Trusted Partners section - remove bottom margin to sit flush with footer */
.trusted-partners-section {
	margin-bottom: 0;
}

/* Remove gap before footer when trusted partners is the last content block */
.trusted-partners-section + footer,
main:has(.trusted-partners-section:last-child) + footer {
	margin-top: 0;
}

/* Ensure no gap between last block and footer in hero page template */
.wp-block-post-content > .trusted-partners-section:last-child {
	margin-bottom: 0;
}

/* Remove block gap after trusted partners section */
.wp-block-post-content:has(> .trusted-partners-section:last-child) {
	--wp--style--block-gap: 0;
}

/* Trusted Partners section padding */
.trusted-partners-section .wp-block-cover__inner-container {
	padding: var(--wp--preset--spacing--80) var(--wp--preset--spacing--50);
	max-width: 800px;
	margin: 0 auto;
}

/* Trusted Partners heading - Sansation font */
.trusted-partners-section h2.wp-block-heading {
	font-family: var(--wp--preset--font-family--sansation), Sansation, sans-serif;
	margin-bottom: var(--wp--preset--spacing--40);
}

/* Trusted Partners body text */
.trusted-partners-section p {
	font-family: var(--wp--preset--font-family--inter), Inter, sans-serif;
}

/* Separator in Trusted Partners - centered, 224px width, 3px height */
.trusted-partners-section .wp-block-separator,
.trusted-partners-separator {
	width: 224px;
	height: 3px;
	border: none;
	margin: 0 auto var(--wp--preset--spacing--50);
}

/**
 * 4.5 Solutions Accordion
 */

/* Solutions Accordion - using headings for reliability */
.solutions-accordion {
	margin-top: var(--wp--preset--spacing--50);
}

.solutions-accordion .accordion-item {
	font-family: var(--wp--preset--font-family--inter), Inter, sans-serif;
	padding: var(--wp--preset--spacing--40) 36px var(--wp--preset--spacing--40) 0;
	border-bottom: 2px solid #fff;
	margin: 0;
	position: relative;
	cursor: pointer;
}

/* Chevron icon */
.solutions-accordion .accordion-item::after {
	content: '';
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 26px;
	height: 16px;
	background-image: url("data:image/svg+xml,%3Csvg width='26' height='16' viewBox='0 0 26 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 2L13 13L24 2' stroke='%23F4F2ED' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-size: contain;
	transition: transform 0.3s ease;
}

/* Rotate chevron when open */
.solutions-accordion .accordion-item.is-open::after {
	transform: translateY(-50%) rotate(180deg);
}

/* Accordion content paragraph */
.solutions-accordion .accordion-content {
	font-family: var(--wp--preset--font-family--inter), Inter, sans-serif;
	font-size: 20px;
	line-height: 1.5;
	padding-right: 36px;
	margin-bottom: var(--wp--preset--spacing--40);
}

/**
 * 5.0 Navigation Styles
 */

/**
 * 4.8 Service Areas - Commercial Focused Expertise Section
 */

/* Fix heading wrapping at larger viewports */
@media (min-width: 1200px) {
	/* Remove max-width constraint on the inner group */
	.has-texture-bg .wp-block-columns .wp-block-column .wp-block-group.is-layout-constrained {
		max-width: none;
	}

	/* Also target the content width */
	.has-texture-bg .wp-block-columns .wp-block-column .wp-block-group.is-layout-constrained > * {
		max-width: none;
	}

	/* Ensure columns are 50/50 split for partner intro */
	.has-texture-bg > .wp-block-columns.alignwide > .wp-block-column:first-child {
		flex-basis: 50%;
	}
	.has-texture-bg > .wp-block-columns.alignwide > .wp-block-column:last-child {
		flex-basis: 50%;
	}

	/* Target the heading specifically - ensure it doesn't wrap before the br */
	.has-texture-bg .wp-block-heading.has-sansation-font-family {
		max-width: 100%;
		width: 100%;
	}
}

/**
 * 4.9 Facility Grid Cards - Match Figma layout specs
 * SCOPED: Only applies to sections containing theme-07 cards
 * Target dimensions for 1440p: 584w x 329h per card
 */

/* Section padding: 96px top/bottom per Figma - only for cards section */
.has-texture-bg:has(.has-theme-07-background-color) {
	padding-top: 96px;
	padding-bottom: 96px;
	padding-left: 0;
	padding-right: 0;
}

/* Inner content group - 1200px max width, centered */
.has-texture-bg:has(.has-theme-07-background-color) > .wp-block-group.is-layout-constrained {
	max-width: 1200px;
	padding-left: 0;
	padding-right: 0;
	margin: 0 auto;
}

/* H2 and separator - no extra constraints */
.has-texture-bg:has(.has-theme-07-background-color) .wp-block-heading,
.has-texture-bg:has(.has-theme-07-background-color) .wp-block-separator {
	max-width: 100%;
}

/* Columns containing cards - centered with gap */
.has-texture-bg .wp-block-columns:has(.has-theme-07-background-color) {
	max-width: 1200px;
	margin: 0 auto;
	padding-left: 0;
	padding-right: 0;
	gap: 32px;
	justify-content: center;
}

/* Card columns - fixed 584px width per Figma */
.has-texture-bg .wp-block-columns:has(.has-theme-07-background-color) > .wp-block-column {
	flex-basis: 584px;
	flex-grow: 0;
	max-width: 584px;
}

/* Card images - 584x329 aspect ratio */
.has-texture-bg .has-theme-07-background-color .wp-block-image {
	margin: 0;
}

.has-texture-bg .has-theme-07-background-color .wp-block-image img {
	width: 100%;
	height: auto;
	aspect-ratio: 584 / 329;
	object-fit: cover;
}

/* First row of cards - 72px margin bottom */
.has-texture-bg .wp-block-group > .wp-block-columns:has(.has-theme-07-background-color):first-of-type {
	margin-bottom: 72px;
}

/* Remove constrained layout max-width on card content groups */
.has-theme-07-background-color .wp-block-group.is-layout-constrained,
.has-theme-07-background-color .wp-block-group-is-layout-constrained {
	--wp--style--global--content-size: 100%;
	--wp--style--global--wide-size: 100%;
	max-width: 100%;
}

.has-theme-07-background-color .wp-block-group.is-layout-constrained > *,
.has-theme-07-background-color .wp-block-group-is-layout-constrained > * {
	max-width: 100%;
}

/* Target specific WordPress container classes */
.has-theme-07-background-color [class*="wp-container-core-group-is-layout"] {
	--wp--style--global--content-size: 100%;
	max-width: 100%;
}

.has-theme-07-background-color [class*="wp-container-core-group-is-layout"] > .wp-block-heading,
.has-theme-07-background-color [class*="wp-container-core-group-is-layout"] > p {
	max-width: 100%;
}

/* Override inline padding on text containers - match Figma spec (15px) - REQUIRED: !important to override WordPress database inline styles */
.has-theme-07-background-color > .wp-block-group,
.has-theme-07-background-color > .wp-block-group.has-global-padding,
.has-theme-07-background-color .wp-block-group[style*="padding-left"],
.has-theme-07-background-color .wp-block-group[style*="padding-right"] {
	padding-left: 15px !important;
	padding-right: 15px !important;
}

/* Card headings - keep on one line for consistent card heights - REQUIRED: !important for responsive clamp to override theme.json and maintain mobile readability */
.has-theme-07-background-color h3.wp-block-heading {
	white-space: nowrap !important;
	font-size: clamp(16px, 2.5vw, 24px) !important;
}

/* Hero nav container - align items on same line */
.is-hero .wp-block-group.alignwide {
	align-items: center;
}

/* Header layout - vertical centering and proper spacing */
.wp-block-group.alignfull:has(.wp-block-navigation) {
	align-items: center; /* Vertically center logo and navigation */
}

/* Remove padding and adjust vertical alignment for navigation wrapper - REQUIRED: !important to override inline styles */
.wp-block-group.is-layout-flow.wp-block-group-is-layout-flow:has(.wp-block-navigation) {
	padding-top: 0 !important;
	margin-top: -20px !important;
}

/* Desktop navigation - add spacing from logo and prevent wrapping */
.wp-block-group.alignfull > .wp-block-group:has(.wp-block-navigation) {
	margin-left: 100px; /* Add significant spacing from logo to match Figma */
}

/* Header navigation gap - prevent wrapping on non-homepage pages */
.wp-block-group.alignfull .wp-block-navigation,
.wp-block-group.alignfull .wp-block-navigation__container {
	gap: 24px;
	flex-wrap: nowrap;
}

/* About intro section - make image flush to left edge of viewport */
.has-texture-bg .wp-block-columns.alignwide > .wp-block-column:first-child {
	margin-left: calc(-1 * max(16px, (100vw - var(--wp--style--global--wide-size, 1440px)) / 2));
	padding-left: 0;
}

/* Navigation items gap - match Figma spacing - REQUIRED: !important to override WordPress core navigation block inline styles */
.is-hero .wp-block-navigation,
.has-theme-02-background-color .wp-block-navigation {
	gap: 32px !important;
}

.is-hero .wp-block-navigation__container,
.has-theme-02-background-color .wp-block-navigation__container {
	gap: 32px !important;
}

/* Homepage header navigation - white text for visibility over hero */
.home .wp-block-group .desktop-navigation .wp-block-navigation-item a,
.home .wp-block-group .wp-block-navigation-item a {
	color: white;
}

.home .wp-block-group .desktop-navigation .wp-block-navigation-item a:hover,
.home .wp-block-group .wp-block-navigation-item a:hover {
	opacity: 0.8;
}

/* Reduce gap between buttons - REQUIRED: !important to override WordPress core buttons block inline styles */
.is-hero .wp-block-buttons {
	gap: 16px !important;
}

/* All rounded buttons should be uppercase */
.wp-block-button__link[style*="border-radius:54px"] {
	text-transform: uppercase;
	font-weight: 700;
	letter-spacing: 1px;
}

/* Hero nav link base styles */
.is-hero .wp-block-navigation-item__content {
	padding: 10px 16px;
	border-radius: 0;
	transition: background-color 0.2s ease;
}

/* Nav link hover and active state - blue background, no rounded corners */
.is-hero .wp-block-navigation-item__content:hover,
.is-hero .wp-block-navigation-item.current-menu-item .wp-block-navigation-item__content,
.is-hero .wp-block-navigation-item__content[aria-current="page"] {
	background-color: #1c8ece;
	border-radius: 0;
}

/* Partner With Us button - transparent background, yellow dotted underline - REQUIRED: !important to override WordPress core button and theme.json button styles */
.wp-block-cover.is-hero .wp-block-button.is-style-subtle .wp-block-button__link,
.wp-block-cover.is-hero .wp-block-button.is-style-subtle .wp-block-button__link.wp-element-button,
.wp-block-cover.alignfull.is-hero .wp-block-button.is-style-subtle .wp-block-button__link,
a.wp-block-button__link[href*="partner-with-us"] {
	background: none !important;
	background-color: transparent !important;
	background-image: none !important;
	border: none !important;
	border-bottom: 2px dotted #fbd872 !important;
	border-radius: 0 !important;
	padding: 10px 0 8px !important;
	color: #f4f2ed !important;
}

.wp-block-cover.is-hero .wp-block-button.is-style-subtle .wp-block-button__link:hover,
.wp-block-cover.is-hero .wp-block-button.is-style-subtle .wp-block-button__link.wp-element-button:hover,
.wp-block-cover.alignfull.is-hero .wp-block-button.is-style-subtle .wp-block-button__link:hover,
a.wp-block-button__link[href*="partner-with-us"]:hover {
	background: none !important;
	background-color: transparent !important;
	background-image: none !important;
	border-bottom-color: white !important;
}

/* Become A Lifeguard button - yellow wave background - REQUIRED: !important to override WordPress core button and theme.json button styles */
.wp-block-cover.is-hero .wp-block-buttons .wp-block-button.is-style-outline.is-style-wave .wp-block-button__link.has-theme-04-background-color.has-background.wp-element-button,
.wp-block-cover.alignfull.is-hero .wp-block-button.is-style-wave .wp-block-button__link.has-theme-04-background-color,
.wp-block-cover.alignfull.is-hero .wp-block-button.is-style-outline .wp-block-button__link.has-background.has-theme-04-background-color,
a.wp-block-button__link.has-theme-04-background-color.has-background[href*="become-a-lifeguard"] {
	background-image: url('/wp-content/uploads/2025/12/yellow-wave.png') !important;
	background-size: cover !important;
	background-position: center !important;
	background-repeat: no-repeat !important;
	background-color: transparent !important;
	color: #1a4ea2 !important;
	border-radius: 43px !important;
	border: none !important;
	padding: 10px 20px !important;
}

.wp-block-cover.is-hero .wp-block-buttons .wp-block-button.is-style-outline.is-style-wave .wp-block-button__link.has-theme-04-background-color.has-background.wp-element-button:hover,
.wp-block-cover.alignfull.is-hero .wp-block-button.is-style-wave .wp-block-button__link.has-theme-04-background-color:hover,
.wp-block-cover.alignfull.is-hero .wp-block-button.is-style-outline .wp-block-button__link.has-background.has-theme-04-background-color:hover,
a.wp-block-button__link.has-theme-04-background-color.has-background[href*="become-a-lifeguard"]:hover {
	background-image: url('/wp-content/uploads/2025/12/yellow-wave.png') !important;
	background-size: cover !important;
	background-position: center !important;
	background-repeat: no-repeat !important;
	background-color: transparent !important;
	color: #1a4ea2 !important;
	opacity: 0.9;
}

/**
 * 4.10 Service Areas Map Section
 * Map takes full container width, stats boxes positioned absolutely on top
 * Target: .has-water-ripple-bg containing .has-theme-02-background-color (not cards section)
 */

/* Map section container - relative positioning for absolute children */
.has-water-ripple-bg:has(.has-theme-02-background-color):not(:has(.has-theme-07-background-color)) {
	position: relative;
	padding: 60px 0;
	overflow: visible;
}

/* Override the columns layout */
.has-water-ripple-bg:has(.has-theme-02-background-color):not(:has(.has-theme-07-background-color)) > .wp-block-columns {
	display: block;
	position: relative;
	max-width: 1440px;
	margin: 0 auto;
}

/* Stats column - positioned absolutely in upper left, overlaying the map - REQUIRED: !important to override WordPress core column block inline styles */
.has-water-ripple-bg:has(.has-theme-02-background-color):not(:has(.has-theme-07-background-color)) > .wp-block-columns > .wp-block-column:first-child {
	position: absolute !important;
	left: 200px !important;
	top: 120px !important;
	bottom: auto !important;
	width: auto !important;
	max-width: 400px;
	z-index: 10;
}

/* Stats box container styling */
.has-water-ripple-bg:has(.has-theme-02-background-color):not(:has(.has-theme-07-background-color)) .has-theme-02-background-color {
	display: inline-flex;
	gap: 6px;
	padding: 26px 35px;
}

/* Map column - full width of container - REQUIRED: !important to override WordPress core column block inline styles */
.has-water-ripple-bg:has(.has-theme-02-background-color):not(:has(.has-theme-07-background-color)) > .wp-block-columns > .wp-block-column:last-child {
	position: relative;
	width: 100% !important;
	max-width: 100% !important;
	flex-basis: 100% !important;
}

/* Map image - full width */
.has-water-ripple-bg:has(.has-theme-02-background-color):not(:has(.has-theme-07-background-color)) .wp-block-image {
	margin: 0;
}

.has-water-ripple-bg:has(.has-theme-02-background-color):not(:has(.has-theme-07-background-color)) .wp-block-image img {
	width: 100%;
	height: auto;
	max-width: 100%;
}

/* Service areas list text - centered below map */
.has-water-ripple-bg:has(.has-theme-02-background-color):not(:has(.has-theme-07-background-color)) > .wp-block-columns > .wp-block-column:last-child > p {
	text-align: center;
	margin-top: 16px;
}

/* Responsive: Stack on smaller screens - REQUIRED: !important to override desktop absolute positioning */
@media (max-width: 1024px) {
	.has-water-ripple-bg:has(.has-theme-02-background-color):not(:has(.has-theme-07-background-color)) > .wp-block-columns > .wp-block-column:first-child {
		position: relative !important;
		left: auto !important;
		bottom: auto !important;
		width: 100% !important;
		max-width: 100%;
		text-align: center;
		padding: 40px 20px;
		order: 2;
	}

	.has-water-ripple-bg:has(.has-theme-02-background-color):not(:has(.has-theme-07-background-color)) > .wp-block-columns > .wp-block-column:last-child {
		order: 1;
	}

	.has-water-ripple-bg:has(.has-theme-02-background-color):not(:has(.has-theme-07-background-color)) > .wp-block-columns {
		display: flex;
		flex-direction: column;
	}

	.has-water-ripple-bg:has(.has-theme-02-background-color):not(:has(.has-theme-07-background-color)) .has-theme-02-background-color {
		justify-content: center;
	}
}


/* Full-height image style for Partner Contact section */
.is-style-full-height {
	height: 100%;
}

.is-style-full-height img {
	height: 100%;
	object-fit: cover;
}

.is-vertically-aligned-stretch .is-style-full-height {
	height: 100%;
}

/* Partner Contact - Section styling */
.has-droplet-bg {
	position: relative;
	overflow: hidden;
}

.has-droplet-bg::before {
	content: '';
	position: absolute;
	inset: 0;
	background: url('/wp-content/uploads/2025/12/texture-bg.png') 0px -537px / 100% 225% no-repeat;
	opacity: 0.1;
	pointer-events: none;
	z-index: 0;
}

.has-droplet-bg > * {
	position: relative;
	z-index: 1;
}

.has-droplet-bg > .wp-block-columns.alignwide {
	align-items: stretch;
}

/* Partner Contact - Image column - absolute positioned for full height - REQUIRED: !important to override WordPress core column block inline styles */
.partner-contact-image-column,
.contact-image-column,
.has-droplet-bg .wp-block-column:last-child {
	position: absolute !important;
	top: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	width: 770px !important;
	margin: 0 !important;
	flex-basis: auto !important;
	padding-right: 0 !important;
}

.partner-contact-image-column .wp-block-image,
.partner-contact-image-column figure,
.contact-image-column .wp-block-image,
.contact-image-column figure,
.has-droplet-bg .wp-block-column:last-child .wp-block-image,
.has-droplet-bg .wp-block-column:last-child figure {
	height: 100%;
	width: 100%;
	margin: 0;
	border-radius: 0;
}

.partner-contact-image-column .wp-block-image img,
.partner-contact-image-column img,
.contact-image-column .wp-block-image img,
.contact-image-column img,
.has-droplet-bg .wp-block-column:last-child img,
.has-droplet-bg img[style*="border-radius"] {
	height: 100%;
	width: 100%;
	object-fit: cover;
	border-radius: 0;
}

/* Partner Contact - Reduce form input margins - REQUIRED: !important to override Gravity Forms plugin inline styles */
.has-droplet-bg .gform_wrapper .gfield {
	margin-bottom: 12px !important;
}

.has-droplet-bg .gform_wrapper .gform_fields {
	row-gap: 12px !important;
}

.has-droplet-bg .gform_wrapper .gfield_label {
	margin-bottom: 4px !important;
}

/**
 * 5.0 Partner Page Separator Styles
 * Fixed 224px width separator for Partner patterns
 * Prevents flex-basis from making separator tall in vertical flex containers
 * REQUIRED: !important to override WordPress core separator block inline styles
 */
.separator-224 {
	width: 224px !important;
	max-width: 224px !important;
	flex-basis: auto !important;
	flex-grow: 0 !important;
	flex-shrink: 0 !important;
	height: auto;
	margin-left: 0 !important;
	margin-right: auto !important;
}

/**
 * 5.1 Aquatic Solutions Section
 */

/* Heading should stay on one line */
.aquatic-solutions-heading {
	white-space: nowrap;
}

/* Service card images - full width, no margin */
.aquatic-solutions-section .service-card-image {
	margin: 0;
}

.aquatic-solutions-section .service-card-image img {
	width: 100%;
	display: block;
}

/**
 * 5.2 Operations Solutions Section
 * Note: Background positioning controlled via WordPress editor focal point
 */

/* Solutions section separator - centered, 224px width - REQUIRED: !important to override WordPress core separator inline styles */
.solutions-section-cover .short-underline {
	width: 224px !important;
	max-width: 224px !important;
	height: 3px !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

/* Solutions cards - 34px gaps between columns, exact Figma dimensions */
.solutions-section-cover > .wp-block-cover__inner-container > .wp-block-columns.alignwide {
	gap: 34px !important;
	max-width: 100% !important;
	justify-content: center !important;
}

/* Solutions column - exact Figma width: 617px */
.solutions-section-cover .wp-block-column {
	width: 617px !important;
	max-width: 617px !important;
	min-width: 617px !important;
	flex: 0 0 617px !important;
}

/* Solutions card - exact Figma dimensions: 617x867, vertical centering and padding */
.solutions-card {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 617px !important;
	height: 867px !important;
	min-height: 867px !important;
}

.solutions-card .wp-block-cover__inner-container {
	padding: 0 98px !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 20px;
}

/* Short underline for solution cards - REQUIRED: !important to override WordPress core separator inline styles */
.short-underline-white {
	width: 224px !important;
	max-width: 224px !important;
	height: 3px !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

/* Natural state - no overlay or text by default - REQUIRED: !important to override WordPress core cover block opacity */
.solutions-card-natural .wp-block-cover__background {
	opacity: 0 !important;
	transition: opacity 0.3s ease-in-out;
}

.solutions-card-natural .wp-block-cover__inner-container {
	opacity: 0 !important;
	transition: opacity 0.3s ease-in-out;
}

/* Hover state - overlay and text appear - REQUIRED: !important to override WordPress core cover block opacity */
.solutions-card-natural:hover .wp-block-cover__background {
	opacity: 0.7 !important;
}

.solutions-card-natural:hover .wp-block-cover__inner-container {
	opacity: 1 !important;
}

/* Active state - always shows overlay */
.solutions-card-active {
	cursor: pointer;
}

.solutions-card-active .wp-block-cover__background {
	transition: opacity 0.3s ease-in-out;
}

/**
 * 5.2 Operations Intro Section
 * Full-bleed image left, text right layout per Figma
 */
.operations-intro-section {
	overflow: hidden;
}

.operations-intro-section > .wp-block-columns {
	max-width: none;
	margin: 0;
	gap: 0;
}

/* Image column - bleed to left edge - REQUIRED: !important to override WordPress database inline styles */
.operations-intro-section > .wp-block-columns > .wp-block-column:first-child {
	padding: 0 !important;
	margin: 0;
}

.operations-intro-section > .wp-block-columns > .wp-block-column:first-child .wp-block-image {
	margin: 0;
}

.operations-intro-section > .wp-block-columns > .wp-block-column:first-child .wp-block-image img {
	width: 100%;
	height: auto;
	display: block;
}

/* Text column - add left padding for gap, constrain width on right - REQUIRED: !important to override WordPress database inline styles */
.operations-intro-section > .wp-block-columns > .wp-block-column:last-child {
	padding-left: var(--wp--preset--spacing--60) !important;
	padding-right: var(--wp--preset--spacing--50) !important;
	max-width: 730px;
}

/**
 * 5.3 Operations Leadership Section
 * Heading and photos overlap the section above
 * Blue background starts partway through photos
 */
.leadership-wrapper {
	position: relative;
	z-index: 2;
	margin-top: -230px;
}

.leadership-section {
	position: relative;
	padding-top: 0;
	background: transparent;
}

.leadership-section.has-theme-02-background-color {
	background: transparent;
}

/* Blue background starts below heading, covers most of photos + names */
.leadership-section::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	top: 150px;
	bottom: 0;
	background-color: #1a4ea2;
	z-index: -1;
}

.leadership-section .leadership-header {
	position: relative;
	z-index: 3;
}

.leadership-section .leadership-cards {
	gap: 32px;
	justify-content: center;
	position: relative;
	z-index: 1;
	margin-top: -40px;
}

.leadership-section .leadership-cards > .wp-block-column {
	flex-basis: 444px;
	flex-grow: 0;
	max-width: 444px;
}

.leadership-section .leadership-photo {
	margin: 0 0 30px 0;
	position: relative;
	cursor: pointer;
}

.leadership-section .leadership-photo img {
	width: 444px;
	height: 444px;
	aspect-ratio: 1 / 1;
	object-fit: cover;
}

/* View Bio Overlay */
.leadership-photo__overlay {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(26, 78, 162, 0.9);
	opacity: 0;
	transition: opacity 0.3s ease;
	display: flex;
	align-items: center;
	justify-content: center;
	pointer-events: none;
}

.leadership-photo:hover .leadership-photo__overlay {
	opacity: 1;
	pointer-events: auto;
}

.leadership-photo__view-bio {
	color: #ffffff;
	font-family: var(--wp--preset--font-family--sansation);
	font-size: 30px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1.5px;
}

/**
 * 5.4 Leadership Modal
 * Modal popup for team member bios
 */
.leadership-modal {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 9999;
}

.leadership-modal[aria-hidden="false"] {
	display: block;
}

.leadership-modal__overlay {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.7);
	cursor: pointer;
}

.leadership-modal__container {
	position: relative;
	max-width: 1468px;
	margin: 72px auto;
	background: white;
	z-index: 10000;
}

.leadership-modal__content {
	display: flex;
	gap: 84px;
	padding: 72px 56px;
	position: relative;
}

.leadership-modal__content::before {
	content: '';
	position: absolute;
	inset: 0;
	background: url('/wp-content/uploads/2025/12/texture-bg.png');
	background-size: cover;
	opacity: 0.1;
	pointer-events: none;
}

.leadership-modal__photo-wrapper {
	position: relative;
	flex-shrink: 0;
	z-index: 1;
}

.leadership-modal__photo {
	width: 506px;
	height: 622px;
	object-fit: cover;
	background: #b2b2b2;
	display: block;
}

.leadership-modal__badge {
	position: absolute;
	bottom: 32px;
	left: 181px;
	background: #1a4ea2;
	padding: 26px 35px;
}

.leadership-modal__badge-inner {
	border: 2px solid white;
	padding: 6px 12px;
	text-align: center;
}

.leadership-modal__badge-number {
	display: block;
	font-family: 'Sansation', sans-serif;
	font-size: 50px;
	font-weight: 700;
	line-height: 53px;
	color: white;
	text-transform: uppercase;
}

.leadership-modal__badge-text {
	display: block;
	font-family: 'Inter', sans-serif;
	font-size: 16px;
	font-weight: 500;
	line-height: 22px;
	color: white;
	text-transform: uppercase;
}

.leadership-modal__info {
	flex: 1;
	z-index: 1;
}

.leadership-modal__name {
	font-family: 'Sansation', sans-serif;
	font-size: 40px;
	font-weight: 700;
	line-height: 60px;
	letter-spacing: 1.2px;
	color: #1a4ea2;
	text-transform: uppercase;
	margin: 0 0 9px;
}

.leadership-modal__title {
	font-family: 'Inter', sans-serif;
	font-size: 20px;
	font-weight: 700;
	line-height: 30px;
	color: #1a4ea2;
	margin: 0 0 21px;
}

.leadership-modal__bio {
	font-family: 'Inter', sans-serif;
	font-size: 20px;
	font-weight: 400;
	line-height: 30px;
	color: #4e4b48;
	max-width: 763px;
}

.leadership-modal__bio p {
	margin: 0;
}

.leadership-modal__close {
	position: absolute;
	top: 80px;
	right: 32px;
	width: 34px;
	height: 34px;
	background: none;
	border: none;
	cursor: pointer;
	padding: 0;
	z-index: 10001;
}

.leadership-modal__close:hover svg line {
	stroke: #1c8ece;
}

/**
 * 5.5 Lifeguard Love Section - Summer Pattern Background
 */

/* Summer pattern background for Why You'll Love Lifeguarding section */
.has-summer-pattern-bg {
	position: relative;
	background-color: #fbd872;
}

.has-summer-pattern-bg::before {
	content: '';
	position: absolute;
	inset: 0;
	background: url('/wp-content/uploads/2025/12/lifeguard-summer-pattern-bg.jpg') center/cover no-repeat;
	opacity: 0.81;
	pointer-events: none;
	z-index: 0;
}

.has-summer-pattern-bg > * {
	position: relative;
	z-index: 1;
}

/**
 * 5.6 Lifeguard Gallery Section - Red Pattern Background
 */

/* Red pattern background for gallery section */
.has-red-pattern-bg {
	position: relative;
}

.has-red-pattern-bg::before {
	content: '';
	position: absolute;
	inset: 0;
	background: url('/wp-content/uploads/2025/12/lifeguard-gallery-bg.jpg') center/cover no-repeat;
	opacity: 0.3;
	pointer-events: none;
	z-index: 0;
}

.has-red-pattern-bg > * {
	position: relative;
	z-index: 1;
}

/* Lifeguard Gallery Strip - 3 images side by side */
.lifeguard-gallery-strip {
	width: 100%;
	overflow: hidden;
}

.lifeguard-gallery-strip .gallery-images {
	display: flex;
	gap: 25px;
	justify-content: center;
	padding: 0 40px;
	max-width: 1440px;
	margin: 0 auto;
}

.lifeguard-gallery-strip .gallery-image {
	flex: 1 1 0;
	max-width: 440px;
	aspect-ratio: 627 / 491;
	overflow: hidden;
	background-color: #e7e7e7;
}

.lifeguard-gallery-strip .gallery-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	cursor: pointer;
	transition: opacity 0.2s ease;
}

.lifeguard-gallery-strip .gallery-image img:hover {
	opacity: 0.9;
}

/* Responsive adjustments */
@media (max-width: 1024px) {
	.lifeguard-gallery-strip .gallery-images {
		gap: 15px;
		padding: 0 20px;
	}

	.lifeguard-gallery-strip .gallery-image {
		max-width: 320px;
	}
}

@media (max-width: 768px) {
	.lifeguard-gallery-strip .gallery-images {
		flex-wrap: wrap;
		justify-content: center;
	}

	.lifeguard-gallery-strip .gallery-image {
		flex: 0 0 calc(50% - 10px);
		max-width: none;
	}
}

/**
 * 5.8 Gallery Lightbox
 */
.gallery-lightbox {
	position: fixed;
	inset: 0;
	background-color: rgba(0, 0, 0, 0.95);
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease, visibility 0.3s ease;
}

.gallery-lightbox.is-open {
	opacity: 1;
	visibility: visible;
}

.gallery-lightbox .lightbox-content {
	max-width: 90vw;
	max-height: 90vh;
	display: flex;
	align-items: center;
	justify-content: center;
}

.gallery-lightbox .lightbox-image {
	max-width: 100%;
	max-height: 90vh;
	object-fit: contain;
}

.gallery-lightbox .lightbox-close {
	position: absolute;
	top: 20px;
	right: 20px;
	background: none;
	border: none;
	color: #fff;
	font-size: 40px;
	cursor: pointer;
	padding: 10px;
	line-height: 1;
	transition: opacity 0.2s ease;
}

.gallery-lightbox .lightbox-close:hover {
	opacity: 0.7;
}

.gallery-lightbox .lightbox-prev,
.gallery-lightbox .lightbox-next {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background: none;
	border: none;
	color: #fff;
	font-size: 60px;
	cursor: pointer;
	padding: 20px;
	line-height: 1;
	transition: opacity 0.2s ease;
}

.gallery-lightbox .lightbox-prev {
	left: 20px;
}

.gallery-lightbox .lightbox-next {
	right: 20px;
}

.gallery-lightbox .lightbox-prev:hover,
.gallery-lightbox .lightbox-next:hover {
	opacity: 0.7;
}

/**
 * 5.9 Lifeguard Love Grid - Centered columns
 */
.lifeguard-love-grid {
	justify-content: center;
}

/**
 * 5.7 Job Fit Section
 */
.job-fit-section {
	background-image: url('/wp-content/uploads/2025/12/water-ripple-bg.jpg');
	background-size: cover;
	background-position: center;
	padding: 100px 0;
	overflow: hidden;
}

.job-fit-container {
	display: flex;
	align-items: center;
	gap: 60px;
	max-width: 1440px;
	margin: 0 auto;
	padding: 0 40px;
	box-sizing: border-box;
}

.job-fit-carousel {
	flex: 0 0 55%;
	max-width: 859px;
}

.job-fit-slides {
	position: relative;
	width: 100%;
	height: 644px;
}

.job-fit-slide {
	display: none;
	width: 100%;
	height: 100%;
}

.job-fit-slide.is-active {
	display: block;
}

.job-fit-slide img {
	width: 100%;
	height: 644px;
	object-fit: cover;
	display: block;
}

.job-fit-dots {
	display: flex;
	justify-content: center;
	gap: 12px;
	margin-top: 40px;
}

.job-fit-dot {
	width: 14px;
	height: 14px;
	padding: 0;
	border-radius: 50%;
	background-color: transparent;
	border: 2px solid var(--wp--preset--color--theme-02);
	cursor: pointer;
	transition: background-color 0.3s ease;
}

.job-fit-dot:hover,
.job-fit-dot.is-active {
	background-color: var(--wp--preset--color--theme-02);
}

.job-fit-content {
	flex: 1;
	min-width: 0;
	overflow: hidden;
}

.job-fit-content h2 {
	font-family: var(--wp--preset--font-family--sansation);
	font-size: 37px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1.5px;
	line-height: 60px;
	color: var(--wp--preset--color--theme-02);
	margin: 0 0 20px 0;
}

.job-fit-content hr {
	width: 224px;
	height: 4px;
	background-color: var(--wp--preset--color--theme-03);
	border: none;
	margin: 0 0 30px 0;
}

.job-fit-content p {
	font-family: var(--wp--preset--font-family--inter);
	font-size: 20px;
	color: #000;
	line-height: 1.6;
	margin: 0 0 20px 0;
}

.job-fit-content ul {
	font-family: var(--wp--preset--font-family--inter);
	font-size: 20px;
	color: #000;
	line-height: 1.6;
	margin: var(--wp--preset--spacing--40) 0 0 0;
	padding-left: 0;
	list-style: none;
}

.job-fit-content ul li {
	margin-bottom: 12px;
	padding-left: 55px;
	position: relative;
}

.job-fit-content ul li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 2px;
	width: 42px;
	height: 35px;
	background-image: url('/wp-content/uploads/2025/12/red-flag.svg');
	background-size: contain;
	background-repeat: no-repeat;
}

.job-fit-button,
.lifeguard-intro-section .wp-block-buttons .wp-block-button .wp-block-button__link.wp-element-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 228px;
	height: 50px;
	padding: 0 !important; /* REQUIRED: !important to override WordPress database inline padding */
	background-color: var(--wp--preset--color--theme-02);
	color: #fff;
	font-family: var(--wp--preset--font-family--inter);
	font-size: 18px;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 1.44px;
	text-decoration: none;
	border-radius: 54px;
	transition: background-color 0.3s ease;
}

.job-fit-button {
	margin-top: var(--wp--preset--spacing--50);
}

.job-fit-button:hover,
.lifeguard-intro-section .wp-block-buttons .wp-block-button .wp-block-button__link.wp-element-button:hover {
	background-color: var(--wp--preset--color--theme-03);
	color: #fff;
}

.lifeguard-intro-section .wp-block-column .wp-block-heading {
	line-height: 60px;
}

/* Responsive */
@media (max-width: 1300px) {
	.job-fit-container {
		padding: 0 40px;
	}

	.job-fit-carousel {
		flex: 0 0 50%;
		width: 50%;
	}

	.job-fit-slides {
		height: auto;
		aspect-ratio: 859 / 644;
	}

	.job-fit-slide img {
		height: auto;
		aspect-ratio: 859 / 644;
	}

	.job-fit-content h2 {
		font-size: 40px;
		white-space: normal;
	}
}

@media (max-width: 1024px) {
	.job-fit-container {
		flex-direction: column;
		gap: 40px;
		padding: 0 40px;
	}

	.job-fit-carousel {
		flex: 0 0 100%;
		width: 100%;
		max-width: 600px;
	}

	.job-fit-content {
		padding-right: 0;
	}

	.job-fit-content h2 {
		font-size: 36px;
	}

	.job-fit-content p,
	.job-fit-content ul {
		font-size: 18px;
	}

	.job-fit-content ul li {
		padding-left: 45px;
	}

	.job-fit-content ul li::before {
		width: 32px;
		height: 27px;
	}

	.job-fit-button {
		width: 228px;
		height: 50px;
		font-size: 18px;
	}
}

/**
 * 5.10 Lifeguard Intro Image
 */
.lifeguard-intro-image {
	margin: 0;
}

.lifeguard-intro-image img {
	width: 100%;
	height: auto;
	display: block;
}

/**
 * 5.11 Responsive Typography - Mobile Text Overflow Fix
 * CRITICAL: Fluid typography to prevent text truncation on small mobile screens (320px-480px)
 * Issue: Fixed 50px headings cause "THE TRUSTE..." truncation on narrow viewports
 * REQUIRED: !important to override WordPress database inline font-size styles for mobile responsiveness
 */

/* Hero cover headings - fluid scaling from 28px (320px) to 50px (1024px+) */
.wp-block-cover h1[style*="font-size:50px"],
.wp-block-cover h2[style*="font-size:50px"],
.wp-block-cover h1.wp-block-heading,
.wp-block-cover h2.wp-block-heading {
	font-size: clamp(28px, 5vw, 50px) !important;
}

/* All 50px headings throughout site - responsive scaling */
h1[style*="font-size:50px"],
h2[style*="font-size:50px"],
.has-texture-bg h1.wp-block-heading,
.has-texture-bg h2.wp-block-heading,
.has-water-ripple-bg h1.wp-block-heading,
.has-red-pattern-bg h2.wp-block-heading,
.has-theme-02-background-color h2.wp-block-heading,
.home-mission-section h2.wp-block-heading {
	font-size: clamp(28px, 4.5vw, 50px) !important;
}

/* Home hero carousel heading - larger base, maintains impact */
.hero-bottom-content h1,
.home-hero-carousel-content h1 {
	font-size: clamp(36px, 6vw, 77px) !important;
}

/* Fine-tune for very small screens (320px) */
@media (max-width: 375px) {
	.wp-block-cover h1[style*="font-size:50px"],
	.wp-block-cover h2[style*="font-size:50px"],
	h1[style*="font-size:50px"],
	h2[style*="font-size:50px"] {
		font-size: clamp(24px, 7vw, 50px) !important;
		line-height: 1.2 !important;
		word-wrap: break-word !important;
		overflow-wrap: break-word !important;
	}
}

/* Tablet adjustments (481px-768px) */
@media (min-width: 481px) and (max-width: 768px) {
	.wp-block-cover h1[style*="font-size:50px"],
	.wp-block-cover h2[style*="font-size:50px"],
	h1[style*="font-size:50px"],
	h2[style*="font-size:50px"] {
		font-size: clamp(32px, 5vw, 50px) !important;
	}
}

/**
 * 6.0 Careers Page Styles
 */

/* Careers hero - 569px height on desktop */
@media (min-width: 1200px) {
	.careers-hero-section {
		min-height: 569px;
		display: flex;
		align-items: center;
	}
}

/* Careers hero - Figma exact column widths (690px / 656px) */
/* REQUIRED: !important needed to override existing .has-texture-bg rule at line 719-724 which uses !important */
@media (min-width: 1200px) {
	.careers-hero-section.has-texture-bg > .wp-block-columns.alignwide > .wp-block-column:first-child {
		flex-basis: 690px !important;
		flex-grow: 0;
	}
	.careers-hero-section.has-texture-bg > .wp-block-columns.alignwide > .wp-block-column:last-child {
		flex-basis: 656px !important;
		flex-grow: 0;
	}
	.careers-hero-section.has-texture-bg > .wp-block-columns.alignwide {
		gap: 67px;
		justify-content: center;
	}
}

/* Careers hero separator - fixed 224px width */
.careers-hero-section .wp-block-separator.is-style-wide {
	width: 224px;
	margin-left: 0;
	margin-right: auto;
}

/* Careers CTA button - exact 225px x 46px sizing - REQUIRED: !important to override WordPress database inline styles from pattern */
.careers-lifeguard-cta-section .wp-block-buttons .wp-block-button.careers-cta-button .wp-block-button__link.wp-element-button {
	width: 225px !important;
	height: 46px !important;
	min-height: 46px !important;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	padding: 0 !important;
}

@media (max-width: 600px) {
	.careers-lifeguard-cta-section .wp-block-buttons .wp-block-button.careers-cta-button .wp-block-button__link.wp-element-button {
		width: auto !important;
		height: auto !important;
		min-height: auto !important;
		padding: 12px 24px !important;
	}
}

/* Offset pool background for careers leadership image - flush left */
.has-offset-pool-bg {
	position: relative;
	margin-right: 10px;
	margin-bottom: 10px;
}

.has-offset-pool-bg::before {
	content: '';
	position: absolute;
	right: -10px;
	bottom: -10px;
	width: 100%;
	height: 100%;
	background: url('/wp-content/uploads/2025/12/pool-bg.png') center/cover no-repeat;
	z-index: 0;
}

.has-offset-pool-bg > * {
	position: relative;
	z-index: 1;
}

/* Careers grid - heading on one line */
.has-water-ripple-bg h1.wp-block-heading {
	white-space: nowrap;
}

/* Careers grid - equal height cards */
.has-water-ripple-bg .wp-block-columns:has(.has-theme-07-background-color) {
	align-items: stretch;
}

.has-water-ripple-bg .wp-block-columns:has(.has-theme-07-background-color) > .wp-block-column {
	display: flex;
}

.has-water-ripple-bg .has-theme-07-background-color {
	flex: 1;
	display: flex;
	flex-direction: column;
}

.has-water-ripple-bg .has-theme-07-background-color > .wp-block-group:last-child {
	flex: 1;
}

/* Careers grid - full width images with consistent aspect ratio */
.has-water-ripple-bg .has-theme-07-background-color .wp-block-image {
	width: 100%;
	margin: 0;
}

.has-water-ripple-bg .has-theme-07-background-color .wp-block-image img {
	width: 100%;
	aspect-ratio: 584 / 329;
	object-fit: cover;
	display: block;
}

/* Careers leadership - flush left image with section edge */
/* REQUIRED: !important to override inline padding from pattern */
.has-water-ripple-bg:has(.has-offset-pool-bg) {
	padding-left: 0 !important;
	padding-right: var(--wp--preset--spacing--50) !important;
}

.has-water-ripple-bg > .wp-block-columns.alignwide {
	max-width: 100%;
	overflow: hidden;
}

.has-water-ripple-bg .has-offset-pool-bg {
	margin-left: 0;
	padding-left: 0;
	margin-right: 10px;
	margin-bottom: 10px;
}

/* Text column needs padding since section padding-left is 0 */
.has-water-ripple-bg:has(.has-offset-pool-bg) > .wp-block-columns > .wp-block-column:last-child {
	padding-right: var(--wp--preset--spacing--50);
}

.has-water-ripple-bg .has-offset-pool-bg .wp-block-image {
	margin: 0;
}

.has-water-ripple-bg .has-offset-pool-bg .wp-block-image img {
	width: 100%;
	max-width: 100%;
	display: block;
}

/* Home Hero Carousel */
.home-hero-carousel-wrapper {
	position: relative;
	overflow: hidden;
}

.hero-navigation-block-wrapper {
	position: absolute;
	top: calc(var(--wp--preset--spacing--20) + 85px);
	left: 380px;
	z-index: 3;
	pointer-events: none;
	transform: translateY(-50%);
}

.hero-navigation-block-wrapper .wp-block-navigation {
	pointer-events: all;
	gap: 48px;
}

.hero-navigation-block-wrapper .wp-block-navigation__container {
	gap: 48px;
}

.hero-navigation-block-wrapper .wp-block-navigation-item a {
	color: white;
	text-decoration: none;
	font-family: var(--wp--preset--font-family--sansation);
	font-size: 20px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.6px;
	line-height: 22px;
	white-space: nowrap;
}

.hero-navigation-block-wrapper .wp-block-navigation-item a:hover {
	opacity: 0.8;
}

/* Become a Lifeguard button in hero navigation - only last item */
.hero-navigation-block-wrapper .wp-block-button.is-style-wave {
	margin-left: 48px;
}

.hero-navigation-block-wrapper .wp-block-navigation > ul.wp-block-navigation__container > li.wp-block-navigation-item:last-child a {
	background-color: #fbd872;
	color: #1a4ea2;
	padding: 10px 20px;
	border-radius: 43px;
	text-transform: capitalize;
}

.hero-navigation-block-wrapper .wp-block-navigation > ul.wp-block-navigation__container > li.wp-block-navigation-item:last-child a:hover {
	opacity: 1;
	background-color: #fcd45f;
}

.home-hero-carousel {
	position: relative;
	width: 100%;
	min-height: 100vh;
	height: 100vh;
}

.home-hero-carousel .carousel-slides {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.home-hero-carousel .carousel-slide {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	transition: opacity 0.5s ease-in-out;
}

.home-hero-carousel .carousel-slide.is-active {
	opacity: 1;
}

.home-hero-carousel .carousel-slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.home-hero-carousel-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(180deg, rgb(26,78,162) 0%, rgba(26,79,163,0) 100%);
	z-index: 1;
	pointer-events: none;
}

.home-hero-carousel-content {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 2;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: 0;
}

.hero-top-bar {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	padding: var(--wp--preset--spacing--40) 0 var(--wp--preset--spacing--20) 0;
	padding-left: 55px;
	gap: 85px;
	width: 100%;
}

.hero-logo {
	width: 240px;
	flex-shrink: 0;
}

.hero-logo a {
	display: block;
	width: 100%;
	height: auto;
}

.hero-navigation {
	flex: 0;
	display: flex;
	align-items: center;
}

.hero-navigation .wp-block-navigation {
	gap: 68px;
}

.hero-navigation .wp-block-navigation__container {
	gap: 68px;
}

.hero-navigation .wp-block-navigation-item a {
	color: white;
	text-decoration: none;
	font-family: var(--wp--preset--font-family--sansation);
	font-size: 20px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.6px;
	line-height: 22px;
	white-space: nowrap;
}

.hero-navigation .wp-block-navigation-item a:hover {
	opacity: 0.8;
}

/* Become a Lifeguard button in hero navigation - REQUIRED: !important to override WordPress core navigation inline styles */
.hero-navigation .wp-block-navigation__container > .wp-block-navigation-item:last-child a,
.hero-navigation .wp-block-navigation-item > a[href*="become-a-lifeguard"],
.hero-navigation .wp-block-navigation-item > a[href*="lifeguard"] {
	background-color: #fbd872 !important;
	color: #1a4ea2 !important;
	padding: 10px 20px !important;
	border-radius: 43px !important;
	text-transform: capitalize !important;
}

.hero-navigation .wp-block-navigation__container > .wp-block-navigation-item:last-child a:hover,
.hero-navigation .wp-block-navigation-item > a[href*="become-a-lifeguard"]:hover,
.hero-navigation .wp-block-navigation-item > a[href*="lifeguard"]:hover {
	opacity: 1 !important;
	background-color: #fcd45f !important;
}

.hero-logo svg {
	width: 100%;
	height: auto;
	fill: white;
}

/* Hide page title on front page (hero has its own heading) */
body.home .wp-block-post-title,
body.page-template-front-page .wp-block-post-title {
	display: none;
}

.hero-bottom-content {
	padding-bottom: var(--wp--preset--spacing--50);
	text-align: center;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.hero-bottom-content h1 {
	color: #FFF;
	text-align: center;
	text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
	font-family: var(--wp--preset--font-family--sansation);
	font-size: 77px;
	font-style: normal;
	font-weight: 700;
	line-height: 115px;
	letter-spacing: 3.08px;
	text-transform: uppercase;
	margin: 0;
	max-width: 100%;
	width: 100%;
}

.home-hero-carousel-dots {
	position: absolute;
	bottom: 20px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	gap: 10px;
	z-index: 3;
}

/* Home hero carousel dots - sizing moved to accessibility section below (line ~2922) */

/* Home About Section (Intro) */
.has-theme-01-background-color.has-texture-bg {
	min-height: 569px;
}

.has-theme-01-background-color.has-texture-bg .wp-block-separator {
	margin-left: 0;
	margin-right: auto;
}

/* Solutions Section - headings single line with exact Figma styling */
.wp-block-cover.solutions-section-cover .wp-block-cover__inner-container h2.wp-block-heading,
.wp-block-cover.solutions-section-cover .wp-block-cover__inner-container h3.wp-block-heading {
	white-space: nowrap;
}

.wp-block-cover.solutions-section-cover .wp-block-cover__inner-container h3.wp-block-heading {
	font-size: 33px;
}

.solutions-card-new .wp-block-image img {
	width: 617px;
	height: 645px;
	object-fit: cover;
}

/* Home Service Areas Section */
.service-areas-intro-section {
	min-height: 997px;
}

/* Home Mission Section */
.home-mission-section {
	min-height: 938px;
}

/* Home Gallery Section */
.home-gallery-section .wp-block-cover__inner-container {
	max-width: 100%;
}

.home-gallery-section h2 {
	max-width: 100%;
}

/* Texture overlay for home gallery cover block - must be above white overlay */
.home-gallery-section.has-texture-bg::before {
	content: '';
	position: absolute;
	inset: 0;
	background: url('/wp-content/uploads/2025/12/texture-bg.png') lightgray 0px -286.696px / 100% 192.83% no-repeat;
	opacity: 0.1;
	pointer-events: none;
	z-index: 2;
}

.home-gallery-section.has-texture-bg .wp-block-cover__inner-container {
	z-index: 3;
}

/* Service Areas Facility Grid Cards */
/* Container max-width already set to 1200px in pattern */

/* Completely disable water-ripple overlay for facility grid section */
.service-areas-facility-grid.has-water-ripple-bg::before {
	display: none;
}

/* Container - 1200px to hold two 584px cards + 32px gap */
.service-areas-facility-grid > .wp-block-group {
	max-width: 1200px;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}

/* Heading - single line, centered */
.service-areas-facility-grid h2.has-text-align-center {
	text-align: center;
	white-space: nowrap;
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
}

/* Equal height for all columns - exact Figma dimensions */
.service-areas-facility-grid .wp-block-columns {
	align-items: stretch;
	display: flex;
	gap: 32px;
	margin-bottom: 72px;
	max-width: 1200px;
	width: 1200px;
	margin-left: auto;
	margin-right: auto;
}

.service-areas-facility-grid .wp-block-columns:last-of-type {
	margin-bottom: 0;
}

.service-areas-facility-grid .wp-block-column {
	display: flex;
	width: 584px;
	max-width: 584px;
	min-width: 584px;
	flex-shrink: 0;
	flex-grow: 0;
}

/* Card wrapper - full height */
.service-areas-facility-grid .wp-block-column > .wp-block-group {
	display: flex;
	flex-direction: column;
	width: 100%;
}

/* Images - exact Figma dimensions: 584 x 329 */
.service-areas-facility-grid .wp-block-image {
	width: 584px;
	height: 329px;
	margin: 0;
	flex-shrink: 0;
	overflow: hidden;
}

.service-areas-facility-grid .wp-block-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* Text area - exact Figma dimensions: 584 x 485 */
.service-areas-facility-grid .wp-block-group.has-theme-07-background-color {
	width: 584px;
	height: 485px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}


/* Home Dual CTA Section */
.home-cta-dual-section {
	margin-top: 20px;
	gap: 20px;
}

.home-cta-button .wp-block-button__link {
	width: 228px;
	height: 50px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0 !important; /* REQUIRED: !important to override WordPress database inline padding */
}

/* Blue Wave Button Style */
.wp-block-button.is-style-outline.is-blue-wave {
	margin-top: 40px;
}

.wp-block-button.is-style-outline.is-blue-wave .wp-block-button__link {
	background-image: url('/wp-content/uploads/2025/12/blue-wave.png');
	background-size: cover;
	background-position: center;
	border: 2px solid #1c8ece;
	border-radius: 54px;
	color: white;
	font-family: var(--wp--preset--font-family--sansation);
	font-size: 25px;
	font-weight: 700;
	text-transform: capitalize;
	padding: 10px 52px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/**
 * 7.0 Mobile Responsive Styles
 */

/* Contact Hero Form - Mobile Responsive - REQUIRED: !important to override desktop layout */
@media (max-width: 768px) {
	/* Stack columns on mobile */
	.has-droplet-bg .wp-block-columns {
		flex-direction: column !important;
	}

	/* Remove absolute positioning on image column for mobile */
	.has-droplet-bg .wp-block-column:last-child {
		position: relative !important;
		width: 100% !important;
		top: auto !important;
		right: auto !important;
		bottom: auto !important;
		height: 400px !important; /* Fixed height for mobile image */
	}

	/* Form column - full width on mobile */
	.has-droplet-bg .wp-block-column:first-child {
		width: 100% !important;
		flex-basis: 100% !important;
		padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40) !important;
	}

	/* Ensure image maintains aspect ratio on mobile */
	.has-droplet-bg .wp-block-column:last-child img {
		height: 100%;
		width: 100%;
		object-fit: cover;
	}
}

/* Gravity Forms - Touch Target Optimization for Mobile */
/* REQUIRED: !important to override Gravity Forms inline styles */
.gform_wrapper input[type="text"],
.gform_wrapper input[type="email"],
.gform_wrapper input[type="tel"],
.gform_wrapper input[type="url"],
.gform_wrapper input[type="number"],
.gform_wrapper textarea,
.gform_wrapper select {
	min-height: 44px !important;
	padding: 12px !important;
	font-size: 16px !important; /* Prevents iOS zoom on focus */
	line-height: 1.5 !important;
}

/* Ensure labels are readable on mobile */
.gform_wrapper .gfield_label {
	font-size: 16px !important;
	font-weight: 600 !important;
	margin-bottom: 8px !important;
}

/* Submit button - consistent styling across all forms matching Figma design */
.gform_wrapper .gform_footer input[type="submit"],
.gform_wrapper .gform_footer button[type="submit"],
.gform_wrapper .gform_button,
.gform_wrapper input.gform_button {
	display: flex !important;
	width: 261px !important;
	padding: 7px 19px !important;
	justify-content: center !important;
	align-items: center !important;
	gap: 8px !important;
	min-height: 44px !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	line-height: 1.5 !important;
	border-radius: 8px !important;
	border: none !important;
	cursor: pointer;
	text-align: center !important;
	box-sizing: border-box !important;
}

/* Ensure checkbox/radio inputs have adequate touch targets */
.gform_wrapper input[type="checkbox"],
.gform_wrapper input[type="radio"] {
	width: 22px !important;
	height: 22px !important;
	margin-right: 10px !important;
}

/* Additional mobile optimization for smaller screens - REQUIRED: !important for mobile font scaling */
@media (max-width: 428px) {
	/* Heading font size adjustment */
	.has-droplet-bg .wp-block-heading {
		font-size: 36px !important;
		line-height: 1.2 !important;
	}

	/* Paragraph font size adjustment */
	.has-droplet-bg p {
		font-size: 18px !important;
		line-height: 1.5 !important;
	}

	/* Reduce padding on smallest screens */
	.has-droplet-bg .wp-block-column:first-child {
		padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30) !important;
	}
}

/* iPhone SE and very small screens (320px) - REQUIRED: !important for mobile font scaling */
@media (max-width: 375px) {
	.has-droplet-bg .wp-block-heading {
		font-size: 32px !important;
	}

	.has-droplet-bg p {
		font-size: 16px !important;
	}

	.has-droplet-bg .wp-block-column:first-child {
		padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--20) !important;
	}
}

/**
 * 7.0 Announcement Banner
 */
.announcement-banner {
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 100;
	text-align: center;
}

.announcement-banner p {
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	flex: 1;
}

#announcement-banner-close {
	position: absolute;
	right: var(--wp--preset--spacing--50);
}

/* Service Areas - Facility Grid Cards - REMOVED DUPLICATE (now at line 2472) */

/* Service Areas Map - left align text with heading */
.service-areas-map-image ~ .wp-block-group p,
.has-water-ripple-bg .wp-block-columns .wp-block-group.has-theme-02-background-color ~ .wp-block-group p {
	text-align: left;
}

/* Partner Contact - Parent container adjustments for flush-right image */
.has-droplet-bg.has-global-padding {
	padding-right: 0 !important;
}

.has-droplet-bg .wp-block-columns.alignwide,
.has-droplet-bg .wp-block-columns.alignfull {
	max-width: none !important;
	padding-right: 0 !important;
	margin-right: 0 !important;
}

/* Partner Contact / Let's Connect - full height image flush right with exact desktop dimensions */
.has-droplet-bg .partner-contact-image-column {
	margin-right: 0 !important;
	padding-right: 0 !important;
	display: flex;
	align-items: stretch;
	width: 770px !important;
	height: 932px !important;
	position: absolute !important;
	right: 0 !important;
	top: 0 !important;
}

.has-droplet-bg .partner-contact-image-column .wp-block-image {
	height: 100%;
	width: 100%;
	margin: 0;
	flex: 1;
}

.has-droplet-bg .partner-contact-image-column .wp-block-image img {
	width: 770px;
	height: 932px;
	object-fit: cover;
	display: block;
	object-position: center;
}

/* Operations Contact / Partner Contact - full height image flush right with exact desktop dimensions - REQUIRED: !important to override WordPress core column block inline styles */
.operations-contact-section,
.partner-contact-section {
	position: relative;
	height: 932px !important;
	min-height: 932px;
	max-height: 932px;
	overflow: hidden;
}

.operations-contact-section.has-global-padding,
.has-droplet-bg.operations-contact-section,
.partner-contact-section.has-global-padding,
.has-droplet-bg.partner-contact-section {
	padding-right: 0 !important;
}

/* Also handle if it's just has-droplet-bg without operations-contact-section class */
.has-droplet-bg:has(.partner-contact-image-column),
.has-droplet-bg:has(.contact-image-column) {
	padding-right: 0 !important;
	overflow: hidden;
	position: relative;
	height: 932px !important;
	min-height: 932px;
	max-height: 932px;
}

.has-droplet-bg:has(.partner-contact-image-column) .wp-block-columns,
.has-droplet-bg:has(.contact-image-column) .wp-block-columns,
.operations-contact-section .wp-block-columns,
.partner-contact-section .wp-block-columns {
	position: relative;
	height: 932px !important;
	min-height: 932px;
	max-height: 932px;
	max-width: none !important;
	padding-right: 0 !important;
	margin-right: 0 !important;
}

/* Reduce padding in contact form sections to fit all content */
.has-droplet-bg:has(.partner-contact-image-column) .wp-block-column:first-child,
.has-droplet-bg:has(.contact-image-column) .wp-block-column:first-child,
.operations-contact-section .wp-block-column:first-child,
.partner-contact-section .wp-block-column:first-child {
	padding-top: 60px !important;
	padding-bottom: 60px !important;
	overflow-y: visible;
	max-height: 932px;
}

/* Reduce spacing in contact sections */
.operations-contact-section .wp-block-group,
.partner-contact-section .wp-block-group {
	gap: 24px !important;
}

.operations-contact-section h1,
.operations-contact-section h2,
.partner-contact-section h1,
.partner-contact-section h2 {
	font-size: 42px !important;
	line-height: 50px !important;
	margin-bottom: 0 !important;
}

.operations-contact-section .wp-block-separator,
.partner-contact-section .wp-block-separator {
	margin-top: 16px !important;
	margin-bottom: 16px !important;
}

.operations-contact-section .wp-block-group > p,
.partner-contact-section .wp-block-group > p {
	margin-bottom: 20px !important;
}

.operations-contact-section .gform_wrapper .gfield,
.partner-contact-section .gform_wrapper .gfield {
	margin-bottom: 8px !important;
}

.operations-contact-section .gform_wrapper .gform_fields,
.partner-contact-section .gform_wrapper .gform_fields {
	row-gap: 8px !important;
}

.operations-contact-section .gform_wrapper .gfield_label,
.partner-contact-section .gform_wrapper .gfield_label {
	margin-bottom: 4px !important;
}

/* Reduce spacing between form elements */
.has-droplet-bg:has(.contact-image-column) .wp-block-group,
.has-droplet-bg:has(.partner-contact-image-column) .wp-block-group {
	gap: 24px !important;
}

/* Reduce heading size slightly to save space */
.has-droplet-bg:has(.contact-image-column) h1,
.has-droplet-bg:has(.partner-contact-image-column) h1,
.has-droplet-bg:has(.contact-image-column) h2,
.has-droplet-bg:has(.partner-contact-image-column) h2 {
	font-size: 42px !important;
	line-height: 50px !important;
	margin-bottom: 0 !important;
}

/* Reduce separator height */
.has-droplet-bg:has(.contact-image-column) .wp-block-separator,
.has-droplet-bg:has(.partner-contact-image-column) .wp-block-separator {
	margin-top: 16px !important;
	margin-bottom: 16px !important;
}

/* Reduce paragraph spacing */
.has-droplet-bg:has(.contact-image-column) .wp-block-group > p,
.has-droplet-bg:has(.partner-contact-image-column) .wp-block-group > p {
	margin-bottom: 20px !important;
}

/* Tighter form field spacing */
.has-droplet-bg:has(.contact-image-column) .gform_wrapper .gfield,
.has-droplet-bg:has(.partner-contact-image-column) .gform_wrapper .gfield {
	margin-bottom: 8px !important;
}

.has-droplet-bg:has(.contact-image-column) .gform_wrapper .gform_fields,
.has-droplet-bg:has(.partner-contact-image-column) .gform_wrapper .gform_fields {
	row-gap: 8px !important;
}

.has-droplet-bg:has(.contact-image-column) .gform_wrapper .gfield_label,
.has-droplet-bg:has(.partner-contact-image-column) .gform_wrapper .gfield_label {
	margin-bottom: 4px !important;
}

.operations-contact-section .operations-contact-image-column,
.operations-contact-section .wp-block-column:last-child {
	margin-right: 0 !important;
	padding-right: 0 !important;
	display: flex;
	align-items: stretch;
	width: 770px !important;
	height: 932px !important;
	position: absolute !important;
	right: 0 !important;
	top: 0 !important;
	flex-basis: auto !important;
	margin: 0 !important;
}

.operations-contact-section .operations-contact-image-column .wp-block-image,
.operations-contact-section .operations-contact-image-column figure,
.operations-contact-section .wp-block-column:last-child .wp-block-image,
.operations-contact-section .wp-block-column:last-child figure {
	height: 100%;
	width: 100%;
	margin: 0;
	flex: 1;
	border-radius: 0;
}

.operations-contact-section .operations-contact-image-column .wp-block-image img,
.operations-contact-section .operations-contact-image-column img,
.operations-contact-section .wp-block-column:last-child .wp-block-image img,
.operations-contact-section .wp-block-column:last-child img {
	width: 770px;
	height: 932px;
	object-fit: cover;
	display: block;
	object-position: center;
	border-radius: 0;
}

/* Contact sections - Mobile/Tablet - reset absolute positioning - REQUIRED: !important to override desktop styles */
@media (max-width: 1024px) {
	.operations-contact-section,
	.partner-contact-section {
		min-height: auto;
		height: auto !important;
	}

	.operations-contact-section .wp-block-columns,
	.partner-contact-section .wp-block-columns {
		min-height: auto;
		height: auto !important;
	}

	.operations-contact-section .operations-contact-image-column,
	.operations-contact-section .wp-block-column:last-child,
	.partner-contact-section .partner-contact-image-column,
	.partner-contact-section .wp-block-column:last-child {
		position: static !important;
		width: 100% !important;
		height: auto !important;
		margin-bottom: var(--wp--preset--spacing--50);
	}

	.operations-contact-section .operations-contact-image-column .wp-block-image img,
	.operations-contact-section .wp-block-column:last-child .wp-block-image img,
	.partner-contact-section .partner-contact-image-column .wp-block-image img,
	.partner-contact-section .wp-block-column:last-child .wp-block-image img {
		width: 100% !important;
		height: auto !important;
		max-height: 500px;
	}
}

/* Partner Trusted Staffing - constrain text to container width */
.has-water-ripple-bg .wp-block-columns .wp-block-column[style*="60%"] .wp-block-group p {
	max-width: 709px;
}

/* Hero Navigation - consistent spacing and prevent wrapping */
.is-hero .wp-block-navigation {
	flex-wrap: nowrap;
}

.is-hero .wp-block-navigation .wp-block-navigation__container {
	gap: 24px;
}

/* Lifeguard Page - solid blue navigation background */
.page-id-23 .wp-block-template-part > .wp-block-group {
	background-color: #1a4ea2;
	margin: 0;
}

.page-id-23 .wp-block-template-part > .wp-block-group .wp-block-group.alignfull {
	background-color: transparent;
}

/* Lifeguard Page - navigation link spacing */
.page-id-23 .wp-block-navigation__container {
	gap: 24px;
	flex-wrap: nowrap;
}

.page-id-23 .wp-block-navigation .wp-block-navigation-item {
	margin: 0;
}

/* Lifeguard Page - ensure Partner With Us link has consistent spacing */
.page-id-23 .wp-block-navigation .wp-block-navigation-item a {
	padding-left: 0;
	padding-right: 0;
}

/* Lifeguard Page - button container spacing */
.page-id-23 .wp-block-buttons.is-content-justification-right.is-layout-flex {
	gap: 20px;
	margin-top: -10px;
}

/* Separator 224 - consistent bottom spacing */
.separator-224 {
	margin-bottom: 60px;
}

/* Lifeguard Intro - paragraph right padding on desktop */
.lifeguard-intro-section p {
	padding-right: 120px;
}

@media (max-width: 768px) {
	.lifeguard-intro-section p {
		padding-right: 0;
	}
}

/* Lifeguard - Why You'll Love icons - 42x35px */
.lifeguard-flag-icon img {
	width: 42px !important;
	height: 35px !important;
	object-fit: contain;
}

/* Lifeguard - Job Fit carousel flush left */
.job-fit-section {
	overflow: hidden;
}

.job-fit-carousel {
	margin-left: calc(-1 * max(16px, (100vw - 1440px) / 2));
}

/* Lifeguard Gallery - white carousel dots */
.lifeguard-gallery-strip {
	position: relative;
	margin: 0 auto;
	padding: 0 40px 60px;
}

.lifeguard-gallery-dots {
	position: absolute;
	bottom: 20px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	gap: 12px;
	z-index: 10;
}

.lifeguard-gallery-dot {
	min-width: 14px;
	min-height: 17px;
	width: 14px;
	height: 17px;
	padding: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	position: relative;
	background-color: transparent;
	border: none;
	cursor: pointer;
}

.lifeguard-gallery-dot::after {
	content: '';
	width: 8px;
	height: 8px;
	border-radius: 50%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: rgba(255, 255, 255, 0.5);
	border: none;
	transition: background-color 0.3s ease;
	pointer-events: none;
}

.lifeguard-gallery-dot:hover::after,
.lifeguard-gallery-dot.is-active::after {
	background: white;
	width: 8px;
	height: 8px;
}

/* Partner Staffing Carousel Dots - Bordered outline style */
.partner-staffing-carousel .splide__pagination {
	bottom: 20px;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	gap: 12px;
	z-index: 10;
}

.partner-staffing-carousel .splide__pagination__page {
	min-width: 17px;
	min-height: 17px;
	width: 17px;
	height: 17px;
	padding: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	position: relative;
	background-color: transparent;
	border: none;
	cursor: pointer;
	opacity: 1;
	flex-shrink: 0;
}

.partner-staffing-carousel .splide__pagination__page::after {
	content: '';
	width: 12px;
	height: 12px;
	border-radius: 50%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background-color: transparent;
	border: 2px solid var(--wp--preset--color--theme-02);
	transition: background-color 0.3s ease;
	pointer-events: none;
}

.partner-staffing-carousel .splide__pagination__page:hover::after,
.partner-staffing-carousel .splide__pagination__page.is-active::after {
	background-color: var(--wp--preset--color--theme-02);
}

/* Partner Staffing Gallery - Simple gallery display */
.partner-staffing-gallery.wp-block-gallery {
	position: relative;
	display: block;
}

.partner-staffing-gallery.wp-block-gallery .wp-block-image {
	width: 100%;
	margin: 0;
}

.partner-staffing-gallery.wp-block-gallery .wp-block-image img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 0;
}

/**
 * 7.0 Mobile Navigation Styles
 */

/* Hide mobile toggle on desktop */
.mobile-nav-toggle {
	display: none;
}

/* Mobile navigation - hidden by default */
.mobile-navigation {
	display: none;
}

.mobile-nav-overlay {
	display: none;
}

/* Mobile breakpoint - below 768px - REQUIRED: !important to hide desktop nav on mobile */
@media (max-width: 767px) {
	/* Hide desktop navigation */
	.desktop-navigation,
	.wp-block-navigation.desktop-navigation {
		display: none !important;
	}

	/* Show mobile toggle button */
	.mobile-nav-toggle {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 44px;
		height: 44px;
		min-width: 44px;
		min-height: 44px;
		padding: 0;
		background: transparent;
		border: none;
		cursor: pointer;
		position: relative;
		z-index: 1001;
		transition: opacity 0.2s ease;
	}

	.mobile-nav-toggle:hover {
		opacity: 0.7;
	}

	.mobile-nav-toggle:focus {
		outline: 2px solid #1c8ece;
		outline-offset: 2px;
	}

	/* Hamburger icon */
	.hamburger-box {
		width: 24px;
		height: 18px;
		display: inline-block;
		position: relative;
	}

	.hamburger-inner,
	.hamburger-inner::before,
	.hamburger-inner::after {
		width: 24px;
		height: 3px;
		background-color: #1a4ea2;
		border-radius: 2px;
		position: absolute;
		transition: transform 0.3s ease, opacity 0.3s ease;
	}

	.hamburger-inner {
		top: 50%;
		transform: translateY(-50%);
	}

	.hamburger-inner::before,
	.hamburger-inner::after {
		content: '';
		display: block;
	}

	.hamburger-inner::before {
		top: -7px;
	}

	.hamburger-inner::after {
		top: 7px;
	}

	/* Animate to X when open */
	.mobile-nav-toggle[aria-expanded="true"] .hamburger-inner {
		transform: rotate(45deg);
	}

	.mobile-nav-toggle[aria-expanded="true"] .hamburger-inner::before {
		opacity: 0;
	}

	.mobile-nav-toggle[aria-expanded="true"] .hamburger-inner::after {
		top: 0;
		transform: rotate(-90deg);
	}

	/* Mobile navigation overlay */
	.mobile-nav-overlay {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.5);
		opacity: 0;
		visibility: hidden;
		transition: opacity 0.3s ease, visibility 0.3s ease;
		z-index: 999;
	}

	.mobile-nav-overlay[aria-hidden="false"] {
		display: block;
		opacity: 1;
		visibility: visible;
	}

	/* Mobile navigation panel */
	.mobile-navigation {
		position: fixed;
		top: 0;
		right: 0;
		width: 85%;
		max-width: 320px;
		height: 100%;
		background-color: #f3f2ed;
		box-shadow: -2px 0 8px rgba(0, 0, 0, 0.15);
		transform: translateX(100%);
		transition: transform 0.3s ease;
		z-index: 1000;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}

	.mobile-navigation[aria-hidden="false"] {
		display: block;
		transform: translateX(0);
	}

	.mobile-navigation-inner {
		padding: 80px 30px 40px;
	}

	/* Clone navigation items into mobile menu with JavaScript */
	.mobile-navigation .wp-block-navigation__container {
		display: flex;
		flex-direction: column;
		gap: 0;
		list-style: none;
		padding: 0;
		margin: 0;
	}

	.mobile-navigation .wp-block-navigation-item {
		border-bottom: 1px solid rgba(26, 78, 162, 0.2);
	}

	.mobile-navigation .wp-block-navigation-item a {
		display: block;
		padding: 16px 0;
		color: #1a4ea2 !important;
		font-family: var(--wp--preset--font-family--sansation), sans-serif;
		font-size: 18px;
		font-weight: 700;
		text-transform: uppercase;
		text-decoration: none;
		letter-spacing: 0.5px;
		transition: color 0.2s ease;
	}

	.mobile-navigation .wp-block-navigation-item a:hover,
	.mobile-navigation .wp-block-navigation-item a:focus {
		color: #1c8ece !important;
	}

	/* Become a Lifeguard button in mobile menu */
	.mobile-navigation .wp-block-navigation-item:last-child a {
		background-color: #fbd872;
		color: #1a4ea2 !important;
		padding: 12px 24px;
		border-radius: 43px;
		text-align: center;
		margin-top: 20px;
	}

	.mobile-navigation .wp-block-navigation-item:last-child a:hover {
		background-color: #fcd45f;
	}
}

/* Extra small devices - ensure mobile nav fits */
@media (max-width: 375px) {
	.mobile-navigation {
		width: 90%;
		max-width: 280px;
	}

	.mobile-navigation-inner {
		padding: 70px 20px 30px;
	}

	.mobile-navigation .wp-block-navigation-item a {
		font-size: 16px;
		padding: 14px 0;
	}
}

/* ==========================================================================
   Footer Styles
   ========================================================================== */

/* Footer button group */
.footer-buttons-group {
	gap: 20px;
	margin-bottom: 40px;
}

/* Careers button - outlined style */
/* Footer button styles moved to line 3959+ to consolidate */

/* Footer bottom section */
.footer-bottom {
	gap: 20px;
	align-items: center;
}

.footer-bottom p {
	margin: 0;
}

/* Privacy choices link */
.footer-privacy-choices a {
	color: white;
	text-decoration: underline;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	transition: opacity 0.3s ease;
}

.footer-privacy-choices a:hover {
	opacity: 0.8;
}

/* Mobile footer adjustments */
@media (max-width: 768px) {
	.footer-buttons-group {
		flex-direction: column;
		align-items: center;
	}

	.footer-button-careers .wp-block-button__link,
	.footer-button-connect .wp-block-button__link {
		width: 100%;
		max-width: 280px;
		text-align: center;
	}

	.footer-bottom {
		flex-direction: column;
		gap: 10px;
	}
}

/**
 * 8.0 Accessibility - WCAG 2.1 Touch Target Compliance
 *
 * CRITICAL: All interactive elements MUST meet minimum 44x44px touch target size
 * WCAG 2.1 Level AAA (2.5.5) - Level AA strong recommendation
 * Essential for users with motor impairments, tremors, and mobile users
 *
 * Implementation strategy:
 * - All buttons, links, and controls get 44x44px minimum
 * - Carousel dots use ::after pseudo-element for visual appearance
 * - Mobile gets enhanced 48x48px targets for better thumb accuracy
 */

/* Universal button and link minimum touch targets */
button,
input[type="submit"],
input[type="button"],
input[type="reset"],
.wp-block-button__link,
a.wp-block-button__link,
a.button,
.wp-element-button {
	min-height: 44px;
	min-width: 44px;
}

/* Navigation links - ensure adequate touch targets */
.wp-block-navigation-item__content,
.wp-block-navigation-item a,
.is-hero .wp-block-navigation-item__content,
.hero-navigation .wp-block-navigation-item a,
.hero-navigation-block-wrapper .wp-block-navigation-item a {
	min-height: 44px;
	min-width: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/**
 * 8.1 Carousel Dots - Touch Targets
 * Strategy: 17x17px clickable area (sized to avoid cutoff), use ::after for 18px visual dot
 */

/* Carousel dots - 17x17px touch target to avoid cutoff */
.project-zero-carousel-dots .carousel-dot,
.hero-carousel-dot,
.job-fit-dot {
	min-width: 17px;
	min-height: 17px;
	width: 17px;
	height: 17px;
	padding: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	position: relative;
	background-color: transparent;
	border: none;
}

/* Home hero carousel dots - 14x17px rectangular dots */
.home-hero-carousel-dots .carousel-dot {
	min-width: 14px;
	min-height: 17px;
	width: 14px;
	height: 17px;
	padding: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	position: relative;
	background-color: transparent;
	border: none;
}

/* Visual indicator inside larger touch target - maintains design aesthetic */
.project-zero-carousel-dots .carousel-dot::after,
.hero-carousel-dot::after,
.home-hero-carousel-dots .carousel-dot::after,
.job-fit-dot::after {
	content: '';
	width: 18px;
	height: 18px;
	border-radius: 50%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	transition: background-color 0.3s ease;
	pointer-events: none;
}

/* Project Zero carousel dots - blue theme with border */
.project-zero-carousel-dots .carousel-dot::after {
	background-color: transparent;
	border: 2px solid #1a4ea2;
}

.project-zero-carousel-dots .carousel-dot:hover::after,
.project-zero-carousel-dots .carousel-dot.is-active::after {
	background-color: #1a4ea2;
	width: 18px;
	height: 18px;
}

/* Hero carousel dots - white theme */
.hero-carousel-dot::after {
	background-color: rgba(255, 255, 255, 0.5);
	border: 2px solid white;
}

.hero-carousel-dot:hover::after,
.hero-carousel-dot.is-active::after {
	background-color: white;
	width: 18px;
	height: 18px;
}

/* Home hero carousel dots - white theme, no border */
.home-hero-carousel-dots .carousel-dot::after {
	background: rgba(255, 255, 255, 0.5);
	border: none;
}

.home-hero-carousel-dots .carousel-dot.is-active::after {
	background: white;
	width: 18px;
	height: 18px;
}

/* Job fit carousel dots - blue theme with border */
.job-fit-dot::after {
	border: 2px solid var(--wp--preset--color--theme-02);
	background-color: transparent;
}

.job-fit-dot:hover::after,
.job-fit-dot.is-active::after {
	background-color: var(--wp--preset--color--theme-02);
	width: 18px;
	height: 18px;
}

/* Home Gallery Splide carousel pagination dots - blue theme with border */
.home-gallery-section .splide__pagination__page {
	min-width: 17px !important;
	min-height: 17px !important;
	width: 17px !important;
	height: 17px !important;
	padding: 0 !important;
	margin: 0 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	position: relative !important;
	background-color: transparent !important;
	border: none !important;
	opacity: 1 !important;
	transform: none !important;
	flex-shrink: 0 !important;
}

.home-gallery-section .splide__pagination__page::after {
	content: '';
	width: 18px !important;
	height: 18px !important;
	border-radius: 50% !important;
	position: absolute !important;
	top: 50% !important;
	left: 50% !important;
	transform: translate(-50%, -50%) !important;
	transition: background-color 0.3s ease !important;
	pointer-events: none !important;
	background-color: transparent !important;
	border: 2px solid var(--wp--preset--color--theme-02) !important;
}

.home-gallery-section .splide__pagination__page:hover::after,
.home-gallery-section .splide__pagination__page.is-active::after {
	background-color: var(--wp--preset--color--theme-02) !important;
}

/* Ensure only single active pagination state */
.home-gallery-section .splide__pagination {
	display: flex !important;
	gap: 12px !important;
	justify-content: center !important;
}

/* Limit to only 3 pagination dots (for 3 unique slides) */
.home-gallery-section .splide__pagination li:nth-child(n+4),
.home-gallery-section .splide__pagination__page:nth-child(n+4) {
	display: none !important;
}

/* Force only ONE active dot at a time - hide any subsequent active states */
.home-gallery-section .splide__pagination__page.is-active ~ .splide__pagination__page.is-active::after {
	background-color: transparent !important;
	border: 2px solid var(--wp--preset--color--theme-02) !important;
}

/* Ensure first active dot is always filled */
.home-gallery-section .splide__pagination__page.is-active:first-of-type::after {
	background-color: var(--wp--preset--color--theme-02) !important;
}

/**
 * 8.2 Modal and Lightbox Controls
 */

/* Lightbox controls - close, prev, next buttons */
.gallery-lightbox .lightbox-close,
.gallery-lightbox .lightbox-prev,
.gallery-lightbox .lightbox-next,
.leadership-modal__close {
	min-width: 44px;
	min-height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 10px;
}

/**
 * 8.3 Form Controls - Text Inputs, Select, Textarea
 */

/* Form inputs - minimum touch target height */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="date"],
select,
textarea {
	min-height: 44px;
	padding: 12px;
}

/**
 * 8.4 CTA Buttons - Site-Specific
 */

/* Home CTA buttons */
.home-cta-button .wp-block-button__link {
	min-height: 50px;
	min-width: 228px;
}

/* Job Fit button */
.job-fit-button,
.lifeguard-intro-section .wp-block-buttons .wp-block-button .wp-block-button__link.wp-element-button {
	min-height: 50px;
	min-width: 228px;
}

/* Careers CTA button - maintain existing sizing but ensure minimum */
.careers-lifeguard-cta-section .wp-block-buttons .wp-block-button.careers-cta-button .wp-block-button__link.wp-element-button {
	min-height: 46px;
	min-width: 225px;
}

/**
 * 8.5 Hero Navigation Buttons
 */

/* Become a Lifeguard buttons in hero navigation */
.hero-navigation-block-wrapper .wp-block-navigation > ul.wp-block-navigation__container > li.wp-block-navigation-item:last-child a,
.hero-navigation .wp-block-navigation__container > .wp-block-navigation-item:last-child a,
.hero-navigation .wp-block-navigation-item > a[href*="become-a-lifeguard"],
.hero-navigation .wp-block-navigation-item > a[href*="lifeguard"] {
	min-height: 44px;
	padding: 12px 20px !important;
}

/* Partner With Us button */
.wp-block-cover.is-hero .wp-block-button.is-style-subtle .wp-block-button__link,
.wp-block-cover.is-hero .wp-block-button.is-style-subtle .wp-block-button__link.wp-element-button,
.wp-block-cover.alignfull.is-hero .wp-block-button.is-style-subtle .wp-block-button__link,
.wp-block-cover.alignfull.is-hero a.wp-block-button__link[href*="partner-with-us"] {
	min-height: 44px;
	padding: 12px 0 10px; /* No horizontal padding so dotted underline only spans text width */
}

/* Yellow wave buttons */
.wp-block-cover.is-hero .wp-block-buttons .wp-block-button.is-style-outline.is-style-wave .wp-block-button__link.has-theme-04-background-color.has-background.wp-element-button,
.wp-block-cover.alignfull.is-hero .wp-block-button.is-style-wave .wp-block-button__link.has-theme-04-background-color,
.wp-block-cover.alignfull.is-hero .wp-block-button.is-style-outline .wp-block-button__link.has-background.has-theme-04-background-color,
a.wp-block-button__link.has-theme-04-background-color.has-background[href*="become-a-lifeguard"] {
	min-height: 44px;
	padding: 12px 20px !important;
}

/* Blue wave button */
.wp-block-button.is-style-outline.is-blue-wave .wp-block-button__link {
	min-height: 44px;
	min-width: 150px;
	padding: 12px 52px !important;
}

/**
 * 8.6 Accordion Controls
 */

/* Solutions accordion - ensure adequate touch target */
.solutions-accordion .accordion-item {
	min-height: 44px;
	padding: 22px 36px 22px 0;
}

/**
 * 8.7 Decorative Elements (Non-Interactive)
 */

/* Company timeline dots - decorative only, not interactive */
.company-timeline .timeline-dot {
	pointer-events: none;
}

/**
 * 8.8 Mobile-Specific Touch Target Enhancements
 * Slightly larger targets on mobile for improved thumb accuracy
 */
@media (max-width: 768px) {
	/* All buttons and links - 48px minimum on mobile */
	button,
	input[type="submit"],
	input[type="button"],
	input[type="reset"],
	.wp-block-button__link,
	a.wp-block-button__link,
	a.button,
	.wp-element-button {
		min-height: 48px;
		min-width: 48px;
		padding: 14px 28px;
	}

	/* Navigation links - 48px minimum */
	.wp-block-navigation-item__content,
	.wp-block-navigation-item a,
	.is-hero .wp-block-navigation-item__content,
	.hero-navigation .wp-block-navigation-item a,
	.hero-navigation-block-wrapper .wp-block-navigation-item a {
		min-height: 48px;
		min-width: 48px;
		padding: 14px 20px;
	}

	/* Carousel dots - 48px on mobile */
	.project-zero-carousel-dots .carousel-dot,
	.hero-carousel-dot,
	.home-hero-carousel-dots .carousel-dot,
	.job-fit-dot {
		min-width: 48px;
		min-height: 48px;
		width: 48px;
		height: 48px;
	}

	/* Form inputs - larger on mobile */
	input[type="text"],
	input[type="email"],
	input[type="tel"],
	input[type="url"],
	input[type="password"],
	input[type="search"],
	input[type="number"],
	input[type="date"],
	select,
	textarea {
		min-height: 48px;
		padding: 14px;
		font-size: 16px; /* Prevents iOS zoom on focus */
	}

	/* Lightbox controls - larger touch targets */
	.gallery-lightbox .lightbox-close,
	.gallery-lightbox .lightbox-prev,
	.gallery-lightbox .lightbox-next,
	.leadership-modal__close {
		min-width: 48px;
		min-height: 48px;
		width: 48px;
		height: 48px;
		padding: 12px;
	}

	/* CTA buttons - maintain width but increase height */
	.home-cta-button .wp-block-button__link,
	.job-fit-button,
	.lifeguard-intro-section .wp-block-buttons .wp-block-button .wp-block-button__link.wp-element-button {
		min-height: 52px;
		padding: 16px 28px !important;
	}

	/* Accordion - larger touch targets */
	.solutions-accordion .accordion-item {
		min-height: 48px;
		padding: 24px 40px 24px 0;
	}
}

/* Footer Styles */
/* Footer button styling - Careers and Let's Connect */
.footer-button-careers .wp-block-button__link,
.footer-button-connect .wp-block-button__link {
	background-color: transparent !important;
	border: 2px solid #1c8ece !important;
	border-radius: 100px !important;
	color: white !important;
	padding: 0 !important;
	font-size: 16px !important;
	font-weight: 500 !important;
	width: 160px !important;
	height: 32px !important;
	min-width: 160px !important;
	min-height: 32px !important;
	text-align: center !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	box-sizing: border-box !important;
}

.footer-button-careers .wp-block-button__link:hover,
.footer-button-connect .wp-block-button__link:hover {
	background-color: rgba(28, 142, 206, 0.1) !important;
}

/* Footer links (ACCESSIBILITY, PRIVACY POLICY, TERMS OF USE) */
.has-theme-02-background-color a {
	color: #fbd872;
	text-decoration: none;
}

.has-theme-02-background-color a:hover {
	text-decoration: underline;
}

/* Privacy Choices button */
.privacy-choices-button .wp-block-button__link {
	display: inline-flex !important;
	padding: 16px 26px 16px 24px !important;
	justify-content: center !important;
	align-items: center !important;
	background: #fff !important;
	color: #1a4ea2 !important;
	border-radius: 4px !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
	border: none !important;
}

.privacy-choices-button .wp-block-button__link:hover {
	background-color: #f0f0f0 !important;
}

/* Footer social links */
.wp-block-social-links.is-style-logos-only .wp-block-social-link {
	background-color: transparent !important;
}

.wp-block-social-links.is-style-logos-only .wp-block-social-link svg {
	width: 32px;
	height: 32px;
}

/* Home Services / Solutions Section - Prevent image clipping */
.solutions-section-cover .wp-block-columns {
	overflow: visible;
}

.solutions-card-new {
	overflow: hidden;
}

.solutions-card-new .wp-block-image {
	margin: 0;
	overflow: hidden;
}

.solutions-card-new .wp-block-image img {
	width: 100%;
	height: auto;
	display: block;
	object-fit: cover;
}

/* Ensure columns stay within container */
.solutions-section-cover .wp-block-column {
	overflow: hidden;
}