/* Matsan shop fixes: scoped to WooCommerce so normal pages are untouched. */
.woocommerce ul.products,
.woocommerce-page ul.products {
	box-sizing: border-box;
}

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
	box-sizing: border-box;
	min-width: 0;
}

.woocommerce ul.products li.product a img,
.woocommerce-page ul.products li.product a img {
	display: block;
	width: 100%;
	max-width: 100%;
	height: clamp(240px, 24vw, 360px);
	margin-right: auto;
	margin-left: auto;
	object-fit: contain;
	object-position: center;
	background: #fff;
}

.single-product .related.products ul.products,
.single-product .upsells.products ul.products {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 24px;
}

.single-product .related.products ul.products li.product,
.single-product .upsells.products ul.products li.product {
	float: none;
	width: 100% !important;
	margin: 0 !important;
}

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

.matsan-mobile-nav [hidden] {
	display: none !important;
}

.matsan-foundation-page {
	--matsan-ink: #123c52;
	--matsan-green: #087a55;
	--matsan-soft: #f3f8f6;
	max-width: 1180px;
	margin: 0 auto;
	padding: 72px 28px 84px;
	color: #385565;
}

.matsan-foundation-page * {
	box-sizing: border-box;
}

.matsan-foundation-page__hero {
	max-width: 920px;
	margin-bottom: 64px;
}

.matsan-foundation-page__eyebrow {
	display: inline-block;
	margin-bottom: 14px;
	color: var(--matsan-green);
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
}

.matsan-foundation-page h1,
.matsan-foundation-page h2,
.matsan-foundation-page h3 {
	color: var(--matsan-ink);
}

.matsan-foundation-page h1 {
	margin: 0 0 22px;
	font-size: clamp(38px, 5vw, 68px);
	line-height: 1.06;
}

.matsan-foundation-page h2 {
	margin: 0 0 20px;
	font-size: clamp(28px, 3vw, 42px);
	line-height: 1.15;
}

.matsan-foundation-page h3 {
	margin: 0 0 12px;
	font-size: 21px;
}

.matsan-foundation-page p,
.matsan-foundation-page li {
	font-size: 17px;
	line-height: 1.75;
}

.matsan-foundation-page__hero > p {
	max-width: 820px;
	font-size: 20px;
}

.matsan-foundation-page section {
	margin-top: 64px;
}

.matsan-foundation-page__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 28px;
}

.matsan-foundation-page__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 12px 22px;
	border: 1px solid var(--matsan-green);
	border-radius: 999px;
	background: var(--matsan-green);
	color: #fff !important;
	font-weight: 800;
	text-decoration: none !important;
	transition: transform .2s ease, box-shadow .2s ease;
}

.matsan-foundation-page__button:hover {
	box-shadow: 0 10px 24px rgba(8, 122, 85, .22);
	transform: translateY(-2px);
}

.matsan-foundation-page__button--ghost {
	background: #fff;
	color: var(--matsan-green) !important;
}

.matsan-foundation-page__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px;
}

.matsan-foundation-page__card {
	display: block;
	padding: 28px;
	border: 1px solid #dfe9e5;
	border-radius: 18px;
	background: #fff;
	box-shadow: 0 8px 26px rgba(18, 60, 82, .06);
	color: inherit !important;
	text-decoration: none !important;
	transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}

.matsan-foundation-page__card:hover {
	border-color: #91c7b4;
	box-shadow: 0 16px 34px rgba(18, 60, 82, .1);
	transform: translateY(-3px);
}

.matsan-foundation-page__card > span {
	color: var(--matsan-green);
	font-weight: 800;
}

.matsan-foundation-page__band,
.matsan-foundation-page__cta {
	padding: clamp(28px, 5vw, 54px);
	border-radius: 24px;
	background: var(--matsan-soft);
}

.matsan-foundation-page__band ul {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 8px 28px;
	margin: 22px 0 0;
}

.matsan-foundation-page__cta {
	background: var(--matsan-ink);
	color: #eaf3f5;
}

.matsan-foundation-page__cta h2 {
	color: #fff;
}

@media (max-width: 700px) {
	.matsan-foundation-page {
		padding: 44px 20px 72px;
	}

	.matsan-foundation-page__hero,
	.matsan-foundation-page section {
		margin-bottom: 0;
		margin-top: 44px;
	}

	.matsan-foundation-page__hero {
		margin-top: 0;
	}

	.matsan-foundation-page__grid,
	.matsan-foundation-page__band ul {
		grid-template-columns: 1fr;
	}

	.matsan-foundation-page__card {
		padding: 22px;
	}

	.matsan-foundation-page p,
	.matsan-foundation-page li,
	.matsan-foundation-page__hero > p {
		font-size: 16px;
	}
}

