/* OP Motion — theme fixes (can be disabled from Settings → OP Motion) */

/* Gradient words (e.g. "ويبيع") disappeared on mobile: restore the gradient fill on highlighted words only. */
.elementor-heading-title em .ops-wi {
	background-image: var(--op-grad, linear-gradient(120deg, #7c5cff, #22d3ee)) !important;
	-webkit-background-clip: text !important;
	background-clip: text !important;
	-webkit-text-fill-color: transparent;
	color: transparent;
}

/* Mobile menu (built by opm.js from the existing header links) */
.opm-mnav-btn { display: none; }
@media (max-width: 1024px) {
	.opm-mnav-btn {
		display: inline-grid; place-items: center; width: 42px; height: 42px; border-radius: 50%;
		border: 1px solid var(--op-line, rgba(255,255,255,.09)); background: transparent; color: var(--op-text, #eef1f8);
		cursor: pointer; padding: 0; flex: none; position: relative; z-index: 10001;
	}
	.opm-mnav-btn span, .opm-mnav-btn span::before, .opm-mnav-btn span::after {
		display: block; width: 18px; height: 2px; border-radius: 2px; background: currentColor; position: relative; transition: transform .4s cubic-bezier(.2,.7,.2,1), opacity .3s;
	}
	.opm-mnav-btn span::before, .opm-mnav-btn span::after { content: ''; position: absolute; inset-inline-start: 0; }
	.opm-mnav-btn span::before { top: -6px; }
	.opm-mnav-btn span::after { top: 6px; }
	html.opm-mnav-open .opm-mnav-btn span { background: transparent; }
	html.opm-mnav-open .opm-mnav-btn span::before { transform: translateY(6px) rotate(45deg); }
	html.opm-mnav-open .opm-mnav-btn span::after { transform: translateY(-6px) rotate(-45deg); }
}
.opm-mnav {
	position: fixed; inset: 0; z-index: 10000; display: flex; flex-direction: column; justify-content: center; gap: 6px;
	padding: 90px 28px 40px; background: color-mix(in srgb, var(--op-bg, #07090f) 94%, transparent);
	backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
	clip-path: circle(0% at 10% 4%); visibility: hidden; transition: clip-path .7s cubic-bezier(.7,0,.2,1), visibility 0s .7s;
	direction: rtl;
}
html.opm-mnav-open .opm-mnav { clip-path: circle(150% at 10% 4%); visibility: visible; transition: clip-path .7s cubic-bezier(.7,0,.2,1), visibility 0s; }
.opm-mnav a {
	display: flex; align-items: baseline; gap: 14px; color: var(--op-text, #eef1f8) !important; text-decoration: none !important;
	font: 700 clamp(28px, 8vw, 40px)/1.35 var(--ops-display, 'Readex Pro', 'IBM Plex Sans Arabic', sans-serif);
	opacity: 0; transform: translateY(24px); transition: opacity .5s, transform .6s cubic-bezier(.2,.7,.2,1);
}
.opm-mnav a small { font: 600 12px/1 'IBM Plex Sans Arabic', sans-serif; color: var(--op-a2, #22d3ee); }
html.opm-mnav-open .opm-mnav a { opacity: 1; transform: none; }
.opm-mnav .opm-mnav-cta {
	margin-top: 24px; justify-content: center; font-size: 17px; min-height: 52px; align-items: center; border-radius: 99px;
	background: var(--op-grad, linear-gradient(120deg,#7c5cff,#22d3ee)); color: #fff !important;
}
html.opm-mnav-open, html.opm-mnav-open body { overflow: hidden; }
.opm-mnav-close {
	position: absolute; top: 18px; left: 18px; width: 46px; height: 46px; border-radius: 50%;
	border: 1px solid var(--op-line, rgba(255,255,255,.09)); background: transparent; color: var(--op-text, #eef1f8);
	display: grid; place-items: center; cursor: pointer; padding: 0;
}