/* StrainSense Brochure Design CSS - All styles consolidated */

/* Force hide mega menu dropdowns - override everything */
.force-hidden {
	position: absolute !important;
	left: -99999px !important;
	top: -99999px !important;
	visibility: hidden !important;
	opacity: 0 !important;
	pointer-events: none !important;
	z-index: -9999 !important;
}

/* ===== CSS VARIABLES ===== */
:root {
	/* Primary Brand Colors */
	--branding-primary: #E31E26;  /* Main brand red */
	--branding-primary-hover: #C01920;  /* Darker red for hover states (15% darker) */
	--branding-primary-light: #FCE4E5;  /* Light red for backgrounds */

	/* Secondary Brand Colors */
	--branding-secondary: #FCA41C;  /* Yellow/amber */
	--branding-secondary-hover: #E89318;  /* Darker yellow for hover (10% darker) */
	--branding-secondary-light: #FFF4E6;  /* Light yellow for backgrounds */

	/* Status Colors */
	--branding-success: #28a745;  /* Green for success states */
	--branding-success-hover: #218838;  /* Darker green for hover */
	--branding-danger: #E31E26;   /* Red for danger states (same as primary) */
	--branding-warning: #FCA41C;  /* Yellow for warnings (same as secondary) */
	--branding-info: #17a2b8;     /* Blue/teal for info */

	/* Text Colors */
	--branding-text-primary: #3C3C3C;    /* Main text color - brand black */
	--branding-text-secondary: #3C3C3C;  /* Secondary/muted text */
	--branding-text-light: #ffffff;      /* White text on dark backgrounds */
	--branding-text-dark: #3C3C3C;       /* Dark text - brand black */

	/* Background Colors */
	--branding-bg-white: #ffffff;
	--branding-bg-light: #f8f9fa;
	--branding-bg-gray: #e9ecef;
	--branding-bg-dark: #3C3C3C;  /* Brand black */

	/* Gray Scale */
	--branding-gray-100: #f8f9fa;
	--branding-gray-200: #e9ecef;
	--branding-gray-300: #dee2e6;
	--branding-gray-400: #ced4da;
	--branding-gray-500: #adb5bd;
	--branding-gray-600: #3C3C3C;
	--branding-gray-700: #3C3C3C;
	--branding-gray-800: #3C3C3C;  /* Brand black */
	--branding-gray-900: #3C3C3C;  /* Brand black */

	/* Border Colors */
	--branding-border: #dee2e6;
	--branding-border-light: #f8f9fa;
	--branding-border-dark: #3C3C3C;  /* Brand black */

	/* Link Colors */
	--branding-link: var(--branding-primary);
	--branding-link-hover: var(--branding-primary-hover);

	/* Button Colors */
	--branding-btn-primary-bg: var(--branding-primary);
	--branding-btn-primary-hover: var(--branding-primary-hover);
	--branding-btn-secondary-bg: var(--branding-secondary);
	--branding-btn-secondary-hover: var(--branding-secondary-hover);
	--branding-btn-success-bg: var(--branding-success);
	--branding-btn-success-hover: var(--branding-success-hover);

	/* Gradient Backgrounds */
	--branding-gradient-primary: linear-gradient(135deg, var(--branding-primary), var(--branding-secondary));
	--branding-gradient-secondary: linear-gradient(135deg, var(--branding-secondary), var(--branding-primary));
	--branding-gradient-light: linear-gradient(135deg, rgba(227, 30, 38, 0.1), var(--branding-secondary-transparent-10));

	/* Gradient Text Effects */
	--branding-gradient-text: linear-gradient(135deg, var(--branding-primary) 0%, var(--branding-secondary) 100%);
	--branding-gradient-text-reverse: linear-gradient(135deg, var(--branding-secondary) 0%, var(--branding-primary) 100%);
	--branding-gradient-text-primary: linear-gradient(135deg, var(--branding-primary) 0%, var(--branding-secondary) 100%);
	--branding-gradient-text-secondary: linear-gradient(135deg, var(--branding-secondary) 0%, var(--branding-primary) 100%);

	/* Shadows */
	--branding-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
	--branding-shadow: 0 0.5rem 1rem var(--branding-black-transparent-15);
	--branding-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);

	/* Border Radius */
	--branding-radius: 0.5rem;
	--branding-radius-lg: 1rem;
	--branding-radius-xl: 1.5rem;

	/* Additional Brand Shades */
	--branding-red-dark: #C01920;  /* Darker red variant */
	--branding-red-darker: #A0161B;  /* Even darker red */
	--branding-red-alt: #E31E26;  /* Alternative red shade (same as primary) */
	--branding-yellow-dark: #E89318;  /* Darker yellow */
	--branding-yellow-light-bg: #FFF4E6;  /* Light yellow background */

	/* Alternative Button Colors (for non-brand elements) */
	--branding-blue: #007bff;  /* Blue for alternative button */
	--branding-blue-dark: #0056b3;  /* Darker blue */
	--branding-blue-darker: #004085;  /* Even darker blue */
	--branding-green: #28a745;  /* Green for success alternative */
	--branding-green-dark: #218838;  /* Darker green */
	--branding-green-darker: #1e7e34;  /* Even darker green */

	/* Additional Grays */
	--branding-gray-alt-1: #3C3C3C;  /* Dark gray text - brand black */
	--branding-gray-alt-2: #5a5a5a;  /* Medium gray text */
	--branding-gray-alt-3: #4a4a4a;  /* Another medium gray */
	--branding-gray-alt-4: #e8eaed;  /* Light gray border */
	--branding-gray-alt-5: #3C3C3C;  /* Very dark gray - brand black */
	--branding-gray-alt-6: #4b5563;  /* Medium-dark gray */
	--branding-gray-alt-7: #6b7280;  /* Another medium gray */
	--branding-gray-alt-8: #fafafa;  /* Very light gray background */
	--branding-gray-alt-9: #F9FAFB;  /* Another light gray background */

	/* Transparent Colors */
	--branding-primary-transparent-10: rgba(227, 30, 38, 0.1);
	--branding-primary-transparent-15: rgba(227, 30, 38, 0.15);
	--branding-primary-transparent-25: rgba(227, 30, 38, 0.25);
	--branding-primary-transparent-30: rgba(227, 30, 38, 0.3);
	--branding-primary-transparent-40: rgba(227, 30, 38, 0.4);
	--branding-secondary-transparent-10: rgba(252, 164, 28, 0.1);
	--branding-secondary-transparent-15: rgba(252, 164, 28, 0.15);
	--branding-black-transparent-05: rgba(60, 60, 60, 0.05);
	--branding-black-transparent-06: rgba(60, 60, 60, 0.06);
	--branding-black-transparent-08: rgba(60, 60, 60, 0.08);
	--branding-black-transparent-10: rgba(60, 60, 60, 0.1);
	--branding-black-transparent-12: rgba(0, 0, 0, 0.12);
	--branding-black-transparent-15: rgba(0, 0, 0, 0.15);
	--branding-black-transparent-20: rgba(0, 0, 0, 0.2);
	--branding-white-transparent-10: rgba(255, 255, 255, 0.1);
	--branding-white-transparent-90: rgba(255, 255, 255, 0.9);
	--branding-white-transparent-95: rgba(255, 255, 255, 0.95);

	/* Legacy color mappings for compatibility */
	--dark-color: var(--branding-gray-900);
	--light-color: var(--branding-gray-100);
}

/* ===== CUSTOM BOOTSTRAP COLORS ===== */
.bg-primary {
	background-color: var(--branding-primary) !important;
}
.bg-primary-light {
	background-color: var(--branding-primary-light) !important;
}
.bg-secondary {
	background-color: var(--branding-secondary) !important;
}
.bg-secondary-light {
	background-color: var(--branding-secondary-light) !important;
}
.text-primary {
	color: var(--branding-primary) !important;
}
.text-secondary {
	color: var(--branding-secondary) !important;
}
/* ===== COMPREHENSIVE BUTTON STYLES ===== */
/* Primary/Red Buttons - All Variations */
.btn-primary,
.btn-danger,
a.btn-primary,
a.btn-danger,
button.btn-primary,
button.btn-danger {
	background-color: var(--branding-primary) !important;
	border-color: var(--branding-primary) !important;
	color: #ffffff !important;
	border-radius: var(--branding-radius);
}

.btn-primary *,
a.btn-primary *,
button.btn-primary *,
.btn-primary span,
.btn-primary i,
a.btn-primary span,
a.btn-primary i {
	color: #ffffff !important;
}

/* Force white text on primary buttons - override any other styles */
.btn.btn-primary,
a.btn.btn-primary,
button.btn.btn-primary,
.btn-primary.btn-lg,
a.btn-primary.btn-lg,
button.btn-primary.btn-lg {
	color: #ffffff !important;
}

.btn-primary:hover,
.btn-danger:hover,
a.btn-primary:hover,
a.btn-danger:hover,
button.btn-primary:hover,
button.btn-danger:hover {
	background-color: var(--branding-primary-hover) !important;
	border-color: var(--branding-primary-hover) !important;
	color: #ffffff !important;
}

.btn-primary:hover *,
a.btn-primary:hover *,
button.btn-primary:hover *,
.btn-primary:hover span,
.btn-primary:hover i,
a.btn-primary:hover span,
a.btn-primary:hover i {
	color: #ffffff !important;
}

/* Ultra-specific hover rule to override all link colors */
a.btn.btn-primary:hover,
a.btn.btn-primary.btn-lg:hover,
a[class*="btn-primary"]:hover,
a[href].btn.btn-primary:hover,
a[href].btn.btn-primary.btn-lg:hover {
	color: #ffffff !important;
	text-decoration: none !important;
}

.btn-primary:focus,
.btn-danger:focus,
a.btn-primary:focus,
a.btn-danger:focus,
button.btn-primary:focus,
button.btn-danger:focus {
	background-color: var(--branding-primary-hover) !important;
	border-color: var(--branding-primary-hover) !important;
	color: var(--branding-text-light) !important;
	box-shadow: 0 0 0 0.2rem rgba(227, 30, 38, 0.25) !important;
}

.btn-primary:active,
.btn-primary:active:hover,
.btn-primary:active:focus,
.btn-primary.active,
.btn-danger:active,
.btn-danger:active:hover,
.btn-danger:active:focus,
.btn-danger.active,
a.btn-primary:active,
a.btn-danger:active,
button.btn-primary:active,
button.btn-danger:active {
	background-color: var(--branding-secondary) !important;
	border-color: var(--branding-secondary) !important;
	color: var(--branding-text-dark) !important;
}

/* Orange Button */
.btn-orange,
a.btn-orange,
button.btn-orange {
	background-color: #FCA41C !important;
	border-color: #FCA41C !important;
	color: #ffffff !important;
	border-radius: var(--branding-radius);
}

.btn-orange *,
a.btn-orange *,
button.btn-orange *,
.btn-orange span,
.btn-orange i,
a.btn-orange span,
a.btn-orange i {
	color: #ffffff !important;
}

.btn.btn-orange,
a.btn.btn-orange,
button.btn.btn-orange,
.btn-orange.btn-lg,
a.btn-orange.btn-lg,
button.btn-orange.btn-lg {
	color: #ffffff !important;
}

.btn-orange:hover,
a.btn-orange:hover,
button.btn-orange:hover {
	background-color: #E89318 !important;
	border-color: #E89318 !important;
	color: #ffffff !important;
}

.btn-orange:hover *,
a.btn-orange:hover *,
button.btn-orange:hover *,
.btn-orange:hover span,
.btn-orange:hover i,
a.btn-orange:hover span,
a.btn-orange:hover i {
	color: #ffffff !important;
}

a.btn.btn-orange:hover,
a.btn.btn-orange.btn-lg:hover,
a[class*="btn-orange"]:hover,
a[href].btn.btn-orange:hover,
a[href].btn.btn-orange.btn-lg:hover {
	color: #ffffff !important;
	text-decoration: none !important;
}

.btn-orange:focus,
a.btn-orange:focus,
button.btn-orange:focus {
	background-color: #E89318 !important;
	border-color: #E89318 !important;
	color: #ffffff !important;
	box-shadow: 0 0 0 0.2rem rgba(252, 164, 28, 0.25) !important;
}

.btn-orange:active,
.btn-orange:active:hover,
.btn-orange:active:focus,
.btn-orange.active,
a.btn-orange:active,
button.btn-orange:active {
	background-color: #D88214 !important;
	border-color: #D88214 !important;
	color: #ffffff !important;
}

/* Outline Primary/Red Buttons */
.btn-outline-primary,
.btn-outline-danger,
a.btn-outline-primary,
a.btn-outline-danger {
	color: var(--branding-primary) !important;
	border-color: var(--branding-primary) !important;
	background-color: transparent !important;
	border-radius: var(--branding-radius);
}

.btn-outline-primary:hover,
.btn-outline-danger:hover,
a.btn-outline-primary:hover,
a.btn-outline-danger:hover {
	background-color: var(--branding-primary) !important;
	border-color: var(--branding-primary) !important;
	color: var(--branding-text-light) !important;
}

.btn-outline-primary:focus,
.btn-outline-danger:focus,
a.btn-outline-primary:focus,
a.btn-outline-danger:focus {
	background-color: var(--branding-primary) !important;
	border-color: var(--branding-primary) !important;
	color: var(--branding-text-light) !important;
	box-shadow: 0 0 0 0.2rem rgba(227, 30, 38, 0.25) !important;
}

.btn-outline-primary:active,
.btn-outline-primary:active:hover,
.btn-outline-primary:active:focus,
.btn-outline-danger:active,
.btn-outline-danger:active:hover,
.btn-outline-danger:active:focus,
a.btn-outline-primary:active,
a.btn-outline-danger:active {
	background-color: var(--branding-secondary) !important;
	border-color: var(--branding-secondary) !important;
	color: var(--branding-text-dark) !important;
}

/* Catch-all for any button with red background */
.btn[style*="background-color: #E31E26"],
.btn[style*="background-color: #e31e26"],
.btn[style*="background-color: var(--branding-primary)"],
.btn[style*="background: #E31E26"],
.btn[style*="background: #e31e26"],
.btn[style*="background: var(--branding-primary)"],
[class*="btn"][style*="background-color: red"],
[class*="btn"][style*="background: red"] {
	transition: all 0.3s ease;
}

.btn[style*="background-color: #E31E26"]:hover,
.btn[style*="background-color: #e31e26"]:hover,
.btn[style*="background-color: var(--branding-primary)"]:hover,
.btn[style*="background: #E31E26"]:hover,
.btn[style*="background: #e31e26"]:hover,
.btn[style*="background: var(--branding-primary)"]:hover,
[class*="btn"][style*="background-color: red"]:hover,
[class*="btn"][style*="background: red"]:hover {
	background-color: var(--branding-primary-hover) !important;
	color: var(--branding-text-light) !important;
}

.btn[style*="background-color: #E31E26"]:active,
.btn[style*="background-color: #e31e26"]:active,
.btn[style*="background-color: var(--branding-primary)"]:active,
.btn[style*="background: #E31E26"]:active,
.btn[style*="background: #e31e26"]:active,
.btn[style*="background: var(--branding-primary)"]:active,
[class*="btn"][style*="background-color: red"]:active,
[class*="btn"][style*="background: red"]:active {
	background-color: var(--branding-secondary) !important;
	color: var(--branding-text-dark) !important;
}

/* Product Card Hover Effects */
.product-card-link:hover .product-card {
	transform: translateY(-5px);
	box-shadow: 0 10px 20px rgba(227, 30, 38, 0.2) !important;
}

.product-card-link {
	text-decoration: none;
	display: block;
}

.product-card {
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Homepage specific product card styles */
#sensor-categories .product-card {
	overflow: hidden !important;
	height: auto !important;
	display: flex !important;
	flex-direction: column !important;
}

/* First div contains the image - homepage only */
#sensor-categories .product-card > div:first-child {
	position: relative !important;
	width: 100% !important;
	height: 250px !important;
	background: #ffffff !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}

#sensor-categories .product-card > div:first-child img {
	width: 100% !important;
	height: 100% !important;
	object-fit: contain !important;
	display: block !important;
	padding: 10px !important;
}

/* Second div contains the text - appears below the image - homepage only */
#sensor-categories .product-card > div:last-child {
	position: relative !important;
	width: 100% !important;
	padding: 1.5rem !important;
}

/* Custom Badge Colors */
.bg-primary-light {
	background-color: var(--branding-primary-transparent-10) !important;
}
.bg-secondary-light {
	background-color: var(--branding-secondary-transparent-10) !important;
}

/* ===== TYPOGRAPHY ===== */
body {
	font-family: "Geist Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	line-height: 1.6;
	color: var(--branding-gray-700);
	padding-top: 60px; /* Reduced padding for better hero section positioning */
}

.brand-text,
.hero-title,
.section-title,
.service-title,
.case-study-title,
.blog-title {
	font-family: "Geist Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	font-weight: 700;
}

/* Apply Geist Sans to all elements */
* {
	font-family: "Geist Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.gradient-text {
	background: var(--branding-gradient-primary);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}

/* ===== TOP BAR STYLES ===== */
.top-bar {
	background: linear-gradient(135deg, var(--branding-primary), var(--branding-secondary));
	color: white;
	padding: 8px 0;
	font-size: 0.875rem;
	position: relative;
	z-index: 1031;
	width: 100%;
}

.top-bar-left {
	display: flex;
	align-items: center;
}

.top-bar-title {
	color: white;
	font-weight: 400;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	max-width: 400px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	display: inline-block;
	margin-right: 8px;
}

.top-bar-right {
	gap: 20px;
}

.top-bar-item {
	display: flex;
	align-items: center;
	gap: 6px;
	color: white;
}

.top-bar-item i {
	font-size: 0.875rem;
	opacity: 0.9;
}

.top-bar-item a {
	color: white;
	text-decoration: none;
	transition: opacity 0.3s ease;
}

.top-bar-item a:hover {
	opacity: 0.8;
}

.top-bar-link {
	color: white;
	text-decoration: none;
	font-size: 0.875rem;
	transition: opacity 0.3s ease;
	white-space: nowrap;
}

.top-bar-link:hover {
	opacity: 0.8;
	color: white;
}

.top-bar-separator {
	color: white;
	opacity: 0.6;
	margin: 0 8px;
	font-size: 0.875rem;
}

/* Mobile responsive top bar */
@media (max-width: 768px) {
	.top-bar {
		display: none;
	}

	/* Adjust body padding on mobile since top bar is hidden */
	body {
		padding-top: 15px;
	}

	/* Ensure logo bar starts at top of screen on mobile */
	.strainsense-logo-bar {
		top: 0 !important;
	}

}

/* Desktop: no padding needed since headers are not fixed */
@media (min-width: 769px) {
	body {
		padding-top: 0;
	}
}

/* ===== LOGO BAR STYLES ===== */
.strainsense-logo-bar {
	background: var(--branding-bg-white) !important;
	background-color: var(--branding-bg-white) !important;
	padding: 1rem 0;
	z-index: 1030;
	top: 38px; /* Push logo bar down to accommodate top bar */
}

.strainsense-logo-bar .navbar-brand {
	margin: 0;
}

.strainsense-logo-bar .navbar-toggler {
	border: 1px solid var(--branding-gray-300);
}

.strainsense-logo-bar .navbar-toggler-icon {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
	width: 2em;
	height: 2em;
}

/* ===== LOGO BAR ITEMS STYLES ===== */
.logo-bar-wrapper {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
}

.logo-bar-left {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
}

.logo-bar-middle {
	flex: 1 1 auto;
	display: flex;
	justify-content: center;
	align-items: center;
}

.logo-bar-right {
	flex: 0 0 auto;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 1rem;
}

/* Header Search Form - Always Visible */
.header-search-form {
	display: flex;
	align-items: stretch;
	width: 100%;
	max-width: 325px;
	background: white;
	border-radius: 8px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	border: 2px solid #e0e0e0;
	overflow: hidden;
	transition: all 0.3s ease;
}

