/*
 * Chernev Clima Mega Menu — modern guided catalogue direction.
 * Loaded after the isolated base stylesheet so the visual direction can evolve
 * without weakening the plugin's defensive theme compatibility rules.
 */

:root {
	--ccmm-modern-red: #dc2b1b;
	--ccmm-modern-red-dark: #bd2316;
	--ccmm-modern-red-soft: #fff0ed;
	--ccmm-modern-ink: #222222;
	--ccmm-modern-copy: #5f6368;
	--ccmm-modern-line: #e7e8e8;
	--ccmm-modern-canvas: #f6f7f7;
	--ccmm-modern-white: #ffffff;
	--ccmm-modern-radius-sm: 8px;
	--ccmm-modern-radius-md: 12px;
	--ccmm-modern-radius-lg: 18px;
	--ccmm-modern-shadow:
		0 24px 70px rgb(21 25 28 / 18%),
		0 2px 8px rgb(21 25 28 / 7%);
	--ccmm-modern-ease: 180ms cubic-bezier(0.2, 0.75, 0.25, 1);
}

.ccmm-backdrop {
	background: rgb(25 29 32 / 42%);
	-webkit-backdrop-filter: blur(3px);
	backdrop-filter: blur(3px);
}

.ccmm-catalog-item {
	margin-right: 18px !important;
}

.ccmm-catalog-item > .ccmm-catalog-launcher,
.ccmm-catalog-item > .ccmm-catalog-launcher:hover,
.ccmm-catalog-item > .ccmm-catalog-launcher[aria-expanded="true"] {
	min-width: 132px;
	min-height: 46px !important;
	padding: 0 17px !important;
	color: var(--ccmm-modern-white) !important;
	background: var(--ccmm-modern-red) !important;
	border-color: var(--ccmm-modern-red) !important;
	border-radius: 10px !important;
	box-shadow: 0 7px 18px rgb(220 43 27 / 16%) !important;
	transition:
		background-color var(--ccmm-modern-ease),
		box-shadow var(--ccmm-modern-ease),
		transform var(--ccmm-modern-ease) !important;
}

.ccmm-catalog-item > .ccmm-catalog-launcher:hover,
.ccmm-catalog-item > .ccmm-catalog-launcher[aria-expanded="true"] {
	background: var(--ccmm-modern-red-dark) !important;
	border-color: var(--ccmm-modern-red-dark) !important;
	box-shadow: 0 9px 22px rgb(220 43 27 / 22%) !important;
	transform: translateY(-1px);
}

.ccmm-catalog-launcher__icon {
	width: 18px;
	height: 18px;
}

.ccmm-desktop {
	padding: 14px 16px 22px;
	overflow-x: hidden;
	overflow-y: auto;
}

.ccmm-desktop__surface {
	width: min(1280px, calc(100vw - 32px));
	max-height: calc(100vh - var(--ccmm-top) - 28px);
	color: var(--ccmm-modern-ink);
	background: var(--ccmm-modern-white);
	border: 1px solid rgb(255 255 255 / 78%);
	border-radius: var(--ccmm-modern-radius-lg);
	box-shadow: var(--ccmm-modern-shadow);
	overflow: hidden;
}

.ccmm-desktop__header {
	grid-template-columns: minmax(210px, 1fr) minmax(300px, 440px) auto 44px;
	gap: 18px;
	min-height: 78px;
	padding: 14px 20px 14px 24px;
	background: var(--ccmm-modern-white);
	border-color: var(--ccmm-modern-line);
}

.ccmm-eyebrow {
	margin: 0;
	color: var(--ccmm-modern-ink);
	font-size: 19px;
	font-weight: 700;
	letter-spacing: -0.015em;
	line-height: 1.25;
	text-transform: none;
}

.ccmm-desktop__title {
	display: none;
}

.ccmm-search input[type="search"] {
	height: 48px;
	padding: 0 18px 0 46px;
	color: var(--ccmm-modern-ink);
	font-size: 14px;
	background: var(--ccmm-modern-canvas);
	border: 1px solid transparent;
	border-radius: var(--ccmm-modern-radius-md);
	box-shadow: none;
	transition:
		background-color var(--ccmm-modern-ease),
		border-color var(--ccmm-modern-ease),
		box-shadow var(--ccmm-modern-ease);
}

.ccmm-search > svg {
	left: 17px;
	width: 19px;
	height: 19px;
	color: #6b6f73;
}

