.bonbaris-modern-runtime-parent.bbmmm-has-runtime > .wd-dropdown-menu,
.bonbaris-modern-runtime-parent.bbmmm-has-runtime > .sub-menu {
	padding: 0 !important;
	overflow: visible !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
}

.bbmmm {
	--bbmmm-ink: #203047;
	--bbmmm-ink-soft: #526071;
	--bbmmm-gold: #b57a45;
	--bbmmm-gold-light: #d6ae78;
	--bbmmm-cream: #f5f0e9;
	--bbmmm-paper: #ffffff;
	--bbmmm-line: rgba(32, 48, 71, 0.11);
	--bbmmm-shadow: 0 24px 70px rgba(20, 29, 42, 0.17), 0 3px 12px rgba(20, 29, 42, 0.08);
	box-sizing: border-box;
	width: min(1240px, calc(100vw - 48px));
	margin: 14px auto;
	direction: rtl;
	color: var(--bbmmm-ink);
	font-family: inherit;
	text-align: right;
}

.bbmmm *,
.bbmmm *::before,
.bbmmm *::after {
	box-sizing: border-box;
}

.bbmmm a,
.bbmmm button {
	-webkit-tap-highlight-color: transparent;
}

.bbmmm a {
	text-decoration: none;
}

.bbmmm svg {
	display: block;
	width: 18px;
	height: 18px;
	flex: 0 0 18px;
}

.bbmmm__shell {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 292px;
	grid-template-areas: "stage rail";
	direction: ltr;
	height: clamp(420px, calc(100vh - 175px), 560px);
	min-height: 0;
	overflow: hidden;
	border: 1px solid var(--bbmmm-line);
	border-radius: 18px;
	background: var(--bbmmm-paper);
	box-shadow: var(--bbmmm-shadow);
}

.bbmmm__rail {
	grid-area: rail;
	direction: rtl;
	display: grid;
	grid-template-rows: auto minmax(0, 1fr) auto;
	min-width: 0;
	background:
		radial-gradient(circle at 12% 4%, rgba(181, 122, 69, 0.13), transparent 33%),
		var(--bbmmm-cream);
	border-left: 1px solid var(--bbmmm-line);
}

.bbmmm__rail-head {
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 75px;
	padding: 13px 16px;
	border-bottom: 1px solid var(--bbmmm-line);
}

.bbmmm__rail-head > span:last-child {
	display: flex;
	min-width: 0;
	flex-direction: column;
	gap: 2px;
}

.bbmmm__rail-head strong {
	color: var(--bbmmm-ink);
	font-size: 15px;
	font-weight: 800;
	line-height: 1.5;
}

.bbmmm__rail-head small {
	color: var(--bbmmm-ink-soft);
	font-size: 11px;
	line-height: 1.5;
}

