/*
Theme Name: Twenty Thirteen
Theme URI: https://wordpress.org/themes/twentythirteen/
Author: the WordPress team
Author URI: https://wordpress.org/
Description: The 2013 theme for WordPress takes us back to the blog, featuring a full range of post formats, each displayed beautifully in their own unique way. Design details abound, starting with a vibrant color scheme and matching header images, beautiful typography and icons, and a flexible layout that looks great on any device, big or small.
Version: 4.7
Tested up to: 7.1
Requires at least: 3.6
Requires PHP: 5.2.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: blog, one-column, two-columns, right-sidebar, custom-header, custom-menu, editor-style, featured-images, footer-widgets, microformats, post-formats, rtl-language-support, sticky-post, translation-ready, accessibility-ready, block-patterns
Text Domain: twentythirteen

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/**
 * Table of Contents:
 *
 * 1.0 - Reset
 * 2.0 - Design Tokens & Variables (:root)
 * 3.0 - Global Layout & Twenty Thirteen Overrides
 * 4.0 - Header & Navigation
 * 5.0 - Section 1: Hero Section
 * 6.0 - Section 2: Key Service Cards
 * 7.0 - Section 3: About Pharmamedix
 * 8.0 - Section 4: Product Categories
 * 9.0 - Section 5: Why Choose Us
 * 10.0 - Section 6: FAQ Accordion
 * 11.0 - Section 7: Commitment Section
 * 12.0 - Section 8: Standards & Testimonials
 * 14.0 - Section 9: CTA Banner Section
 * 15.0 - Section 10: Site Footer
 * 16.0 - Responsive Utilities
 * ----------------------------------------------------------------------------
 */


/**
 * 1.0 Reset
 *
 * Modified from Normalize.css to provide cross-browser consistency and a smart
 * default styling of HTML elements.
 *
 * @see http://git.io/normalize
 * ----------------------------------------------------------------------------
 */

/* ==========================================================================
   2.0 DESIGN TOKENS & ROOT VARIABLES
   ========================================================================== */
:root {
	/* Primary Navy & Dark Blue Palette */
	--color-navy: #0b2540;
	--color-navy-dark: #071524;
	--color-navy-deep: #011b2d;
	--color-navy-rich: #03243b;
	--color-navy-light: #163b5f;
	--color-navy-soft: #eaf1f8;

	/* Brand Green & Olive Accent Palette */
	--color-accent: #8dc63f;
	--color-accent-hover: #7ab332;
	--color-accent-soft: #f2f9ea;
	--color-olive: #98b66e;
	--color-olive-dark: #8aa95e;
	--color-olive-hover: #88a75e;
	--color-social-green: #94b16d;
	--color-teal-check: #2dd4bf;

	/* Cyan & Blue Accents */
	--color-blue: #366296;
	--color-blue-hover: #2b517d;
	--color-blue-footer: #366296;
	--color-cyan: #bce3eb;
	--color-cyan-light: #e8f6f9;
	--color-cyan-dark: #0e7490;

	/* Gold & Warm Accents */
	--color-gold: #f5be42;
	--color-gold-light: #fef7e6;
	--color-gold-dark: #b45309;
	--color-gold-badge: #e5a93c;
	--color-gold-line: #ffd272;

	/* Neutrals & Text */
	--color-text-body: #334155;
	--color-text-muted: #64748b;
	--color-text-subtle: #7b8892;
	--color-text-slate: #55606e;
	--color-text-light: #94a3b8;
	--color-topbar-text: #4a5568;
	--color-catalogue-green: #7f9f44;
	--color-catalogue-hover: #6c8936;
	--color-bg-light: #f8fafc;
	--color-bg-soft: #f1f5f9;
	--color-bg-card: #f1f2f4;
	--color-card-gray: #f2f4f7;
	--color-card-gray-border: #dde2e2;
	--color-card-cyan: #c5e3ee;
	--color-card-cyan-from: #aed5e5;
	--color-card-cyan-to: #d5e8f2;
	--color-card-cyan-border: #9cc2d2;
	--color-card-gold: #f9d78d;
	--color-card-gold-from: #ffcc53;
	--color-card-gold-to: #fcda8a;
	--color-card-gold-border: #e6b540;
	--color-card-text-dark: #2d3748;
	--color-card-text-cyan: #15313d;
	--color-card-text-gold: #3e1d00;
	--color-bullet-inactive: #cbd5e1;
	--color-eyebrow-commitment: #7ba3c4;
	--color-eyebrow-standards: #6086a8;
	--color-border: #e2e8f0;
	--color-border-light: #eef2f6;
	--color-white: #ffffff;

	/* Typography Families */
	--font-heading: 'Urbanist', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	--font-body: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	--font-serif: 'Unna', Georgia, serif;
}

/* ==========================================================================
   3.0 GLOBAL LAYOUT & TWENTY THIRTEEN OVERRIDES
   ========================================================================== */
body {
	font-family: var(--font-body);
	color: var(--color-text-body);
	background-color: var(--color-white);
	line-height: 1.6;
	overflow-x: hidden;
	margin: 0;
	padding: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: var(--font-heading);
	color: var(--color-navy);
	font-weight: 700;
	line-height: 1.25;
}

/* Override Twenty Thirteen default constraints */
#page {
	max-width: 100% !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
}

#main.site-main {
	max-width: 100% !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
}

.site-header {
	background: var(--color-white) !important;
	border: none !important;
	max-width: 100% !important;
	padding: 0 !important;
}

/* Utilities */
.text-navy {
	color: var(--color-navy) !important;
}


/* ==========================================================================
   4.0 HEADER & NAVIGATION
   ========================================================================= */
.site-topbar {
	font-size: 0.85rem;
	color: var(--color-topbar-text);
	background-color: var(--color-white);
}

.topbar-info {
	font-family: var(--font-body);
	font-size: 0.82rem;
}

.topbar-info a {
	color: var(--color-topbar-text);
	transition: color 0.2s ease;
}

.topbar-info a:hover {
	color: var(--color-blue);
}

/* Continuous Topbar Ticker on Small Screens */
.topbar-ticker-wrap {
	overflow: hidden;
	width: 100%;
	background-color: var(--color-white);
	position: relative;
}

.topbar-ticker-track {
	display: flex;
	width: max-content;
	animation: topbarTicker 26s linear infinite;
	will-change: transform;
}

.topbar-ticker-wrap:hover .topbar-ticker-track,
.topbar-ticker-wrap:active .topbar-ticker-track {
	animation-play-state: paused;
}

.topbar-ticker-group {
	display: flex;
	align-items: center;
	flex-shrink: 0;
	gap: 24px;
	padding-right: 24px;
	font-family: var(--font-body);
	font-size: 12.5px;
	color: var(--color-text-slate);
}

.topbar-ticker-item {
	display: inline-flex;
	align-items: center;
	white-space: nowrap;
}

.topbar-ticker-sep {
	color: var(--color-bullet-inactive);
	font-size: 14px;
	user-select: none;
}

.topbar-emergency-pill {
	background-color: var(--color-social-green);
	color: var(--color-white);
	padding: 8px 12px;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	text-decoration: none;
	font-size: 12px;
	transition: background-color 0.2s ease;
}

.topbar-emergency-pill:hover {
	background-color: var(--color-olive-dark);
	color: var(--color-white);
}

@keyframes topbarTicker {
	0% {
		transform: translateX(0);
	}

	100% {
		transform: translateX(-50%);
	}
}