.header-search-form:focus-within {
	border-color: var(--branding-primary);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.header-search-input {
	flex: 1;
	border: none;
	border-radius: 0;
	padding: 0.75rem 1rem;
	font-size: 15px;
	background: white;
}

.header-search-input:focus {
	outline: none;
	box-shadow: none;
}

.header-search-submit {
	background: #FCA41C !important;
	border: none !important;
	color: white !important;
	padding: 0.75rem 1.5rem !important;
	cursor: pointer;
	transition: all 0.3s ease;
	flex-shrink: 0;
	border-radius: 0 !important;
}

.header-search-submit:hover {
	background: #e89316 !important;
}

.header-search-submit i {
	font-size: 18px;
}

.logo-bar-item {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	color: var(--branding-gray-700);
	font-size: 18px;
	line-height: 1;
	text-decoration: none;
	transition: color 0.3s ease;
}

.logo-bar-item i {
	font-size: 18px;
	color: var(--branding-primary);
	line-height: 1;
	display: inline-flex;
	align-items: center;
}

.logo-bar-item a {
	color: var(--branding-gray-700);
	text-decoration: none;
	transition: color 0.3s ease;
}

.logo-bar-item a:hover {
	color: var(--branding-primary);
}

/* Expandable Search Styles */
.search-toggle-container {
	position: relative;
}

.search-toggle-btn {
	background: var(--branding-primary);
	border: none;
	width: 45px;
	height: 45px;
	border-radius: 8px;
	color: white;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all 0.3s ease;
	position: relative;
	z-index: 1001;
}

.search-toggle-btn:hover {
	background: var(--branding-primary-hover);
}

.search-toggle-btn i {
	font-size: 20px;
}

/* Hide toggle button when search is active */
.search-toggle-container:has(.search-expandable.active) .search-toggle-btn {
	opacity: 0;
	pointer-events: none;
}

.search-expandable {
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 0;
	overflow: hidden;
	opacity: 0;
	transition: all 0.3s ease;
	z-index: 1000;
}

.search-expandable.active {
	width: 550px;
	opacity: 1;
	animation: searchSlideIn 0.3s ease;
	border-radius: 8px;
}

@keyframes searchSlideIn {
	from {
		transform: translateY(-50%) translateX(20px);
		opacity: 0;
	}
	to {
		transform: translateY(-50%) translateX(0);
		opacity: 1;
	}
}

.search-expandable .search-form {
	display: flex;
	gap: 0;
	background: white;
	border-radius: 8px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2), 0 2px 8px rgba(0, 0, 0, 0.1);
	border: 2px solid var(--branding-primary);
	overflow: hidden;
	white-space: nowrap;
}

.search-expandable .btn-search-close {
	background: #f8f9fa;
	border: none;
	border-right: 1px solid #dee2e6;
	color: var(--branding-gray-700);
	padding: 0.75rem 1rem;
	cursor: pointer;
	transition: all 0.3s ease;
	display: flex;
	align-items: center;
	justify-content: center;
}

.search-expandable .btn-search-close:hover {
	background: var(--branding-primary);
	color: white;
}

.search-expandable .btn-search-close i {
	font-size: 20px;
	font-weight: bold;
}

.search-expandable .search-input {
	border: none;
	border-radius: 0;
	padding: 0.75rem 1rem;
	font-size: 15px;
	flex: 1;
}

.search-expandable .search-input:focus {
	outline: none;
	box-shadow: none;
}

.search-expandable .btn-search-submit {
	background: var(--branding-primary);
	border: none;
	border-radius: 0;
	color: white;
	padding: 0.75rem 1.5rem;
	cursor: pointer;
	transition: all 0.3s ease;
}

.search-expandable .btn-search-submit:hover {
	background: var(--branding-primary-hover);
}

.search-expandable .btn-search-submit i {
	font-size: 18px;
}

/* ===== NAVIGATION STYLES ===== */
.strainsense-navbar {
	background: var(--branding-primary) !important;
	background-color: var(--branding-primary) !important;
	border-bottom: 1px solid var(--branding-black-transparent-05);
	padding: 8px 0;
	transition: all 0.3s ease;
	position: sticky;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1029;
	width: 100%;
}

/* Fix navigation item spacing */
/* .strainsense-navbar .navbar-nav {
	gap: 1rem !important;
} */

.strainsense-navbar .nav-item {
	margin: 0 !important;
	padding: 0 !important;
}

/* Override any existing navigation backgrounds */
.navbar,
nav,
.navbar-light,
.navbar-expand-lg,
#mainNavbar,
nav.navbar,
nav.navbar-light,
nav.navbar-expand-lg,
nav#mainNavbar,
.strainsense-navbar,
nav.strainsense-navbar {
	background: var(--branding-primary) !important;
	background-color: var(--branding-primary) !important;
}

/* Specifically target the Zeus nav override */
nav[role="navigation"],
nav[itemtype="https://schema.org/SiteNavigationElement"],
nav.navbar.navbar-expand-lg.navbar-light.fixed-top.strainsense-navbar,
#mainNavbar.navbar.navbar-expand-lg.navbar-light.fixed-top.strainsense-navbar {
	background: var(--branding-bg-white) !important;
	background-color: var(--branding-bg-white) !important;
}

/* Additional overrides for navbar background but exclude dropdown menus */
nav.strainsense-navbar > .container,
nav.strainsense-navbar > .container > a,
nav.strainsense-navbar > .container > button {
	background-color: transparent !important;
}

/* Ensure dropdown menus have proper background */
.strainsense-navbar .dropdown-menu {
	background-color: transparent !important;
}

/* Final override to beat Zeus CSS specificity that loads later via @push */
html body nav.navbar {
	background: var(--branding-bg-white) !important;
	background-color: var(--branding-bg-white) !important;
}

html body nav {
	background: var(--branding-bg-white) !important;
	background-color: var(--branding-bg-white) !important;
}

/* ===== MEGA MENU STYLES - SIMPLE FIXES ONLY ===== */
.strainsense-navbar .dropdown-menu {
	background: transparent !important;
	border: 1px solid var(--branding-black-transparent-10);
	box-shadow: 0 5px 15px var(--branding-black-transparent-10);
	border-radius: 0.5rem;
	font-family: "Geist Sans", sans-serif;
	max-height: 70vh;
	overflow-y: auto;
}

.strainsense-navbar .nav-white {
	background-color: var(--branding-bg-white) !important;
	box-shadow: 0 2px 3px 0px var(--branding-black-transparent-10) !important;
}

/* Just fix the text casing and colors */
.strainsense-navbar .megamenu a {
	text-transform: capitalize !important;
	color: var(--branding-gray-700);
	text-decoration: none;
	padding: 8px 12px;
	border-radius: 4px;
	transition: all 0.3s ease;
}

.strainsense-navbar .megamenu a:hover {
	color: #ffffff;
	background-color: transparent;
}

/* Override for the top-level mega menu nav link - give it proper spacing */
.strainsense-navbar .megamenu > a.dropdown-toggle {
	padding: 10px 24px !important;
}

/* Hide the undefined div that Bootstrap creates inside hidden-html - exact path */
.strainsense-navbar .megamenu .mega-menu-left-nav .change-mega-menu-child .hidden-html div[style*="display: block"] {
	display: none !important;
}

.strainsense-navbar .megamenu .htmlBlockTitle,
.strainsense-navbar .megamenu h6 {
	color: var(--branding-primary) !important;
	text-transform: capitalize !important;
	font-weight: 600;
	margin-bottom: 12px;
}

/* Add some padding and structure to mega menu content */
.strainsense-navbar .megamenu {
	padding: 20px;
}


/* Also add scrolling to mega menu children wrapper */
.strainsense-navbar .mega-menu-side-children-wrapper {
	max-height: 75vh;
	overflow-y: auto;
}

.strainsense-navbar .mega-menu-side-children-wrapper::-webkit-scrollbar {
	width: 6px;
}

.strainsense-navbar .mega-menu-side-children-wrapper::-webkit-scrollbar-track {
	background: var(--branding-gray-200);
	border-radius: 3px;
}

.strainsense-navbar .mega-menu-side-children-wrapper::-webkit-scrollbar-thumb {
	background: var(--branding-primary);
	border-radius: 3px;
}

.strainsense-navbar .mega-menu-side-children-wrapper::-webkit-scrollbar-thumb:hover {
	background: var(--branding-primary-hover);
}

/* Promotion Static Block Content - 2 Column Layout */
.strainsense-navbar .promotion-static-block-content {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
	padding: 20px;
	width: 100%;
}

.strainsense-navbar .promotion-static-block-content .card,
.strainsense-navbar .promotion-static-block-content .resource-card {
	width: 100%;
	height: 100%;
}

/* Add scrolling to left side navigation */
.strainsense-navbar .mega-menu-side-left-nav {
	max-height: 75vh;
	overflow-y: auto;
}

/* Hide scrollbar but keep scrolling functionality */
.strainsense-navbar .mega-menu-side-left-nav::-webkit-scrollbar {
	width: 0;
	display: none;
}

.strainsense-navbar .mega-menu-side-left-nav {
	scrollbar-width: none; /* Firefox */
	-ms-overflow-style: none; /* IE and Edge */
}

.strainsense-navbar .megamenu ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.strainsense-navbar .megamenu li {
	margin-bottom: 8px;
}

/* Fix product card layout in mega menu */
.strainsense-navbar .megamenu .row {
	margin: 0 -5px;
	flex-wrap: wrap;
}

.strainsense-navbar .megamenu .col-md-3,
.strainsense-navbar .megamenu .col-lg-3 {
	padding: 5px;
	flex: 0 0 33.333%;
	max-width: 33.333%;
}

.strainsense-navbar .megamenu .card {
	width: 100%;
	height: auto;
	border: 1px solid var(--branding-gray-300);
	border-radius: 6px;
	overflow: hidden;
	transition: all 0.3s ease;
}

.strainsense-navbar .megamenu .card:hover {
	border-color: var(--branding-primary);
	box-shadow: 0 2px 8px var(--branding-primary-transparent-15);
}

.strainsense-navbar .megamenu .card-body {
	padding: 8px;
}

.strainsense-navbar .megamenu .card-title {
	font-size: 12px;
	font-weight: 600;
	margin-bottom: 4px;
	color: var(--branding-text-primary);
	line-height: 1.2;
}

.strainsense-navbar .megamenu .card img {
	width: 100%;
	height: 80px;
	object-fit: contain;
	background: var(--branding-bg-light);
}

/* Mega menu responsive */
@media (max-width: 991.98px) {
	.mega-menu-side-wrapper {
		flex-direction: column;
	}

	.mega-menu-side-left-nav {
		width: 100%;
		margin-right: 0;
		margin-bottom: 1rem;
	}

	.mega-menu-side-children-wrapper {
		width: 100% !important;
	}

	.strainsense-navbar .megamenu {
		padding: 15px;
	}

	.strainsense-navbar .megamenu .col-md-3,
	.strainsense-navbar .megamenu .col-lg-3 {
		flex: 0 0 50%;
		max-width: 50%;
	}
}

@media (max-width: 576px) {
	.strainsense-navbar .megamenu .col-md-3,
	.strainsense-navbar .megamenu .col-lg-3 {
		flex: 0 0 100%;
		max-width: 100%;
	}
}

.strainsense-navbar.scrolled {
	box-shadow: 0 2px 15px var(--branding-black-transparent-10);
}

.strainsense-navbar .navbar-brand img {
	max-height: 50px;
	transition: transform 0.3s ease;
}

.strainsense-navbar .navbar-brand:hover img {
	transform: scale(1.02);
}

.strainsense-navbar .navbar-nav {
	align-items: center;
	gap: 50px;
}

.strainsense-navbar .navbar-collapse {
	justify-content: center;
}

.strainsense-navbar .navbar-nav.mx-auto {
	margin-left: 0 !important;
	margin-right: 0 !important;
}

.strainsense-navbar .nav-link {
	font-weight: 500;
	color: white;
	padding: 10px 24px!important;
	margin: 0;
	font-size: 18px;
	transition: all 0.3s ease;
	position: relative;
	text-transform: capitalize !important;
	display: flex;
	align-items: center;
}

.strainsense-navbar .nav-item:first-child .nav-link {
	margin-left: 0;
}

.strainsense-navbar .nav-item:last-child .nav-link {
	margin-right: 0;
}

.strainsense-navbar .nav-link:hover,
.strainsense-navbar .nav-link:focus,
.strainsense-navbar .dropdown-toggle:hover,
.strainsense-navbar .dropdown-toggle:focus {
	color: #FCA41C;
}

.strainsense-navbar .nav-link.active {
	color: #FCA41C;
	font-weight: 600;
}

/* Online Shop Button Styling */
.strainsense-navbar .nav-shop-button,
.strainsense-navbar .nav-shop-button:link,
.strainsense-navbar .nav-shop-button:visited {
	background: #FCA41C !important;
	color: white !important;
	border-radius: 8px;
	padding: 10px 24px !important;
	transition: all 0.3s ease;
}

.strainsense-navbar .nav-shop-button:hover,
.strainsense-navbar .nav-shop-button:focus,
.strainsense-navbar .nav-shop-button:active {
	background: #E89318 !important;
	color: white !important;
	transform: translateY(-2px);
	box-shadow: 0 4px 8px rgba(252, 164, 28, 0.3);
}

.strainsense-navbar .dropdown-menu {
	border: 1px solid var(--branding-black-transparent-10);
	box-shadow: 0 5px 15px var(--branding-black-transparent-10);
	border-radius: 0.5rem;
	padding: 0.5rem 0;
	margin-top: 0.5rem;
	background: var(--branding-bg-white);
	transition: none !important; /* Remove any transition delay */
}