.bbmmm__brand-mark {
	position: relative;
	display: grid;
	width: 42px;
	height: 42px;
	flex: 0 0 42px;
	place-items: center;
	overflow: hidden;
	border: 1px solid rgba(181, 122, 69, 0.45);
	border-radius: 13px;
	background: linear-gradient(145deg, var(--bbmmm-ink), #334863);
	box-shadow: 0 7px 18px rgba(32, 48, 71, 0.17);
}

.bbmmm__brand-mark::before {
	position: absolute;
	width: 27px;
	height: 27px;
	border: 1px solid rgba(214, 174, 120, 0.45);
	border-radius: 50%;
	content: "";
}

.bbmmm__brand-mark span {
	position: relative;
	color: #fff;
	font-family: Arial, sans-serif;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.06em;
}

.bbmmm__tabs {
	min-height: 0;
	overflow-x: hidden;
	overflow-y: auto;
	padding: 7px 8px;
	scrollbar-color: rgba(32, 48, 71, 0.2) transparent;
	scrollbar-width: thin;
}

.bbmmm__tab {
	position: relative;
	display: flex;
	width: 100%;
	min-height: 33px;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin: 0;
	padding: 7px 10px;
	border: 0;
	border-radius: 9px;
	background: transparent;
	color: #3e4b5b;
	font: inherit;
	font-size: 12px;
	font-weight: 650;
	line-height: 1.55;
	text-align: right;
	cursor: pointer;
	transition: color 160ms ease, background-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.bbmmm__tab + .bbmmm__tab {
	margin-top: 1px;
}

.bbmmm__tab svg {
	width: 15px;
	height: 15px;
	flex-basis: 15px;
	opacity: 0;
	transform: translateX(5px);
	transition: opacity 160ms ease, transform 160ms ease;
}

.bbmmm__tab:hover,
.bbmmm__tab:focus-visible {
	background: rgba(214, 174, 120, 0.18);
	color: var(--bbmmm-ink) !important;
	outline: none;
}

.bbmmm__tab.is-active,
.bbmmm__tab.is-active:hover,
.bbmmm__tab.is-active:focus-visible {
	background: linear-gradient(135deg, var(--bbmmm-ink), #2d425d);
	color: var(--bbmmm-gold-light) !important;
	box-shadow: 0 7px 17px rgba(32, 48, 71, 0.16);
	transform: translateX(-2px);
}

.bbmmm__tab.is-active > span,
.bbmmm__tab.is-active:hover > span,
.bbmmm__tab.is-active:focus-visible > span,
.bbmmm__tab.is-active svg,
.bbmmm__tab.is-active:hover svg,
.bbmmm__tab.is-active:focus-visible svg {
	color: inherit !important;
}

.bbmmm__tab.is-active::after {
	position: absolute;
	top: 9px;
	right: 0;
	bottom: 9px;
	width: 3px;
	border-radius: 4px 0 0 4px;
	background: var(--bbmmm-gold-light);
	content: "";
}

.bbmmm__tab.is-active svg {
	opacity: 1;
	transform: translateX(0);
}

.bbmmm__rail-all {
	display: flex;
	min-height: 50px;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 10px 18px;
	border-top: 1px solid var(--bbmmm-line);
	background: rgba(255, 255, 255, 0.68);
	color: var(--bbmmm-ink);
	font-size: 12px;
	font-weight: 800;
	transition: color 160ms ease, background-color 160ms ease;
}

.bbmmm__rail-all:hover,
.bbmmm__rail-all:focus-visible {
	background: #fff;
	color: var(--bbmmm-gold);
	outline: none;
}

.bbmmm__stage {
	grid-area: stage;
	direction: rtl;
	display: grid;
	grid-template-rows: minmax(0, 1fr) auto;
	min-width: 0;
	min-height: 0;
	background: #fff;
}

.bbmmm__panels {
	position: relative;
	min-width: 0;
	min-height: 0;
	overflow: hidden;
}

.bbmmm__panel {
	display: grid;
	height: 100%;
	grid-template-rows: auto minmax(0, 1fr);
	min-height: 0;
	animation: bbmmm-panel-in 190ms ease both;
}

.bbmmm__panel[hidden] {
	display: none !important;
}

@keyframes bbmmm-panel-in {
	from {
		opacity: 0;
		transform: translateX(7px);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

.bbmmm__panel-head {
	display: flex;
	min-height: 91px;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	padding: 17px 26px 14px;
	border-bottom: 1px solid var(--bbmmm-line);
	background:
		linear-gradient(90deg, rgba(245, 240, 233, 0.6), rgba(255, 255, 255, 0) 48%),
		#fff;
}

.bbmmm__panel-head > div {
	min-width: 0;
}

.bbmmm__eyebrow {
	display: block;
	margin-bottom: 2px;
	color: var(--bbmmm-gold);
	font-size: 10px;
	font-weight: 800;
	letter-spacing: 0.02em;
}

.bbmmm__panel-head h3 {
	margin: 0;
	font-size: 20px;
	font-weight: 850;
	line-height: 1.5;
}

.bbmmm__panel-head h3 a {
	color: var(--bbmmm-ink);
}

.bbmmm__panel-head h3 a:hover,
.bbmmm__panel-head h3 a:focus-visible {
	color: var(--bbmmm-gold);
	outline: none;
}

.bbmmm__panel-head p {
	margin: 1px 0 0;
	color: var(--bbmmm-ink-soft);
	font-size: 11px;
	line-height: 1.6;
}

.bbmmm__category-all {
	display: inline-flex;
	min-height: 38px;
	align-items: center;
	gap: 8px;
	padding: 8px 12px;
	border: 1px solid rgba(181, 122, 69, 0.24);
	border-radius: 10px;
	background: rgba(245, 240, 233, 0.45);
	color: var(--bbmmm-gold);
	font-size: 11px;
	font-weight: 800;
	white-space: nowrap;
	transition: color 160ms ease, border-color 160ms ease, background-color 160ms ease;
}

.bbmmm__category-all:hover,
.bbmmm__category-all:focus-visible {
	border-color: var(--bbmmm-gold);
	background: var(--bbmmm-gold);
	color: #fff;
	outline: none;
}

.bbmmm__category-all svg {
	width: 15px;
	height: 15px;
	flex-basis: 15px;
}

.bbmmm__panel-body {
	display: grid;
	grid-template-columns: 268px minmax(0, 1fr);
	grid-template-areas: "visual links";
	direction: ltr;
	min-width: 0;
	min-height: 0;
	gap: 24px;
	padding: 18px 24px;
	overflow: hidden;
}

.bbmmm__links {
	grid-area: links;
	direction: rtl;
	display: grid;
	grid-auto-rows: minmax(35px, auto);
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-content: start;
	gap: 4px 10px;
	min-width: 0;
	min-height: 0;
	overflow-y: auto;
	padding: 1px 1px 4px;
	scrollbar-color: rgba(32, 48, 71, 0.18) transparent;
	scrollbar-width: thin;
}

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

.bbmmm__links > a {
	display: grid;
	grid-template-columns: 7px minmax(0, 1fr) 16px;
	align-items: center;
	gap: 9px;
	min-width: 0;
	padding: 6px 9px;
	border: 1px solid transparent;
	border-radius: 9px;
	color: #465466;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.55;
	transition: color 150ms ease, background-color 150ms ease, border-color 150ms ease, transform 150ms ease;
}

.bbmmm__links > a svg {
	width: 15px;
	height: 15px;
	opacity: 0;
	transform: translateX(4px);
	transition: opacity 150ms ease, transform 150ms ease;
}

.bbmmm__link-dot {
	display: block;
	width: 6px;
	height: 6px;
	border: 1px solid rgba(181, 122, 69, 0.62);
	border-radius: 50%;
	background: rgba(181, 122, 69, 0.12);
	transition: background-color 150ms ease, transform 150ms ease;
}

.bbmmm__links > a:hover,
.bbmmm__links > a:focus-visible {
	border-color: rgba(32, 48, 71, 0.08);
	background: #f8f7f4;
	color: var(--bbmmm-ink);
	outline: none;
	transform: translateX(-2px);
}

.bbmmm__links > a:hover svg,
.bbmmm__links > a:focus-visible svg {
	opacity: 0.7;
	transform: translateX(0);
}

.bbmmm__links > a:hover .bbmmm__link-dot,
.bbmmm__links > a:focus-visible .bbmmm__link-dot {
	background: var(--bbmmm-gold);
	transform: scale(1.15);
}

.bbmmm__visual {
	grid-area: visual;
	direction: rtl;
	display: flex;
	min-width: 0;
	align-self: start;
	flex-direction: column;
	overflow: hidden;
	border: 1px solid var(--bbmmm-line);
	border-radius: 15px;
	background: #fff;
	box-shadow: 0 10px 30px rgba(32, 48, 71, 0.08);
	color: var(--bbmmm-ink);
	transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.bbmmm__visual:hover,
.bbmmm__visual:focus-visible {
	border-color: rgba(181, 122, 69, 0.42);
	box-shadow: 0 15px 36px rgba(32, 48, 71, 0.14);
	color: var(--bbmmm-ink);
	outline: none;
	transform: translateY(-2px);
}

.bbmmm__media {
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: linear-gradient(145deg, #24354e, #111c2d);
}

.bbmmm__media img,
.bbmmm__media-placeholder {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

.bbmmm__media img {
	z-index: 2;
	display: block;
	object-fit: cover;
	object-position: center;
	opacity: 0;
	transform: scale(1.025);
	transition: opacity 260ms ease, transform 420ms ease;
}

.bbmmm__media img.is-loaded {
	opacity: 1;
	transform: scale(1);
}

.bbmmm__visual:hover .bbmmm__media img.is-loaded {
	transform: scale(1.035);
}

.bbmmm__media-placeholder {
	display: grid;
	place-items: center;
	overflow: hidden;
	background:
		radial-gradient(circle at 18% 17%, rgba(214, 174, 120, 0.45), transparent 25%),
		radial-gradient(circle at 82% 85%, rgba(181, 122, 69, 0.25), transparent 30%),
		linear-gradient(145deg, #293d59, #162438);
}

.bbmmm__media-placeholder::before,
.bbmmm__media-placeholder::after {
	position: absolute;
	width: 140px;
	height: 140px;
	border: 1px solid rgba(255, 255, 255, 0.13);
	border-radius: 34px;
	content: "";
	transform: rotate(45deg);
}

.bbmmm__media-placeholder::after {
	width: 92px;
	height: 92px;
	border-color: rgba(214, 174, 120, 0.35);
}

.bbmmm__media-placeholder strong {
	position: relative;
	z-index: 1;
	color: #fff;
	font-family: Arial, sans-serif;
	font-size: 27px;
	font-weight: 800;
	letter-spacing: 0.08em;
}

.bbmmm__placeholder-orbit {
	position: absolute;
	width: 190px;
	height: 76px;
	border: 1px solid rgba(214, 174, 120, 0.22);
	border-radius: 50%;
	transform: rotate(-18deg);
}

.bbmmm__media-badge {
	position: absolute;
	z-index: 3;
	top: 11px;
	right: 11px;
	padding: 5px 8px;
	border: 1px solid rgba(255, 255, 255, 0.38);
	border-radius: 999px;
	background: rgba(20, 29, 42, 0.66);
	backdrop-filter: blur(5px);
	color: #fff;
	font-size: 9px;
	font-weight: 800;
}

.bbmmm__visual-copy {
	display: flex;
	min-height: 66px;
	flex-direction: column;
	justify-content: center;
	gap: 2px;
	padding: 10px 13px 11px;
}

.bbmmm__visual-copy strong {
	overflow: hidden;
	color: var(--bbmmm-ink);
	font-size: 12px;
	font-weight: 800;
	line-height: 1.6;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.bbmmm__visual-copy span {
	color: var(--bbmmm-ink-soft);
	font-size: 10px;
	line-height: 1.6;
}

.bbmmm__empty-state {
	display: flex;
	grid-column: 1 / -1;
	align-self: start;
	flex-direction: column;
	gap: 7px;
	padding: 20px;
	border: 1px dashed rgba(181, 122, 69, 0.36);
	border-radius: 13px;
	background: rgba(245, 240, 233, 0.5);
}

.bbmmm__empty-state strong {
	font-size: 13px;
}

.bbmmm__empty-state span {
	color: var(--bbmmm-ink-soft);
	font-size: 11px;
	line-height: 1.8;
}

.bbmmm__empty-state a {
	align-self: start;
	color: var(--bbmmm-gold);
	font-size: 11px;
	font-weight: 800;
}

.bbmmm__footer {
	display: flex;
	min-height: 58px;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	padding: 10px 24px;
	border-top: 1px solid var(--bbmmm-line);
	background: #fbfaf8;
}

.bbmmm__footer-note {
	color: var(--bbmmm-ink-soft);
	font-size: 10px;
	line-height: 1.6;
}

.bbmmm__footer nav {
	display: flex;
	align-items: center;
	gap: 9px;
}

.bbmmm__footer nav a {
	padding: 6px 10px;
	border-radius: 8px;
	color: var(--bbmmm-ink);
	font-size: 10px;
	font-weight: 800;
	transition: color 150ms ease, background-color 150ms ease;
}

.bbmmm__footer nav a:hover,
.bbmmm__footer nav a:focus-visible {
	background: var(--bbmmm-cream);
	color: var(--bbmmm-gold);
	outline: none;
}

.bbmmm__footer nav .bbmmm__consult {
	background: var(--bbmmm-ink);
	color: #fff;
}

.bbmmm__footer nav .bbmmm__consult:hover,
.bbmmm__footer nav .bbmmm__consult:focus-visible {
	background: var(--bbmmm-gold);
	color: #fff;
}

.bbmmm--empty {
	padding: 25px;
	border: 1px solid #dba617;
	border-radius: 10px;
	background: #fff8db;
	color: #5f4b0b;
}

/* Compact shared system for Services and Solutions. */
.bbmmm--compact {
	width: min(1120px, calc(100vw - 48px));
	margin-block: 12px;
}

.bbmmm-compact__shell {
	overflow: hidden;
	border: 1px solid var(--bbmmm-line);
	border-radius: 18px;
	background: var(--bbmmm-paper);
	box-shadow: var(--bbmmm-shadow);
}

.bbmmm-compact__header {
	display: flex;
	min-height: 82px;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	padding: 14px 20px;
	border-bottom: 1px solid var(--bbmmm-line);
	background:
		radial-gradient(circle at 8% 0%, rgba(214, 174, 120, 0.2), transparent 30%),
		linear-gradient(100deg, #f7f2eb, #fff 54%);
}

.bbmmm-compact__identity {
	display: flex;
	min-width: 0;
	align-items: center;
	gap: 13px;
}

.bbmmm-compact__identity > span:last-child {
	display: flex;
	min-width: 0;
	flex-direction: column;
}

.bbmmm-compact__identity small {
	color: var(--bbmmm-gold);
	font-size: 9px;
	font-weight: 800;
	line-height: 1.5;
}

.bbmmm-compact__identity strong {
	color: var(--bbmmm-ink);
	font-size: 18px;
	font-weight: 850;
	line-height: 1.5;
}

.bbmmm-compact__identity > span:last-child > span {
	color: var(--bbmmm-ink-soft);
	font-size: 10px;
	line-height: 1.55;
}

.bbmmm-compact__all {
	display: inline-flex;
	min-height: 38px;
	align-items: center;
	gap: 8px;
	padding: 8px 13px;
	border: 1px solid rgba(181, 122, 69, 0.3);
	border-radius: 10px;
	background: rgba(255, 255, 255, 0.72);
	color: var(--bbmmm-gold);
	font-size: 10px;
	font-weight: 800;
	white-space: nowrap;
	transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.bbmmm-compact__all:hover,
.bbmmm-compact__all:focus-visible {
	border-color: var(--bbmmm-gold);
	background: var(--bbmmm-gold);
	color: #fff;
	outline: none;
	transform: translateX(-2px);
}

.bbmmm-compact__all svg {
	width: 15px;
	height: 15px;
	flex-basis: 15px;
}

.bbmmm-services__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
	padding: 16px 18px;
}

.bbmmm-service-card {
	overflow: hidden;
	border: 1px solid var(--bbmmm-line);
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 6px 18px rgba(32, 48, 71, 0.05);
}

.bbmmm-service-card > header {
	display: flex;
	min-height: 62px;
	align-items: center;
	gap: 11px;
	padding: 10px 12px;
	border-bottom: 1px solid var(--bbmmm-line);
	background: #fbfaf8;
}

.bbmmm-service-card__number {
	display: grid;
	width: 36px;
	height: 36px;
	flex: 0 0 36px;
	place-items: center;
	border: 1px solid rgba(181, 122, 69, 0.28);
	border-radius: 11px;
	background: var(--bbmmm-cream);
	color: var(--bbmmm-gold);
	font-family: inherit !important;
	font-size: 11px;
	font-weight: 800;
	font-variant-numeric: normal;
	letter-spacing: 0;
}

.bbmmm-service-card > header > span:last-child {
	display: flex;
	min-width: 0;
	flex-direction: column;
	gap: 1px;
}

.bbmmm-service-card > header strong {
	color: var(--bbmmm-ink);
	font-size: 12px;
	font-weight: 850;
	line-height: 1.55;
}

.bbmmm-service-card > header small {
	color: var(--bbmmm-ink-soft);
	font-size: 9px;
	line-height: 1.5;
}

.bbmmm-service-card nav {
	display: grid;
	gap: 2px;
	padding: 7px;
}

.bbmmm-service-card nav a {
	display: grid;
	min-height: 39px;
	grid-template-columns: 7px minmax(0, 1fr) 15px;
	align-items: center;
	gap: 8px;
	padding: 7px 8px;
	border: 1px solid transparent;
	border-radius: 9px;
	color: #465466;
	font-size: 10px;
	font-weight: 650;
	line-height: 1.55;
	transition: color 150ms ease, background-color 150ms ease, border-color 150ms ease, transform 150ms ease;
}

.bbmmm-service-card nav a svg {
	width: 14px;
	height: 14px;
	opacity: 0;
	transform: translateX(4px);
	transition: opacity 150ms ease, transform 150ms ease;
}

.bbmmm-service-card nav a:hover,
.bbmmm-service-card nav a:focus-visible {
	border-color: rgba(32, 48, 71, 0.08);
	background: var(--bbmmm-cream);
	color: var(--bbmmm-ink);
	outline: none;
	transform: translateX(-2px);
}

.bbmmm-service-card nav a:hover svg,
.bbmmm-service-card nav a:focus-visible svg {
	opacity: 0.75;
	transform: translateX(0);
}

.bbmmm-solutions__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 8px;
	padding: 16px 18px;
}

.bbmmm-solution-tile {
	display: grid;
	min-height: 58px;
	grid-template-columns: 35px minmax(0, 1fr) 15px;
	align-items: center;
	gap: 9px;
	padding: 8px 10px;
	border: 1px solid var(--bbmmm-line);
	border-radius: 11px;
	background: #fff;
	color: var(--bbmmm-ink);
	box-shadow: 0 4px 14px rgba(32, 48, 71, 0.035);
	transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.bbmmm-solution-tile__number {
	display: grid;
	width: 35px;
	height: 35px;
	place-items: center;
	border-radius: 9px;
	background: var(--bbmmm-cream);
	color: var(--bbmmm-gold);
	font-family: inherit !important;
	font-size: 9px;
	font-weight: 800;
	font-variant-numeric: normal;
	letter-spacing: 0;
}

.bbmmm-solution-tile__copy {
	display: flex;
	min-width: 0;
	flex-direction: column;
	gap: 1px;
}

.bbmmm-solution-tile__copy strong {
	overflow: hidden;
	color: inherit;
	font-size: 10px;
	font-weight: 800;
	line-height: 1.55;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.bbmmm-solution-tile__copy small {
	color: var(--bbmmm-ink-soft);
	font-size: 8px;
	line-height: 1.5;
}

.bbmmm-solution-tile > svg {
	width: 14px;
	height: 14px;
	opacity: 0.35;
	transition: opacity 160ms ease, transform 160ms ease;
}

.bbmmm-solution-tile:hover,
.bbmmm-solution-tile:focus-visible {
	border-color: rgba(181, 122, 69, 0.42);
	background: #fbf8f3;
	box-shadow: 0 8px 20px rgba(32, 48, 71, 0.08);
	color: var(--bbmmm-ink);
	outline: none;
	transform: translateY(-2px);
}

.bbmmm-solution-tile:hover > svg,
.bbmmm-solution-tile:focus-visible > svg {
	opacity: 0.85;
	transform: translateX(-2px);
}

.bbmmm-compact__footer {
	display: flex;
	min-height: 58px;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	padding: 9px 20px;
	border-top: 1px solid var(--bbmmm-line);
	background: linear-gradient(90deg, #fbfaf8, #f5f0e9);
}

.bbmmm-compact__footer > span {
	display: flex;
	min-width: 0;
	flex-direction: column;
	gap: 1px;
}

.bbmmm-compact__footer strong {
	color: var(--bbmmm-ink);
	font-size: 10px;
	font-weight: 850;
	line-height: 1.55;
}

.bbmmm-compact__footer small {
	color: var(--bbmmm-ink-soft);
	font-size: 9px;
	line-height: 1.55;
}

.bbmmm-compact__footer > a {
	display: inline-flex;
	min-height: 36px;
	align-items: center;
	gap: 7px;
	padding: 7px 13px;
	border-radius: 9px;
	background: var(--bbmmm-ink);
	color: #fff;
	font-size: 10px;
	font-weight: 800;
	white-space: nowrap;
	transition: background-color 160ms ease, transform 160ms ease;
}

.bbmmm-compact__footer > a svg {
	width: 14px;
	height: 14px;
}

.bbmmm-compact__footer > a:hover,
.bbmmm-compact__footer > a:focus-visible {
	background: var(--bbmmm-gold);
	color: #fff;
	outline: none;
	transform: translateX(-2px);
}

/* Magazine stays a conventional dropdown, but shares the same visual language. */
.bonbaris-modern-magazine-parent > .wd-dropdown-menu,
.bonbaris-modern-magazine-parent > .sub-menu {
	min-width: 330px !important;
	padding: 9px !important;
	overflow: hidden !important;
	border: 1px solid rgba(32, 48, 71, 0.11) !important;
	border-radius: 15px !important;
	background: #fff !important;
	box-shadow: 0 18px 48px rgba(20, 29, 42, 0.16), 0 3px 10px rgba(20, 29, 42, 0.06) !important;
}

/*
 * Keep the native Magazine dropdown open while the pointer crosses the small
 * header-to-dropdown gap. JavaScript owns the class and removes it only after
 * a short hover-intent delay, so every link remains reachable.
 */
.bonbaris-modern-magazine-parent.bbmmm-magazine-open > .wd-dropdown-menu,
.bonbaris-modern-magazine-parent.bbmmm-magazine-open > .sub-menu {
	display: block !important;
	z-index: 400 !important;
	opacity: 1 !important;
	visibility: visible !important;
	pointer-events: auto !important;
	transform: none !important;
}

.bonbaris-modern-magazine-parent > .wd-dropdown-menu::before,
.bonbaris-modern-magazine-parent > .sub-menu::before {
	display: block;
	margin: -9px -9px 7px;
	padding: 11px 14px;
	border-bottom: 1px solid rgba(32, 48, 71, 0.09);
	background: linear-gradient(100deg, #f5f0e9, #fff);
	color: #203047;
	content: "تازه‌های مجله بن‌باریس";
	font-size: 10px;
	font-weight: 850;
	text-align: right;
}

.bonbaris-modern-magazine-parent > .wd-dropdown-menu li > a,
.bonbaris-modern-magazine-parent > .sub-menu li > a {
	position: relative;
	display: flex !important;
	min-height: 39px;
	align-items: center;
	padding: 7px 25px 7px 10px !important;
	border-radius: 9px;
	color: #465466 !important;
	font-size: 10px !important;
	font-weight: 650 !important;
	line-height: 1.55 !important;
	transition: color 150ms ease, background-color 150ms ease, transform 150ms ease !important;
}

.bonbaris-modern-magazine-parent > .wd-dropdown-menu li > a::before,
.bonbaris-modern-magazine-parent > .sub-menu li > a::before {
	position: absolute;
	right: 10px;
	width: 6px;
	height: 6px;
	border: 1px solid rgba(181, 122, 69, 0.65);
	border-radius: 50%;
	background: rgba(181, 122, 69, 0.1);
	content: "";
}

.bonbaris-modern-magazine-parent > .wd-dropdown-menu li > a:hover,
.bonbaris-modern-magazine-parent > .wd-dropdown-menu li > a:focus-visible,
.bonbaris-modern-magazine-parent > .sub-menu li > a:hover,
.bonbaris-modern-magazine-parent > .sub-menu li > a:focus-visible {
	background: #f5f0e9 !important;
	color: #203047 !important;
	outline: none;
	transform: translateX(-2px);
}

/* A subtle page veil reinforces the dropdown as a temporary navigation layer. */
body.bbmmm-overlay-active::before {
	position: fixed;
	z-index: 388;
	inset: 0;
	background: rgba(16, 23, 33, 0.34);
	content: "";
	pointer-events: none;
	opacity: 1;
	animation: bbmmm-veil-in 160ms ease both;
}

body.bbmmm-overlay-active .whb-header {
	z-index: 389 !important;
}

@keyframes bbmmm-veil-in {
	from { opacity: 0; }
	to { opacity: 1; }
}

@media (max-width: 1180px) {
	.bbmmm {
		width: calc(100vw - 28px);
	}

	.bbmmm__shell {
		grid-template-columns: minmax(0, 1fr) 265px;
	}

	.bbmmm__panel-body {
		grid-template-columns: 230px minmax(0, 1fr);
		gap: 17px;
		padding-inline: 18px;
	}

	.bbmmm__links > a {
		font-size: 11px;
	}
}

@media (max-width: 1024px) {
	.bbmmm {
		display: none !important;
	}

	body.bbmmm-overlay-active::before {
		display: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.bbmmm *,
	.bbmmm *::before,
	.bbmmm *::after,
	body.bbmmm-overlay-active::before {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
	}
}