@media (prefers-reduced-motion: reduce) {
	.topbar-ticker-track {
		animation: none;
		overflow-x: auto;
	}
}

/* Green Emergency Line Block */
.emergency-block {
	background-color: var(--color-social-green);
	color: var(--color-white);
	font-family: var(--font-body);
	margin-right: 60px;
}

.emergency-icon-wrap {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background-color: rgba(255, 255, 255, 0.25);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--color-white);
	font-size: 0.85rem;
}

.emergency-label {
	font-size: 11px;
	line-height: 1.1;
	opacity: 0.95;
	font-weight: 400;
}

.emergency-number {
	font-size: 13px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.3px;
}

/* Main Navbar Floating Blue Bar */
.navbar-wrapper {
	background-color: var(--color-white);
}

.main-navbar {
	background-color: var(--color-blue);
	border-radius: 20px;
	box-shadow: 0 4px 15px rgba(54, 98, 150, 0.15);
	min-height: 80px;
}

.logo-card {
	background-color: var(--color-white) !important;
	border-radius: 12px !important;
	padding: 7px 12px !important;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
	transition: transform 0.2s ease;
}

.logo-card:hover {
	transform: scale(1.02);
}

.main-nav-list .nav-link {
	font-family: var(--font-body);
	font-weight: 500;
	font-size: 0.95rem;
	color: var(--color-white) !important;
	padding: 0.5rem 1rem !important;
	transition: opacity 0.2s ease;
	opacity: 0.92;
}

.main-nav-list .nav-link:hover,
.main-nav-list .nav-link.active {
	opacity: 1;
	font-weight: 600;
}

/* Download Catalogue Pill Button */
.btn-catalogue {
	background-color: var(--color-white) !important;
	color: var(--color-catalogue-green) !important;
	border: none;
	font-family: var(--font-body);
	font-weight: 600;
	font-size: 0.88rem;
	padding: 0.6rem 1.6rem !important;
	transition: all 0.25s ease;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
	white-space: nowrap;
}

.btn-catalogue:hover {
	background-color: var(--color-bg-light) !important;
	color: var(--color-catalogue-hover) !important;
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}


/* ==========================================================================
   5.0 SECTION 1: HERO SECTION
   ========================================================================= */
.hero-section {
	background-color: var(--color-white);
}

.hero-banner {
	background-size: cover;
	background-position: center right;
	background-repeat: no-repeat;
	border-radius: 24px;
	position: relative;
	min-height: 480px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
}

.hero-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to right, rgba(7, 21, 36, 0.48) 0%, rgba(7, 21, 36, 0.28) 55%, rgba(7, 21, 36, 0.1) 100%);
	border-radius: inherit;
	z-index: 1;
	pointer-events: none;
}

.hero-banner-row {
	position: relative;
	z-index: 2;
	min-height: 520px;
	padding: 50px 65px;
	margin: 0;
}

@media (min-width: 1200px) {
	.hero-banner {
		min-height: 520px;
	}

	.hero-banner-row {
		min-height: 540px;
		padding: 55px 75px;
	}
}

.hero-card {
	background-color: var(--color-white);
	border-radius: 20px;
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
	width: 100%;
	max-width: 412px;
	position: relative;
	z-index: 2;
	padding: 20px 26px 24px 26px;
	border: none;
}

.hero-card-title {
	font-family: var(--font-heading);
	color: var(--color-navy);
	font-size: 19px;
	font-weight: 600;
	letter-spacing: -0.2px;
	margin-top: 0;
	margin-bottom: 15px;
	text-align: center;
	line-height: 1.25;
}

.hero-input {
	height: 42px;
	border: 1px solid var(--color-border);
	border-radius: 9px;
	font-family: var(--font-body);
	font-size: 12.5px;
	padding: 0 14px;
	color: var(--color-text-body);
	background-color: var(--color-white);
	box-shadow: none;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
	width: 100%;
}

.hero-input::placeholder {
	color: var(--color-text-light);
	font-size: 12.5px;
	font-family: var(--font-body);
	opacity: 1;
}

.hero-input:focus {
	border-color: var(--color-olive);
	box-shadow: 0 0 0 2px rgba(152, 182, 110, 0.2);
	outline: none;
	background-color: var(--color-white);
}

.hero-form textarea.hero-input.hero-textarea {
	height: 95px !important;
	min-height: 95px !important;
	max-height: 95px !important;
	padding-top: 10px;
	padding-bottom: 10px;
	resize: none;
}

.btn-hero-submit {
	background-color: var(--color-olive);
	color: var(--color-white);
	border: none;
	border-radius: 8px;
	font-family: var(--font-body);
	font-size: 12.5px;
	font-weight: 500;
	padding: 12px 20px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	transition: all 0.25s ease;
	box-shadow: none;
	text-decoration: none;
	line-height: 1;
}

.btn-hero-submit:hover {
	background-color: var(--color-olive-dark);
	color: var(--color-white);
	transform: translateY(-1px);
	box-shadow: 0 4px 10px rgba(152, 182, 110, 0.3);
}

/* Decorative Right Box (from assets/banner-right-box.png) */
.banner-right-box {
	position: absolute;
	right: 0;
	bottom: 0;
	width: 120px;
	height: auto;
	z-index: 1;
	pointer-events: none;
}

@media (max-width: 991.98px) {
	.hero-banner {
		background-position: 70% center;
		min-height: auto;
		border-radius: 20px;
	}

	.hero-banner-row {
		min-height: auto;
		padding: 32px 24px;
	}

	.hero-card {
		max-width: 440px;
		margin: 0 auto;
	}

	.banner-right-box {
		width: 80px;
		bottom: 0;
		opacity: 0.8;
	}
}

@media (max-width: 575.98px) {
	.hero-banner {
		border-radius: 18px;
		background-position: center center;
	}

	.hero-overlay {
		background: rgba(7, 21, 36, 0.45);
	}

	.hero-banner-row {
		padding: 16px 12px;
	}

	.hero-card {
		padding: 18px 16px 20px;
		border-radius: 16px;
		max-width: 100%;
		margin: 0 auto;
	}

	.hero-card-title {
		font-size: 17px;
		margin-bottom: 12px;
	}

	.hero-input {
		height: 38px;
		font-size: 12px;
		padding: 0 10px;
	}

	.hero-input::placeholder {
		font-size: 11.5px;
	}

	.hero-form textarea.hero-input.hero-textarea {
		height: 80px !important;
		min-height: 80px !important;
		max-height: 80px !important;
		padding: 8px 10px;
	}

	.btn-hero-submit {
		width: 100%;
		height: auto;
		font-size: 12.5px;
	}

	.banner-right-box {
		display: none;
	}
}


/* ==========================================================================
   6.0 SECTION 2: KEY SERVICE / BENEFIT CARDS (3 COLORED CARDS)
   ========================================================================= */
.service-cards-section {
	background-color: var(--color-white);
}

@media (max-width: 991.98px) {
	.service-card {
		padding: 32px 20px 38px 20px;
	}

	.service-card-title {
		font-size: 25px;
	}

	.service-card-text {
		font-size: 15px;
		line-height: 24px;
	}
}

@media (max-width: 575.98px) {
	.service-card {
		padding: 28px 18px 32px 18px;
	}

	.service-card-title {
		font-size: 21px;
	}

	.service-card-text {
		font-size: 14.5px;
		line-height: 23px;
	}

	.service-card-icon {
		width: 24px;
		height: 24px;
		margin-left: 8px;
	}

	.btn-service-card {
		height: 40px !important;
	}
}

