:root {
			/*
			 * فاصله مگامنو از پایین همان لینک منویی که هاور می‌شود.
			 * مقدار مثبت = پایین‌تر، مقدار منفی = بالاتر.
			 */
			--grbm-margin-top: 10px;
			--grbm-top: 80px;
			--grbm-ink: #f5f6f7;
			--grbm-blue: #00aeef;
		}

		.gr-blog-mega-menu {
			position: static !important;
		}

		.grbm-wrap {
			position: fixed;
			z-index: 999999;
			top: var(--grbm-top);
			right: 0;
			left: 0;
			width: 100vw;
			height: 520px;
			max-height:
				calc(
					100vh -
					var(--grbm-top) -
					23px
				);
			margin-top: var(--grbm-margin-top) !important;
			padding:
				27px
				clamp(
					32px,
					5.1vw,
					98px
				)
				30px;
			overflow: visible;
			visibility: hidden;
			opacity: 0;
			pointer-events: none;
			color: var(--grbm-ink);
			background:
				rgba(2, 0, 31, .88);
			border: 0 !important;
			box-shadow:
				0 30px 70px
				rgba(0, 0, 0, .58);
			backdrop-filter:
				blur(18px)
				saturate(108%);
			-webkit-backdrop-filter:
				blur(18px)
				saturate(108%);
			transform: translateZ(0);
			-webkit-transform:
				translateZ(0);
			will-change:
				opacity,
				backdrop-filter;
			transition: none !important;
		}

		.grbm-wrap::before {
			position: absolute;
			z-index: 2;
			right: 0;
			bottom: 100%;
			left: 0;
			display: block;
			width: 100%;
			height: 30px;
			content: "";
			background: transparent;
			pointer-events: auto;
		}

		.gr-blog-mega-menu.grbm-open
		> .grbm-wrap {
			visibility: visible;
			opacity: 1;
			pointer-events: auto;
		}

		.grbm-wrap,
		.grbm-wrap button,
		.grbm-wrap a,
		.grbm-wrap span {
			font-family:
				"Vazirmatn",
				"IRANSansX",
				"IRANS",
				"Yekan Bakh",
				Tahoma,
				sans-serif !important;
		}

		.grbm-mobile-heading,
		.grbm-mobile-subtitle,
		.grbm-cat-image,
		.grbm-cat-arrow,
		.grbm-blog-button {
			display: none;
		}

		.grbm-mega {
			display: flex;
			direction: rtl;
			width: 100%;
			max-width: 1720px;
			height: 100%;
			margin: 0 auto;
			overflow: hidden;
		}

		.grbm-cats {
			display: flex;
			width: 300px;
			flex: none;
			flex-direction: column;
			padding: 1px 0 1px 38px;
			overflow-x: hidden;
			overflow-y: auto;
			scrollbar-width: thin;
			scrollbar-color:
				rgba(255, 255, 255, .16)
				transparent;
		}

		.grbm-cat {
			appearance: none;
			display: flex;
			align-items: center;
			justify-content: flex-start;
			gap: 9px;
			width: calc(100% - 18px);
			min-height: 38px;
			flex: 0 0 auto;
			margin: 0 4px 10px 14px;
			padding: 5px 10px;
			border: 0 !important;
			border-radius: 5px;
			outline: 0;
			color: #f2f2f2;
			background: transparent;
			font-size: 14px;
			font-weight: 400;
			line-height: 1.45;
			text-align: right;
			cursor: pointer;
			box-shadow: none !important;
		}

		.grbm-cat:hover,
		.grbm-cat.is-active {
			color: #fff;
			background:
				rgba(43, 43, 45, .92);
		}

		.grbm-cat-label {
			min-width: 0;
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
		}

		.grbm-badge {
			flex: none;
			padding: 2px 7px 1px;
			border:
				1px solid
				var(--grbm-blue) !important;
			border-radius: 3px;
			color: var(--grbm-blue);
			background:
				transparent !important;
			font-size: 10px;
		}

		.grbm-posts {
			min-width: 0;
			flex: 1;
			overflow-x: hidden;
			overflow-y: auto;
		}

		.grbm-panel {
			display: none;
			width: 100%;
			height: 100%;
		}

		.grbm-panel.is-active {
			display: flex;
			flex-direction: column;
		}

		.grbm-grid {
			display: grid;
			grid-template-columns:
				repeat(
					3,
					minmax(0, 1fr)
				);
			gap: 12px 14px;
		}

		.grbm-card,
		.grbm-card:hover {
			position: relative;
			display: grid;
			direction: rtl;
			grid-template-columns:
				76px minmax(0, 1fr);
			grid-template-rows: 1fr;
			column-gap: 12px;
			height: 126px;
			min-width: 0;
			padding: 8px 9px;
			overflow: hidden;
			border: 0 !important;
			border-radius: 5px;
			color:
				var(--grbm-ink) !important;
			background:
				rgba(29, 29, 31, .94);
			box-shadow: none !important;
			text-decoration: none !important;
			transform: none !important;
		}

		.grbm-thumb {
			position: relative;
			display: grid;
			width: 76px;
			height: 94px;
			align-self: center;
			place-items: center;
			overflow: hidden;
			border-radius: 4px;
		}

		.grbm-thumb img {
			display: block;
			width: 100%;
			height: 100%;
			margin: 0;
			object-fit: cover;
			transition:
				transform .24s ease;
		}

		.grbm-card:hover
		.grbm-thumb img {
			transform: scale(1.09);
		}

		.grbm-thumb time {
			position: absolute;
			right: 4px;
			bottom: 4px;
			padding: 2px 5px;
			border-radius: 2px;
			color: #fff;
			background:
				rgba(2, 0, 31, .82);
			font-size: 8px;
		}

		.grbm-no-image {
			color: var(--grbm-blue);
			font-size: 26px;
		}

		.grbm-title {
			display: -webkit-box;
			align-self: center;
			overflow: hidden;
			color: #f6f6f6;
			font-size: 12px;
			font-weight: 600;
			line-height: 1.7;
			text-align: right;
			-webkit-line-clamp: 3;
			-webkit-box-orient: vertical;
		}

		.grbm-footer {
			display: flex;
			margin-top: 17px;
		}

		.grbm-footer a {
			color:
				var(--grbm-blue) !important;
			font-size: 13px;
			font-weight: 600;
			text-decoration: none !important;
		}

		@media (max-width: 1180px) {
			.grbm-wrap {
				padding-right: 34px;
				padding-left: 34px;
			}

			.grbm-cats {
				width: 245px;
				padding-left: 26px;
			}

			.grbm-card,
			.grbm-card:hover {
				grid-template-columns:
					64px minmax(0, 1fr);
				height: 120px;
			}

			.grbm-thumb {
				width: 64px;
				height: 88px;
			}
		}

		/*--------------------------------------------------
		# حالت موبایل
		--------------------------------------------------*/

		@media (max-width: 1024px) {
			.gr-blog-mega-menu {
				position: relative !important;
			}

			.gr-blog-mega-menu
				> .grbm-wrap {
				position: static !important;
				z-index: auto !important;
				top: auto !important;
				right: auto !important;
				left: auto !important;
				display: none !important;
				width: 100% !important;
				max-width: 100% !important;
				height: auto !important;
				max-height: none !important;
				margin: 0 !important;
				padding: 0 !important;
				overflow: hidden !important;
				visibility: hidden !important;
				opacity: 0 !important;
				pointer-events: none !important;
				color: #fff;
				background:
					rgba(2, 0, 31, .98);
				backdrop-filter: none;
				-webkit-backdrop-filter: none;
				transform: none !important;
				-webkit-transform: none !important;
				will-change: auto;
			}

			.gr-blog-mega-menu.grbm-open
				> .grbm-wrap {
				display: block !important;
				visibility: visible !important;
				opacity: 1 !important;
				pointer-events: auto !important;
			}

			.grbm-wrap::before {
				display: none !important;
				content: none !important;
			}

			.grbm-mobile-heading {
				direction: rtl;
				display: grid;
				grid-template-columns:
					36px 1fr 36px;
				align-items: center;
				min-height: 48px;
				padding: 5px 10px;
				border-bottom:
					1px solid
					rgba(255, 255, 255, .1);
				background: #050505;
			}

			.grbm-mobile-back,
			.grbm-mobile-close {
				appearance: none;
				display: grid;
				width: 34px;
				height: 34px;
				margin: 0;
				padding: 0;
				place-items: center;
				border: 0 !important;
				border-radius: 0;
				color: #fff !important;
				background:
					transparent !important;
				font-size: 25px;
				line-height: 1;
				box-shadow: none !important;
				cursor: pointer;
			}

			.grbm-mobile-back {
				visibility: hidden;
				opacity: 0;
			}

			.grbm-wrap.grbm-mobile-panel-open
				.grbm-mobile-back {
				visibility: visible;
				opacity: 1;
			}

			.grbm-mobile-title {
				overflow: hidden;
				color: #fff;
				font-size: 14px;
				font-weight: 600;
				text-align: center;
				text-overflow: ellipsis;
				white-space: nowrap;
			}

			.grbm-mega {
				display: block !important;
				width: 100% !important;
				max-width: 100% !important;
				height: auto !important;
				margin: 0 !important;
				padding: 0 !important;
				overflow: visible !important;
			}

			.grbm-cats {
				display: flex !important;
				width: 100% !important;
				height: auto !important;
				flex-direction: column;
				margin: 0 !important;
				padding: 0 10px 14px !important;
				overflow-x: hidden !important;
				overflow-y: auto !important;
			}

			.grbm-mobile-subtitle {
				display: block;
				padding: 15px 4px 8px;
				color:
					rgba(255, 255, 255, .62);
				font-size: 12px;
				font-weight: 400;
			}

			.grbm-cat {
				display: flex !important;
				align-items: center !important;
				justify-content:
					flex-start !important;
				gap: 10px;
				width: 100% !important;
				min-height: 52px !important;
				margin: 0 !important;
				padding: 7px 5px !important;
				border: 0 !important;
				border-bottom:
					1px solid
					rgba(255, 255, 255, .045)
					!important;
				border-radius: 0 !important;
				color: #f3f3f3 !important;
				background:
					transparent !important;
				font-size: 13px !important;
				text-align: right;
				box-shadow: none !important;
			}

			.grbm-cat:hover,
			.grbm-cat:focus,
			.grbm-cat.is-active {
				color: #fff !important;
				background:
					rgba(255, 255, 255, .045)
					!important;
			}

			.grbm-cat-image {
				display: grid;
				width: 38px;
				height: 38px;
				flex: none;
				place-items: center;
				overflow: hidden;
				border-radius: 4px;
				background:
					rgba(255, 255, 255, .06);
			}

			.grbm-cat-image img {
				display: block;
				width: 100%;
				height: 100%;
				object-fit: cover;
			}

			.grbm-cat-label {
				min-width: 0;
				flex: 1;
				color: inherit !important;
				text-align: right;
				text-overflow: ellipsis;
				white-space: nowrap;
			}

			.grbm-cat-arrow {
				display: block;
				width: 20px;
				flex: none;
				color:
					rgba(255, 255, 255, .7);
				font-size: 22px;
				line-height: 1;
				text-align: center;
			}

			.grbm-badge {
				margin-right: auto;
			}

			.grbm-blog-button {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 100%;
				min-height: 44px;
				margin: 12px 0 0;
				padding: 8px 14px;
				border:
					1px solid
					var(--grbm-blue) !important;
				border-radius: 6px;
				color:
					var(--grbm-blue) !important;
				background:
					transparent !important;
				font-size: 13px;
				text-decoration: none !important;
			}

			.grbm-posts {
				display: none !important;
				width: 100% !important;
				max-height: 480px;
				margin: 0;
				padding: 12px 10px 18px;
				overflow-x: hidden;
				overflow-y: auto;
			}

			.grbm-wrap.grbm-mobile-panel-open
				.grbm-cats {
				display: none !important;
			}

			.grbm-wrap.grbm-mobile-panel-open
				.grbm-posts {
				display: block !important;
			}

			.grbm-panel,
			.grbm-panel.is-active {
				height: auto !important;
			}

			.grbm-panel {
				display: none !important;
			}

			.grbm-panel.is-active {
				display: block !important;
			}

			.grbm-grid {
				display: grid !important;
				grid-template-columns:
					1fr !important;
				gap: 9px !important;
				width: 100%;
			}

			.grbm-card,
			.grbm-card:hover {
				display: grid !important;
				grid-template-columns:
					76px minmax(0, 1fr);
				width: 100%;
				height: 100px !important;
				margin: 0;
				padding: 7px 9px !important;
			}

			.grbm-thumb {
				width: 76px !important;
				height: 82px !important;
			}

			.grbm-title {
				font-size: 12px !important;
				-webkit-line-clamp: 3;
			}

			.grbm-footer {
				margin-top: 13px;
			}

			.grbm-footer a {
				font-size: 12px;
			}
		}