/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
	Mobile hamburger — amber bars on navy header
-----------------------------------------------------------------*/
.cnvs-hamburger .cnvs-hamburger-inner,
.cnvs-hamburger .cnvs-hamburger-inner::before,
.cnvs-hamburger .cnvs-hamburger-inner::after {
	background-color: #C8860A !important;
}

/* ----------------------------------------------------------------
	Brand — override Canvas theme colour (green → amber)
-----------------------------------------------------------------*/
:root {
	--cnvs-themecolor: #C8860A;
	--cnvs-themecolor-rgb: 200, 134, 10;
}

/* Unify header & footer background to Mitcorr navy */
.dark {
	--cnvs-header-bg: #0A1628;
	--cnvs-header-sticky-bg: #0A1628;
	--cnvs-footer-bg: #0A1628;
	--cnvs-contrast-bg: #0A1628;
	--cnvs-contrast-bg-offset: #111f38;
}

/* ----------------------------------------------------------------
	Logo sizing — header & footer
-----------------------------------------------------------------*/

/* Force logo size — remove all Canvas max constraints */
#logo,
#header-wrap #logo {
	max-height: none !important;
}

#logo img,
#header-wrap #logo img {
	height: 80px !important;
	width: auto !important;
	max-width: none !important;
	max-height: none !important;
	min-height: 80px !important;
}

/* Footer logo */
.footer-logo-img {
	height: 65px !important;
	width: auto !important;
	max-width: none !important;
	display: block;
	margin-bottom: 16px;
}

/* Counter + suffix */
.counter-plus::after {
	content: '+';
	font-size: inherit;
	font-weight: inherit;
	color: inherit;
}

/* ----------------------------------------------------------------
	Sectors We Serve — SVG icon system
-----------------------------------------------------------------*/
.feature-box.fbox-plain .fbox-icon {
	width: auto !important;
	padding: 2px 16px 0 0;
	flex-shrink: 0;
}
.feature-box.fbox-plain .fbox-icon a {
	display: block;
	width: auto !important;
	height: auto !important;
	color: #0A1628;
}
.feature-box.fbox-plain:hover .fbox-icon a {
	color: #C8860A;
}
.feature-box.fbox-plain .fbox-icon svg {
	display: block;
	width: 48px;
	height: 48px;
	stroke: currentColor;
	fill: none;
	stroke-width: 1.5;
	stroke-linecap: round;
	stroke-linejoin: round;
	transition: transform 0.2s ease;
}
.feature-box.fbox-plain:hover .fbox-icon svg {
	transform: scale(1.08);
}

/* ----------------------------------------------------------------
	Product Cards — SVG icon system
-----------------------------------------------------------------*/
.product-icon {
	display: block;
	width: 80px;
	height: 80px;
	margin-bottom: 20px;
	color: #0A1628;
	transition: color 0.2s ease, transform 0.2s ease;
}

.product-card:hover .product-icon {
	color: #C8860A;
	transform: scale(1.05);
}

.product-icon svg {
	width: 100%;
	height: 100%;
	stroke: currentColor;
	fill: none;
	stroke-width: 1.5;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* ----------------------------------------------------------------
	Client Logo Carousel — Consistent sizing & professional finish
-----------------------------------------------------------------*/
#oc-clients .oc-item {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 80px;
	padding: 8px 16px;
}

#oc-clients .oc-item img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	/* Crisp rendering for logos */
	image-rendering: -webkit-optimize-contrast;
	image-rendering: crisp-edges;
	/* Greyscale by default — colour on hover */
	filter: grayscale(100%) opacity(0.65);
	transition: filter 0.35s ease;
}

#oc-clients .oc-item img:hover {
	filter: grayscale(0%) opacity(1);
}