.service-card {
	border-radius: 14px;
	padding: 40px 20px 50px 20px;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.04);
}

.service-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 12px 28px rgba(7, 26, 45, 0.12) !important;
}

/* Card 1: Off-White / Pale Gray */
.service-card-white {
	background-color: var(--color-card-gray);
	border: none;
	border-bottom: 8px solid var(--color-card-gray-border, #DDE2E2);
}

/* Card 2: Soft Sky Cyan */
.service-card-cyan {
	background: linear-gradient(to top, var(--color-card-cyan-from, #AED5E5), var(--color-card-cyan-to, #D5E8F2));
	border: none;
	border-bottom: 8px solid var(--color-card-cyan-border, #9CC2D2);
}

/* Card 3: Soft Amber Gold */
.service-card-gold {
	background: linear-gradient(to top, #a4cc87, #c2cb8c);
	border: none;
	border-bottom: 8px solid #94b573;
}

.service-card-header {
	border-bottom: 1px solid rgba(7, 26, 45, 0.08);
}

.service-card-white .service-card-header {
	border-bottom: 1px solid rgba(0, 0, 0, 0.07);
}

.service-card-title {
	font-family: var(--font-heading);
	color: var(--color-navy);
	font-size: 30px;
	font-weight: 400;
	line-height: 1.25;
	letter-spacing: -0.2px;
}

.service-card-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	margin-left: 10px;
	width: 26px;
	height: 26px;
}

.service-card-icon svg,
.service-card-icon-img {
	display: block;
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	object-fit: contain;
}

.service-card-text {
	font-family: var(--font-body);
	color: var(--color-card-text-dark);
	font-size: 16px;
	line-height: 26px;
}

.service-card-text-cyan {
	color: var(--color-card-text-cyan);
}

.service-card-text-gold {
	color: var(--color-card-text-gold);
}

.btn-service-card {
	background-color: var(--color-navy-deep) !important;
	color: var(--color-white) !important;
	border: none !important;
	border-radius: 8px !important;
	font-family: var(--font-heading);
	font-size: 12.5px !important;
	font-weight: 500 !important;
	height: 38px !important;
	padding: 0 16px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	text-decoration: none !important;
	transition: all 0.25s ease !important;
	box-shadow: none !important;
	width: 100%;
}

.btn-service-card:hover {
	background-color: var(--color-navy-dark) !important;
	color: var(--color-white) !important;
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(2, 34, 57, 0.25) !important;
}


/* ==========================================================================
   7.0 SECTION 3: ABOUT / HEALTHCARE INTRODUCTION
   ========================================================================= */
.about-section {
	background-color: var(--color-white);
}

.about-visual-container {
	position: relative;
	max-width: 490px;
	margin: 0 auto;
	padding-top: 30px;
	padding-left: 20px;
	padding-right: 15px;
	padding-bottom: 10px;
}

.about-main-img-wrap {
	position: relative;
	margin-left: 55px;
	margin-right: 30px;
	border-radius: 22px;
	overflow: hidden;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

.about-main-img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 22px;
}

.about-floating-img-wrap {
	position: absolute;
	top: 0;
	left: 0;
	width: 38%;
	max-width: 180px;
	border-radius: 20px;
	overflow: hidden;
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);
	z-index: 3;
	background-color: var(--color-white);
}

.about-floating-img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 20px;
}

.about-experience-card {
	position: absolute;
	bottom: -40px;
	right: 0;
	padding: 39px 40px;
	border-radius: 22px;
	background: linear-gradient(-161deg, #366293 27%, #4a7483 46%, #739670 71%, #8aa66c 100%);
	box-shadow: 0 14px 35px rgba(11, 37, 64, 0.2);
	z-index: 4;
	color: var(--color-white);
}

.exp-icon-wrap {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.exp-icon-wrap svg,
.exp-icon-img {
	display: block;
	width: 46px;
	height: 46px;
	object-fit: contain;
}

.exp-number {
	font-family: var(--font-heading);
	font-size: 60px;
	font-weight: 400;
	line-height: 1;
	color: var(--color-white);
	margin-bottom: 6px;
	letter-spacing: -0.5px;
}

.exp-label {
	font-family: var(--font-body);
	font-size: 13px;
	font-weight: 400;
	line-height: 1.35;
	color: rgba(255, 255, 255, 0.95);
}

/* Right Content Column */
.about-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 12px;
}

.about-eyebrow-icon {
	width: 18px;
	height: auto;
	display: inline-block;
}

.about-eyebrow-text {
	font-family: var(--font-heading);
	font-size: 13.5px;
	font-weight: 500;
	color: var(--color-text-subtle);
	letter-spacing: 0.1px;
}

.about-title {
	font-family: var(--font-heading);
	font-size: 31px;
	font-weight: 700;
	color: var(--color-navy-deep);
	line-height: 1.22;
	letter-spacing: -0.3px;
	margin-top: 0;
	margin-bottom: 20px;
}

.about-text-wrapper {
	display: flex;
	align-items: stretch;
	margin-left: 38px;
}

.about-accent-line {
	width: 2.5px;
	background-color: var(--color-gold-line);
	border-radius: 2px;
	flex-shrink: 0;
	margin-right: 14px;
}

.about-paragraphs p {
	font-family: var(--font-body);
	font-size: 12px;
	font-weight: 400;
	line-height: 1.58;
	color: var(--color-text-slate);
	margin-bottom: 12px;
}

.about-paragraphs p:last-child {
	margin-bottom: 0;
}

@media (max-width: 991.98px) {
	.about-title {
		font-size: 26px;
		margin-bottom: 16px;
	}

	.about-text-wrapper {
		margin-left: 20px;
	}

	.about-visual-container {
		margin-bottom: 2.8rem;
	}

	.about-experience-card {
		padding: 28px 30px;
		bottom: -28px;
	}

	.exp-icon-wrap svg,
	.exp-icon-img {
		width: 38px;
		height: 38px;
	}

	.exp-number {
		font-size: 48px;
	}
}

@media (max-width: 575.98px) {
	.about-visual-container {
		padding: 15px 0 0 0;
		max-width: 100%;
		margin-bottom: 2.5rem;
	}

	.about-main-img-wrap {
		margin-left: 20px;
		margin-right: 15px;
	}

	.about-main-img {
		border-radius: 18px;
	}

	.about-floating-img-wrap {
		width: 36%;
		border-radius: 16px;
	}

	.about-experience-card {
		padding: 20px 22px;
		border-radius: 16px;
		bottom: -20px;
	}

	.exp-icon-wrap {
		margin-bottom: 10px;
	}

	.exp-icon-wrap svg,
	.exp-icon-img {
		width: 30px;
		height: 30px;
	}

	.exp-number {
		font-size: 38px;
	}

	.exp-label {
		font-size: 11.5px;
	}

	.about-title {
		font-size: 22px;
		line-height: 1.25;
		margin-bottom: 14px;
	}

	.about-text-wrapper {
		margin-left: 10px;
	}

	.about-accent-line {
		margin-right: 10px;
	}

	.about-paragraphs p {
		font-size: 11.5px;
		line-height: 1.52;
		margin-bottom: 10px;
	}
}


/* ==========================================================================
   8.0 SECTION 4: PRODUCT CATEGORIES
   ========================================================================= */
.products-banner {
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: 24px;
	padding: 55px 50px 48px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
}

.category-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 8px;
}

.category-eyebrow-icon {
	width: 18px;
	height: auto;
	display: block;
}

.category-eyebrow-text {
	font-family: var(--font-heading);
	font-size: 12.5px;
	font-weight: 600;
	color: var(--color-text-subtle);
	letter-spacing: 0.6px;
	text-transform: uppercase;
}

.category-section-title {
	font-family: var(--font-heading);
	font-size: 32px;
	font-weight: 700;
	color: var(--color-navy-deep);
	line-height: 1.22;
	margin: 0;
	letter-spacing: -0.3px;
}

.btn-category-enquire {
	display: inline-block;
	background-color: var(--color-olive);
	color: var(--color-white);
	border: none;
	border-radius: 8px;
	padding: 8px 26px;
	font-family: var(--font-body);
	font-size: 12.5px;
	font-weight: 500;
	text-decoration: none;
	transition: background-color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
}

.btn-category-enquire:hover {
	background-color: var(--color-olive-hover);
	color: var(--color-white);
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(152, 182, 110, 0.35);
}

/* Swiper Products Slider */
.products-slider {
	padding: 8px 4px 16px;
	margin: -8px -4px 0;
}

.products-slider .swiper-wrapper {
	height: auto;
}

.products-slider .swiper-slide {
	height: auto;
	display: flex;
}

.products-slider .swiper-slide .product-category-card {
	width: 100%;
}

.product-category-card {
	background-color: var(--color-white);
	border-radius: 20px;
	padding: 12px 12px 24px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
	height: 100%;
	display: flex;
	flex-direction: column;
	border: 1px solid rgba(0, 0, 0, 0.03);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.product-category-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 28px rgba(0, 0, 0, 0.08);
}

.category-card-img-wrap {
	position: relative;
	border-radius: 14px;
	overflow: hidden;
	margin-bottom: 18px;
}

.category-card-img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 14px;
	object-fit: cover;
}

.category-badge {
	position: absolute;
	right: 12px;
	bottom: 14px;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background-color: var(--color-olive);
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.category-badge-icon {
	width: 22px;
	height: 22px;
	object-fit: contain;
}

.category-card-body {
	padding: 0 6px;
	flex-grow: 1;
}

.category-card-title {
	font-family: var(--font-heading);
	font-size: 18px;
	font-weight: 600;
	color: var(--color-navy-deep);
	margin-top: 0;
	margin-bottom: 8px;
	letter-spacing: -0.2px;
}

.category-card-text {
	font-family: var(--font-body);
	font-size: 12px;
	font-weight: 400;
	color: var(--color-text-muted);
	line-height: 1.55;
	margin-bottom: 0;
}

/* Products Swiper Pagination */
.products-pagination {
	position: static;
	margin-top: 20px;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 6px;
}

.products-pagination .swiper-pagination-bullet {
	width: 8px;
	height: 8px;
	background-color: var(--color-bullet-inactive);
	opacity: 1;
	margin: 0 !important;
	border-radius: 50%;
	transition: all 0.25s ease;
	cursor: pointer;
}

.products-pagination .swiper-pagination-bullet-active {
	width: 24px;
	border-radius: 4px;
	background-color: var(--color-olive);
}

@media (max-width: 991.98px) {
	.products-banner {
		padding: 40px 28px 36px;
	}

	.category-section-title {
		font-size: 26px;
	}

	.product-category-card {
		padding: 10px 10px 20px;
	}

	.category-badge {
		width: 42px;
		height: 42px;
		right: 10px;
		bottom: 12px;
	}

	.category-badge-icon {
		width: 19px;
		height: 19px;
	}

	.category-card-title {
		font-size: 16px;
	}

	.category-card-text {
		font-size: 11.5px;
	}
}

@media (max-width: 767.98px) {
	.products-banner {
		padding: 30px 16px 28px;
		border-radius: 18px;
	}

	.category-section-title {
		font-size: 23px;
	}

	.product-category-card {
		padding: 12px 12px 22px;
	}

	.category-badge {
		width: 44px;
		height: 44px;
		right: 12px;
		bottom: 12px;
	}

	.category-badge-icon {
		width: 20px;
		height: 20px;
	}

	.category-card-title {
		font-size: 17px;
	}

	.category-card-text {
		font-size: 12px;
	}
}


/* ==========================================================================
   9.0 SECTION 5: WHY CHOOSE US
   ========================================================================= */
.why-section {
	background-color: var(--color-white);
	padding: 70px 0 65px;
}

.why-eyebrow {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	margin-bottom: 12px;
}

.why-eyebrow-icon {
	width: 18px;
	height: auto;
	display: block;
}

.why-eyebrow-text {
	font-family: var(--font-heading);
	font-size: 13px;
	font-weight: 500;
	color: var(--color-text-subtle);
	line-height: 1.3;
}

.why-title {
	font-family: var(--font-heading);
	font-size: 32px;
	font-weight: 700;
	color: var(--color-navy-deep);
	line-height: 1.22;
	letter-spacing: -0.3px;
	margin: 0 0 16px;
}

.why-text {
	font-family: var(--font-body);
	font-size: 12px;
	font-weight: 400;
	color: var(--color-text-slate);
	line-height: 1.65;
	margin-bottom: 24px;
}

.btn-why-cta {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background-color: var(--color-olive);
	color: var(--color-white);
	border: none;
	border-radius: 6px;
	padding: 9px 24px;
	font-family: var(--font-body);
	font-size: 12.5px;
	font-weight: 500;
	text-decoration: none;
	transition: background-color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
}

.btn-why-cta:hover {
	background-color: var(--color-olive-hover);
	color: var(--color-white);
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(152, 182, 110, 0.35);
}

.why-image-wrap {
	border-radius: 20px;
	overflow: hidden;
}

.why-image {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 20px;
	object-fit: cover;
}

/* 3 Feature items in bottom row */
.why-feature-item {
	display: flex;
	align-items: flex-start;
	gap: 14px;
}

.why-feature-icon-badge {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background-color: var(--color-blue);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.why-feature-icon {
	width: 20px;
	height: 20px;
	object-fit: contain;
	display: block;
}

.why-feature-content {
	flex-grow: 1;
}

.why-feature-title {
	font-family: var(--font-heading);
	font-size: 15px;
	font-weight: 600;
	color: var(--color-navy-deep);
	margin: 0 0 6px;
	letter-spacing: -0.2px;
}

.why-feature-desc {
	font-family: var(--font-body);
	font-size: 11.5px;
	font-weight: 400;
	color: var(--color-text-muted);
	line-height: 1.55;
	margin-bottom: 0;
}

@media (max-width: 991.98px) {
	.why-section {
		padding: 50px 0 45px;
	}

	.why-title {
		font-size: 26px;
	}

	.why-image-wrap {
		margin-top: 10px;
	}
}

@media (max-width: 767.98px) {
	.why-section {
		padding: 40px 0 35px;
	}

	.why-title {
		font-size: 23px;
	}

	.why-text {
		font-size: 12px;
		margin-bottom: 20px;
	}

	.why-feature-item {
		gap: 12px;
	}

	.why-feature-icon-badge {
		width: 40px;
		height: 40px;
	}

	.why-feature-icon {
		width: 18px;
		height: 18px;
	}

	.why-feature-title {
		font-size: 14.5px;
	}
}


/* ==========================================================================
   10.0 SECTION 6: FAQ ACCORDION
   ========================================================================= */
.faq-section {
	background-color: var(--color-white);
	padding: 70px 0 65px;
}

.faq-image-wrap {
	border-radius: 20px;
	overflow: hidden;
	max-width: 440px;
}

.faq-image {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 20px;
	object-fit: cover;
}

.faq-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 8px;
}

.faq-eyebrow-icon {
	width: 18px;
	height: auto;
	display: block;
}

.faq-eyebrow-text {
	font-family: var(--font-heading);
	font-size: 12.5px;
	font-weight: 600;
	color: var(--color-text-subtle);
	letter-spacing: 0.6px;
	text-transform: uppercase;
}

.faq-title {
	font-family: var(--font-heading);
	font-size: 32px;
	font-weight: 700;
	color: var(--color-navy-deep);
	line-height: 1.22;
	letter-spacing: -0.3px;
	margin: 0 0 12px;
}

.faq-subtitle {
	font-family: var(--font-body);
	font-size: 12px;
	font-weight: 400;
	color: var(--color-text-muted);
	line-height: 1.55;
	margin: 0 0 24px;
}

/* Accordion Component */
.faq-accordion .accordion-item {
	background-color: var(--color-white);
	border: 1px solid var(--color-border-light);
	border-radius: 14px;
	margin-bottom: 12px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
	overflow: hidden;
	transition: box-shadow 0.25s ease, border-color 0.25s ease;
}

.faq-accordion .accordion-item:last-child {
	margin-bottom: 0;
}

.faq-accordion .accordion-item:has(.accordion-collapse.show) {
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
	border-color: var(--color-border);
}

.faq-accordion .accordion-button {
	background-color: var(--color-white);
	color: var(--color-navy-deep);
	font-family: var(--font-heading);
	font-size: 14.5px;
	font-weight: 600;
	padding: 16px 20px;
	box-shadow: none;
	border: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.faq-accordion .accordion-button:not(.collapsed) {
	background-color: var(--color-white);
	color: var(--color-navy-deep);
	padding-bottom: 10px;
	box-shadow: none;
}

.faq-accordion .accordion-button:focus {
	box-shadow: none;
	border-color: transparent;
}

.faq-accordion .accordion-button::after {
	content: '+';
	background-image: none;
	font-family: var(--font-heading);
	font-size: 20px;
	font-weight: 500;
	color: var(--color-navy-deep);
	width: auto;
	height: auto;
	transform: none;
	line-height: 1;
	flex-shrink: 0;
	margin-left: 12px;
}

.faq-accordion .accordion-button:not(.collapsed)::after {
	content: '—';
	background-image: none;
	font-size: 16px;
	font-weight: 600;
	transform: none;
}

.faq-accordion .accordion-body {
	font-family: var(--font-body);
	font-size: 12px;
	font-weight: 400;
	color: var(--color-text-muted);
	line-height: 1.55;
	padding: 0 20px 18px;
}

@media (max-width: 991.98px) {
	.faq-section {
		padding: 50px 0 45px;
	}

	.faq-image-wrap {
		max-width: 400px;
		margin: 0 auto 30px;
	}

	.faq-title {
		font-size: 26px;
	}

	.faq-accordion .accordion-button {
		font-size: 13.5px;
		padding: 14px 16px;
	}

	.faq-accordion .accordion-body {
		padding: 0 16px 16px;
		font-size: 11.5px;
	}
}

@media (max-width: 767.98px) {
	.faq-section {
		padding: 40px 0 35px;
	}

	.faq-image-wrap {
		max-width: 100%;
		margin-bottom: 24px;
	}

	.faq-title {
		font-size: 23px;
	}

	.faq-subtitle {
		font-size: 11.5px;
		margin-bottom: 20px;
	}

	.faq-accordion .accordion-button {
		font-size: 13px;
		padding: 13px 14px;
	}

	.faq-accordion .accordion-body {
		padding: 0 14px 14px;
		font-size: 11.5px;
	}
}


/* ==========================================================================
   11.0 SECTION 7: COMMITMENT SECTION
   ========================================================================= */
.commitment-section {
	background-color: transparent;
}

.commitment-banner {
	background-color: var(--color-navy-rich);
	border-radius: 24px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
}

.commitment-content-col {
	padding: 55px 48px 50px 52px;
	background-color: var(--color-navy-rich);
	position: relative;
	overflow: hidden;
}

.commitment-watermark {
	position: absolute;
	right: -50px;
	bottom: -50px;
	width: 320px;
	height: 320px;
	pointer-events: none;
}

.commitment-content-wrap {
	position: relative;
	z-index: 1;
}

.commitment-eyebrow {
	display: flex;
	align-items: flex-start;
	gap: 8px;
}

.commitment-eyebrow-text {
	font-family: var(--font-heading);
	font-size: 11.5px;
	font-weight: 600;
	color: var(--color-eyebrow-commitment);
	letter-spacing: 0.6px;
	line-height: 1.3;
}

.commitment-title {
	font-family: var(--font-heading);
	font-size: 34px;
	font-weight: 700;
	color: var(--color-white);
	line-height: 1.2;
	letter-spacing: -0.3px;
	margin: 12px 0 16px;
}

.commitment-text {
	font-family: var(--font-body);
	font-size: 12px;
	color: rgba(255, 255, 255, 0.72);
	line-height: 1.65;
	margin-bottom: 20px;
}

.commitment-checklist {
	font-family: var(--font-body);
	font-size: 12px;
	color: rgba(255, 255, 255, 0.9);
	line-height: 1.4;
}

.commitment-checklist li {
	margin-bottom: 9px;
}

.btn-commitment-cta {
	display: inline-block;
	background-color: var(--color-olive);
	color: var(--color-white);
	border: none;
	border-radius: 6px;
	padding: 9px 24px;
	font-family: var(--font-body);
	font-size: 12.5px;
	font-weight: 500;
	text-decoration: none;
	transition: background-color 0.25s ease;
}

.btn-commitment-cta:hover {
	background-color: var(--color-olive-dark);
	color: var(--color-white);
}

.commitment-visual-col {
	position: relative;
	min-height: 480px;
	overflow: hidden;
}

.commitment-visual-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.commitment-card {
	position: absolute;
	bottom: 24px;
	left: 20px;
	right: 48px;
	max-width: 480px;
	background: linear-gradient(135deg, #c2e678 24%, #76be9b 57%, #2e6285 100%);
	border-radius: 16px;
	padding: 16px 20px 18px;
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.2);
}

.commitment-card-icon {
	width: 20px;
	height: auto;
	display: block;
}

.commitment-card-title {
	font-family: var(--font-heading);
	font-size: 15px;
	font-weight: 700;
	color: var(--color-navy-deep);
	line-height: 1.15;
}

.commitment-card-text {
	font-family: var(--font-body);
	font-size: 11px;
	color: var(--color-navy-rich);
	line-height: 1.5;
	margin-top: 6px;
}

@media (max-width: 991.98px) {
	.commitment-banner {
		border-radius: 20px;
	}

	.commitment-content-col {
		padding: 40px 24px 35px;
	}

	.commitment-title {
		font-size: 28px;
	}

	.commitment-visual-col {
		min-height: 420px;
	}

	.commitment-visual-img {
		min-height: 420px;
	}

	.commitment-card {
		bottom: 16px;
		left: 16px;
		right: 16px;
		max-width: none;
		padding: 16px 18px;
	}
}

@media (max-width: 575.98px) {
	.commitment-banner {
		border-radius: 16px;
	}

	.commitment-content-col {
		padding: 30px 18px 25px;
	}

	.commitment-title {
		font-size: 23px;
	}

	.commitment-text {
		font-size: 11.5px;
	}

	.commitment-visual-col {
		min-height: 380px;
	}

	.commitment-visual-img {
		min-height: 380px;
	}

	.commitment-card {
		bottom: 12px;
		left: 12px;
		right: 12px;
		padding: 14px 14px;
	}

	.commitment-card-title {
		font-size: 14px;
	}

	.commitment-card-text {
		font-size: 10.5px;
		line-height: 1.45;
	}
}


/* ==========================================================================
   12.0 SECTION 8: STANDARDS & TESTIMONIALS
   ========================================================================= */
.standards-section {
	background-color: var(--color-white);
}

.standards-visual {
	max-width: 420px;
}

.standards-photo-wrap {
	border-radius: 20px;
	overflow: hidden;
}

.standards-photo {
	width: 100%;
	height: auto;
	display: block;
	object-fit: cover;
}

.standards-stat-badge {
	position: absolute;
	top: 52%;
	left: 8px;
	background-color: var(--color-navy-dark);
	border-radius: 20px;
	padding: 18px 24px;
	box-shadow: 0 10px 25px rgba(8, 33, 54, 0.25);
	z-index: 2;
}

.stat-badge-number {
	font-family: var(--font-serif);
	font-size: 90px;
	font-weight: 400;
	color: var(--color-gold-badge);
	line-height: 0.92;
	display: block;
	margin-bottom: 0;
}

.stat-badge-label {
	font-family: var(--font-heading);
	font-size: 36px;
	font-weight: 400;
	color: var(--color-white);
	line-height: 1.1;
	display: block;
}

.standards-quote-circle {
	position: absolute;
	bottom: 22px;
	right: 18px;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background-color: var(--color-white);
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
	z-index: 2;
}

.standards-eyebrow {
	display: flex;
	align-items: center;
	gap: 8px;
}

.standards-eyebrow-text {
	font-family: var(--font-heading);
	font-size: 11.5px;
	font-weight: 600;
	color: var(--color-eyebrow-standards);
	letter-spacing: 0.3px;
}

.standards-title {
	font-family: var(--font-heading);
	font-size: 34px;
	font-weight: 700;
	color: var(--color-navy);
	line-height: 1.2;
	letter-spacing: -0.3px;
	margin: 10px 0 14px;
}

.standards-stars-img {
	width: 81px;
	height: 17px;
	display: block;
}

.standards-slider {
	padding: 0;
	margin: 0;
}

.standards-slider .swiper-slide {
	height: auto;
}

.standards-card {
	background-color: var(--color-white);
	border: 1px solid var(--color-border-light);
	border-radius: 16px;
	padding: 28px 32px;
}

.standards-card-quote {
	font-family: var(--font-body);
	font-size: 12px;
	color: var(--color-text-body);
	line-height: 1.7;
	margin-bottom: 20px;
}

.standards-card-divider {
	height: 1px;
	background-color: var(--color-bg-soft);
	margin-bottom: 20px;
}

.standards-avatar {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	object-fit: cover;
}

.standards-author-name {
	font-family: var(--font-heading);
	font-size: 14px;
	font-weight: 700;
	color: var(--color-navy);
	line-height: 1.2;
}

.standards-author-title {
	font-family: var(--font-body);
	font-size: 11px;
	color: var(--color-text-muted);
}

.btn-testimonial-nav {
	background: transparent;
	border: none;
	padding: 6px 8px;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: var(--color-text-body);
	transition: opacity 0.2s ease, transform 0.2s ease, color 0.2s ease;
	line-height: 1;
}

.btn-testimonial-nav:hover {
	opacity: 0.7;
	transform: scale(1.12);
	color: var(--color-navy);
}

.btn-testimonial-nav:focus {
	outline: none;
}

@media (max-width: 1199.98px) {
	.standards-visual {
		max-width: 370px;
	}

	.stat-badge-number {
		font-size: 76px;
	}

	.stat-badge-label {
		font-size: 30px;
	}

	.standards-stat-badge {
		padding: 16px 20px;
		border-radius: 18px;
	}
}

@media (max-width: 991.98px) {
	.standards-visual {
		max-width: 380px;
		margin-bottom: 25px;
	}

	.standards-stat-badge {
		top: 52%;
		bottom: auto;
		left: 8px;
		padding: 15px 18px;
		border-radius: 16px;
	}

	.stat-badge-number {
		font-size: 64px;
	}

	.stat-badge-label {
		font-size: 26px;
	}

	.standards-quote-circle {
		right: 15px;
		bottom: 20px;
	}

	.standards-title {
		font-size: 26px;
	}

	.standards-card {
		padding: 22px 20px;
	}
}

@media (max-width: 575.98px) {
	.standards-visual {
		max-width: 320px;
	}

	.standards-title {
		font-size: 22px;
	}

	.standards-card-quote {
		font-size: 11.5px;
	}

	.standards-stat-badge {
		padding: 12px 16px;
		border-radius: 14px;
	}

	.stat-badge-number {
		font-size: 46px;
	}

	.stat-badge-label {
		font-size: 18px;
	}

	.standards-quote-circle {
		width: 40px;
		height: 40px;
	}
}





/* ==========================================================================
   14.0 SECTION 9: CTA BANNER SECTION
   ========================================================================= */
.cta-banner-section {
	background-color: transparent;
}

.cta-banner {
	border-radius: 24px;
	border-bottom-right-radius: 3px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
	position: relative;
	overflow: hidden;
	min-height: 700px;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}

.cta-bg-top {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 44%;
	background-size: cover;
	background-position: center top;
	background-repeat: no-repeat;
	z-index: 1;
}

.cta-top-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to right, rgba(0, 0, 0, 0.52) 0%, rgba(0, 0, 0, 0.25) 55%, rgba(0, 0, 0, 0.05) 100%);
}

.cta-bg-bottom {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 56%;
	background-color: var(--color-navy-rich);
	z-index: 1;
}

.cta-inner-wrap {
	position: relative;
	z-index: 2;
	width: 100%;
}

.cta-left-top {
	padding: 50px 40px 35px 55px;
	min-height: 308px;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	justify-content: end;
}

.cta-eyebrow {
	font-family: var(--font-body);
	font-size: 14.5px;
	font-weight: 500;
	color: rgba(255, 255, 255, 0.92);
	letter-spacing: 0.2px;
	display: block;
	margin-bottom: 8px;
}

.cta-title {
	font-family: var(--font-heading);
	font-size: 34px;
	font-weight: 400;
	color: var(--color-white);
	line-height: 1.25;
	letter-spacing: -0.4px;
	margin: 0;
	max-width: 650px;
}

.cta-left-bottom {
	padding: 40px 40px 48px 55px;
	min-height: 392px;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	justify-content: end;
}

.cta-icon-circle {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background-color: rgba(255, 255, 255, 0.12);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--color-white);
	margin-top: 2px;
}

