/* RADCOM Mega Menu Panels — Products / Solutions (Mega menu 2026 design) */

body .rmm {
	--rmm-purple: #A24A95;
	--rmm-ink: #000;
	--rmm-muted: #3D3D3D;
	--rmm-hover: #F0F0F0;
	padding: 28px 48px 36px;
	font-family: Roboto, Arial, sans-serif;
	text-align: left;
}

body .rmm ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

/* "All Products →" */
body .rmm .rmm-all {
	display: inline-block;
	margin: 0 0 18px -8px;
	padding: 8px;
	border-radius: 6px;
	font: 600 16px/1.3 Roboto, Arial, sans-serif;
	color: var(--rmm-ink);
	text-decoration: none;
	transition: background-color .15s, color .15s;
}

body .rmm .rmm-all:hover,
body .rmm .rmm-all:focus-visible {
	background: var(--rmm-hover);
	color: var(--rmm-purple);
}

/* Items flow down columns of --rmm-rows, then to the next column */
body .rmm .rmm-grid {
	display: grid;
	grid-auto-flow: column;
	grid-template-rows: repeat(var(--rmm-rows, 3), auto);
	grid-auto-columns: minmax(200px, 300px);
	justify-content: start;
	gap: 8px 32px;
}

/* An item with children (e.g. RADCOM VIA) takes a full-height, double-width column */
body .rmm .rmm-group {
	grid-row: 1 / -1;
	grid-column: span 2;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

body .rmm .rmm-sub {
	display: grid;
	grid-auto-flow: column;
	grid-template-rows: repeat(var(--rmm-rows, 2), auto);
	grid-auto-columns: minmax(0, 1fr);
	gap: 8px 24px;
	padding-left: 40px;
}

/* Item: title + description, grey card + purple title on hover */
body .rmm .rmm-link {
	display: block;
	height: 100%;
	padding: 8px;
	border-radius: 8px;
	color: var(--rmm-ink);
	text-decoration: none;
	transition: background-color .15s;
}

body .rmm .rmm-title {
	display: block;
	font: 600 16px/1.3 Roboto, Arial, sans-serif;
	color: var(--rmm-ink);
	transition: color .15s;
}

body .rmm .rmm-desc {
	display: block;
	margin-top: 6px;
	max-width: 280px;
	font: 400 13px/1.4 Roboto, Arial, sans-serif;
	color: var(--rmm-muted);
}

body .rmm .rmm-link:hover,
body .rmm .rmm-link:focus-visible {
	background: var(--rmm-hover);
}

body .rmm .rmm-link:hover .rmm-title,
body .rmm .rmm-link:focus-visible .rmm-title {
	color: var(--rmm-purple);
}

body .rmm a:focus-visible {
	outline: 2px solid var(--rmm-purple);
	outline-offset: 2px;
}

/* Mobile menu (Elementor nav menu): description under each sub-item */
body .elementor-nav-menu--dropdown .rmm-mdesc {
	display: block;
	margin-top: 4px;
	font-size: 12px;
	line-height: 1.4;
	font-weight: 400;
	color: #3D3D3D;
	white-space: normal;
}

body .elementor-nav-menu--dropdown .sub-menu a:has(.rmm-mdesc) {
	display: block;
	font-weight: 600;
	border-radius: 6px;
	margin: 2px 8px;
}

body .elementor-nav-menu--dropdown .sub-menu a:has(.rmm-mdesc):hover {
	background: #F0F0F0;
	color: #A24A95;
}