.ccmm-search input[type="search"]:hover {
	background: #f1f2f2;
	border-color: transparent;
}

.ccmm-search input[type="search"]:focus-visible {
	background: var(--ccmm-modern-white);
	border-color: var(--ccmm-modern-red);
	box-shadow: 0 0 0 3px rgb(220 43 27 / 11%);
}

.ccmm-all-products {
	min-height: 44px;
	padding: 0 14px;
	color: var(--ccmm-modern-red) !important;
	font-size: 13px;
	font-weight: 650;
	background: var(--ccmm-modern-red-soft);
	border: 0;
	border-radius: 10px;
	white-space: nowrap;
}

.ccmm-all-products:hover {
	color: var(--ccmm-modern-red-dark) !important;
	background: #ffe5e0;
}

.ccmm-all-products svg {
	width: 16px;
	height: 16px;
}

.ccmm-close {
	width: 44px;
	height: 44px;
	color: #606468;
	background: transparent;
	border: 0;
	border-radius: 10px;
}

.ccmm-close:hover {
	color: var(--ccmm-modern-ink);
	background: var(--ccmm-modern-canvas);
}

.ccmm-desktop__body {
	grid-template-columns: 300px minmax(0, 1fr);
	min-height: 421px;
	background: var(--ccmm-modern-white);
}

.ccmm-tabs {
	display: flex;
	flex-direction: column;
	gap: 5px;
	min-width: 0;
	padding: 12px;
	background: var(--ccmm-modern-canvas);
	border-right: 1px solid var(--ccmm-modern-line);
}

.ccmm-tab {
	grid-template-columns: 42px minmax(0, 1fr) 18px;
	gap: 12px;
	min-height: 62px;
	padding: 9px 11px;
	color: var(--ccmm-modern-ink);
	background: transparent;
	border: 0;
	border-radius: var(--ccmm-modern-radius-md);
	cursor: pointer;
	transition:
		background-color var(--ccmm-modern-ease),
		box-shadow var(--ccmm-modern-ease),
		color var(--ccmm-modern-ease);
}

.ccmm-tab::before {
	display: none;
	content: none;
}

.ccmm-tab:hover {
	background: rgb(255 255 255 / 72%);
}

.ccmm-tab[aria-selected="true"] {
	color: var(--ccmm-modern-ink);
	background: var(--ccmm-modern-white);
	box-shadow:
		0 5px 18px rgb(31 35 38 / 7%),
		0 0 0 1px rgb(34 34 34 / 4%);
}

.ccmm-tab__number,
.ccmm-tabs-shell__heading,
.ccmm-panel__index {
	display: none !important;
}

.ccmm-tab__icon,
.ccmm-panel__icon,
.ccmm-mobile-group__icon {
	color: #555b60;
	background: #eceeee;
	border: 0;
	border-radius: 50%;
	transition:
		color var(--ccmm-modern-ease),
		background-color var(--ccmm-modern-ease),
		transform var(--ccmm-modern-ease);
}

.ccmm-tab__icon {
	width: 42px;
	height: 42px;
}

.ccmm-tab__icon svg {
	width: 21px;
	height: 21px;
	stroke-width: 1.65;
}

.ccmm-tab:hover .ccmm-tab__icon,
.ccmm-tab[aria-selected="true"] .ccmm-tab__icon {
	color: var(--ccmm-modern-red);
	background: var(--ccmm-modern-red-soft);
	border-color: transparent;
}

.ccmm-tab[aria-selected="true"] .ccmm-tab__icon {
	transform: scale(1.04);
}

.ccmm-tab__copy {
	align-self: center;
	min-width: 0;
}

.ccmm-tab__copy strong {
	display: block;
	overflow: visible;
	color: inherit;
	font-size: 14px;
	font-weight: 650;
	letter-spacing: -0.005em;
	line-height: 1.32;
	text-overflow: clip;
	white-space: normal;
}

.ccmm-tab__copy small {
	display: none;
}

.ccmm-tab__arrow {
	width: 17px;
	height: 17px;
	color: #92969a;
	opacity: 1;
	transition:
		color var(--ccmm-modern-ease),
		transform var(--ccmm-modern-ease);
}

.ccmm-tab:hover .ccmm-tab__arrow,
.ccmm-tab[aria-selected="true"] .ccmm-tab__arrow {
	color: var(--ccmm-modern-red);
	transform: translateX(2px);
}

.ccmm-panels {
	min-width: 0;
	background: var(--ccmm-modern-white);
}