.cta-info-title {
	font-family: var(--font-heading);
	font-size: 15.5px;
	font-weight: 600;
	color: var(--color-white);
	margin-bottom: 3px;
}

.cta-info-text {
	font-family: var(--font-body);
	font-size: 12.5px;
	color: rgba(255, 255, 255, 0.78);
	line-height: 1.55;
}

.text-white-75 {
	color: rgba(255, 255, 255, 0.75);
}

.text-white-75:hover {
	color: var(--color-white);
}

.cta-benefits-wrap {
	margin-top: 20px;
	padding-top: 20px;
	border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.cta-benefits-title {
	font-family: var(--font-heading);
	font-size: 16px;
	font-weight: 600;
	color: var(--color-white);
	margin-bottom: 14px;
}

.cta-benefits-list {
	font-family: var(--font-body);
	font-size: 12px;
	color: rgba(255, 255, 255, 0.88);
	line-height: 1.5;
}

.cta-benefits-list li {
	margin-bottom: 10px;
}

.cta-right-col {
	padding: 40px 24px 0 12px;
}

.cta-form-card {
	background-color: var(--color-bg-card);
	border-radius: 26px 26px 0 0;
	padding: 40px 36px 36px;
	box-shadow: 0 -6px 30px rgba(0, 0, 0, 0.08);
	max-width: 475px;
	margin-left: auto;
	min-height: 520px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.cta-form-heading {
	font-family: var(--font-heading);
	font-size: 26px;
	font-weight: 700;
	color: var(--color-navy);
	text-align: center;
	margin-bottom: 8px;
}

.cta-form-subtitle {
	font-family: var(--font-body);
	font-size: 12px;
	color: var(--color-text-muted);
	text-align: center;
	line-height: 1.55;
	margin-bottom: 24px;
}

.cta-input {
	background-color: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: 12px;
	padding: 12px 16px;
	height: 46px;
	font-family: var(--font-body);
	font-size: 12.5px;
	color: var(--color-navy);
	box-shadow: none !important;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.cta-input::placeholder {
	color: var(--color-text-light);
}

.cta-input:focus {
	border-color: var(--color-blue);
	background-color: var(--color-white);
}

.cta-textarea {
	resize: none;
	height: 120px;
	min-height: 120px;
	padding: 12px 16px;
}

.btn-cta-submit {
	background-color: var(--color-olive);
	color: var(--color-white);
	border: none;
	border-radius: 10px;
	padding: 12px 36px;
	font-family: var(--font-body);
	font-size: 13.5px;
	font-weight: 500;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: background-color 0.25s ease, transform 0.2s ease;
}

.btn-cta-submit:hover {
	background-color: var(--color-blue-hover);
	color: var(--color-white);
	transform: translateY(-1px);
}

@media (max-width: 991.98px) {
	.cta-banner {
		min-height: auto;
	}

	.cta-bg-top {
		height: 250px;
	}

	.cta-bg-bottom {
		height: calc(100% - 250px);
	}

	.cta-left-top {
		padding: 40px 24px 30px;
		min-height: 250px;
	}

	.cta-title {
		font-size: 26px;
	}

	.cta-left-bottom {
		padding: 30px 24px 35px;
		min-height: auto;
	}

	.cta-right-col {
		padding: 0 16px 20px;
	}

	.cta-form-card {
		border-radius: 20px;
		margin: 0 auto;
		max-width: 100%;
		padding: 30px 24px 32px;
		min-height: auto;
	}
}

@media (max-width: 575.98px) {
	.cta-banner {
		border-radius: 18px;
		border-bottom-right-radius: 3px;
	}

	.cta-bg-top {
		height: 220px;
	}

	.cta-bg-bottom {
		height: calc(100% - 220px);
	}

	.cta-left-top {
		padding: 28px 18px 20px;
		min-height: 220px;
	}

	.cta-title {
		font-size: 20px;
	}

	.cta-left-bottom {
		padding: 20px 18px 25px;
	}

	.cta-form-card {
		padding: 22px 16px 24px;
	}

	.cta-form-heading {
		font-size: 20px;
	}

	.cta-input {
		height: 42px;
		padding: 10px 14px;
	}

	.cta-textarea {
		height: 95px;
		min-height: 95px;
	}

	.btn-cta-submit {
		width: 100%;
	}
}


/* ==========================================================================
   15.0 SECTION 11: SITE FOOTER
   ========================================================================= */
.site-footer {
	background-color: var(--color-white);
}

.footer-card {
	background-color: var(--color-blue-footer);
	border-radius: 24px;
	padding: 46px 44px;
	position: relative;
	overflow: hidden;
	box-shadow: 0 6px 25px rgba(0, 0, 0, 0.05);
}

.footer-bg-watermark {
	position: absolute;
	right: 0;
	bottom: 0;
	width: 304px;
	height: 304px;
	background-repeat: no-repeat;
	background-position: right bottom;
	background-size: contain;
	pointer-events: none;
	opacity: 0.85;
	z-index: 1;
}

.footer-card-inner {
	position: relative;
	z-index: 2;
}

.footer-logo-card {
	background-color: var(--color-white);
	border-radius: 10px;
	padding: 10px 18px;
	display: inline-flex;
	align-items: center;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.footer-desc {
	font-family: var(--font-body);
	font-size: 13px;
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.85);
	max-width: 380px;
}

.footer-social-wrap {
	display: flex;
	gap: 10px;
}

.footer-social-btn {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background-color: var(--color-social-green);
	color: var(--color-white);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	font-size: 13px;
	transition: transform 0.2s ease, opacity 0.2s ease;
}

.footer-social-btn:hover {
	transform: translateY(-2px);
	opacity: 0.92;
	color: var(--color-white);
}

.footer-heading {
	font-family: var(--font-heading);
	font-size: 18px;
	font-weight: 600;
	color: var(--color-white);
	margin-bottom: 16px;
}

.footer-quick-links {
	font-family: var(--font-body);
	font-size: 13.5px;
	line-height: 1.7;
}

.footer-quick-links li {
	margin-bottom: 9px;
}

.footer-quick-links a {
	color: rgba(255, 255, 255, 0.8);
	text-decoration: none;
	transition: color 0.2s ease, padding-left 0.2s ease;
}

.footer-quick-links a:hover {
	color: var(--color-white);
	padding-left: 3px;
}

.footer-contact-card {
	background-color: var(--color-white);
	border-radius: 22px;
	padding: 28px 28px 24px;
	max-width: 400px;
	margin-left: auto;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}

.footer-contact-title {
	font-family: var(--font-heading);
	font-size: 19px;
	font-weight: 700;
	color: var(--color-navy);
}

.footer-contact-info {
	font-family: var(--font-body);
	font-size: 12.5px;
	color: var(--color-text-muted);
	line-height: 1.55;
}

.footer-contact-info a {
	color: var(--color-text-muted);
	text-decoration: none;
	transition: color 0.2s ease;
}

.footer-contact-info a:hover {
	color: var(--color-navy);
}

.footer-contact-emergency {
	font-family: var(--font-body);
	font-size: 13.5px;
	font-weight: 700;
	color: var(--color-navy);
	line-height: 1.5;
}

.footer-contact-emergency a {
	color: var(--color-navy);
	text-decoration: none;
}

.btn-footer-connect {
	background-color: var(--color-olive);
	color: var(--color-white);
	border: none;
	border-radius: 8px;
	padding: 11px 20px;
	font-family: var(--font-body);
	font-size: 13px;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background-color 0.25s ease, transform 0.2s ease;
}

.btn-footer-connect:hover {
	background-color: var(--color-navy);
	color: var(--color-white);
	transform: translateY(-1px);
}

.footer-bottom {
	background-color: var(--color-white);
	border-top: 1px solid rgba(0, 0, 0, 0.05);
	font-family: var(--font-body);
	font-size: 12px;
	color: var(--color-text-muted);
}

.footer-copyright strong {
	color: var(--color-text-body);
	font-weight: 700;
}

.footer-legal-links {
	display: inline-flex;
	gap: 20px;
	list-style: none;
	padding: 0;
	margin: 0;
}

.footer-legal-links a {
	color: var(--color-text-muted);
	text-decoration: none;
	transition: color 0.2s ease;
}

.footer-legal-links a:hover {
	color: var(--color-navy);
}

@media (max-width: 991.98px) {
	.footer-card {
		padding: 36px 24px;
	}

	.footer-contact-card {
		margin-left: 0;
		max-width: 100%;
		margin-top: 8px;
	}
}

@media (max-width: 575.98px) {
	.footer-card {
		border-radius: 18px;
		padding: 28px 18px;
	}

	.footer-contact-card {
		padding: 22px 18px;
	}

	.footer-legal-links {
		gap: 12px;
		flex-wrap: wrap;
		justify-content: center;
	}
}


/* ==========================================================================
   16.0 RESPONSIVE UTILITIES & MOBILE OPTIMIZATIONS
   ========================================================================= */
@media (max-width: 991.98px) {
	.emergency-block {
		border-radius: 8px;
		margin: 4px 0;
	}

	.main-navbar {
		border-radius: 14px;
	}

	.main-nav-list {
		padding: 0.75rem 0;
		text-align: center;
	}

	.hero-section {
		min-height: auto;
		padding: 2rem 0;
	}
}

@media (max-width: 575.98px) {
	.hero-section {
		padding: 1rem 0;
	}
}

/* ==========================================================================
   17.0 PREMIUM SCROLL REVEAL ANIMATIONS (ZERO-OVERFLOW ARCHITECTURE)
   ========================================================================= */

/* Progressive Enhancement: Base animation styles only activate when JS confirms ready */
html.js-reveal-ready .reveal-on-scroll {
	opacity: 0;
	transform: translateY(26px);
	transition: opacity 1.05s cubic-bezier(0.22, 1, 0.36, 1), transform 1.05s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: opacity, transform;
}

html.js-reveal-ready .reveal-on-scroll.is-revealed {
	opacity: 1;
	transform: translateY(0);
	will-change: auto;
}

/* Subtle scale reveal for large banner cards (Hero, Commitment, CTA, Footer) */
html.js-reveal-ready .reveal-scale {
	opacity: 0;
	transform: translateY(22px) scale(0.985);
	transition: opacity 1.1s cubic-bezier(0.22, 1, 0.36, 1), transform 1.1s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: opacity, transform;
}

html.js-reveal-ready .reveal-scale.is-revealed {
	opacity: 1;
	transform: translateY(0) scale(1);
	will-change: auto;
}

/* Stagger container for multi-card grids (Services, Why Choose Us, etc.) */
html.js-reveal-ready .reveal-stagger>* {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity 1.05s cubic-bezier(0.22, 1, 0.36, 1), transform 1.05s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: opacity, transform;
}

html.js-reveal-ready .reveal-stagger.is-revealed>* {
	opacity: 1;
	transform: translateY(0);
	will-change: auto;
}

html.js-reveal-ready .reveal-stagger.is-revealed>*:nth-child(1) {
	transition-delay: 0.08s;
}

html.js-reveal-ready .reveal-stagger.is-revealed>*:nth-child(2) {
	transition-delay: 0.22s;
}

html.js-reveal-ready .reveal-stagger.is-revealed>*:nth-child(3) {
	transition-delay: 0.36s;
}

html.js-reveal-ready .reveal-stagger.is-revealed>*:nth-child(4) {
	transition-delay: 0.50s;
}

html.js-reveal-ready .reveal-stagger.is-revealed>*:nth-child(5) {
	transition-delay: 0.64s;
}

html.js-reveal-ready .reveal-stagger.is-revealed>*:nth-child(6) {
	transition-delay: 0.78s;
}

/* Directional helper for staggered pairs */
html.js-reveal-ready .reveal-delay-1 {
	transition-delay: 0.20s !important;
}

html.js-reveal-ready .reveal-delay-2 {
	transition-delay: 0.38s !important;
}

/* Accessibility: Respect user's motion preferences */
@media (prefers-reduced-motion: reduce) {

	html.js-reveal-ready .reveal-on-scroll,
	html.js-reveal-ready .reveal-scale,
	html.js-reveal-ready .reveal-stagger>* {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}
}

/* ==========================================================================
   17.1 PREMIUM KINETIC TEXT REVEALING ANIMATIONS
   ========================================================================= */

/* Word-by-word kinetic slide-up container */
.reveal-word-wrap {
	display: inline-block;
	overflow: hidden;
	vertical-align: bottom;
	padding-bottom: 0.18em;
	margin-bottom: -0.18em;
}

/* Individual word in unrevealed state */
html.js-reveal-ready .reveal-word {
	display: inline-block;
	transform: translateY(115%);
	opacity: 0;
	transition: transform 1.05s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.85s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform, opacity;
}

/* Individual word in revealed state */
html.js-reveal-ready .is-revealed .reveal-word,
html.js-reveal-ready .reveal-text.is-revealed .reveal-word {
	transform: translateY(0);
	opacity: 1;
	will-change: auto;
}

/* Smooth text fade and lift for eyebrows, subtitles, and descriptions */
html.js-reveal-ready .reveal-text-fade {
	opacity: 0;
	transform: translateY(14px);
	transition: opacity 0.95s cubic-bezier(0.22, 1, 0.36, 1), transform 0.95s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: opacity, transform;
}

html.js-reveal-ready .is-revealed .reveal-text-fade,
html.js-reveal-ready .reveal-text-fade.is-revealed {
	opacity: 1;
	transform: translateY(0);
	will-change: auto;
}

/* Stagger delays for sequential text hierarchy */
html.js-reveal-ready .about-eyebrow.reveal-text-fade,
html.js-reveal-ready .why-eyebrow.reveal-text-fade,
html.js-reveal-ready .category-eyebrow.reveal-text-fade,
html.js-reveal-ready .faq-eyebrow.reveal-text-fade,
html.js-reveal-ready .commitment-eyebrow.reveal-text-fade,
html.js-reveal-ready .standards-eyebrow.reveal-text-fade,
html.js-reveal-ready .cta-eyebrow.reveal-text-fade {
	transition-delay: 0.08s;
}

html.js-reveal-ready .reveal-text-delay-1 {
	transition-delay: 0.30s !important;
}

html.js-reveal-ready .reveal-text-delay-2 {
	transition-delay: 0.48s !important;
}

/* Accent line vertical expansion reveal */
html.js-reveal-ready .about-accent-line {
	transform: scaleY(0);
	transform-origin: top;
	transition: transform 1.1s cubic-bezier(0.22, 1, 0.36, 1) 0.32s;
}

html.js-reveal-ready .is-revealed .about-accent-line,
html.js-reveal-ready .about-accent-line.is-revealed {
	transform: scaleY(1);
}

/* Reduced motion accessibility for text reveals */
@media (prefers-reduced-motion: reduce) {

	html.js-reveal-ready .reveal-word,
	html.js-reveal-ready .reveal-text-fade,
	html.js-reveal-ready .about-accent-line {
		transform: none !important;
		opacity: 1 !important;
		transition: none !important;
	}
}