/* Keep the homepage hero available on desktop even if the old theme visibility rule sticks. */
body.home .header-middle.type-slider,
body.home #header-slider-container,
body.home #header-slider-container .header-slider-wrapper,
body.home #rev_slider_15_1_wrapper,
body.home #rev_slider_15_1 {
	display: block !important;
}

body.home #rev_slider_15_1_wrapper {
	background-color: #000 !important;
	background-image: url("https://www.matsangroup.com/wp-content/uploads/revslider/video-media/matsan0612f_27.jpeg") !important;
	background-position: center !important;
	background-size: cover !important;
}

@media (min-width: 783px) {
	body.home #rev_slider_15_1_wrapper {
		visibility: visible !important;
		min-height: 520px;
	}
}

@media (max-width: 782px) {
	body {
		padding-bottom: calc(88px + env(safe-area-inset-bottom));
	}

	.woocommerce ul.products,
	.woocommerce-page ul.products,
	.single-product .related.products ul.products,
	.single-product .upsells.products ul.products {
		display: grid !important;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 14px;
		width: 100% !important;
		margin-right: 0 !important;
		margin-left: 0 !important;
	}

	.woocommerce ul.products::before,
	.woocommerce ul.products::after,
	.woocommerce-page ul.products::before,
	.woocommerce-page ul.products::after {
		display: none !important;
	}

	.woocommerce ul.products li.product,
	.woocommerce-page ul.products li.product {
		float: none !important;
		clear: none !important;
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 0 16px !important;
	}

	.woocommerce ul.products li.product a img,
	.woocommerce-page ul.products li.product a img {
		height: clamp(150px, 44vw, 220px);
	}

	.matsan-mobile-nav {
		display: block;
		position: relative;
		z-index: 99990;
		font-family: inherit;
	}

	.matsan-mobile-nav__bar {
		display: grid;
		position: fixed;
		right: 10px;
		bottom: calc(8px + env(safe-area-inset-bottom));
		left: 10px;
		grid-template-columns: repeat(5, minmax(0, 1fr));
		min-height: 70px;
		padding: 7px 5px 6px;
		border: 1px solid rgba(18, 58, 78, .1);
		border-radius: 21px;
		background: rgba(255, 255, 255, .96);
		box-shadow: 0 12px 40px rgba(11, 47, 66, .22), 0 2px 8px rgba(11, 47, 66, .08);
		-webkit-backdrop-filter: blur(18px);
		backdrop-filter: blur(18px);
		z-index: 2;
	}

	.matsan-mobile-nav__bar a,
	.matsan-mobile-nav__bar button {
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		gap: 4px;
		min-width: 0;
		padding: 5px 2px 3px;
		border: 0;
		border-radius: 13px;
		background: transparent;
		box-shadow: none;
		color: #31566a;
		font: inherit;
		font-size: 10.5px;
		font-weight: 700;
		line-height: 1.15;
		text-align: center;
		text-decoration: none;
		text-transform: none;
		cursor: pointer;
		transition: color .2s ease, background-color .2s ease, transform .2s ease;
	}

	.matsan-mobile-nav__bar button[aria-expanded="true"],
	.matsan-mobile-nav__bar .is-current,
	.matsan-mobile-nav__bar a:focus-visible,
	.matsan-mobile-nav__bar button:focus-visible {
		background: #edf7f3;
		color: #087a55;
		outline: 2px solid transparent;
	}

	.matsan-mobile-nav__bar a:active,
	.matsan-mobile-nav__bar button:active {
		transform: scale(.94);
	}

	.matsan-mobile-nav__bar svg {
		width: 22px;
		height: 22px;
		fill: none;
		stroke: currentColor;
		stroke-width: 1.85;
		stroke-linecap: round;
		stroke-linejoin: round;
		transition: transform .2s ease;
	}

	.matsan-mobile-nav__bar > :nth-child(3) {
		position: relative;
		padding-top: 33px;
	}

	.matsan-mobile-nav__bar > :nth-child(3) svg {
		position: absolute;
		top: -22px;
		left: 50%;
		width: 44px;
		height: 44px;
		padding: 10px;
		border: 4px solid #fff;
		border-radius: 50%;
		background: linear-gradient(145deg, #169b68, #087a55);
		box-shadow: 0 8px 20px rgba(8, 122, 85, .32);
		color: #fff;
		transform: translateX(-50%);
		box-sizing: border-box;
	}

	.matsan-mobile-nav__bar > :nth-child(3)[aria-expanded="true"] svg,
	.matsan-mobile-nav__bar > :nth-child(3).is-current svg {
		background: linear-gradient(145deg, #b22b72, #842054);
		box-shadow: 0 8px 20px rgba(132, 32, 84, .3);
	}

	.matsan-mobile-nav__backdrop {
		position: fixed;
		inset: 0;
		background: rgba(7, 29, 42, .46);
		-webkit-backdrop-filter: blur(2px);
		backdrop-filter: blur(2px);
		z-index: 0;
	}

	.matsan-mobile-nav__panel {
		position: fixed;
		right: 12px;
		bottom: calc(90px + env(safe-area-inset-bottom));
		left: 12px;
		max-height: min(58vh, 440px);
		overflow: auto;
		padding: 8px 16px 16px;
		border: 1px solid rgba(16, 48, 68, .08);
		border-radius: 22px;
		background: #fff;
		box-shadow: 0 24px 65px rgba(10, 29, 41, .3);
		z-index: 1;
		animation: matsan-panel-in .2s ease-out;
	}

	@keyframes matsan-panel-in {
		from { opacity: 0; transform: translateY(12px) scale(.98); }
		to { opacity: 1; transform: translateY(0) scale(1); }
	}

	.matsan-mobile-nav__panel-head {
		display: flex;
		align-items: center;
		justify-content: space-between;
		position: sticky;
		top: -8px;
		padding: 11px 2px 10px;
		border-bottom: 1px solid #e7edf1;
		background: #fff;
		color: #123c52;
		font-size: 16px;
	}

	.matsan-mobile-nav__panel-head button {
		width: 36px;
		height: 36px;
		padding: 0;
		border: 0;
		border-radius: 50%;
		background: #eef5f7;
		box-shadow: none;
		color: #183d55;
		font-size: 25px;
		line-height: 1;
	}

	.matsan-mobile-nav__panel ul {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 9px;
		margin: 12px 0 0;
		padding: 0;
		list-style: none;
	}

	.matsan-mobile-nav__panel li {
		margin: 0;
		padding: 0;
	}

	.matsan-mobile-nav__panel li a,
	.matsan-mobile-nav__panel li button {
		display: flex;
		align-items: center;
		width: 100%;
		min-height: 48px;
		padding: 10px 12px;
		border: 1px solid #e2ebee;
		border-radius: 12px;
		background: #f9fbfc;
		box-shadow: none;
		color: #183d55;
		font-family: inherit;
		font-size: 12.5px;
		font-weight: 600;
		line-height: 1.25;
		text-align: left;
		text-decoration: none;
		text-transform: none;
		cursor: pointer;
		transition: border-color .2s ease, background-color .2s ease, color .2s ease, transform .2s ease;
	}

	.matsan-mobile-nav__panel li a:active,
	.matsan-mobile-nav__panel li button:active,
	.matsan-mobile-nav__languages li button.is-selected {
		border-color: #169b68;
		background: #edf7f3;
		color: #087a55;
		transform: scale(.98);
	}

	.matsan-mobile-nav__languages li a,
	.matsan-mobile-nav__languages li button {
		gap: 8px;
	}

	/* The navbar owns language selection on mobile; GTranslate stays active invisibly. */
	.gtranslate_wrapper > .gt_switcher_wrapper,
	.gt_float_switcher {
		display: none !important;
	}

	/* Slider Revolution's autoHeight reads the video too tall on some phones. */
	body.home .header-middle.type-slider,
	body.home #header-slider-container,
	body.home #header-slider-container .header-slider-wrapper,
	body.home #rev_slider_15_1_wrapper,
	body.home #rev_slider_15_1,
	body.home #rev_slider_15_1 rs-slides,
	body.home #rev_slider_15_1 rs-slide {
		height: 480px !important;
		min-height: 0 !important;
		max-height: 480px !important;
	}

	body.home .header-middle.type-slider,
	body.home #header-slider-container,
	body.home #header-slider-container .header-slider-wrapper,
	body.home #rev_slider_15_1_wrapper {
		overflow: hidden !important;
	}

	body.home #rev_slider_15_1 rs-bgvideo,
	body.home #rev_slider_15_1 .html5vid,
	body.home #rev_slider_15_1 video {
		width: 100% !important;
		height: 100% !important;
		background-color: #000 !important;
		background-position: center !important;
		background-repeat: no-repeat !important;
		background-size: contain !important;
		object-fit: contain !important;
		object-position: center !important;
	}

}

@media (max-width: 480px) {
	body.home .header-middle.type-slider,
	body.home #header-slider-container,
	body.home #header-slider-container .header-slider-wrapper,
	body.home #rev_slider_15_1_wrapper,
	body.home #rev_slider_15_1,
	body.home #rev_slider_15_1 rs-slides,
	body.home #rev_slider_15_1 rs-slide {
		height: 320px !important;
		max-height: 320px !important;
	}
}

@media (max-width: 374px) {
	.matsan-mobile-nav__bar a,
	.matsan-mobile-nav__bar button {
		font-size: 9px;
	}
}