/* Remove transition delays on desktop dropdown hover */
@media (min-width: 992px) {
	.strainsense-navbar .dropdown:hover > .dropdown-menu {
		display: block !important;
		transition: none !important;
	}

	.strainsense-navbar .dropdown-menu {
		display: none;
		transition: none !important;
	}

	/* BACKUP OF PREVIOUS MEGA MENU STYLES - TO REVERT, UNCOMMENT THIS BLOCK AND REMOVE THE NEW STYLES BELOW
	.strainsense-navbar .dropdown.megamenu,
	.strainsense-navbar .dropdown.normalmenu {
		position: static !important;
	}

	.strainsense-navbar .dropdown.megamenu .dropdown-menu,
	.strainsense-navbar .dropdown.normalmenu .dropdown-menu {
		width: 100% !important;
		left: 0 !important;
		right: 0 !important;
		top: 100% !important;
		border-radius: 0 !important;
		border-left: none !important;
		border-right: none !important;
		margin-top: 0 !important;
		z-index: 1000 !important;
	}

	.strainsense-navbar .megamenu {
		padding: 30px 0 !important;
	}

	.strainsense-navbar .megamenu .row {
		margin: 0 !important;
	}

	.strainsense-navbar .megamenu .col-md-3,
	.strainsense-navbar .megamenu .col-lg-3 {
		padding: 0 15px !important;
	}

	.strainsense-navbar .nav-item {
		position: relative;
		z-index: 1001 !important;
	}
	END OF BACKUP */

	/* CLEAN COMPACT MEGA MENU DESIGN */
	.strainsense-navbar .dropdown.megamenu,
	.strainsense-navbar .dropdown.normalmenu {
		position: static !important;
	}

	.strainsense-navbar .dropdown.megamenu .dropdown-menu,
	.strainsense-navbar .dropdown.normalmenu .dropdown-menu {
		width: 100% !important;
		max-width: none !important;
		position: absolute !important;
		left: 0 !important;
		right: 0 !important;
		transform: none !important;
		top: 100% !important;
		border: 1px solid var(--branding-gray-200) !important;
		border-top: none !important;
		border-radius: 0 0 8px 8px !important;
		box-shadow: 0 8px 24px var(--branding-black-transparent-08) !important;
		background: transparent !important;
		padding: 0 !important;
		margin-top: 0 !important;
		z-index: 1000 !important;
	}

	/* Megamenu Container - BD Sensors Style */
	.strainsense-navbar .megamenu {
		max-width: none !important;
		margin: 0 !important;
		padding: 0 !important;
		background: transparent !important;
	}

	.strainsense-navbar .megamenu .dropdown-menu {
		border: none;
		box-shadow: 0 4px 20px rgba(0,0,0,0.15);
		border-radius: 0;
		margin-top: -1px !important;
		padding: 0;
		overflow: visible !important;
	}

	/* Bridge the gap between nav item and dropdown */
	.strainsense-navbar .nav-item.dropdown:hover::after {
		content: '';
		position: absolute;
		bottom: -3px;
		left: 0;
		right: 0;
		height: 5px;
		background: transparent;
		z-index: 1001;
	}

	/* Base state for dropdown - hidden but ready */
	.strainsense-navbar .megamenu .dropdown-menu {
		display: block !important;
		visibility: hidden !important;
		opacity: 0 !important;
		pointer-events: auto !important;
		transition: opacity 0.15s ease-in-out, visibility 0s linear 0.5s !important;
	}

	/* Show dropdown on hover with NO delay */
	.strainsense-navbar .dropdown.megamenu:hover .dropdown-menu,
	.strainsense-navbar .megamenu.dropdown:hover .dropdown-menu,
	.strainsense-navbar .megamenu .dropdown-menu:hover {
		visibility: visible !important;
		opacity: 1 !important;
		transition-delay: 0s !important;
	}

	/* Ensure parent dropdown container extends to include the dropdown menu */
	.strainsense-navbar .megamenu.dropdown {
		position: static !important;
	}

	/* BD Sensors Style Mega Menu - Two Panel Layout */
	.strainsense-navbar .mega-menu-side-wrapper {
		display: flex !important;
		width: 100% !important;
		min-height: 400px;
		overflow: visible !important;
		position: relative;
		border-bottom: 5px solid var(--mega-menu-primary);
		transition: border-color 0.3s ease;
	}

	/* Color Scheme Variables - Default to Red */
	.strainsense-navbar .mega-menu-side-wrapper {
		--mega-menu-primary: #E31E26;
		--mega-menu-primary-dark: #C01920;
		--mega-menu-stripe-1: rgba(227, 30, 38, 0.7);
		--mega-menu-stripe-2: rgba(227, 30, 38, 0.3);
	}

	/* Green Color Scheme */
	.strainsense-navbar .mega-menu-side-wrapper.color-green {
		--mega-menu-primary: #A3C300;
		--mega-menu-primary-dark: #8BAD00;
		--mega-menu-stripe-1: rgba(163, 195, 0, 0.7);
		--mega-menu-stripe-2: rgba(163, 195, 0, 0.3);
	}

	/* Light Blue Color Scheme */
	.strainsense-navbar .mega-menu-side-wrapper.color-light-blue {
		--mega-menu-primary: #009DDF;
		--mega-menu-primary-dark: #0087BF;
		--mega-menu-stripe-1: rgba(0, 157, 223, 0.7);
		--mega-menu-stripe-2: rgba(0, 157, 223, 0.3);
	}

	/* Red Color Scheme (Branding) */
	.strainsense-navbar .mega-menu-side-wrapper.color-red {
		--mega-menu-primary: #E31E26;
		--mega-menu-primary-dark: #C01920;
		--mega-menu-stripe-1: rgba(227, 30, 38, 0.7);
		--mega-menu-stripe-2: rgba(227, 30, 38, 0.3);
	}

	/* Orange Color Scheme (Branding Secondary) */
	.strainsense-navbar .mega-menu-side-wrapper.color-orange {
		--mega-menu-primary: #F47920;
		--mega-menu-primary-dark: #D6691C;
		--mega-menu-stripe-1: rgba(244, 121, 32, 0.7);
		--mega-menu-stripe-2: rgba(244, 121, 32, 0.3);
	}

	/* Grey Color Scheme */
	.strainsense-navbar .mega-menu-side-wrapper.color-grey {
		--mega-menu-primary: #4B4C55;
		--mega-menu-primary-dark: #3A3B42;
		--mega-menu-stripe-1: rgba(75, 76, 85, 0.7);
		--mega-menu-stripe-2: rgba(75, 76, 85, 0.3);
	}

	/* Dark Blue Color Scheme */
	.strainsense-navbar .mega-menu-side-wrapper.color-dark-blue {
		--mega-menu-primary: #045493;
		--mega-menu-primary-dark: #03437A;
		--mega-menu-stripe-1: rgba(4, 84, 147, 0.7);
		--mega-menu-stripe-2: rgba(4, 84, 147, 0.3);
	}

	/* Black Color Scheme */
	.strainsense-navbar .mega-menu-side-wrapper.color-black {
		--mega-menu-primary: #000000;
		--mega-menu-primary-dark: #1a1a1a;
		--mega-menu-stripe-1: rgba(0, 0, 0, 0.7);
		--mega-menu-stripe-2: rgba(0, 0, 0, 0.3);
	}

	/* Left Sidebar Navigation - Color Coded Panel with Diagonal Right Edge */
	.strainsense-navbar .mega-menu-side-left-nav {
		display: block !important;
		width: 30% !important;
		background: linear-gradient(135deg, #E31E26 0%, #C01920 100%) !important;
		padding: 0 !important;
		margin: 0 !important;
		flex-shrink: 0;
		overflow-y: auto;
		max-height: 600px;
		position: relative;
		z-index: 2;
		clip-path: polygon(0 0, 100% 0, 87% 100%, 0% 100%);
	}

	/* Create a pseudo-element for smooth color transitions */
	.strainsense-navbar .mega-menu-side-left-nav::before {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: linear-gradient(135deg, #E31E26 0%, #C01920 100%);
		opacity: 1;
		transition: opacity 0.4s ease;
		z-index: 0;
		pointer-events: none;
	}

	/* Color overlays - apply to both container and ::before */
	.strainsense-navbar .mega-menu-side-left-nav.color-green {
		background: linear-gradient(135deg, #A3C300 0%, #8BAD00 100%) !important;
	}
	.strainsense-navbar .mega-menu-side-left-nav.color-green::before {
		background: linear-gradient(135deg, #A3C300 0%, #8BAD00 100%);
		opacity: 1;
	}

	.strainsense-navbar .mega-menu-side-left-nav.color-light-blue {
		background: linear-gradient(135deg, #009DDF 0%, #0087BF 100%) !important;
	}
	.strainsense-navbar .mega-menu-side-left-nav.color-light-blue::before {
		background: linear-gradient(135deg, #009DDF 0%, #0087BF 100%);
		opacity: 1;
	}

	.strainsense-navbar .mega-menu-side-left-nav.color-red {
		background: linear-gradient(135deg, #E31E26 0%, #C01920 100%) !important;
	}
	.strainsense-navbar .mega-menu-side-left-nav.color-red::before {
		background: linear-gradient(135deg, #E31E26 0%, #C01920 100%);
		opacity: 1;
	}

	.strainsense-navbar .mega-menu-side-left-nav.color-orange {
		background: linear-gradient(135deg, #F47920 0%, #D66A1C 100%) !important;
	}
	.strainsense-navbar .mega-menu-side-left-nav.color-orange::before {
		background: linear-gradient(135deg, #F47920 0%, #D66A1C 100%);
		opacity: 1;
	}

	.strainsense-navbar .mega-menu-side-left-nav.color-grey {
		background: linear-gradient(135deg, #4B4C55 0%, #3D3E45 100%) !important;
	}
	.strainsense-navbar .mega-menu-side-left-nav.color-grey::before {
		background: linear-gradient(135deg, #4B4C55 0%, #3D3E45 100%);
		opacity: 1;
	}

	.strainsense-navbar .mega-menu-side-left-nav.color-dark-blue {
		background: linear-gradient(135deg, #045493 0%, #03457A 100%) !important;
	}
	.strainsense-navbar .mega-menu-side-left-nav.color-dark-blue::before {
		background: linear-gradient(135deg, #045493 0%, #03457A 100%);
		opacity: 1;
	}

	.strainsense-navbar .mega-menu-side-left-nav.color-black {
		background: linear-gradient(135deg, #000000 0%, #1A1A1A 100%) !important;
	}
	.strainsense-navbar .mega-menu-side-left-nav.color-black::before {
		background: linear-gradient(135deg, #000000 0%, #1A1A1A 100%);
		opacity: 1;
	}

	/* ========================================================================
	   🔒 LOCKED - DIAGONAL STRIPES - DO NOT MODIFY - WORKING PERFECTLY 🔒
	   ========================================================================
	   These stripes sit on the diagonal edge of the left panel and change
	   color dynamically based on the active category. If these ever break,
	   restore from this exact configuration.

	   BACKUP CONFIGURATION (Working as of 2025):
	   - First stripe: 70% opacity, z-index: 5
	   - Second stripe: 30% opacity, z-index: 4
	   - Both use clip-path with precise polygon calculations
	   - Colors from CSS variables: --mega-menu-stripe-1 and --mega-menu-stripe-2
	   ======================================================================== */

	/* First diagonal stripe - 70% opacity - sits on diagonal edge */
	.strainsense-navbar .mega-menu-side-wrapper::before {
		content: '';
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		width: 100%;
		background: var(--mega-menu-stripe-1);
		clip-path: polygon(30% 0, calc(30% + 15px) 0, calc(26.1% + 15px) 100%, 26.1% 100%);
		z-index: 5;
		pointer-events: none;
		transition: background 0.3s ease;
	}

	/* Second diagonal stripe - 30% opacity - sits on diagonal edge */
	.strainsense-navbar .mega-menu-side-wrapper::after {
		content: '';
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		width: 100%;
		background: var(--mega-menu-stripe-2);
		clip-path: polygon(calc(30% + 15px) 0, calc(30% + 30px) 0, calc(26.1% + 30px) 100%, calc(26.1% + 15px) 100%);
		z-index: 4;
		pointer-events: none;
		transition: background 0.3s ease;
	}

	/* ========================================================================
	   END OF LOCKED STRIPE SECTION
	   ======================================================================== */

	/* Ensure content is above the diagonal stripe */
	.strainsense-navbar .mega-menu-side-left-nav ul {
		position: relative;
		z-index: 10;
		list-style: none;
		padding: 0;
		margin: 0;
		background: transparent !important;
	}

	.strainsense-navbar .mega-menu-side-left-nav li {
		margin: 0;
		border-bottom: 1px solid rgba(255, 255, 255, 0.1);
		border-left: 4px solid transparent;
		transition: all 0.2s ease;
		background: transparent !important;
	}

	.strainsense-navbar .mega-menu-side-left-nav li:hover {
		cursor: pointer;
		background: var(--mega-menu-stripe-1) !important; /* 70% opacity stripe color */
		border-left: 4px solid white;
		box-shadow: inset 0 0 20px rgba(255, 255, 255, 0.1);
	}

	.strainsense-navbar .mega-menu-side-left-nav li:hover a {
		background: transparent !important;
		color: white !important;
	}

	/* Active state for hovered parent category */
	.strainsense-navbar .mega-menu-side-left-nav li.active {
		border-left: 4px solid white;
		background: var(--mega-menu-stripe-1) !important; /* 70% opacity stripe color */
		box-shadow: inset 0 0 20px rgba(255, 255, 255, 0.15);
	}

	.strainsense-navbar .mega-menu-side-left-nav li.active a {
		background: transparent !important;
		color: white !important;
	}

	.strainsense-navbar .mega-menu-side-left-nav li a {
		display: flex !important;
		align-items: center;
		padding: 12px 20px 12px 24px !important;
		color: #ffffff !important;
		font-size: 16px !important;
		font-weight: 500 !important;
		text-decoration: none !important;
		transition: all 0.2s ease !important;
		gap: 12px;
		width: 100%;
		box-sizing: border-box;
		background: transparent !important;
	}

	/* Category icon images */
	.strainsense-navbar .mega-menu-side-left-nav li a img.category-icon {
		width: 40px;
		height: 40px;
		object-fit: contain;
		background: rgba(255, 255, 255, 0.9);
		border-radius: 50%;
		flex-shrink: 0;
		margin-left: 16px;
		padding: 4px;
	}

	/* Hide the ::before pseudo-element when image exists */
	.strainsense-navbar .mega-menu-side-left-nav li a:has(img.category-icon):before {
		display: none;
	}

	/* Fallback circle if no image */
	.strainsense-navbar .mega-menu-side-left-nav li a:before {
		content: '';
		display: inline-block;
		width: 40px;
		height: 40px;
		background: rgba(255, 255, 255, 0.2);
		border-radius: 50%;
		flex-shrink: 0;
		margin-left: 16px;
	}

	.strainsense-navbar .mega-menu-side-left-nav li:hover a {
		color: #ffffff !important;
		padding-left: 30px !important;
		background: transparent !important;
	}

	/* Keep all parent categories visible - no dimming for easy navigation */

	/* Subcategories container under each parent on left */
	.strainsense-navbar .mega-menu-side-left-nav .hidden-html {
		display: none;
		background: transparent !important;
		padding: 0;
	}

	/* Removed hover display - now controlled by JavaScript click events */

	/* View All link in left sidebar */
	.strainsense-navbar .mega-menu-side-left-nav .hidden-html .view-all-link {
		display: flex !important;
		align-items: center;
		padding: 12px 20px 12px 57px !important;
		color: #ffffff !important;
		font-size: 14px !important;
		font-weight: 700 !important;
		text-decoration: none !important;
		background: transparent !important;
		border-bottom: 2px solid rgba(255, 255, 255, 0.2);
		transition: all 0.2s ease !important;
	}

	.strainsense-navbar .mega-menu-side-left-nav .hidden-html .view-all-link:hover {
		background: transparent !important;
		padding-left: 62px !important;
	}

	/* Subcategory links styling */
	.strainsense-navbar .mega-menu-side-left-nav .hidden-html a:not(.view-all-link) {
		display: flex !important;
		padding: 12px 20px 12px 52px !important;
		font-size: 14px !important;
		border-bottom: 1px solid rgba(255, 255, 255, 0.05);
		color: #ffffff !important;
		text-decoration: none !important;
		background: transparent !important;
	}

	.strainsense-navbar .mega-menu-side-left-nav .hidden-html a:before {
		display: none !important;
	}

	.strainsense-navbar .mega-menu-side-left-nav .hidden-html a:not(.view-all-link):hover {
		background: transparent !important;
		padding-left: 57px !important;
	}

	/* Middle Container: Subcategories (45%) */
	.strainsense-navbar .mega-menu-side-middle {
		display: block !important;
		flex: 1 !important;
		width: 45% !important;
		padding: 30px !important;
		padding-left: 50px !important; /* Extra spacing from left panel */
		background: transparent !important;
		overflow-y: auto;
		max-height: 600px;
		position: relative;
		z-index: 3;
	}

	/* Middle container stays transparent regardless of parent category */
	.strainsense-navbar .mega-menu-side-wrapper.color-green .mega-menu-side-middle,
	.strainsense-navbar .mega-menu-side-wrapper.color-light-blue .mega-menu-side-middle,
	.strainsense-navbar .mega-menu-side-wrapper.color-red .mega-menu-side-middle,
	.strainsense-navbar .mega-menu-side-wrapper.color-orange .mega-menu-side-middle,
	.strainsense-navbar .mega-menu-side-wrapper.color-grey .mega-menu-side-middle,
	.strainsense-navbar .mega-menu-side-wrapper.color-dark-blue .mega-menu-side-middle,
	.strainsense-navbar .mega-menu-side-wrapper.color-black .mega-menu-side-middle {
		background: transparent !important;
	}

	/* Right Container: Promotion Static Block (25%) */
	.strainsense-navbar .mega-menu-side-right {
		display: block !important;
		width: 25% !important;
		padding: 30px !important;
		background: #f8f9fa !important;
		overflow-y: auto;
		max-height: 600px;
		flex-shrink: 0;
	}

	/* Hide promotion panel when child category has no promotion and is active */
	.strainsense-navbar .mega-menu-promotion.no-promotion.active {
		display: none !important;
	}

	/* Hide entire right panel when it has the hide-panel class */
	.strainsense-navbar .mega-menu-side-right.hide-panel {
		display: none !important;
	}

	/* Subcategory Grid Styles */
	.strainsense-navbar .mega-menu-subcategories {
		display: none;
	}

	.strainsense-navbar .mega-menu-subcategories.active {
		display: block !important;
	}

	.strainsense-navbar .subcategory-grid {
		display: block !important;
		padding: 0 !important;
		margin: 0 !important;
	}

	.strainsense-navbar .mega-menu-side-middle .subcategory-item,
	.strainsense-navbar .subcategory-grid .subcategory-item,
	.strainsense-navbar a.subcategory-item {
		display: flex !important;
		flex-direction: row !important;
		align-items: center !important;
		gap: 15px;
		text-decoration: none !important;
		color: var(--branding-gray-700) !important;
		padding: 18px 15px; /* Increased vertical padding for more space between items */
		transition: all 0.2s ease;
		background: transparent !important;
		border-bottom: 1px solid #f0f0f0;
	}

	.strainsense-navbar .subcategory-item:hover {
		background: #f8f9fa !important;
		color: var(--branding-primary) !important;
	}

	.strainsense-navbar .subcategory-image {
		width: 50px !important;
		height: 50px !important;
		flex-shrink: 0 !important;
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		border-radius: 50% !important;
		background: white !important;
		padding: 8px !important;
		border: 2px solid var(--mega-menu-stripe-1) !important; /* Uses 70% opacity stripe color */
		transition: border-color 0.3s ease !important;
	}

	.strainsense-navbar .subcategory-image img {
		max-width: 100% !important;
		max-height: 100% !important;
		object-fit: contain !important;
	}

	.strainsense-navbar .subcategory-name {
		font-size: 16px !important;
		font-weight: 500 !important;
		line-height: 1.4 !important;
		color: var(--branding-gray-700) !important;
		transition: color 0.2s ease !important;
		flex: 1 !important;
		display: inline-block !important;
	}

	.strainsense-navbar .subcategory-item:hover .subcategory-name {
		color: var(--branding-primary) !important;
	}

	/* Promotion Block Visibility */
	.strainsense-navbar .mega-menu-promotion {
		display: none;
	}

	.strainsense-navbar .mega-menu-promotion.active {
		display: block !important;
	}

	/* Old children wrapper - deprecated */
	.strainsense-navbar .mega-menu-side-children-wrapper {
		display: none !important;
		background: #ffffff;
		padding: 30px !important;
		max-height: 500px !important;
		overflow-y: auto !important;
		position: relative;
		z-index: 2;
	}

	/* Hide child divs by default, JavaScript will show the active one */
	.strainsense-navbar .mega-menu-side-child {
		display: none;
	}

	/* Show first child by default on initial load */
	.strainsense-navbar .mega-menu-side-child:first-child {
		display: block;
	}

	/* View All button styling */
	.strainsense-navbar .view-all-category {
		padding: 15px 20px 10px 20px;
	}

	.strainsense-navbar .view-all-category .btn {
		display: inline-flex;
		align-items: center;
		font-weight: 600;
		border-width: 2px;
		transition: all 0.3s ease;
	}

	.strainsense-navbar .view-all-category .btn:hover {
		background: rgba(255, 255, 255, 0.2);
		border-color: rgba(255, 255, 255, 1);
		transform: translateX(5px);
	}

	/* Active state when hovering left nav item */

	/* Promotional Block Styling - Right Panel */
	.mega-menu-promo {
		max-width: 400px;
		background-color: #fff;
		border-radius: 8px;
		padding: 10px;
	}

	.mega-menu-promo .promo-thumbnail {
		width: 100%;
		height: 200px;
		object-fit: cover;
		border-radius: 8px;
		margin-bottom: 15px;
	}

	.mega-menu-promo .promo-title {
		font-size: 18px;
		font-weight: bold;
		color: #333;
		margin-bottom: 10px;
		line-height: 1.3;
	}

	.mega-menu-promo .promo-text {
		font-size: 14px;
		color: #666;
		line-height: 1.6;
		margin-bottom: 15px;
	}

	.mega-menu-promo .promo-link {
		display: inline-block;
		color: var(--branding-primary);
		font-weight: 600;
		font-size: 14px;
		text-decoration: none;
		transition: color 0.2s;
	}

	.mega-menu-promo .promo-link:hover {
		color: var(--branding-primary-hover);
		text-decoration: underline;
	}

	/* Right Content Area - Product Cards and Content */
	.strainsense-navbar .mega-menu-side-child .row {
		display: grid !important;
		grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
		gap: 15px;
		margin: 0 !important;
	}

	.strainsense-navbar .megamenu .card {
		border: 1px solid var(--branding-gray-300) !important;
		border-radius: 8px !important;
		background: #ffffff !important;
		transition: all 0.3s ease !important;
		overflow: hidden !important;
		height: 100%;
	}

	.strainsense-navbar .megamenu .card:hover {
		border-color: var(--branding-primary) !important;
		box-shadow: 0 4px 12px rgba(0,0,0,0.1) !important;
		transform: translateY(-2px) !important;
	}

	.strainsense-navbar .megamenu .card-body {
		padding: 12px !important;
	}

	.strainsense-navbar .megamenu .card img {
		width: 100% !important;
		height: 120px !important;
		object-fit: contain !important;
		background: var(--branding-bg-light);
		padding: 10px;
	}


	/* Clean category headers - no Zeus styling */
	.strainsense-navbar .megamenu .htmlBlockTitle,
	.strainsense-navbar .megamenu h6 {
		display: none !important;
	}

	/* Simple category headers */
	.strainsense-navbar .megamenu .card-title {
		margin-bottom: 10px !important;
		padding: 0 !important;
	}

	.strainsense-navbar .megamenu .card-title a {
		font-size: 14px !important;
		font-weight: 600 !important;
		color: var(--branding-gray-800) !important;
		padding: 0 !important;
		margin: 0 !important;
		text-decoration: none !important;
		line-height: 1.2 !important;
		display: block !important;
	}


	.strainsense-navbar .megamenu .card-title a:hover {
		color: var(--branding-primary) !important;
		transform: none !important;
	}

	/* Column layout for product items within right content area */
	.strainsense-navbar .mega-menu-side-child .col-md-3,
	.strainsense-navbar .mega-menu-side-child .col-lg-3,
	.strainsense-navbar .mega-menu-side-child .col-12,
	.strainsense-navbar .mega-menu-side-child [class*="col-"] {
		padding: 0 !important;
		margin: 0 !important;
	}

	/* Show all menu items as simple list */
	.strainsense-navbar .megamenu ul ul {
		display: block !important;
		visibility: visible !important;
		opacity: 1 !important;
		position: static !important;
		background: none !important;
		box-shadow: none !important;
		padding-left: 0 !important;
		margin: 0 !important;
	}

	/* Ensure subcategory links are flush with their parent title */
	.strainsense-navbar .megamenu .card-text {
		padding: 0 !important;
		margin: 0 !important;
	}

	/* Remove any wrapper padding that might exist */
	.strainsense-navbar .megamenu .card-text > * {
		padding-left: 0 !important;
		padding-right: 0 !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	/* Remove padding from nav-level-2 and lower-level classes */
	.strainsense-navbar .megamenu .nav-level-2,
	.strainsense-navbar .megamenu .lower-level {
		padding: 0 !important;
		margin: 0 !important;
	}

	/* Ensure all nested levels have no padding */
	.strainsense-navbar .megamenu [class*="nav-level"] {
		padding-left: 0 !important;
		padding-right: 0 !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	/* Compact subcategory link styling */
	.strainsense-navbar .megamenu a {
		display: block !important;
		padding: 3px 0 !important;
		margin: 0 !important;
		color: var(--branding-text-secondary) !important;
		text-decoration: none !important;
		font-size: 14px !important;
		line-height: 1.3 !important;
		transition: color 0.2s ease !important;
		background: none !important;
		border-radius: 0 !important;
	}

	.strainsense-navbar .megamenu a:hover {
		color: #ffffff !important;
		background: transparent !important;
		transform: none !important;
	}

	/* Override for the top-level mega menu nav link - give it proper spacing like other nav items */
	.strainsense-navbar .megamenu > a.dropdown-toggle {
		padding: 10px 24px !important;
	}

	/* Reset card title link padding */
	.strainsense-navbar .megamenu .card-title a {
		padding: 0 !important;
		transform: none !important;
	}

	.strainsense-navbar .megamenu .card-title a:hover {
		transform: none !important;
	}

	/* Hide all children by default, JavaScript will show the active one */
	.strainsense-navbar .megamenu .mega-menu-side-child {
		display: none;
	}

	/* Show first child by default on initial load */
	.strainsense-navbar .megamenu .mega-menu-side-child:first-child {
		display: block;
	}

	/* Clean list styling */
	.strainsense-navbar .megamenu ul {
		list-style: none !important;
		padding: 0 !important;
		margin: 0 !important;
	}

	.strainsense-navbar .megamenu li {
		margin: 0 !important;
		padding: 0 !important;
	}

	/* Force all list items and their children to have no left padding */
	.strainsense-navbar .megamenu ul li,
	.strainsense-navbar .megamenu ul li > * {
		padding-left: 0 !important;
		margin-left: 0 !important;
	}

	/* Ensure nav items are clickable and have consistent font size */
	.strainsense-navbar .nav-item {
		position: relative;
		z-index: 1001 !important;
	}

	/* Ensure consistent font size and styling for all nav items including dropdowns */
	.strainsense-navbar .nav-link,
	.strainsense-navbar .dropdown-toggle,
	.strainsense-navbar span.nav-link,
	.strainsense-navbar .nav-link.dropdown-toggle {
		font-size: 18px !important;
		font-weight: 500 !important;
		color: #ffffff !important;
		display: flex !important;
		align-items: center !important;
	}

	/* Make sure dropdown toggles inherit the same styles */
	.strainsense-navbar .dropdown-toggle.nav-link {
		font-weight: 500 !important;
		color: #ffffff !important;
	}

	/* Align all nav items on the same baseline */
	.strainsense-navbar .navbar-nav {
		align-items: center !important;
		gap: 20px !important;
	}

	/* Special styling for mega-menu cards if present */
	.strainsense-navbar .megamenu .card {
		border: none !important;
		background: var(--branding-bg-light) !important;
		transition: all 0.3s ease !important;
	}

	.strainsense-navbar .megamenu .card:hover {
		background: var(--branding-bg-white) !important;
		box-shadow: 0 5px 15px var(--branding-black-transparent-10) !important;
	}

	.navbar-expand-lg .navbar-collapse {
		justify-content: start !important;
	}
}

/* Laptop responsive adjustments */
@media (min-width: 992px) and (max-width: 1411px) {
	.strainsense-navbar .navbar-nav {
		gap: 0px !important;
	}

	.strainsense-navbar .nav-link,
	.strainsense-navbar .dropdown-toggle,
	.strainsense-navbar span.nav-link,
	.strainsense-navbar .nav-link.dropdown-toggle {
		font-size: 16px !important;
	}
}

.strainsense-navbar .dropdown-item {
	padding: 0.5rem 1.5rem;
	font-weight: 400;
	color: var(--branding-gray-700);
	transition: none !important; /* Remove transition for instant response */
	text-transform: capitalize !important;
}

/* Desktop only hover states */
@media (min-width: 992px) {
	.strainsense-navbar .dropdown-item:hover,
	.strainsense-navbar .dropdown-item:focus {
		background-color: var(--branding-primary-transparent-10);
		color: var(--branding-primary);
	}
}


.strainsense-navbar .btn {
	font-family: "Geist Sans", sans-serif;
	font-weight: 500;
	font-size: 15px;
	padding: 15px 30px;
	border-radius: var(--branding-radius);
	transition: all 0.3s ease;
	margin-left: 8px;
}

.strainsense-navbar .btn:hover {
	transform: translateY(-1px);
	box-shadow: 0 4px 12px var(--branding-black-transparent-15);
	text-decoration: none;
}

.strainsense-navbar .btn-outline-primary {
	color: var(--branding-primary) !important;
	border-color: var(--branding-primary);
	background-color: var(--branding-bg-white) !important;
}

.strainsense-navbar .btn-outline-primary:hover {
	background-color: var(--branding-primary) !important;
	border-color: var(--branding-primary);
	color: var(--branding-text-light) !important;
}

.strainsense-navbar .btn-primary {
	background-color: var(--branding-primary) !important;
	border-color: var(--branding-primary);
	color: var(--branding-text-light) !important;
}

.strainsense-navbar .btn-primary:hover {
	background-color: var(--branding-primary-hover) !important;
	border-color: var(--branding-primary-hover);
	color: var(--branding-text-light) !important;
}

.strainsense-navbar .btn-primary:focus,
.strainsense-navbar .btn-outline-primary:focus {
	box-shadow: 0 0 0 3px var(--branding-primary-transparent-25);
}

/* Additional overrides to ensure button colors work correctly */
.strainsense-navbar .btn-primary:active,
.strainsense-navbar .btn-primary:active:hover,
.strainsense-navbar .btn-primary:active:focus {
	background-color: var(--branding-secondary) !important;
	border-color: var(--branding-secondary) !important;
	color: var(--branding-text-dark) !important;
}
.strainsense-navbar .btn-primary:visited {
	background-color: var(--branding-primary) !important;
	color: var(--branding-text-light) !important;
}

.strainsense-navbar .btn-outline-primary:active,
.strainsense-navbar .btn-outline-primary:visited {
	color: var(--branding-primary) !important;
	background-color: var(--branding-bg-white) !important;
}

.strainsense-navbar a.btn-primary,
.strainsense-navbar a.btn-outline-primary {
	text-decoration: none !important;
}

/* Mobile Navigation Styles */
.strainsense-navbar .navbar-toggler {
	border: 1px solid var(--branding-black-transparent-10);
	padding: 0.25rem 0.5rem;
}

.strainsense-navbar .navbar-toggler-icon {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
	width: 2em;
	height: 2em;
}

.strainsense-navbar .navbar-toggler:focus {
	box-shadow: 0 0 0 0.2rem var(--branding-primary-transparent-25);
}

@media (max-width: 991.98px) {
	.navbar,
	nav,
	.navbar-light,
	.navbar-expand-lg,
	#mainNavbar,
	nav.navbar,
	nav.navbar-light,
	nav.navbar-expand-lg,
	nav#mainNavbar,
	.strainsense-navbar,
	nav.strainsense-navbar {
		background: var(--branding-bg-white) !important;
		background-color: var(--branding-bg-white) !important;
	}

	.strainsense-navbar .container {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
	}

	.strainsense-navbar .navbar-brand {
		flex: 0 0 auto;
		margin-right: auto;
	}

	.strainsense-navbar .navbar-toggler {
		flex: 0 0 auto;
		margin-left: auto;
	}

	.strainsense-navbar .navbar-collapse {
		background: var(--branding-bg-white);
		border-radius: 0.5rem;
		margin-top: 1rem;
		padding: 1rem;
		box-shadow: 0 5px 15px var(--branding-black-transparent-10);
		border: 1px solid var(--branding-black-transparent-10);
		flex-basis: 100%;
		width: 100%;
	}

	.strainsense-navbar .navbar-nav {
		text-align: center;
		gap: 0;
	}

	.strainsense-navbar .nav-link {
		margin: 0.25rem 0;
		padding: 0.75rem 1rem;
		font-size: 16px;
	}

	.strainsense-navbar .d-flex {
		flex-direction: column;
		align-items: center;
		margin-top: 1rem;
	}

	.strainsense-navbar .btn {
		margin: 0.25rem 0;
		width: auto;
		min-width: 120px;
	}

	.strainsense-navbar .btn.d-none.d-md-block {
		display: inline-flex !important;
	}

	/* Hide nester flyout dropdowns on mobile */
	.strainsense-navbar .nav-item.hover-flyout > div,
	.strainsense-navbar .hidden-html {
		display: none!important;
		visibility: hidden!important;
		opacity: 0!important;
		pointer-events: none!important;
	}
	.strainsense-navbar .hover-flyout > a {
		pointer-events: auto!important;
	}
	.strainsense-navbar .mega-menu-side-children-wrapper {
		display: none;
	}
	.mega-menu-side-left-nav {
		background-color: #fff!important;
	}
}

/* ===== HOMEPAGE STYLES ===== */

/* Hero Section */
.hero-section {
	position: relative;
	background: linear-gradient(135deg, var(--branding-white-transparent-95), rgba(248, 249, 250, 0.9));
	min-height: 50vh;
	overflow: hidden;
	margin-top: 0;
}

.hero-background {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
}

.hero-shape-1 {
	position: absolute;
	top: -10%;
	right: -5%;
	width: 600px;
	height: 600px;
	background: var(--branding-gradient-light);
	border-radius: 50%;
	opacity: 0.6;
}

.hero-shape-2 {
	position: absolute;
	bottom: -15%;
	left: -10%;
	width: 800px;
	height: 800px;
	background: var(--branding-gradient-light);
	border-radius: 50%;
	opacity: 0.4;
}

.hero-title {
	font-size: 3.5rem;
	font-weight: 700;
	line-height: 1.2;
	margin-bottom: 1.5rem;
}

@media (min-width: 992px) {
	.hero-title {
		font-size: 38px;
	}
}

.hero-subtitle {
	font-size: 1.25rem;
	color: var(--branding-gray-600);
	line-height: 1.6;
	max-width: 500px;
}

.gradient-text {
	background: var(--branding-gradient-primary);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}

.bg-primary-light {
	background-color: var(--branding-primary-transparent-10) !important;
}

.bg-secondary-light {
	background-color: var(--branding-secondary-transparent-10) !important;
}

.hero-buttons .btn {
	font-weight: 600;
	padding: 15px 30px;
	border-radius: var(--branding-radius);
}

.stat-number {
	font-size: 2rem;
	font-weight: 700;
	color: var(--branding-primary);
	line-height: 1;
}

.stat-label {
	font-size: 0.875rem;
	color: var(--branding-gray-600);
	margin-top: 0.25rem;
}

.hero-image-container {
	position: relative;
}

.hero-image {
	border-radius: var(--branding-radius-lg);
	box-shadow: var(--branding-shadow-lg);
	position: relative;
	z-index: 2;
}

.floating-element {
	position: absolute;
	background: var(--branding-gradient-primary);
	border-radius: 50%;
	z-index: 1;
}

.floating-element-1 {
	width: 80px;
	height: 80px;
	top: 20%;
	left: -20px;
	opacity: 0.8;
	animation: float 6s ease-in-out infinite;
}

.floating-element-2 {
	width: 60px;
	height: 60px;
	bottom: 20%;
	right: -30px;
	opacity: 0.6;
	animation: float 8s ease-in-out infinite reverse;
}

@keyframes float {
	0%, 100% { transform: translateY(0px); }
	50% { transform: translateY(-20px); }
}

/* Section Styles */
.section-title {
	font-size: 32px;
	font-weight: 700;
	line-height: 1.2;
}

.section-subtitle {
	font-size: 1.125rem;
	color: var(--branding-gray-600);
	line-height: 1.6;
	max-width: 600px;
}

/* Service Cards */
.service-card {
	background: var(--branding-bg-white);
	border-radius: var(--branding-radius-lg);
	padding: 2rem;
	box-shadow: var(--branding-shadow);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	display: flex;
	flex-direction: column;
}

.service-card:hover {
	transform: translateY(-10px);
	box-shadow: var(--branding-shadow-lg);
}

.service-icon {
	width: 60px;
	height: 60px;
	background: var(--branding-gradient-light);
	border-radius: var(--branding-radius);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 1.5rem;
}

.service-icon i {
	font-size: 1.5rem;
	color: var(--branding-primary);
}

.service-title {
	font-size: 1.5rem;
	font-weight: 600;
	margin-bottom: 1rem;
	color: var(--dark-color);
}

.service-description {
	color: var(--branding-gray-600);
	line-height: 1.6;
	margin-bottom: 1.5rem;
}

.service-features {
	list-style: none;
	padding: 0;
	margin-bottom: 2rem;
	flex-grow: 1;
}

.service-features li {
	margin-bottom: 0.75rem;
	display: flex;
	align-items: center;
}

.service-features a {
	color: var(--branding-gray-700);
	text-decoration: none;
}

.service-features a:hover {
	color: var(--branding-primary);
}

/* Capability Cards */
.capability-card {
	background: var(--branding-bg-white);
	border-radius: var(--branding-radius);
	padding: 1.5rem;
	box-shadow: var(--branding-shadow-sm);
	transition: transform 0.3s ease;
}

.capability-card:hover {
	transform: translateY(-5px);
}

.capability-icon {
	width: 50px;
	height: 50px;
	background: var(--branding-gradient-light);
	border-radius: var(--branding-radius);
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}

.capability-icon i {
	font-size: 1.25rem;
	color: var(--branding-primary);
}

.capability-title {
	font-size: 1.125rem;
	font-weight: 600;
	margin-bottom: 0.75rem;
	color: var(--dark-color);
}

.capability-description {
	color: var(--branding-gray-600);
	font-size: 0.875rem;
	line-height: 1.5;
}

/* Category Cards */
.category-card {
	background: var(--branding-bg-white);
	border-radius: var(--branding-radius-lg);
	overflow: hidden;
	box-shadow: var(--branding-shadow);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.category-card:hover {
	transform: translateY(-10px);
	box-shadow: var(--branding-shadow-lg);
}

.category-image {
	height: 200px;
	overflow: hidden;
}

.category-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.3s ease;
}

.category-card:hover .category-image img {
	transform: scale(1.1);
}

.category-title {
	font-size: 1.25rem;
	font-weight: 600;
	margin-bottom: 0.75rem;
	color: var(--dark-color);
}

.category-description {
	color: var(--branding-gray-600);
	font-size: 0.875rem;
	line-height: 1.5;
	margin-bottom: 1.5rem;
}

.zeus-product-price-section {
	display: none!important;
}

/* About Section */
.about-content {
	padding-right: 2rem;
}

.about-feature {
	text-align: center;
}

.about-feature i {
	font-size: 2rem;
	display: block;
}

.about-feature h5 {
	font-weight: 600;
	margin: 0.5rem 0 0.25rem;
	color: var(--dark-color);
}

.about-feature p {
	color: var(--branding-gray-600);
	margin: 0;
}

.about-image-container {
	position: relative;
}

/* Responsive Design */
@media (max-width: 768px) {
	.hero-section {
		margin-top: 0;
		padding-top: 0 !important;
	}

	.hero-title {
		font-size: 2.5rem;
	}

	.hero-subtitle {
		font-size: 1.125rem;
	}

	.section-title {
		font-size: 2rem;
	}

	.hero-shape-1,
	.hero-shape-2 {
		display: none;
	}

	.about-content {
		padding-right: 0;
		margin-bottom: 2rem;
	}

	.floating-element {
		display: none;
	}
	.hero-buttons .btn, .about-content .btn {
		width: 100%;
	}
	#contact-cta .button-row {
		display: flex;
		flex-direction: column;
		margin-top: 10px;
	}
	#contact-cta .button-row .btn {
		width: 100%;
	}
}

/* ===== FOOTER STYLES ===== */
.strainsense-footer {
	background: linear-gradient(135deg, var(--branding-gray-900) 0%, var(--branding-gray-800) 100%);
	color: var(--branding-text-light);
	padding: 60px 0 30px 0;
}

.strainsense-footer .footer-brand {
	margin-bottom: 20px;
}

.strainsense-footer .footer-brand img {
	max-height: 60px;
	width: auto;
}

.strainsense-footer .footer-description {
	color: var(--branding-gray-400);
	font-size: 16px;
	line-height: 1.6;
	margin-bottom: 30px;
}

.strainsense-footer .footer-contact {
	margin-bottom: 30px;
}

.strainsense-footer .footer-contact p {
	color: var(--branding-gray-400);
	margin-bottom: 8px;
}

.strainsense-footer .footer-contact a {
	color: var(--branding-gray-400);
	text-decoration: none;
	transition: color 0.3s ease;
}

.strainsense-footer .footer-contact a:hover {
	color: var(--branding-primary);
	text-decoration: none;
}

.strainsense-footer .footer-contact i {
	color: var(--branding-primary);
}

.strainsense-footer .footer-title {
	font-size: 18px;
	font-weight: 600;
	color: var(--branding-text-light);
	margin-bottom: 20px;
}

.strainsense-footer .footer-links {
	list-style: none;
	padding: 0;
	margin: 0;
}

.strainsense-footer .footer-links li {
	margin-bottom: 12px;
}

.strainsense-footer .footer-links a {
	color: var(--branding-gray-400);
	text-decoration: none;
	font-size: 14px;
	transition: color 0.3s ease;
}

.strainsense-footer .footer-links a:hover {
	color: var(--branding-primary);
	text-decoration: none;
}

.strainsense-footer .social-links {
	display: flex;
	gap: 15px;
}

.strainsense-footer .social-link {
	width: 40px;
	height: 40px;
	background: var(--branding-white-transparent-10);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--branding-gray-400);
	text-decoration: none;
	font-size: 18px;
	transition: all 0.3s ease;
}

.strainsense-footer .social-link:hover {
	background: var(--branding-primary);
	color: var(--branding-text-light);
	transform: translateY(-2px);
	text-decoration: none;
}

.strainsense-footer .footer-divider {
	border: none;
	height: 1px;
	background: var(--branding-white-transparent-10);
	margin: 40px 0 20px 0;
}

.strainsense-footer .footer-copyright {
	color: var(--branding-gray-400);
	font-size: 14px;
	margin: 0;
}

.strainsense-footer .footer-legal {
	display: flex;
	gap: 20px;
}

.strainsense-footer .footer-legal a {
	color: var(--branding-gray-400);
	text-decoration: none;
	font-size: 14px;
	transition: color 0.3s ease;
}

.strainsense-footer .footer-legal a:hover {
	color: var(--branding-primary);
	text-decoration: none;
}

/* ===== GENERAL BROCHURE STYLES ===== */
.gradient-text {
	background: linear-gradient(135deg, var(--branding-primary) 0%, var(--branding-secondary) 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}

.gradient-text-light {
	background: linear-gradient(135deg, var(--branding-bg-white) 0%, var(--branding-gray-200) 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}

.section-title {
	margin-bottom: 1rem;
}

.section-subtitle {
	font-size: 1.125rem;
	color: var(--branding-text-secondary);
	line-height: 1.6;
	max-width: 600px;
}

.bg-primary-light {
	background-color: var(--branding-primary-transparent-10) !important;
}

.bg-secondary-light {
	background-color: var(--branding-secondary-transparent-10) !important;
}

/* ===== TABLET MEGA MENU (992px - 1366px) ===== */
@media (min-width: 992px) and (max-width: 1366px) {
	/* Hide the right side promotional content on tablets */
	.strainsense-navbar .mega-menu-side-right {
		display: none !important;
	}

	/* Make the left navigation 40% width */
	.strainsense-navbar .mega-menu-side-left-nav {
		width: 40% !important;
	}

	/* Remove max-width constraint on wrapper */
	.strainsense-navbar .mega-menu-side-wrapper {
		max-width: none !important;
	}

	/* Expand middle container to fill remaining space */
	.strainsense-navbar .mega-menu-side-middle {
		flex: 1 !important;
		width: 60% !important;
		max-width: none !important;
	}

	/* Make subcategories expand to full width */
	.strainsense-navbar .mega-menu-subcategories,
	.strainsense-navbar .mega-menu-subcategories.has-promotion,
	.strainsense-navbar .mega-menu-subcategories.no-promotion {
		width: 100% !important;
		max-width: 100% !important;
	}

	.strainsense-navbar .subcategory-grid {
		width: 100% !important;
		max-width: 100% !important;
	}

	/* Hide the diagonal stripe pseudo-elements */
	.strainsense-navbar .mega-menu-side-wrapper::before,
	.strainsense-navbar .mega-menu-side-wrapper::after {
		display: none !important;
	}

	/* Ensure left nav content stays above stripes */
	.strainsense-navbar .mega-menu-side-left-nav {
		z-index: 3 !important;
		position: relative;
	}

	/* Ensure borders go full width on tablets */
	.strainsense-navbar .mega-menu-side-left-nav li {
		width: 100% !important;
		margin: 0 !important;
	}

	.strainsense-navbar .mega-menu-side-left-nav li a {
		width: 100% !important;
	}
}

/* ===== MOBILE NAVIGATION ===== */
@media (max-width: 991px) {
	/* Mobile navbar styling */
	.strainsense-navbar .navbar-nav {
		text-align: left;
		padding: 0;
		margin: 0;
	}

	/* Make the navbar collapse scrollable */
	.strainsense-navbar .navbar-collapse {
		max-height: calc(100vh - 60px); /* Smaller offset for more scroll space */
		overflow-y: auto;
		overflow-x: hidden;
		-webkit-overflow-scrolling: touch; /* Smooth scrolling on iOS */
	}

	/* Ensure the navbar content is fully scrollable */
	.strainsense-navbar #navbarContent {
		padding-bottom: 5rem !important; /* Increased padding to ensure last items are fully visible */
		min-height: 100%;
	}

	/* Add extra space at the bottom of the nav list */
	.strainsense-navbar .navbar-nav {
		padding-bottom: 3rem !important;
	}

	.strainsense-navbar .nav-item {
		width: 100%;
		margin: 0;
	}

	/* Fix megamenu alignment on mobile */
	.strainsense-navbar .megamenu {
		padding: 0 !important;
	}

	/* Mobile: Override mega menu top-level padding to match other nav items */
	.strainsense-navbar .megamenu > a.dropdown-toggle {
		padding: 0.75rem 1rem !important;
	}

	/* Mobile: Make mega menu side navigation full width */
	.strainsense-navbar .mega-menu-side-left-nav {
		width: 100% !important;
	}

	/* Mobile: Hide mega menu subcategories completely */
	.strainsense-navbar .mega-menu-subcategories {
		display: none !important;
	}

	/* Mobile: Hide resources/promotional content section */
	.strainsense-navbar .mega-menu-side-children-wrapper {
		display: none !important;
	}

	/* Mobile: Hide right side panel */
	.strainsense-navbar .mega-menu-side-right {
		display: none !important;
	}

	/* Mobile: Display category icons to the left of titles */
	.strainsense-navbar .megamenu .category-icon {
		display: inline-block !important;
		width: 32px !important;
		height: 32px !important;
		margin-right: 10px !important;
		vertical-align: middle !important;
		object-fit: contain !important;
	}

	.strainsense-navbar .megamenu .category-name {
		display: inline-block !important;
		vertical-align: middle !important;
		font-size: 12px !important;
	}

	.strainsense-navbar .megamenu a {
		display: flex !important;
		align-items: center !important;
	}

	/* Style all navigation links consistently */
	.strainsense-navbar .nav-link,
	.strainsense-navbar .dropdown-toggle,
	.strainsense-navbar .dropdown > a,
	.strainsense-navbar .dropdown > span {
		padding: 0.75rem 1rem !important;
		border-bottom: 1px solid var(--branding-black-transparent-05);
		color: var(--branding-gray-700) !important;
		font-weight: 500 !important;
		text-align: left !important;
		background: transparent !important;
		text-transform: none !important;
		font-size: 1rem !important;
		margin: 0 !important;
		margin-left: 0 !important;
		display: block !important;
	}

	/* Ensure text inside links has no extra color */
	.strainsense-navbar .nav-link *,
	.strainsense-navbar .dropdown-toggle * {
		color: inherit !important;
	}

	/* Remove any inherited colors */
	.strainsense-navbar .nav-link.is-active,
	.strainsense-navbar .nav-link:hover,
	.strainsense-navbar .nav-link:focus {
		color: var(--branding-gray-700) !important;
	}

	/* Style dropdown toggles specifically */
	.strainsense-navbar .dropdown-toggle,
	.strainsense-navbar span.dropdown-toggle {
		border: none;
		width: 100%;
		display: block !important;
		cursor: pointer;
		position: relative;
		padding-right: 2.5rem !important; /* Add space for arrow */
	}

	/* Style mobile buttons in nav */
	.strainsense-navbar .navbar-nav .btn {
		width: calc(100% - 2rem) !important;
		margin: 0.5rem 1rem !important;
		padding: 0.75rem !important;
		font-weight: 500 !important;
		border-radius: 25px !important;
		text-align: center !important;
		display: block !important;
	}

	.strainsense-navbar .navbar-nav .btn-outline-primary {
		border: 2px solid var(--branding-primary) !important;
		color: var(--branding-primary) !important;
		background: transparent !important;
	}

	.strainsense-navbar .navbar-nav .btn-primary {
		background: var(--branding-primary) !important;
		border: 2px solid var(--branding-primary) !important;
		color: var(--branding-text-light) !important;
	}

	.strainsense-navbar .dropdown-toggle::after {
		position: absolute;
		right: 1rem;
		top: 50%;
		transform: translateY(-50%);
		transition: transform 0.3s ease;
	}

	/* Rotate arrow when open */
	.strainsense-navbar .nav-item.mobile-open .dropdown-toggle::after {
		transform: translateY(-50%) rotate(180deg);
	}

	/* Hide dropdowns by default, show on click */
	.strainsense-navbar .dropdown-menu {
		display: none !important;
		position: static !important;
		width: 100%;
		background: transparent !important;
		border: none !important;
		box-shadow: none !important;
		padding: 0 !important;
		margin: 0 !important;
		border-radius: 0 !important;
		float: none !important;
		transform: none !important;
		top: auto !important;
		left: auto !important;
		right: auto !important;
	}

	/* Remove ALL padding and margins from dropdown structure */
	.strainsense-navbar .dropdown-menu .row,
	.strainsense-navbar .dropdown-menu .col,
	.strainsense-navbar .dropdown-menu [class*="col-"],
	.strainsense-navbar .dropdown-menu > div {
		padding: 0 !important;
		margin: 0 !important;
		width: 100% !important;
	}

	/* Show dropdown when parent has mobile-open class */
	.strainsense-navbar .mobile-open > .dropdown-menu,
	.strainsense-navbar .mobile-open .dropdown-menu,
	.strainsense-navbar .nav-item.mobile-open > .dropdown-menu,
	.strainsense-navbar .normalmenu.mobile-open > .dropdown-menu,
	.strainsense-navbar .dropdown.mobile-open > .dropdown-menu {
		display: block !important;
		visibility: visible !important;
		opacity: 1 !important;
		height: auto !important;
		overflow: visible !important;
	}

	/* Show all child elements properly */
	.strainsense-navbar .mobile-open .dropdown-menu ul,
	.strainsense-navbar .mobile-open .dropdown-menu li {
		display: block !important;
		visibility: visible !important;
		opacity: 1 !important;
	}

	/* Remove any spacing from Bootstrap structure */
	.strainsense-navbar .mobile-open .dropdown-menu .row,
	.strainsense-navbar .mobile-open .dropdown-menu .col,
	.strainsense-navbar .mobile-open .dropdown-menu > div {
		display: block !important;
		width: 100% !important;
		padding: 0 !important;
		margin: 0 !important;
		background: transparent !important;
		border: none !important;
	}

	/* Clean list styling */
	.strainsense-navbar .dropdown-menu ul {
		padding: 0 !important;
		margin: 0 !important;
		list-style: none !important;
		width: 100% !important;
		background: transparent !important;
	}

	/* Hide any nested dropdowns or flyouts on mobile */
	.strainsense-navbar .hover-flyout-child,
	.strainsense-navbar .dropdown-menu ul ul {
		display: none !important;
	}

	/* Ensure dropdown links are clickable */
	.strainsense-navbar .mobile-open .dropdown-menu a {
		display: block !important;
		pointer-events: auto !important;
	}

	/* Style dropdown items exactly like main nav items */
	.strainsense-navbar .dropdown-menu .nav-item,
	.strainsense-navbar .dropdown-menu li {
		margin: 0 !important;
		padding: 0 !important;
		width: 100% !important;
		list-style: none !important;
	}

	/* Dropdown items should be indented and have no borders */
	.strainsense-navbar .dropdown-menu .nav-item,
	.strainsense-navbar .dropdown-menu li {
		border: none !important;
		border-bottom: none !important;
	}

	.strainsense-navbar .dropdown-menu .nav-item .nav-link,
	.strainsense-navbar .dropdown-menu li a,
	.strainsense-navbar .dropdown-menu a {
		padding: 0.5rem 1rem 0.5rem 2rem !important; /* Indent dropdown items */
		color: var(--branding-text-secondary) !important; /* Slightly lighter color */
		font-size: 0.95rem !important; /* Slightly smaller text */
		border: 0 !important; /* Remove all borders */
		border-top: 0 !important;
		border-bottom: 0 !important;
		border-left: 0 !important;
		border-right: 0 !important;
		outline: none !important;
		background: transparent !important;
		text-decoration: none !important;
		display: block !important;
		text-transform: none !important;
		font-weight: 400 !important; /* Lighter weight for sub-items */
		text-align: left !important;
		width: 100% !important;
		margin: 0 !important;
		border-radius: 0 !important;
	}

	/* Active state for dropdown items (no hover on mobile) */
	.strainsense-navbar .dropdown-menu .nav-item .nav-link:active,
	.strainsense-navbar .dropdown-item:active {
		background: var(--branding-primary-transparent-10) !important;
		color: var(--branding-primary) !important;
	}

	/* Base rule: Hide all dropdowns on mobile */
	.strainsense-navbar .dropdown-menu {
		display: none !important;
	}

	/* When mobile-open class is present, ALWAYS show the dropdown regardless of hover state */
	.strainsense-navbar .mobile-open > .dropdown-menu {
		display: block !important;
	}

	/* Ensure dropdown stays visible even when hovering on mobile-open items */
	.strainsense-navbar .dropdown.mobile-open:hover > .dropdown-menu,
	.strainsense-navbar .normalmenu.mobile-open:hover > .dropdown-menu,
	.strainsense-navbar .nav-item.mobile-open:hover > .dropdown-menu,
	.strainsense-navbar li.mobile-open:hover > .dropdown-menu {
		display: block !important;
	}

	/* Disable any hover-triggered showing of dropdowns */
	.strainsense-navbar .dropdown:not(.mobile-open):hover > .dropdown-menu,
	.strainsense-navbar .normalmenu:not(.mobile-open):hover > .dropdown-menu,
	.strainsense-navbar .nav-item:not(.mobile-open):hover > .dropdown-menu {
		display: none !important;
	}

	/* Remove any hover state changes */
	.strainsense-navbar .dropdown-menu .nav-item .nav-link:hover,
	.strainsense-navbar .dropdown-item:hover {
		background: transparent !important;
		color: var(--branding-text-secondary) !important;
	}
	/* Additional mobile styles */
	.section-title {
		font-size: 2rem;
	}

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

	.strainsense-footer .social-links {
		justify-content: center;
		margin-top: 20px;
	}
}

/* =============================================
   CATEGORY PAGE STYLES
   ============================================= */

/* Category Hero Section */
#hero {
	width: 100%;
	background-size: contain !important;
	background-repeat: no-repeat !important;
	background-position: bottom 0 right calc(50% - 470px) !important;
}

#hero .overlay {
	border-bottom: 5px solid var(--branding-primary) !important;
}

#hero .hero-info {
	width: 70%;
}

.category-hero {
	background: linear-gradient(135deg, var(--branding-primary-light) 0%, var(--branding-secondary-light) 100%);
	position: relative;
}

.bg-red-light {
	background-color: var(--branding-primary-light) !important;
}

.text-red {
	color: var(--branding-red-alt) !important;
}

/* Category Cards */
.category-card {
	transition: all 0.3s ease;
	border: 1px solid var(--branding-gray-300);
	position: relative;
}

.category-card:hover {
	box-shadow: 0 10px 30px var(--branding-black-transparent-10);
	transform: translateY(-2px);
}

.category-card .stretched-link::after {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1;
	content: "";
}

.category-card:hover .btn-outline-primary {
	background-color: var(--branding-primary-light);
	border-color: var(--branding-red-alt);
	color: var(--branding-red-alt);
}

.category-image-wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 150px;
}

/* Educational Content */
.educational-content h3 {
	color: var(--branding-gray-alt-5);
	font-weight: 600;
	margin-top: 2rem;
	margin-bottom: 1rem;
}

.educational-content p {
	color: var(--branding-gray-alt-6);
	line-height: 1.8;
	margin-bottom: 1.5rem;
}

/* Products Section */
#products-section {
	background-color: var(--branding-gray-100);
}

.products-grid .product-card {
	transition: all 0.3s ease;
}

.products-grid .product-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 10px 30px var(--branding-black-transparent-10);
}

/* AJAX Loading */
.ajax-loading-area {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: var(--branding-white-transparent-95);
	padding: 30px;
	border-radius: 10px;
	box-shadow: 0 5px 20px var(--branding-black-transparent-10);
	z-index: 1000;
	display: none;
}

.ajax-loading-area.active {
	display: block;
}

/* Category-specific overrides */
.category-btn {
	background: var(--branding-red-alt);
	border: 1px solid var(--branding-red-alt) !important;
	color: var(--branding-bg-white);
}

.category-btn:hover {
	background: var(--branding-bg-white);
	color: var(--branding-red-alt);
	transition: all ease 0.2s;
}

.ecom-highlight {
	color: var(--branding-red-alt);
}

/* Remove any yellow/orange text */
.category-hero a:not(.btn) {
	color: var(--branding-red-alt) !important;
	text-decoration: none;
}

.category-hero a:not(.btn):hover {
	color: var(--branding-red-dark) !important;
	text-decoration: underline;
}

/* Breadcrumb styling */
.breadcrumbSection ol {
	margin-bottom: 0!important;
	display: flex;
	flex-direction: row;
	justify-content: end;
}
.breadcrumb-item + .breadcrumb-item::before {
	content: "›";
	color: var(--branding-gray-alt-7);
	padding: 0 0.5rem;
}

.breadcrumb {
	font-size: 0.875rem;
}

/* Hero section text */
.category-hero h1 {
	font-size: 3rem;
	letter-spacing: -0.02em;
}

.category-hero .lead {
	color: var(--branding-gray-alt-6) !important;
}

.category-hero .category-description {
	font-size: 18px;
}

/* Feature cards in hero */
.category-hero .bg-white {
	border: 1px solid var(--branding-black-transparent-05);
}

/* Category responsive adjustments */
@media (max-width: 767.98px) {
	.category-hero {
		padding-top: 2rem !important;
		padding-bottom: 2rem !important;
	}

	.display-4 {
		font-size: 2rem;
	}

	.display-5 {
		font-size: 1.75rem;
	}

	.category-card {
		margin-bottom: 1rem;
	}
}

/* ===== EDUCATIONAL CONTENT SECTION STYLES ===== */
.educational-section {
	padding: 5rem 0;
	background: var(--branding-gray-alt-9);
}

.educational-section h2 {
	font-size: 2.2rem;
	font-weight: 600;
	color: var(--branding-gray-alt-1);
	text-align: center;
	margin-bottom: 3rem;
	letter-spacing: -0.5px;
}

.educational-section h3 {
	font-size: 1.75rem;
	font-weight: 600;
	color: var(--branding-gray-900);
	margin: 3rem 0 1.5rem 0;
}

.educational-section p {
	font-size: 1.1rem;
	color: var(--branding-gray-alt-3);
	line-height: 1.8;
	margin-bottom: 1.5rem;
}
.cat-card-type {
	background-color: var(--branding-bg-white);
	box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,.075);
	padding: 32px;
	margin-bottom: 32px;
	border-radius: 14px;
}
.inner-cat-card-type {
	background-color: var(--branding-gray-alt-9);
	border-radius: 10px;
	padding: 24px;
	margin-bottom: 24px;
}
/* Accelerometer Type Cards */
.accelerometer-types {
	margin: 3rem 0;
}

.type-cards {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 2rem;
	margin-top: 2rem;
}

@media (max-width: 768px) {
	.type-cards {
		grid-template-columns: 1fr;
	}
}

.type-card {
	background: var(--branding-bg-white);
	border-radius: 12px;
	padding: 2.5rem;
	border: 1px solid var(--branding-gray-alt-4);
	box-shadow: 0 2px 8px var(--branding-black-transparent-05);
	transition: all 0.3s ease;
}

.type-card:hover {
	box-shadow: 0 4px 12px var(--branding-black-transparent-10);
	transform: translateY(-2px);
}

.type-card h4 {
	font-size: 1.4rem;
	font-weight: 600;
	color: var(--branding-gray-alt-1);
	margin-bottom: 1rem;
	letter-spacing: -0.3px;
}

.type-card p {
	font-size: 1rem;
	color: var(--branding-gray-alt-2);
	line-height: 1.7;
	margin: 0;
}

/* Technical Image */
.technical-image {
	margin: 2rem 0;
	text-align: center;
}

.technical-image img {
	max-width: 100%;
	height: auto;
	border-radius: 8px;
	box-shadow: 0 4px 12px var(--branding-black-transparent-10);
}

.image-caption {
	font-size: 0.9rem;
	color: var(--branding-gray-600);
	margin-top: 1rem;
	text-align: center;
	font-style: italic;
}

/* FAQ Section Enhancements */
.faq-section {
	padding: 4rem 0;
	background: var(--branding-bg-white);
}

.faq-section h2 {
	font-size: 2.2rem;
	font-weight: 600;
	color: var(--branding-gray-alt-1);
	text-align: center;
	letter-spacing: -0.5px;
}

.faq-section p.h2 {
	font-size: 2.2rem;
	font-weight: 600;
	color: #000;
	text-align: center;
	letter-spacing: -0.5px;
}

.help-callout {
	background: var(--branding-yellow-light-bg);
	border-radius: 12px;
	padding: 2.5rem;
	margin-bottom: 3rem;
	border: none;
}

.help-callout h3 {
	font-size: 1.5rem;
	font-weight: 600;
	color: var(--branding-gray-alt-1);
	margin-bottom: 1rem;
	letter-spacing: -0.3px;
}

.help-callout p {
	font-size: 1.05rem;
	color: var(--branding-gray-alt-2);
	line-height: 1.7;
	margin: 0;
}

.help-callout p a {
	color: var(--branding-yellow-dark);
	text-decoration: underline;
}

/* Modern FAQ Accordion */
.modern-accordion {
	margin-top: 2rem;
}

.modern-accordion .accordion-item {
	background: var(--branding-bg-white);
	border: 1px solid var(--branding-gray-alt-4);
	border-radius: 8px;
	margin-bottom: 12px;
	overflow: hidden;
	transition: all 0.2s ease;
}

.modern-accordion .accordion-item:hover {
	box-shadow: 0 2px 8px var(--branding-black-transparent-08);
}

.modern-accordion .accordion-button {
	font-size: 1.05rem;
	font-weight: 500;
	color: var(--branding-gray-alt-1);
	background: var(--branding-bg-white);
	border: none;
	padding: 1.3rem 1.5rem;
	box-shadow: none !important;
	position: relative;
	transition: background-color 0.2s ease;
}

.modern-accordion .accordion-button:not(.collapsed) {
	background: var(--branding-bg-light);
	color: var(--branding-gray-alt-1);
	border-bottom: 1px solid var(--branding-gray-alt-4);
	box-shadow: none !important;
}

.modern-accordion .accordion-button:focus {
	box-shadow: none !important;
	border-color: transparent;
	outline: none;
}

.modern-accordion .accordion-button::after {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%236b7280'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
	transition: transform 0.2s ease;
}

.modern-accordion .accordion-button:not(.collapsed)::after {
	transform: rotate(180deg);
}

.modern-accordion .accordion-body {
	padding: 1.5rem;
	font-size: 0.95rem;
	color: var(--branding-gray-alt-2);
	line-height: 1.7;
	background: var(--branding-gray-alt-8);
}

/* Educational and FAQ Links */
.educational-section a,
.cat-card-type a,
.faq-section a,
.modern-accordion a {
	color: var(--branding-primary) !important;
	text-decoration: none !important;
}

.educational-section a:hover,
.cat-card-type a:hover,
.faq-section a:hover,
.modern-accordion a:hover {
	color: var(--branding-primary-hover) !important;
	text-decoration: none !important;
}

.educational-section a:focus,
.cat-card-type a:focus,
.faq-section a:focus,
.modern-accordion a:focus,
.educational-section a:active,
.cat-card-type a:active,
.faq-section a:active,
.modern-accordion a:active {
	color: var(--branding-primary) !important;
	text-decoration: none !important;
}

/* Remove underline from ins tags in FAQs */
.faq-section ins,
.modern-accordion ins {
	text-decoration: none !important;
}

.faq-section ins a,
.modern-accordion ins a {
	text-decoration: none !important;
}

/* Highlighted text */
.text-highlight {
	color: var(--branding-red-alt);
	font-weight: 600;
}

/* ===== SUBCATEGORY CARDS ===== */
.subCategories {
	background: transparent;
	padding: 2rem 0 !important;
}

.subCategories .row {
	margin-left: -12px;
	margin-right: -12px;
}

.subCategories .row > [class*='col-'] {
	padding-left: 12px;
	padding-right: 12px;
	margin-bottom: 24px;
}

.subcategory-card {
	background: var(--branding-bg-white);
	border: 1px solid var(--branding-gray-alt-4);
	border-radius: 16px;
	overflow: hidden;
	transition: all 0.3s ease;
	height: 100%;
	box-shadow: 0 2px 8px var(--branding-black-transparent-06);
}

.subcategory-card:hover {
	box-shadow: 0 8px 24px var(--branding-black-transparent-12);
	transform: translateY(-4px);
}

.subcategory-card-body {
	padding: 2rem;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	height: 100%;
}

.subcategory-image-wrapper {
	background: #fff;
	border-radius: 12px;
	width: 100%;
	height: 250px;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

.subcategory-image {
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	object-fit: contain;
}

.subcategory-title {
	font-size: 1.5rem;
	font-weight: 600;
	color: var(--branding-gray-alt-1);
	margin-bottom: 1.5rem;
	letter-spacing: -0.5px;
	text-transform: uppercase;
	line-height: 1.2;
}

.subcategory-btn {
	padding: 0.75rem 2rem;
	font-weight: 500;
	border: 2px solid var(--branding-gray-alt-1);
	color: var(--branding-gray-alt-1);
	background: transparent;
	border-radius: 8px;
	transition: all 0.3s ease;
	text-transform: uppercase;
	font-size: 0.9rem;
	letter-spacing: 0.5px;
	text-decoration: none;
	margin-top: auto;
}

.subcategory-btn:hover,
.subcategory-btn:focus,
.subcategory-btn:active {
	background: var(--branding-red-alt) !important;
	border-color: var(--branding-red-alt) !important;
	color: var(--branding-text-light) !important;
	transform: scale(1.05);
	box-shadow: none !important;
	outline: none !important;
}

/* Responsive adjustments for subcategory cards */
@media (max-width: 767px) {
	.subcategory-card-body {
		padding: 1.5rem;
	}

	.subcategory-image-wrapper {
		height: 200px;
		padding: 1.5rem;
	}

	.subcategory-title {
		font-size: 1.25rem;
	}
}

/* Links within category description - style as red text */
.category-hero .lead a:not(.main-button),
.category-hero p.lead a:not(.main-button),
.category-hero .col-lg-10 p a:not(.main-button),
section.category-hero p.lead a:not(.main-button),
.category-hero a[href*="pdf"]:not(.main-button),
.category-hero a[href*="download"]:not(.main-button),
.category-hero a[href*="overview"]:not(.main-button) {
	color: var(--branding-primary) !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	transition: all 0.2s ease !important;
}

.category-hero .lead a:not(.main-button):hover,
.category-hero p.lead a:not(.main-button):hover,
.category-hero .col-lg-10 p a:not(.main-button):hover,
section.category-hero p.lead a:not(.main-button):hover,
.category-hero a[href*="pdf"]:not(.main-button):hover,
.category-hero a[href*="download"]:not(.main-button):hover,
.category-hero a[href*="overview"]:not(.main-button):hover {
	color: var(--branding-red-dark) !important;
	text-decoration: none !important;
}

/* Main button styling for category hero */
.category-hero a.main-button {
	background-color: var(--branding-primary);
	color: #fff !important;
	padding: 15px;
}

.category-hero a.main-button:hover {
	color: #fff !important;
	text-decoration: none !important;
}

/* Removed icon before download links - icon already exists in content */

/* Category Download Buttons */
.category-downloads {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 15px;
	margin-top: 20px;
}

.download-btn,
a.download-btn {
	display: inline-flex !important;
	align-items: center;
	gap: 10px;
	padding: 14px 28px !important;
	background: var(--branding-gradient-primary) !important;
	border: 2px solid var(--branding-primary) !important;
	border-radius: 50px !important;
	color: var(--branding-text-light) !important;
	font-weight: 600 !important;
	font-size: 16px !important;
	text-decoration: none !important;
	transition: all 0.3s ease !important;
	box-shadow: 0 4px 15px var(--branding-primary-transparent-30) !important;
	text-transform: none !important;
	line-height: 1.5 !important;
	cursor: pointer !important;
}

.download-btn:hover,
a.download-btn:hover {
	background: linear-gradient(135deg, var(--branding-primary-hover) 0%, var(--branding-primary-hover) 100%) !important;
	border-color: var(--branding-red-dark) !important;
	transform: translateY(-2px) !important;
	box-shadow: 0 6px 20px var(--branding-primary-transparent-40) !important;
	color: var(--branding-text-light) !important;
	text-decoration: none !important;
}

.download-btn i,
a.download-btn i {
	font-size: 20px !important;
	margin-right: 4px;
	display: inline-block;
	vertical-align: middle;
}

/* Fallback if Bootstrap Icons aren't loading */
.download-btn::before,
a.download-btn::before {
	content: "📄";
	font-size: 20px;
	margin-right: 8px;
	display: inline-block;
	vertical-align: middle;
}

.download-btn.btn-datasheet::before,
a.download-btn.btn-datasheet::before {
	content: "📊";
}

/* Hide emoji if icon is present */
.download-btn:has(i)::before,
a.download-btn:has(i)::before {
	display: none;
}

/* Alternative button styles for different file types */
.download-btn.btn-datasheet {
	background: linear-gradient(135deg, var(--branding-blue) 0%, var(--branding-blue-dark) 100%);
	box-shadow: 0 4px 15px rgba(0, 123, 255, 0.3);
}

.download-btn.btn-datasheet:hover {
	background: linear-gradient(135deg, var(--branding-blue-dark) 0%, var(--branding-blue-darker) 100%);
	box-shadow: 0 6px 20px rgba(0, 123, 255, 0.4);
}

.download-btn.btn-manual {
	background: linear-gradient(135deg, var(--branding-green) 0%, var(--branding-green-dark) 100%);
	box-shadow: 0 4px 15px rgba(40, 167, 69, 0.3);
}

.download-btn.btn-manual:hover {
	background: linear-gradient(135deg, var(--branding-green-dark) 0%, var(--branding-green-darker) 100%);
	box-shadow: 0 6px 20px rgba(40, 167, 69, 0.4);
}

@media (max-width: 768px) {
	.category-downloads {
		flex-direction: column;
		align-items: center;
	}

	.download-btn {
		width: 100%;
		max-width: 280px;
		justify-content: center;
	}
}

/* ===== ZEUS PRODUCT CARDS ===== */
/* Ensure products display in rows */
.products-from-ajax,
.row.products-from-ajax,
div.row.products-from-ajax {
	display: flex !important;
	flex-wrap: wrap !important;
	flex: none !important;
	margin-left: -8px;
	margin-right: -8px;
	width: 100% !important;
}

.products-from-ajax > div,
.products-from-ajax > .shop-item {
	padding-left: 8px;
	padding-right: 8px;
	display: block !important;
}

/* Ensure Bootstrap column classes work */
.products-from-ajax > .col-12 {
	flex: 0 0 100% !important;
	max-width: 100% !important;
}

@media (min-width: 768px) {
	.products-from-ajax > .col-md-6 {
		flex: 0 0 50% !important;
		max-width: 50% !important;
	}
}

@media (min-width: 992px) {
	.products-from-ajax > .col-lg-4 {
		flex: 0 0 33.333333% !important;
		max-width: 33.333333% !important;
	}
}

.zeus-product-card {
	border: 1px solid var(--branding-gray-alt-4);
	border-radius: 16px;
	overflow: visible;
	transition: all 0.3s ease;
	box-shadow: 0 2px 8px var(--branding-black-transparent-06);
	cursor: pointer;
}

.zeus-product-card:hover {
	box-shadow: 0 8px 24px var(--branding-black-transparent-12);
	transform: translateY(-4px);
}

.zeus-product-image-wrapper {
	background: #fff;
	border-radius: 12px;
	padding: 0.5rem;
	margin-bottom: 1rem;
	height: 100%;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: visible;
}

@media (min-width: 992px) {
	.zeus-product-image-wrapper {
		margin-bottom: 0;
	}
}

.zeus-product-image {
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	object-fit: contain !important;
}

.zeus-product-info {
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}

.zeus-product-title {
	font-size: 1rem;
	font-weight: 600;
	margin-bottom: 0.5rem;
	line-height: 1.3;
}

.zeus-product-title a {
	color: var(--branding-gray-alt-1);
	text-decoration: none;
	transition: color 0.3s ease;
}

.zeus-product-title a:hover {
	color: var(--branding-red-alt);
}

.zeus-product-info .card-title.zeus-product-title a {
	color: #000 !important;
}

.zeus-product-description {
	font-size: 0.875rem;
	color: var(--branding-gray-alt-2);
	margin-bottom: 0.75rem;
	line-height: 1.4;
}

.zeus-product-price-section {
	margin-bottom: 1rem;
	margin-top: auto;
}

.zeus-price-label {
	font-size: 0.85rem;
	color: var(--branding-text-secondary);
	margin-bottom: 0.25rem;
}

.zeus-price-value {
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--branding-red-alt);
}

.zeus-price-unit {
	font-size: 0.75rem;
	font-weight: 400;
	color: var(--branding-text-secondary);
}

.zeus-price-wrapper {
	display: flex;
	align-items: center;
	gap: 0.75rem;
}

.zeus-price-special {
	color: var(--branding-red-alt);
}

.zeus-price-original {
	text-decoration: line-through;
	font-size: 1rem;
	color: var(--branding-text-secondary);
	font-weight: 500;
}

.zeus-product-action {
	margin-top: auto;
}

.zeus-product-btn {
	width: 100%;
	padding: 0.75rem 1.5rem;
	font-weight: 500;
	border: 2px solid var(--branding-gray-alt-1);
	color: var(--branding-gray-alt-1);
	background: transparent;
	border-radius: 8px;
	transition: all 0.3s ease;
	text-transform: uppercase;
	font-size: 0.85rem;
	letter-spacing: 0.5px;
	text-decoration: none;
}

.zeus-product-btn:hover,
.zeus-product-btn:focus,
.zeus-product-btn:active {
	background: var(--branding-red-alt) !important;
	border-color: var(--branding-red-alt) !important;
	color: var(--branding-text-light) !important;
	transform: scale(1.02);
	box-shadow: none !important;
	outline: none !important;
}

/* Discount ribbon - preserved from Zeus */
.corner-ribbon {
	position: absolute;
	top: 10px;
	left: -35px;
	width: 120px;
	padding: 10px 0;
	background: var(--branding-red-alt);
	color: var(--branding-bg-white);
	text-align: center;
	font-weight: 700;
	font-size: 0.85rem;
	transform: rotate(-45deg);
	z-index: 10;
	box-shadow: 0 2px 5px var(--branding-black-transparent-20);
}

/* Responsive adjustments for product cards */
@media (max-width: 575px) {

	.zeus-product-image-wrapper {
		height: 150px;
		padding: 1rem;
	}
}

/* Fix breadcrumb section position to appear below fixed navigation */
.breadcrumbSection {
	position: relative;
	z-index: 1;
}

@media (max-width: 767px) {
	.breadcrumbSection {
		margin-top: 0px !important; /* Mobile breadcrumb margin */
	}
}

/* Style breadcrumb links to match brand colors */
.breadcrumb a,
.breadcrumbSection a {
	color: var(--branding-primary) !important; /* Brand red color */
	text-decoration: none !important;
	transition: color 0.2s ease !important;
}

.breadcrumb a:hover,
.breadcrumbSection a:hover {
	color: var(--branding-primary-hover) !important; /* Darker red on hover */
	text-decoration: none !important;
}

/* Style the breadcrumb separators */
.breadcrumbSection span[style*="padding: 0 5px"] {
	color: var(--branding-text-secondary) !important; /* Gray color for separators */
}

/* Product page badge styles */
.product-badges {
	display: flex;
	gap: 10px;
	justify-content: flex-start;
	margin-bottom: 20px;
	flex-wrap: wrap;
}

.bage-solid,
.bage-free-shipping,
p.bage-solid,
p.bage-free-shipping {
	display: inline-block !important;
	background: var(--branding-success) !important;
	color: var(--branding-text-light) !important;
	padding: 8px 16px !important;
	border-radius: 25px !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	margin: 0 5px 10px 5px !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
	box-shadow: 0 2px 4px var(--branding-black-transparent-10) !important;
	position: relative !important;
}

.bage-free-shipping,
p.bage-free-shipping {
	background: var(--branding-primary) !important; /* Red badge for Price Match */
}

/* Icon styles for badges */
.bage-solid::before,
p.bage-solid::before {
	content: "🚚";
	margin-right: 6px;
	font-size: 16px;
}

.bage-free-shipping::before,
p.bage-free-shipping::before {
	content: "💰";
	margin-right: 6px;
	font-size: 16px;
}

/* Product page tab navigation styles */
.nav-tabs .nav-link {
	color: var(--branding-text-secondary) !important;
	background-color: transparent !important;
	border: 1px solid transparent !important;
	border-bottom: 3px solid transparent !important;
	transition: all 0.3s ease !important;
}

.nav-tabs .nav-link:hover {
	color: var(--branding-primary) !important;
	border-color: transparent !important;
	border-bottom-color: var(--branding-primary) !important;
}

.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
	color: var(--branding-primary) !important;
	background-color: var(--branding-text-light) !important;
	border-color: var(--branding-gray-300) var(--branding-gray-300) var(--branding-bg-white) !important;
	border-bottom: 3px solid var(--branding-primary) !important;
}

/* Override Bootstrap's default blue for tab links */
#productTabs .nav-link {
	color: var(--branding-text-secondary) !important;
}

#productTabs .nav-link.active {
	color: var(--branding-primary) !important;
	border-bottom-color: var(--branding-primary) !important;
}

#productTabs .nav-link:hover,
#productTabs .nav-link:focus {
	color: var(--branding-primary) !important;
	border-bottom-color: var(--branding-primary) !important;
}

/* Product description links - style as brand red */
.tab-content a,
.tab-pane a,
#productTabsContent a,
.product-description a {
	color: var(--branding-primary) !important;
	text-decoration: none !important;
	font-weight: 600 !important;
	transition: color 0.2s ease !important;
}

.tab-content a:hover,
.tab-pane a:hover,
#productTabsContent a:hover,
.product-description a:hover {
	color: var(--branding-primary-hover) !important;
	text-decoration: underline !important;
}

/* Related Products Slider Styles */
.related-products-slider {
	position: relative;
	padding: 0;
}

.slider-container {
	overflow: hidden;
	margin: 0 -10px;
}

.slider-track {
	display: flex;
	transition: transform 0.3s ease;
}

.slider-item {
	flex-shrink: 0;
	width: 100%;
	padding: 0 10px;
}

.related-product-card {
	background: var(--branding-bg-light);
	padding: 15px;
	border-radius: 8px;
	height: 100%;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	color: var(--branding-text-dark);
}

.related-product-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 4px 12px var(--branding-black-transparent-15);
}

.related-product-card img {
	transition: transform 0.3s ease;
}

.related-product-card:hover img {
	transform: scale(1.05);
}

.related-product-card h6 {
	color: var(--branding-text-dark, #3C3C3C);
}

/* Slider Navigation Buttons */
.slider-prev,
.slider-next {
	position: absolute;
	top: 40%;
	transform: translateY(-50%);
	z-index: 10;
	background: var(--branding-primary, #E31E26) !important;
	color: white !important;
	border: none !important;
	border-radius: 50%;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all 0.3s ease;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.slider-prev:hover,
.slider-next:hover {
	background: var(--branding-primary-hover, #C01920) !important;
	transform: translateY(-50%) scale(1.1);
}

.slider-prev {
	left: 5px;
}

.slider-next {
	right: 5px;
}

.slider-prev:disabled,
.slider-next:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

/* Slider Dots */
.slider-dots {
	display: flex;
	justify-content: center;
	gap: 8px;
	margin-top: 15px;
}

.slider-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--branding-gray-300);
	border: none;
	cursor: pointer;
	transition: all 0.3s ease;
}

.slider-dot.active {
	background: var(--branding-primary);
	width: 24px;
	border-radius: 4px;
}

.slider-dot:hover:not(.active) {
	background: var(--branding-gray-500);
}

/* ============================================
   MOBILE RESPONSIVE STYLES - PRODUCT PAGE
   ============================================ */

/* Tablet Styles (768px and below) */
@media (max-width: 768px) {
	/* Breadcrumb adjustments */
	.breadcrumbSection {
		margin-top: 80px !important; /* No top bar on mobile, just navbar */
		padding: 5px 10px !important;
		font-size: 14px !important;
	}

	/* Product hero adjustments */
	.product-hero h1 {
		font-size: 2rem !important;
	}

	/* Tab navigation */
	.nav-tabs {
		border-bottom: none !important;
		overflow-x: auto !important;
		flex-wrap: nowrap !important;
		-webkit-overflow-scrolling: touch !important;
	}

	.nav-tabs .nav-link {
		white-space: nowrap !important;
		padding: 0.5rem 1rem !important;
	}
}

/* Mobile Styles (575px and below) */
@media (max-width: 575px) {

	.pageContent {
		margin-top: 0;
	}

	/* Breadcrumb mobile optimization */
	.breadcrumbSection {
		margin-top: 0px !important;
		padding: 3px 5px !important;
		font-size: 12px !important;
	}

	.breadcrumb {
		margin-bottom: 0 !important;
		padding: 0.25rem 0.5rem !important;
	}

	/* Hide breadcrumb text, show only last item on mobile */
	.breadcrumb li:not(:last-child) {
		display: none !important;
	}

	.breadcrumb li:last-child::before {
		content: "← " !important;
		color: var(--branding-primary) !important;
	}

	/* Product Hero Mobile Optimization */
	.product-hero {
		padding: 2rem 0 !important;
	}

	.product-hero h1,
	.product-hero .display-5 {
		font-size: 1.5rem !important;
		line-height: 1.3 !important;
		margin-bottom: 1rem !important;
	}

	.product-hero p.lead {
		font-size: 0.95rem !important;
		margin-bottom: 1rem !important;
	}

	/* Product badges mobile */
	.product-badges {
		justify-content: center !important;
		margin-bottom: 15px !important;
	}

	.bage-solid,
	.bage-free-shipping,
	p.bage-solid,
	p.bage-free-shipping {
		padding: 6px 12px !important;
		font-size: 11px !important;
		margin: 0 3px 8px 3px !important;
	}

	.bage-solid::before,
	.bage-free-shipping::before,
	p.bage-solid::before,
	p.bage-free-shipping::before {
		font-size: 12px !important;
		margin-right: 4px !important;
	}

	/* Product image mobile */
	.product-main-image {
		max-height: 250px !important;
	}

	/* Product thumbnails mobile */
	.product-thumbnails {
		margin-top: 10px !important;
	}

	.product-thumbnails .col-3 {
		padding: 2px !important;
	}

	.product-thumbnails img {
		width: 60px !important;
		height: 60px !important;
	}

	/* Key specifications mobile */
	.product-hero ul li {
		font-size: 0.85rem !important;
		margin-bottom: 0.5rem !important;
	}

	/* Category badges mobile */
	.product-hero .badge {
		font-size: 10px !important;
		padding: 4px 8px !important;
		margin: 2px !important;
	}

	/* CTA Button mobile */
	.product-hero .btn-lg {
		padding: 0.75rem 1.5rem !important;
		font-size: 0.95rem !important;
		width: 100% !important;
	}

	/* Tab navigation mobile */
	.nav-tabs {
		display: flex !important;
		overflow-x: auto !important;
		overflow-y: hidden !important;
		-webkit-overflow-scrolling: touch !important;
		margin-left: -15px !important;
		margin-right: -15px !important;
		padding: 0 15px !important;
		border-bottom: 1px solid var(--branding-gray-300) !important;
	}

	.nav-tabs::-webkit-scrollbar {
		height: 4px !important;
	}

	.nav-tabs::-webkit-scrollbar-track {
		background: var(--branding-gray-200) !important;
	}

	.nav-tabs::-webkit-scrollbar-thumb {
		background: var(--branding-primary) !important;
		border-radius: 4px !important;
	}

	.nav-tabs .nav-item {
		flex-shrink: 0 !important;
	}

	.nav-tabs .nav-link {
		padding: 0.5rem 0.75rem !important;
		font-size: 0.85rem !important;
		white-space: nowrap !important;
	}

	/* Tab content mobile */
	.tab-content {
		padding: 15px 0 !important;
	}

	.tab-pane h3,
	.tab-pane h4 {
		font-size: 1.1rem !important;
		margin-bottom: 1rem !important;
	}

	.tab-pane p {
		font-size: 0.9rem !important;
		line-height: 1.6 !important;
	}

	/* Stock table mobile */
	.stock-table-wrapper {
		overflow-x: auto !important;
		-webkit-overflow-scrolling: touch !important;
		margin: 0 -15px !important;
		padding: 0 15px !important;
	}

	.table {
		font-size: 0.8rem !important;
	}

	.table th,
	.table td {
		padding: 0.5rem !important;
	}

	/* Related products sidebar becomes bottom section on mobile */
	.product-hero + .container .row > .col-lg-4 {
		margin-top: 2rem !important;
	}

	/* Related products slider mobile */
	.related-products-slider {
		margin: 0 -15px !important;
		padding: 0 15px !important;
	}

	.slider-prev,
	.slider-next {
		width: 30px !important;
		height: 30px !important;
		font-size: 12px !important;
	}

	.slider-prev {
		left: 5px !important;
	}

	.slider-next {
		right: 5px !important;
	}

	.related-product-card {
		padding: 12px !important;
	}

	.related-product-card h6 {
		font-size: 0.9rem !important;
	}

	.related-product-card p {
		font-size: 0.8rem !important;
	}

	/* Forms and inputs mobile */
	.form-control,
	.form-select {
		font-size: 16px !important; /* Prevents zoom on iOS */
		padding: 0.5rem !important;
	}

	/* Modal adjustments for mobile */
	.modal-dialog {
		margin: 10px !important;
	}

	.modal-content {
		border-radius: 10px !important;
	}

	/* Container padding mobile */
	.container {
		padding-left: 15px !important;
		padding-right: 15px !important;
	}

	/* Section padding mobile */
	section {
		padding-top: 2rem !important;
		padding-bottom: 2rem !important;
	}

	/* Support documents mobile */
	.support-documents .list-group-item {
		padding: 0.5rem !important;
		font-size: 0.85rem !important;
	}

	/* Enquiry form mobile */
	.enquiry-form .btn {
		width: 100% !important;
	}
}

/* Extra small mobile (below 400px) */
@media (max-width: 400px) {
	/* Even smaller adjustments for tiny screens */
	.product-hero h1 {
		font-size: 1.25rem !important;
	}

	.breadcrumbSection {
		display: none !important; /* Hide breadcrumbs on very small screens */
	}

	.product-thumbnails {
		display: none !important; /* Hide thumbnails on very small screens */
	}

	.nav-tabs .nav-link {
		padding: 0.4rem 0.6rem !important;
		font-size: 0.8rem !important;
	}
}

/* Technical Resources Page Styles */
.technical-resources-lead {
	max-width: 700px;
}

/* Ensure all headings use branding black on technical resources page */
.technical-resources-page h1,
.technical-resources-page h2,
.technical-resources-page h3,
.technical-resources-page h4,
.technical-resources-page h5,
.technical-resources-page h6 {
	color: var(--branding-text-dark, #3C3C3C) !important;
}

.resource-icon-wrapper {
	width: 64px;
	height: 64px;
}

.resource-icon {
	font-size: 2rem;
}

/* Light background colors for resource icons using CSS variables */
.resource-icon-wrapper-primary {
	background-color: var(--branding-primary-light, rgba(227, 30, 38, 0.1)); /* Uses brand primary light */
}

.resource-icon-wrapper-danger {
	background-color: var(--branding-primary-light, rgba(227, 30, 38, 0.1)); /* Uses brand primary light (red) */
}

.resource-icon-wrapper-success {
	background-color: rgba(40, 167, 69, 0.1); /* Light green - using Bootstrap's success color */
}

.resource-icon-wrapper-info {
	background-color: rgba(23, 162, 184, 0.1); /* Light cyan - using Bootstrap's info color */
}

.resource-icon-wrapper-warning {
	background-color: var(--branding-secondary-light, rgba(252, 164, 28, 0.1)); /* Uses brand secondary light (yellow) */
}

.resource-icon-wrapper-secondary {
	background-color: var(--branding-gray-100, rgba(108, 117, 125, 0.1)); /* Uses brand gray light */
}

.resource-icon-wrapper-dark {
	background-color: var(--branding-gray-200, rgba(60, 60, 60, 0.1)); /* Uses brand gray for light dark */
}

.resource-card {
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	position: relative;
}

.resource-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 10px 30px -5px rgba(227, 30, 38, 0.3),
	0 15px 40px -10px rgba(252, 164, 28, 0.25) !important;
}

/* Ensure titles use brand black and don't inherit link colors */
.resource-card h3 {
	color: var(--branding-text-dark, #3C3C3C) !important;
}

/* Override link color inheritance */
a .resource-card h3 {
	color: var(--branding-text-dark, #3C3C3C) !important;
}

.small {
	letter-spacing: 0.05em;
}

/* Technical Videos Page Styles */
.technical-videos-page {
	background-color: #ffffff;
	min-height: 100vh;
}

.technical-videos-hero {
	background-color: #f8f9fa;
	padding-top: 120px;
	padding-bottom: 80px;
}

.technical-videos-hero h2 {
	letter-spacing: -0.02em;
	color: var(--branding-text-dark, #3C3C3C);
}

/* Ensure all headings use branding black on technical videos page */
.technical-videos-page h1,
.technical-videos-page h2,
.technical-videos-page h3,
.technical-videos-page h4,
.technical-videos-page h5,
.technical-videos-page h6 {
	color: var(--branding-text-dark, #3C3C3C) !important;
}

.technical-videos-hero .lead {
	font-size: 1.25rem;
	color: var(--branding-text-secondary, #6c757d);
}

/* Search Bar */
.video-search-wrapper .search-icon {
	left: 20px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 20px;
	color: var(--branding-text-secondary, #6c757d);
}

.video-search-input {
	background-color: #ffffff !important;
	border: 1px solid #dee2e6 !important;
	color: var(--branding-text-dark, #3C3C3C) !important;
	border-radius: 12px !important;
	padding-left: 50px !important;
}

.video-search-input:focus {
	background-color: #ffffff !important;
	border-color: var(--branding-primary, #E31E26) !important;
	box-shadow: 0 0 0 0.2rem rgba(227, 30, 38, 0.25) !important;
	color: var(--branding-text-dark, #3C3C3C) !important;
}

.video-search-input::placeholder {
	color: #adb5bd;
}

/* Category Filter Buttons */
.video-categories-section {
	background-color: #ffffff;
	border-color: #dee2e6 !important;
}

.category-filter-btn {
	border-radius: 20px;
	padding: 8px 20px;
	background-color: transparent;
	border-color: #dee2e6;
	color: var(--branding-text-secondary, #6c757d);
	transition: all 0.3s ease;
}

.category-filter-btn:hover {
	border-color: var(--branding-primary, #E31E26);
	color: var(--branding-primary, #E31E26);
}

.category-filter-btn.active {
	background-color: var(--branding-primary, #E31E26) !important;
	border-color: var(--branding-primary, #E31E26) !important;
	color: #fff !important;
}

/* Video Content Section */
.video-content-section {
	background-color: #ffffff;
}

/* h2 color now handled by general heading rule above */

/* Video Cards */
.video-card {
	background-color: #ffffff;
	border: 1px solid #dee2e6;
	border-radius: 12px;
	overflow: hidden;
	transition: all 0.3s ease;
}

.video-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
	border-color: var(--branding-primary-light, #FCE4E5);
}

.video-thumbnail {
	position: relative;
	overflow: hidden;
	aspect-ratio: 16/9;
}

.video-thumbnail img {
	object-fit: cover;
	transition: transform 0.3s ease;
}

.video-card:hover .video-thumbnail img {
	transform: scale(1.05);
}

/* Video Play Overlay */
.video-play-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.4);
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: opacity 0.3s ease;
}

.video-card:hover .video-play-overlay {
	opacity: 1;
}

.play-button {
	width: 60px;
	height: 60px;
	background-color: var(--branding-primary, #E31E26);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.play-button i {
	color: white;
	font-size: 24px;
	margin-left: 4px;
}

/* Video Card Body */
.video-card-body {
	background-color: #ffffff;
}

.video-title {
	color: var(--branding-text-dark, #3C3C3C);
	font-size: 0.875rem;
	line-height: 1.5;
}

/* Text Colors - Override for white background */
.technical-videos-page .text-white {
	color: var(--branding-text-dark, #3C3C3C) !important;
}

.technical-videos-page .text-white-50 {
	color: var(--branding-text-secondary, #6c757d) !important;
}

/* CTA Section */
.video-cta-section {
	background-color: #f8f9fa;
}

/* Responsive adjustments */
@media (max-width: 767px) {
	.technical-videos-hero {
		padding-top: 40px; /* Reduced since body already has padding */
		padding-bottom: 40px;
	}

	.technical-videos-hero h2 {
		font-size: 2rem;
	}

	.category-filter-btn {
		padding: 6px 15px;
		font-size: 0.875rem;
	}
}

/* ===== PRODUCT OVERVIEWS PAGE ===== */

/* Product Overview Links */
.product-overviews-page a.storage-link,
.product-overviews-page .storage-link {
	color: var(--branding-primary, #E31E26) !important;
	text-decoration: none !important;
}

.product-overviews-page a.storage-link:hover,
.product-overviews-page .storage-link:hover {
	color: var(--branding-primary-hover, #C01920) !important;
	text-decoration: none !important;
}

/* ===== WHITEPAPERS PAGE ===== */

/* Hero Section */
.whitepapers-hero {
	background-color: #f8f9fa;
	padding-top: 120px;
	padding-bottom: 40px;
}

.whitepapers-hero h2 {
	letter-spacing: -0.02em;
	color: var(--branding-text-dark, #3C3C3C);
}

/* Ensure all headings use branding black on whitepapers page */
.whitepapers-page h1,
.whitepapers-page h2,
.whitepapers-page h3,
.whitepapers-page h4,
.whitepapers-page h5,
.whitepapers-page h6 {
	color: var(--branding-text-dark, #3C3C3C) !important;
}

.whitepapers-hero .lead {
	font-size: 1.25rem;
	color: var(--branding-text-secondary, #6c757d);
}

/* Search Bar */
.whitepaper-search-wrapper .search-icon {
	left: 20px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 20px;
	color: var(--branding-text-secondary, #6c757d);
}

.whitepaper-search-input {
	background-color: #ffffff !important;
	border: 2px solid #dee2e6 !important;
	border-radius: 50px !important;
	padding-left: 55px !important;
	font-size: 1rem;
	transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.whitepaper-search-input:focus {
	border-color: var(--branding-primary, #E31E26) !important;
	box-shadow: 0 0 0 0.2rem rgba(227, 30, 38, 0.15) !important;
	background-color: #ffffff !important;
}

/* Category Filter Section */
.whitepaper-categories-section {
	background-color: #ffffff;
	border-color: #dee2e6 !important;
}

/* Category Filter Buttons */
.whitepapers-page .category-filter-btn {
	border-radius: 20px;
	padding: 8px 20px;
	background-color: transparent;
	border: 1px solid #dee2e6;
	color: var(--branding-text-secondary, #6c757d);
	transition: all 0.3s ease;
}

.whitepapers-page .category-filter-btn:hover {
	border-color: var(--branding-primary, #E31E26);
	color: var(--branding-primary, #E31E26);
}

.whitepapers-page .category-filter-btn.active {
	background-color: var(--branding-primary, #E31E26) !important;
	border-color: var(--branding-primary, #E31E26) !important;
	color: #fff !important;
}

/* Whitepaper Cards */
.whitepapers-page .whitepaper-item {
	transition: opacity 0.3s ease;
}

.whitepapers-page .card {
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.whitepapers-page .card:hover {
	transform: translateY(-5px);
	box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.15) !important;
}

/* ===== CASE STUDIES PAGE ===== */

/* Hero Section */
.case-studies-hero {
	background-color: #f8f9fa;
	padding-top: 120px;
	padding-bottom: 40px;
}

.case-studies-hero h1 {
	letter-spacing: -0.02em;
	color: var(--branding-text-dark, #3C3C3C);
}

/* Ensure all headings use branding black on case studies page */
.case-studies-page h1,
.case-studies-page h2,
.case-studies-page h3,
.case-studies-page h4,
.case-studies-page h5,
.case-studies-page h6 {
	color: var(--branding-text-dark, #3C3C3C) !important;
}

.case-studies-hero .lead {
	font-size: 1.25rem;
	color: var(--branding-text-secondary, #6c757d);
}

/* Search Bar */
.case-study-search-wrapper .search-icon {
	left: 20px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 20px;
	color: var(--branding-text-secondary, #6c757d);
}

.case-study-search-input {
	background-color: #ffffff !important;
	border: 2px solid #dee2e6 !important;
	border-radius: 50px !important;
	padding-left: 55px !important;
	font-size: 1rem;
	transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.case-study-search-input:focus {
	border-color: var(--branding-primary, #E31E26) !important;
	box-shadow: 0 0 0 0.2rem rgba(227, 30, 38, 0.15) !important;
	background-color: #ffffff !important;
}

/* Case Study Cards */
.case-studies-page .case-study-item {
	transition: opacity 0.3s ease;
}

.case-studies-page .card {
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.case-studies-page .card:hover {
	transform: translateY(-5px);
	box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.15) !important;
}

/* ===== APPLICATION FOCUS PAGE ===== */

/* Hero Section */
.application-hero {
	background-color: #f8f9fa;
	padding-top: 120px;
	padding-bottom: 40px;
}

.application-hero h1 {
	letter-spacing: -0.02em;
	color: var(--branding-text-dark, #3C3C3C);
}

/* Ensure all headings use branding black on application page */
.application-focus-page h1,
.application-focus-page h2,
.application-focus-page h3,
.application-focus-page h4,
.application-focus-page h5,
.application-focus-page h6 {
	color: var(--branding-text-dark, #3C3C3C) !important;
}

.application-hero .lead {
	font-size: 1.25rem;
	color: var(--branding-text-secondary, #6c757d);
}

/* Application Cards */
.application-card {
	overflow: hidden;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.application-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.15) !important;
}

.application-image-wrapper {
	position: relative;
	overflow: hidden;
	height: 280px;
}

.application-card-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s ease;
}

.application-card:hover .application-card-image {
	transform: scale(1.1);
}

.application-overlay {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.4));
	padding: 1.5rem;
	transition: background 0.3s ease;
}

.application-card:hover .application-overlay {
	background: linear-gradient(to top, rgba(227, 30, 38, 0.9), rgba(252, 164, 28, 0.7));
}

.application-overlay-content h2 {
	color: #ffffff !important;
	margin: 0;
	font-size: 1.25rem;
}

/* ===== NEWS ARTICLES PAGE ===== */

/* Hero Section */
.news-hero {
	background-color: #f8f9fa;
	padding-top: 120px;
	padding-bottom: 40px;
}

.news-hero h1 {
	letter-spacing: -0.02em;
	color: var(--branding-text-dark, #3C3C3C);
}

/* Ensure all headings use branding black on news page */
.news-articles-page h1,
.news-articles-page h2,
.news-articles-page h3,
.news-articles-page h4,
.news-articles-page h5,
.news-articles-page h6 {
	color: var(--branding-text-dark, #3C3C3C) !important;
}

.news-hero .lead {
	font-size: 1.25rem;
	color: var(--branding-text-secondary, #6c757d);
}

/* Search Bar */
.news-search-wrapper .search-icon {
	left: 20px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 20px;
	color: var(--branding-text-secondary, #6c757d);
}

.news-search-input {
	background-color: #ffffff !important;
	border: 2px solid #dee2e6 !important;
	border-radius: 50px !important;
	padding-left: 55px !important;
	font-size: 1rem;
	transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.news-search-input:focus {
	border-color: var(--branding-primary, #E31E26) !important;
	box-shadow: 0 0 0 0.2rem rgba(227, 30, 38, 0.15) !important;
	background-color: #ffffff !important;
}

/* Article Cards */
.news-article-card {
	transition: opacity 0.3s ease;
}

.news-article-card .card {
	overflow: hidden;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.news-article-card:hover .card {
	transform: translateY(-5px);
	box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.15) !important;
}

.article-image-wrapper {
	position: relative;
	overflow: hidden;
	height: 250px;
	background-color: #f8f9fa;
}

.article-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s ease;
}

.news-article-card:hover .article-image {
	transform: scale(1.1);
}

.article-category-badge {
	position: absolute;
	top: 15px;
	left: 15px;
	background-color: var(--branding-primary, #E31E26);
	color: #ffffff;
	padding: 6px 16px;
	font-size: 0.75rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	border-radius: 20px;
	z-index: 1;
}

.article-title {
	font-weight: 700;
	color: var(--branding-text-dark, #3C3C3C);
	line-height: 1.4;
	transition: color 0.3s ease;
	min-height: 60px;
}

.news-article-card:hover .article-title {
	color: var(--branding-primary, #E31E26);
}

.article-excerpt {
	font-size: 0.95rem;
	line-height: 1.6;
	color: var(--branding-text-secondary, #6c757d);
}

.article-meta {
	padding-top: 1rem;
	border-top: 1px solid #e9ecef;
}

.article-date {
	font-size: 0.875rem;
	color: var(--branding-text-secondary, #6c757d);
	font-weight: 500;
}

/* ===== CONTACT PAGE ===== */

/* Hero Section */
.contact-hero {
	background: linear-gradient(135deg, var(--branding-white-transparent-95), rgba(248, 249, 250, 0.9));
	position: relative;
	overflow: hidden;
}

.contact-hero h1 {
	font-size: 3.5rem;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -0.02em;
	color: var(--branding-text-dark, #3C3C3C);
}

.contact-hero .hero-subtitle {
	font-size: 1.25rem;
	color: var(--branding-gray-600);
	line-height: 1.6;
}

/* Three-Step Process Cards */
.contact-step-card {
	background: #ffffff;
	padding: 2.5rem 2rem;
	border-radius: 16px;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
	transition: all 0.3s ease;
	height: 100%;
	border: 2px solid transparent;
}

.contact-step-card:hover {
	transform: translateY(-8px);
	box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);
	border-color: var(--branding-primary, #E31E26);
}

.step-number {
	width: 70px;
	height: 70px;
	line-height: 70px;
	margin: 0 auto;
	background: linear-gradient(135deg, var(--branding-primary, #E31E26) 0%, var(--branding-secondary, #FCA41C) 100%);
	color: #ffffff;
	border-radius: 50%;
	font-size: 1.75rem;
	font-weight: 700;
	display: inline-block;
	text-align: center;
	box-shadow: 0 4px 16px rgba(227, 30, 38, 0.25);
}

/* Contact Form */
.contact-form-wrapper {
	background: #ffffff;
	padding: 2.5rem;
	border-radius: 12px;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}

.contact-form .form-label {
	color: var(--branding-text-dark, #3C3C3C);
	margin-bottom: 0.5rem;
}

.contact-form .form-control {
	border: 2px solid #dee2e6;
	border-radius: 8px;
	padding: 0.75rem 1rem;
	transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.contact-form .form-control:focus {
	border-color: var(--branding-primary, #E31E26);
	box-shadow: 0 0 0 0.2rem rgba(227, 30, 38, 0.15);
}

.contact-form textarea.form-control {
	resize: vertical;
	min-height: 150px;
}

/* Contact Form Links - Privacy Policy and Terms */
.contact-form a,
.contact-form .form-group a,
.contact-form label a {
	color: var(--branding-primary, #E31E26) !important;
	text-decoration: none !important;
}

.contact-form a:hover,
.contact-form .form-group a:hover,
.contact-form label a:hover {
	color: var(--branding-primary-hover, #C01920) !important;
	text-decoration: none !important;
}

/* Contact Information */
.contact-info-wrapper {
	position: sticky;
	top: 100px;
}

.contact-info-item {
	display: flex;
	align-items: flex-start;
	padding: 1.5rem;
	background: #f8f9fa;
	border-radius: 12px;
	transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.contact-info-item:hover {
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
	transform: translateX(5px);
}

.contact-info-icon {
	width: 50px;
	height: 50px;
	min-width: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(135deg, var(--branding-primary, #E31E26) 0%, var(--branding-secondary, #FCA41C) 100%);
	color: #ffffff;
	border-radius: 10px;
	margin-right: 1rem;
	font-size: 1.25rem;
}

.contact-info-content h3 {
	color: var(--branding-text-dark, #3C3C3C);
	margin-bottom: 0.25rem;
}

.contact-info-content a {
	color: var(--branding-primary, #E31E26);
	font-weight: 500;
	transition: opacity 0.3s ease;
}

.contact-info-content a:hover {
	opacity: 0.8;
}

.contact-info-content p {
	color: var(--branding-text-secondary, #6c757d);
	margin: 0;
	line-height: 1.7;
}

/* Social Links in Contact */
.contact-social .social-links {
	display: flex;
	gap: 1rem;
}

.contact-social .social-link {
	width: 45px;
	height: 45px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #f8f9fa;
	color: var(--branding-text-dark, #3C3C3C);
	border-radius: 10px;
	font-size: 1.25rem;
	transition: all 0.3s ease;
	text-decoration: none;
}

.contact-social .social-link:hover {
	background: linear-gradient(135deg, var(--branding-primary, #E31E26) 0%, var(--branding-secondary, #FCA41C) 100%);
	color: #ffffff;
	transform: translateY(-3px);
	box-shadow: 0 4px 12px rgba(227, 30, 38, 0.3);
}

/* Ensure all headings use branding black on contact page */
.contact-page h1,
.contact-page h2,
.contact-page h3,
.contact-page h4,
.contact-page h5,
.contact-page h6 {
	color: var(--branding-text-dark, #3C3C3C) !important;
}

/* Responsive Adjustments */
@media (max-width: 991.98px) {
	.contact-info-wrapper {
		position: static;
		top: auto;
	}

	.contact-form-wrapper {
		margin-bottom: 2rem;
	}
}

/* ===== FAQs PAGE ===== */

/* Hero Section */
.faqs-hero {
	background-color: #f8f9fa;
	padding-top: 120px;
	padding-bottom: 40px;
}

.faqs-hero h1 {
	letter-spacing: -0.02em;
	color: var(--branding-text-dark, #3C3C3C);
}

.faqs-hero .lead {
	font-size: 1.25rem;
	color: var(--branding-text-secondary, #6c757d);
}

/* Search Bar */
.faqs-search-wrapper .search-icon {
	left: 20px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 20px;
	color: var(--branding-text-secondary, #6c757d);
}

.faqs-search-input {
	background-color: #ffffff !important;
	border: 2px solid #dee2e6 !important;
	border-radius: 50px !important;
	padding-left: 55px !important;
	font-size: 1rem;
	transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.faqs-search-input:focus {
	border-color: var(--branding-primary, #E31E26) !important;
	box-shadow: 0 0 0 0.2rem rgba(227, 30, 38, 0.15) !important;
	background-color: #ffffff !important;
}

/* FAQ Accordion Items */
.faqs-page .accordion-item {
	background: #ffffff;
	border: none;
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
	transition: box-shadow 0.3s ease;
}

.faqs-page .accordion-item:hover {
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.faqs-page .accordion-button {
	background-color: #ffffff;
	color: var(--branding-text-dark, #3C3C3C);
	font-weight: 600;
	font-size: 1.1rem;
	padding: 1.5rem 1.75rem;
	border: none;
	transition: background-color 0.3s ease, color 0.3s ease;
}

.faqs-page .accordion-button:not(.collapsed) {
	background-color: #f8f9fa;
	color: var(--branding-primary, #E31E26);
	box-shadow: none;
}

.faqs-page .accordion-button:focus {
	box-shadow: none;
	border: none;
}

.faqs-page .accordion-button::after {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%233C3C3C'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
	transition: transform 0.3s ease;
}

.faqs-page .accordion-button:not(.collapsed)::after {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23E31E26'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
	transform: rotate(-180deg);
}

.faqs-page .accordion-body {
	padding: 1.5rem 1.75rem;
	color: var(--branding-text-secondary, #6c757d);
	line-height: 1.7;
	font-size: 1rem;
	background-color: #ffffff;
}

.faqs-page .accordion-body a {
	color: var(--branding-primary, #E31E26) !important;
	text-decoration: none !important;
	font-weight: 500;
	transition: opacity 0.3s ease;
}

.faqs-page .accordion-body a:hover {
	opacity: 0.8;
	text-decoration: none !important;
}

.faqs-page .accordion-body ins {
	text-decoration: none !important;
}

.faqs-page .accordion-body a ins {
	color: var(--branding-primary, #E31E26) !important;
	text-decoration: none !important;
}

/* Ensure all headings use branding black on FAQs page */
.faqs-page h1,
.faqs-page h2,
.faqs-page h3,
.faqs-page h4,
.faqs-page h5,
.faqs-page h6 {
	color: var(--branding-text-dark, #3C3C3C) !important;
}

/* Pagination Styling */
.news-articles-page .pagination {
	margin: 0 !important;
	padding: 0 !important;
}

.news-articles-page .pagination li {
	display: inline-block !important;
	margin: 0 3px !important;
}

.news-articles-page .pagination a,
.news-articles-page .pagination span {
	display: inline-block !important;
	padding: 8px 14px !important;
	min-width: 38px !important;
	text-align: center !important;
	color: #3C3C3C !important;
	background: #ffffff !important;
	border: 2px solid #e9ecef !important;
	border-radius: 6px !important;
	text-decoration: none !important;
	font-weight: 600 !important;
	font-size: 14px !important;
	transition: all 0.3s ease !important;
}

.news-articles-page .pagination a:hover {
	color: #ffffff !important;
	background: #E31E26 !important;
	border-color: #E31E26 !important;
	transform: translateY(-2px) !important;
	box-shadow: 0 4px 12px rgba(227, 30, 38, 0.3) !important;
}

.news-articles-page .pagination .active span {
	color: #ffffff !important;
	background: #E31E26 !important;
	border-color: #E31E26 !important;
	box-shadow: 0 4px 12px rgba(227, 30, 38, 0.35) !important;
}

.news-articles-page .pagination .disabled span {
	color: #adb5bd !important;
	background: #f8f9fa !important;
	border-color: #e9ecef !important;
	opacity: 0.6 !important;
	cursor: not-allowed !important;
}

/* ===== PRIVACY POLICY PAGE ===== */

/* Hero Section */
.privacy-hero {
	background: linear-gradient(135deg, rgba(227, 30, 38, 0.05), rgba(252, 164, 28, 0.05));
	padding-top: 120px;
	padding-bottom: 60px;
}

.privacy-hero h1 {
	letter-spacing: -0.02em;
	color: var(--branding-text-dark, #3C3C3C);
}

.privacy-hero .badge {
	font-size: 0.875rem;
	padding: 0.5rem 1rem;
	font-weight: 600;
}

/* Introduction Card */
.privacy-intro {
	border-left: 4px solid var(--branding-primary, #E31E26);
}

.privacy-intro a {
	color: var(--branding-primary, #E31E26) !important;
	text-decoration: none !important;
	font-weight: 600;
}

.privacy-intro a:hover {
	color: var(--branding-primary-hover, #C01920) !important;
	text-decoration: underline !important;
}

/* Privacy Cards - Quick Links */
.privacy-card {
	background: #ffffff;
	padding: 2rem;
	border-radius: 12px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
	transition: all 0.3s ease;
	text-align: center;
	border: 2px solid transparent;
}

.privacy-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 20px rgba(227, 30, 38, 0.15);
	border-color: var(--branding-primary, #E31E26);
}

.privacy-card .privacy-icon {
	width: 60px;
	height: 60px;
	margin: 0 auto 1.5rem;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--branding-primary), var(--branding-secondary));
	display: flex;
	align-items: center;
	justify-content: center;
}

.privacy-card .privacy-icon i,
.privacy-card .privacy-icon .fa,
.privacy-card .privacy-icon [class*="fa-"] {
	font-size: 1.75rem;
	color: #ffffff !important;
}

/* Force white color on all icon variations */
.privacy-icon i,
.privacy-icon .fa,
.privacy-icon [class^="fa-"],
.privacy-icon [class*=" fa-"] {
	color: #ffffff !important;
}

/* Privacy Definition Cards */
.privacy-definition-card {
	background: #f8f9fa;
	padding: 1.5rem;
	border-radius: 10px;
	height: 100%;
	transition: all 0.3s ease;
}

.privacy-definition-card:hover {
	background: #ffffff;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.privacy-definition-card .privacy-icon {
	width: 50px;
	height: 50px;
	margin: 0 auto 1rem;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--branding-primary), var(--branding-secondary));
	display: flex;
	align-items: center;
	justify-content: center;
}

.privacy-definition-card .privacy-icon i,
.privacy-definition-card .privacy-icon .fa {
	font-size: 1.5rem;
	color: #ffffff !important;
}

/* Privacy Content Cards */
.privacy-content-card {
	background: #ffffff;
	padding: 2.5rem;
	border-radius: 12px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

/* Privacy Lists */
.privacy-list {
	list-style: none;
	padding-left: 0;
	margin-bottom: 0;
}

.privacy-list li {
	padding-left: 1.5rem;
	margin-bottom: 0.75rem;
	position: relative;
}

.privacy-list li:before {
	content: "•";
	color: var(--branding-primary, #E31E26);
	font-weight: bold;
	font-size: 1.25rem;
	position: absolute;
	left: 0;
	top: -2px;
}

.privacy-list li:last-child {
	margin-bottom: 0;
}

/* Privacy Form Cards */
.privacy-form-card {
	background: #ffffff;
	padding: 2.5rem;
	border-radius: 12px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.privacy-form-card .form-control {
	border: 2px solid #dee2e6;
	border-radius: 8px;
	padding: 0.75rem 1rem;
	transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.privacy-form-card .form-control:focus {
	border-color: var(--branding-primary, #E31E26);
	box-shadow: 0 0 0 0.2rem rgba(227, 30, 38, 0.15);
}

.privacy-form-card textarea.form-control {
	resize: vertical;
	min-height: 120px;
}

.privacy-form-card .btn {
	padding: 0.75rem 2rem;
	font-weight: 600;
}

/* Privacy Policy Links */
.privacy-content-card a,
.privacy-intro a,
section a {
	color: var(--branding-primary, #E31E26) !important;
	text-decoration: none !important;
	font-weight: 500;
}

.privacy-content-card a:hover,
.privacy-intro a:hover,
section a:hover {
	color: var(--branding-primary-hover, #C01920) !important;
	text-decoration: none !important;
}

/* Responsive Adjustments */
@media (max-width: 767.98px) {
	.privacy-hero {
		padding-top: 80px;
		padding-bottom: 40px;
	}

	.privacy-card,
	.privacy-content-card,
	.privacy-form-card {
		padding: 1.5rem;
	}

	.privacy-definition-card {
		padding: 1.25rem;
	}
}

/* ===== BLOG TEMPLATE PAGE ===== */

/* Blog Hero Section */
.blog-hero {
	position: relative;
	min-height: 60vh;
	display: flex;
	align-items: center;
	overflow: hidden;
	padding: 120px 0 80px;
}

.blog-hero-image {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	z-index: 1;
}

.blog-hero-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(30, 34, 40, 0.7);
	z-index: 2;
}

.blog-hero .container {
	z-index: 3;
}

.blog-hero h1 {
	letter-spacing: -0.02em;
	line-height: 1.2;
}

.blog-hero-intro {
	font-size: 1.125rem;
	line-height: 1.7;
	opacity: 0.95;
}

.blog-hero-intro p {
	font-size: 1.125rem;
	margin-bottom: 1rem;
}

.min-vh-60 {
	min-height: 60vh;
}

/* Blog Hero Card */
.blog-hero-card {
	background: #ffffff;
	border-radius: 12px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
	overflow: hidden;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.blog-hero-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 15px 40px rgba(0, 0, 0, 0.25);
}

.blog-hero-card-image img {
	width: 100%;
	height: auto;
	display: block;
}

.blog-hero-card-body {
	padding: 2rem;
}

.blog-hero-card-body h3 {
	color: var(--branding-text-dark, #3C3C3C);
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

/* Blog Main Content */
.blog-main-content {
	background: #ffffff;
}

.blog-content-wrapper {
	background: #ffffff;
	padding: 2.5rem;
	border-radius: 12px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

/* Blog Content Block Styling */
.blog-content-block h2 {
	color: var(--branding-text-dark, #3C3C3C);
	font-weight: 700;
	margin-top: 2.5rem;
	margin-bottom: 1rem;
	font-size: 1.75rem;
	line-height: 1.3;
}

.blog-content-block h2:first-child {
	margin-top: 0;
}

.blog-content-block h3 {
	color: var(--branding-text-dark, #3C3C3C);
	font-weight: 600;
	margin-top: 2rem;
	margin-bottom: 1rem;
	font-size: 1.5rem;
	line-height: 1.4;
}

.blog-content-block h4 {
	color: var(--branding-text-dark, #3C3C3C);
	font-weight: 600;
	margin-top: 1.5rem;
	margin-bottom: 0.75rem;
	font-size: 1.25rem;
}

.blog-content-block p {
	font-size: 1.125rem;
	line-height: 1.8;
	color: var(--branding-text-secondary, #6c757d);
	margin-bottom: 1.25rem;
}

.blog-content-block ul,
.blog-content-block ol {
	font-size: 1.125rem;
	line-height: 1.8;
	color: var(--branding-text-secondary, #6c757d);
	margin-bottom: 1.5rem;
	padding-left: 2rem;
}

.blog-content-block ul {
	list-style-type: disc;
}

.blog-content-block ol {
	list-style-type: decimal;
}

.blog-content-block li {
	margin-bottom: 0.5rem;
	padding-left: 0.5rem;
}

.blog-content-block li::marker {
	color: var(--branding-primary, #E31E26);
}

.blog-content-block a {
	color: var(--branding-primary, #E31E26) !important;
	text-decoration: none !important;
	font-weight: 500;
	transition: color 0.2s ease;
}

.blog-content-block a:hover {
	color: var(--branding-primary-hover, #C01920) !important;
	text-decoration: none !important;
}

.blog-content-block ins,
.blog-content-block a ins {
	text-decoration: none !important;
}

.blog-content-block hr {
	margin: 3rem 0;
	border: 0;
	border-top: 2px solid #e9ecef;
	opacity: 1;
}

.blog-content-block img {
	max-width: 100%;
	height: auto;
	border-radius: 8px;
	margin: 2rem 0;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.blog-content-block blockquote {
	border-left: 4px solid var(--branding-primary, #E31E26);
	padding-left: 1.5rem;
	margin: 2rem 0;
	font-style: italic;
	color: var(--branding-text-dark, #3C3C3C);
	background: #f8f9fa;
	padding: 1.5rem;
	border-radius: 8px;
}

.blog-content-block code {
	background: #f8f9fa;
	padding: 0.25rem 0.5rem;
	border-radius: 4px;
	font-size: 0.95em;
	color: var(--branding-primary, #E31E26);
}

.blog-content-block pre {
	background: #f8f9fa;
	padding: 1.5rem;
	border-radius: 8px;
	overflow-x: auto;
	margin: 1.5rem 0;
}

.blog-content-block pre code {
	background: transparent;
	padding: 0;
	color: var(--branding-text-dark, #3C3C3C);
}

/* Blog Sidebar */
.blog-sidebar {
	background: #f8f9fa;
	padding: 2rem;
	border-radius: 12px;
	border: 2px solid #e9ecef;
}

/* Blog Recent Section */
.blog-recent {
	background: #f8f9fa;
}

.blog-recent h2 {
	letter-spacing: -0.02em;
}

/* Responsive Adjustments */
@media (max-width: 991.98px) {
	.blog-hero {
		min-height: auto;
		padding: 100px 0 60px;
	}

	.blog-hero h1 {
		font-size: 2rem;
	}

	.blog-hero-intro {
		font-size: 1rem;
	}

	.blog-hero-card {
		margin-top: 2rem;
	}

	.blog-content-wrapper {
		padding: 1.5rem;
	}

	.blog-content-block h2 {
		font-size: 1.5rem;
	}

	.blog-content-block h3 {
		font-size: 1.25rem;
	}

	.blog-content-block p,
	.blog-content-block ul,
	.blog-content-block ol {
		font-size: 1rem;
	}

	.blog-sidebar {
		margin-bottom: 2rem;
		position: static !important;
		top: auto !important;
	}
}

@media (max-width: 575.98px) {
	.blog-hero {
		padding: 80px 0 40px;
	}

	.blog-hero h1 {
		font-size: 1.75rem;
	}

	.blog-hero-card-body {
		padding: 1.5rem;
	}

	.blog-hero-card-body .d-flex {
		flex-direction: column;
	}

	.blog-hero-card-body .btn {
		width: 100%;
	}

	.blog-content-wrapper {
		padding: 1rem;
	}

	.blog-content-block h2 {
		font-size: 1.35rem;
		margin-top: 2rem;
	}

	.blog-content-block h3 {
		font-size: 1.15rem;
		margin-top: 1.5rem;
	}
}

/* ========================================================================
   NEWS BLOCK / BLOG CARDS STYLING
   ======================================================================== */

.LatestNews-section {
	padding: 4rem 0;
}

.post-container {
	background: #ffffff;
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
	transition: all 0.3s ease;
	height: 100%;
	display: flex;
	flex-direction: column;
}

.post-container:hover {
	transform: translateY(-8px);
	box-shadow: 0 12px 32px rgba(227, 30, 38, 0.2);
}

.post-container .thumbnail {
	width: 100%;
	height: 200px;
	overflow: hidden;
	position: relative;
}

.post-container .thumbnail img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.post-container:hover .thumbnail img {
	transform: scale(1.1);
}

.post-container .post-content {
	padding: 1.5rem;
	flex: 1;
	display: flex;
	flex-direction: column;
}

.post-container .post-content .title {
	font-size: 1.25rem;
	font-weight: 600;
	color: #1e2228;
	margin-bottom: 0.75rem;
	line-height: 1.4;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.post-container .post-content .description {
	color: #666;
	font-size: 0.95rem;
	line-height: 1.6;
	margin-bottom: 1rem;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.post-container .post-meta {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin-top: auto;
	padding-top: 1rem;
	border-top: 1px solid #f0f0f0;
}

.post-container .post-meta .timestamp {
	color: var(--branding-primary, #E31E26);
	font-size: 0.9rem;
	font-weight: 500;
	display: flex;
	align-items: center;
	gap: 0.4rem;
}

.post-container .post-meta .timestamp i {
	color: var(--branding-amber, #FCA41C);
}

/* Responsive adjustments */
@media (max-width: 768px) {
	.post-container .thumbnail {
		height: 180px;
	}

	.post-container .post-content {
		padding: 1.25rem;
	}

	.post-container .post-content .title {
		font-size: 1.1rem;
	}
}

/* ========================================================================
   HOMEPAGE CTA SECTION STYLING
   ======================================================================== */

#contact-cta .btn-outline-light,
#contact-cta .btn-light {
	background-color: #ffffff !important;
	color: var(--branding-primary, #E31E26) !important;
	border-color: #ffffff !important;
	font-weight: 600;
}

#contact-cta .btn-outline-light:hover,
#contact-cta .btn-light:hover {
	background-color: #1e2228 !important;
	color: #ffffff !important;
	border-color: #1e2228 !important;
	transform: translateY(-2px);
}


/* ========================================================================
   PRODUCT PAGE MOBILE RESPONSIVENESS
   ======================================================================== */

/* Product tabs mobile styling */
@media (max-width: 768px) {
	.product-details-section .nav-tabs {
		flex-wrap: nowrap;
		overflow-x: auto;
		overflow-y: hidden;
		-webkit-overflow-scrolling: touch;
		border-bottom: 2px solid #dee2e6;
		scrollbar-width: thin;
		scrollbar-color: var(--branding-primary, #E31E26) #f0f0f0;
	}

	.product-details-section .nav-tabs::-webkit-scrollbar {
		height: 4px;
	}

	.product-details-section .nav-tabs::-webkit-scrollbar-track {
		background: #f0f0f0;
	}

	.product-details-section .nav-tabs::-webkit-scrollbar-thumb {
		background: var(--branding-primary, #E31E26);
		border-radius: 2px;
	}

	.product-details-section .nav-item {
		flex-shrink: 0;
	}

	.product-details-section .nav-link {
		white-space: nowrap;
		padding: 0.75rem 1rem;
		font-size: 0.9rem;
	}

	.product-details-section .tab-content .bg-white {
		padding: 1.5rem !important;
	}

	.product-details-section .table-responsive {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	.product-details-section table {
		font-size: 0.875rem;
	}

	.product-details-section table td,
	.product-details-section table th {
		padding: 0.5rem;
		white-space: nowrap;
	}

	/* Stock table mobile adjustments */
	.stockTable {
		font-size: 0.8rem;
	}

	.stockTable td,
	.stockTable th {
		padding: 0.4rem !important;
	}

	.stockTable .btn {
		font-size: 0.75rem !important;
		padding: 0.25rem 0.5rem !important;
	}
}

/* ========================================================================
   PRODUCT PAGE TECHNICAL RESOURCES
   ======================================================================== */

/* Fix download icon alignment */
.product-details-section .d-flex.align-items-center {
	align-items: flex-start !important;
}

.product-details-section .d-flex.align-items-center .bi-file-earmark-text {
	flex-shrink: 0;
	margin-top: 0.25rem;
}

.product-details-section .d-flex.align-items-center .flex-grow-1 {
	min-width: 0;
	overflow-wrap: break-word;
}

.product-details-section .d-flex.align-items-center .btn {
	flex-shrink: 0;
	margin-left: 0.5rem;
}

/* Hide "Need Help Choosing" section on product page */
.product-details-section .text-center h6.fw-bold:contains("Need Help Choosing?"),
.product-details-section .text-center:has(h6:contains("Need Help")) {
	display: none;
}

/* Alternative approach - hide the entire help section after hr */
.product-details-section .col-lg-4 hr + .text-center {
	display: none !important;
}

.product-details-section .col-lg-4 hr {
	display: none !important;
}

.shop-product {
	display: none;
}
/* ========================================================================
   MEGA MENU - LIMIT CHILDREN TO 4 ITEMS
   ======================================================================== */

.lower-level .row > div:nth-child(n+5) {
	display: none !important;
}

/* ========================================================================
   MEGA MENU - IMAGE LEFT OF TITLES
   ======================================================================== */

.lower-level a {
	display: flex !important;
	align-items: center !important;
	gap: 0.75rem;
}

.lower-level a img {
	width: 30px;
	height: 30px;
	object-fit: cover;
	border-radius: 4px;
	flex-shrink: 0;
}

.lower-level a .megaMenuColumnName {
	flex: 1;
}

/* ========================================================================
   MEGA MENU - SHOW IMAGES
   ======================================================================== */

.strainsense-navbar .megamenu img,
.strainsense-navbar .megamenu .card-img-top,
.strainsense-navbar .megamenu .card img {
	display: block !important;
}

/* Position image to left of heading in mega menu */
.strainsense-navbar .megamenu .lower-level a {
	display: flex !important;
	align-items: center !important;
	flex-direction: row !important;
	gap: 0.75rem !important;
}

.strainsense-navbar .megamenu .lower-level a img {
	order: -1 !important;
	margin: 0 !important;
}

.strainsense-navbar .megamenu .lower-level a .megaMenuColumnName {
	order: 1 !important;
}

/* Hide main category images, keep child category images */
.strainsense-navbar .megamenu .nav-top-level-2 > a > img {
	display: none !important;
}

.strainsense-navbar .megamenu .nav-top-level-3 img,
.strainsense-navbar .megamenu .lower-level img {
	display: block !important;
}

/* Ensure mega menu children are limited to 4 items - more specific */
.strainsense-navbar .megamenu .lower-level .row > div:nth-child(n+5) {
	display: none !important;
}

.nav-level-3 .row > div:nth-child(n+5) {
	display: none !important;
}

/* Mobile Search Bar Styles */
.mobile-search-item {
	width: 100%;
	padding: 10px 15px;
}

.mobile-search-form {
	width: 100%;
}

.mobile-search-wrapper {
	display: flex;
	align-items: stretch;
	width: 100%;
	border: 1px solid #dee2e6;
	background-color: white;
	overflow: hidden;
}

.mobile-search-input {
	flex: 1;
	border: none;
	border-radius: 0;
	padding: 0.75rem 1rem;
	font-size: 15px;
	box-sizing: border-box;
	background-color: white;
	min-width: 0;
}

.mobile-search-input:focus {
	outline: none;
	box-shadow: none;
}

.btn-mobile-search-submit {
	background: var(--branding-primary) !important;
	border: none !important;
	color: white !important;
	padding: 0.75rem !important;
	width: 50px !important;
	min-width: 50px !important;
	max-width: 50px !important;
	cursor: pointer;
	transition: all 0.3s ease;
	flex-shrink: 0 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	border-radius: 0 !important;
}

.btn-mobile-search-submit i {
	font-size: 18px;
}

.btn-mobile-search-submit:hover {
	background-color: var(--branding-primary-dark, #0056b3);
}

.btn-mobile-search-submit i {
	font-size: 18px;
}

/* Exhibitions Page Styles */
.exhibitions-page .exhibition-card {
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.exhibitions-page .exhibition-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.15) !important;
}

.exhibitions-page .exhibition-card .card-img-wrapper {
	position: relative;
	height: 300px;
}

.exhibitions-page .exhibition-card .card-img-wrapper img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.3s ease;
}

.exhibitions-page .exhibition-card:hover .card-img-wrapper img {
	transform: scale(1.05);
}

/* Careers Page Styles */
.careers-page .careers-image-wrapper {
	position: relative;
	overflow: hidden;
	border-radius: 8px;
	box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1);
}

.careers-page .careers-image {
	width: 100%;
	height: auto;
	display: block;
	transition: transform 0.3s ease;
}

.careers-page .careers-image-wrapper:hover .careers-image {
	transform: scale(1.05);
}

.careers-page .alert-info {
	background-color: #e8f4f8;
	border-left: 4px solid var(--branding-primary);
}

.careers-page .alert-info .bi-info-circle-fill {
	color: var(--branding-primary);
}