.ccmm-panel {
	grid-template-columns: minmax(0, 1fr) 268px;
	gap: 30px;
	min-height: 100%;
	padding: 26px 28px 28px;
	animation: ccmm-modern-panel-in 190ms ease-out both;
}

@keyframes ccmm-modern-panel-in {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

.ccmm-panel__heading {
	align-items: center;
	gap: 14px;
	margin-bottom: 20px;
	padding-bottom: 18px;
	border-color: var(--ccmm-modern-line);
}

.ccmm-panel__icon {
	width: 48px;
	height: 48px;
	flex: 0 0 48px;
	color: var(--ccmm-modern-red);
	background: var(--ccmm-modern-red-soft);
}

.ccmm-panel__icon svg {
	width: 24px;
	height: 24px;
	stroke-width: 1.65;
}

.ccmm-panel__heading h2 {
	color: var(--ccmm-modern-ink);
	font-size: 22px;
	font-weight: 700;
	letter-spacing: -0.02em;
	line-height: 1.25;
}

.ccmm-panel__heading p:not(.ccmm-panel__index) {
	margin-top: 4px;
	color: var(--ccmm-modern-copy);
	font-size: 13.5px;
	line-height: 1.45;
}

.ccmm-link-columns {
	gap: 22px 34px;
}

.ccmm-link-column h3 {
	margin-bottom: 7px;
	color: #777b7f;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.09em;
	line-height: 1.3;
}

.ccmm-link-column li {
	border-color: var(--ccmm-modern-line);
}

.ccmm-link-column a {
	min-height: 48px;
	margin: 0 -8px;
	padding: 9px 8px;
	color: var(--ccmm-modern-ink) !important;
	font-size: 14.5px;
	font-weight: 500;
	line-height: 1.4;
	border-radius: var(--ccmm-modern-radius-sm);
	transition:
		color var(--ccmm-modern-ease),
		background-color var(--ccmm-modern-ease);
}

.ccmm-link-column a svg {
	width: 16px;
	height: 16px;
	color: #a4a7aa;
}

.ccmm-link-column a:hover,
.ccmm-link-column a:focus-visible {
	padding-left: 8px;
	color: var(--ccmm-modern-red) !important;
	background: var(--ccmm-modern-red-soft);
}

.ccmm-link-column a:hover svg,
.ccmm-link-column a:focus-visible svg {
	color: var(--ccmm-modern-red);
	transform: translateX(2px);
}

.ccmm-promo {
	position: relative;
	display: flex;
	min-height: 100%;
	padding: 148px 20px 20px;
	overflow: hidden;
	color: var(--ccmm-modern-ink);
	background: #f3f4f4;
	border: 0;
	border-radius: 14px;
}

.ccmm-promo::before {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	height: 128px;
	background:
		linear-gradient(180deg, transparent 58%, rgb(243 244 244 / 96%) 100%),
		url("../images/chernev-ventilation.webp") center 46% / cover no-repeat;
	content: "";
}

.ccmm-promo::after {
	display: none;
	content: none;
}

.ccmm-promo__mark {
	position: absolute;
	z-index: 1;
	top: 103px;
	left: 20px;
	width: 46px;
	height: 46px;
	margin: 0;
	color: var(--ccmm-modern-red);
	background: var(--ccmm-modern-white);
	border: 0;
	border-radius: 50%;
	box-shadow: 0 5px 15px rgb(32 36 39 / 13%);
}

.ccmm-promo__eyebrow,
.ccmm-promo h3,
.ccmm-promo > p:not(.ccmm-promo__eyebrow),
.ccmm-promo__trust {
	margin-right: 0;
	margin-left: 0;
}

.ccmm-promo__eyebrow {
	margin-top: 15px;
	margin-bottom: 7px;
	color: var(--ccmm-modern-red);
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 0.1em;
}

.ccmm-promo h3 {
	color: var(--ccmm-modern-ink);
	font-size: 18px;
	font-weight: 700;
	letter-spacing: -0.015em;
	line-height: 1.33;
}

.ccmm-promo > p:not(.ccmm-promo__eyebrow) {
	display: none;
}

.ccmm-promo__trust {
	margin-bottom: 16px;
	color: #4f5356;
	font-size: 11.5px;
	line-height: 1.4;
	border-color: #dde0e0;
}

.ccmm-promo__trust li {
	padding: 7px 0 7px 16px;
	border-color: #dde0e0;
}

.ccmm-promo__trust li::before {
	top: 13px;
	width: 7px;
	height: 7px;
	background: var(--ccmm-modern-red);
	border-radius: 50%;
}

.ccmm-promo__trust strong {
	color: var(--ccmm-modern-ink);
}

.ccmm-promo a {
	width: 100%;
	min-height: 46px;
	margin: auto 0 0;
	padding: 0 15px;
	color: var(--ccmm-modern-white) !important;
	font-size: 13.5px;
	font-weight: 650;
	background: var(--ccmm-modern-red);
	border: 0;
	border-radius: 10px;
	box-shadow: 0 6px 14px rgb(220 43 27 / 16%);
}

.ccmm-promo a:hover {
	background: var(--ccmm-modern-red-dark);
}

.ccmm-desktop :where(a, button, input):focus-visible,
.ccmm-mobile-menu :where(a, button):focus-visible,
.ccmm-mobile-toggle:focus-visible {
	outline: 3px solid rgb(220 43 27 / 24%);
	outline-offset: 2px;
}

.ccmm-mobile-toggle {
	width: 44px;
	height: 44px;
	margin-right: 4px;
	color: #686c70;
	background: #f3f4f4;
	border: 0;
	border-radius: 9px;
}

.ccmm-mobile-toggle:hover,
.ccmm-mobile-toggle[aria-expanded="true"] {
	color: var(--ccmm-modern-red);
	background: var(--ccmm-modern-red-soft);
}

.ccmm-mobile-menu {
	padding: 8px;
	background: var(--ccmm-modern-canvas);
	border: 0;
}

.ccmm-mobile-menu__top {
	min-height: 52px;
	margin-bottom: 6px;
	padding: 0 11px;
	background: transparent;
	border: 0;
}

.ccmm-mobile-menu__top > span {
	color: var(--ccmm-modern-ink);
	font-size: 14px;
	font-weight: 700;
}

.ccmm-mobile-menu__top > a {
	color: var(--ccmm-modern-red) !important;
	font-size: 13px;
	font-weight: 650;
}

.ccmm-mobile-group {
	margin-bottom: 6px;
	overflow: hidden;
	background: var(--ccmm-modern-white);
	border: 1px solid transparent;
	border-radius: var(--ccmm-modern-radius-md);
	box-shadow: 0 2px 8px rgb(30 34 37 / 3%);
}

.ccmm-mobile-group h3 > button {
	min-height: 76px;
	padding: 9px 11px;
	border-radius: inherit;
}

.ccmm-mobile-group h3 > button:hover,
.ccmm-mobile-group h3 > button[aria-expanded="true"] {
	color: var(--ccmm-modern-ink);
	background: var(--ccmm-modern-white);
}

.ccmm-mobile-group h3 > button[aria-expanded="true"] {
	box-shadow: inset 3px 0 0 var(--ccmm-modern-red);
}

.ccmm-mobile-group__label {
	gap: 12px;
}

.ccmm-mobile-group__icon {
	width: 44px;
	height: 44px;
	flex: 0 0 44px;
	color: #5c6165;
	background: #eef0f0;
}

.ccmm-mobile-group h3 > button[aria-expanded="true"] .ccmm-mobile-group__icon {
	color: var(--ccmm-modern-red);
	background: var(--ccmm-modern-red-soft);
}

.ccmm-mobile-group__label strong {
	color: var(--ccmm-modern-ink);
	font-size: 16px;
	font-weight: 650;
	line-height: 1.35;
}

.ccmm-mobile-group__label small {
	margin-top: 3px;
	color: #777b7f;
	font-size: 13px;
	line-height: 1.4;
}

.ccmm-mobile-group__chevron {
	width: 18px;
	height: 18px;
	color: #8c9094;
}

.ccmm-mobile-group h3 > button[aria-expanded="true"] .ccmm-mobile-group__chevron {
	color: var(--ccmm-modern-red);
}

.ccmm-mobile-group__panel {
	padding: 2px 14px 15px 67px;
	background: var(--ccmm-modern-white);
}

.ccmm-mobile-column + .ccmm-mobile-column {
	margin-top: 14px;
}

.ccmm-mobile-column > p {
	margin-bottom: 5px;
	color: #7a7e82;
	font-size: 11px;
	letter-spacing: 0.08em;
}

.ccmm-mobile-column li {
	border-color: var(--ccmm-modern-line);
}

.ccmm-mobile-column a {
	min-height: 46px;
	color: var(--ccmm-modern-ink) !important;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.45;
}

.ccmm-mobile-column a:hover {
	color: var(--ccmm-modern-red) !important;
}

.ccmm-mobile-cta {
	min-height: 82px;
	margin: 10px 0 0;
	padding: 14px;
	color: var(--ccmm-modern-white) !important;
	background: #272b2e;
	border: 0;
	border-radius: var(--ccmm-modern-radius-md);
	box-shadow: none;
}

.ccmm-mobile-cta:hover {
	color: var(--ccmm-modern-white) !important;
	background: #1f2224;
}

.ccmm-mobile-cta > span:first-child {
	width: 44px;
	height: 44px;
	color: var(--ccmm-modern-white);
	background: var(--ccmm-modern-red);
	border: 0;
	border-radius: 50%;
}

.ccmm-mobile-cta strong {
	font-size: 15px;
	font-weight: 650;
}

.ccmm-mobile-cta small {
	color: rgb(255 255 255 / 70%);
	font-size: 13px;
	line-height: 1.4;
}

.ccmm-mobile-cta > svg {
	color: var(--ccmm-modern-white);
	opacity: 0.7;
}

@media (max-width: 1199px) and (min-width: 992px) {
	.ccmm-desktop__surface {
		width: calc(100vw - 24px);
	}

	.ccmm-desktop__header {
		grid-template-columns: minmax(190px, 1fr) minmax(280px, 390px) auto 42px;
		gap: 12px;
		padding-inline: 18px 14px;
	}

	.ccmm-desktop__body {
		grid-template-columns: 260px minmax(0, 1fr);
	}

	.ccmm-tabs {
		padding: 10px;
	}

	.ccmm-tab {
		grid-template-columns: 38px minmax(0, 1fr) 16px;
		gap: 10px;
		padding-inline: 9px;
	}

	.ccmm-tab__icon {
		width: 38px;
		height: 38px;
	}

	.ccmm-panel {
		grid-template-columns: minmax(0, 1fr) 230px;
		gap: 22px;
		padding: 24px;
	}

	.ccmm-promo {
		min-height: 100%;
	}
}

@media (max-width: 1040px) and (min-width: 992px) {
	.ccmm-desktop__header {
		grid-template-columns: minmax(170px, 1fr) minmax(260px, 340px) auto 42px;
	}

	.ccmm-desktop__title {
		display: none;
	}

	.ccmm-all-products {
		padding-inline: 11px;
	}

	.ccmm-panel {
		grid-template-columns: minmax(0, 1fr);
	}

	.ccmm-promo {
		display: grid;
		grid-template-columns: 126px minmax(0, 1fr) auto;
		align-items: center;
		gap: 10px 16px;
		min-height: 128px;
		padding: 16px 16px 16px 146px;
	}

	.ccmm-promo::before {
		right: auto;
		width: 126px;
		height: 100%;
		background:
			linear-gradient(90deg, transparent 72%, rgb(243 244 244 / 95%) 100%),
			url("../images/chernev-ventilation.webp") center / cover no-repeat;
	}

	.ccmm-promo__mark {
		display: none;
	}

	.ccmm-promo__eyebrow,
	.ccmm-promo h3,
	.ccmm-promo > p:not(.ccmm-promo__eyebrow),
	.ccmm-promo__trust {
		grid-column: 1;
	}

	.ccmm-promo__eyebrow {
		grid-column: 2;
		margin: 0 0 -4px;
	}

	.ccmm-promo h3 {
		grid-column: 2;
	}

	.ccmm-promo > p:not(.ccmm-promo__eyebrow),
	.ccmm-promo__trust {
		display: none;
	}

	.ccmm-promo a {
		grid-row: 1 / span 2;
		grid-column: 3;
		width: auto;
		margin: 0;
		white-space: nowrap;
	}
}

@media (max-width: 991px) {
	.ccmm-backdrop,
	.ccmm-desktop {
		display: none !important;
	}
}

@media (min-width: 992px) {
	.ccmm-mobile-toggle,
	.ccmm-mobile-menu {
		display: none !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ccmm-catalog-item > .ccmm-catalog-launcher,
	.ccmm-tab,
	.ccmm-tab__icon,
	.ccmm-tab__arrow,
	.ccmm-link-column a {
		transition-duration: 0.01ms !important;
	}

	.ccmm-panel {
		animation: none !important;
	}
}